@charset "UTF-8";
/*
Theme Name:はまだデンタルクリニック
Theme URI:https://hamadadental.mom
Description:はまだデンタルクリニック WordPressテーマ
Author:SHIFT Inc.
Version:1.0
*/
html, body { width:100%; height:100%; }
body { position:relative; margin:0; padding:0; color:#684f40; background:#fff; font-size:15px; line-height:1.5;
font-family:"fot-udmarugo-large-pr6n", sans-serif; }
*, *:before, *:after { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }

ul, ol, dl li { padding:0; margin:0; }
h1, h2, h3, h4, h5, h6 { margin-top:0; }
p,figure { margin:0; }
ul { list-style:none; }
img, iframe { vertical-align:bottom; }
a img { border:none; }
a:hover { opacity:0.75; filter:alpha(opacity=75); -ms-filter:"alpha( opacity=75 )"; }
hr { height:0; margin:5px 0 30px; border:0; border-top:1px solid #999; border-bottom:1px solid #fff; }
hr.hd { height:0; margin:0; border:0; border-top:1px solid #d2d2d2; border-bottom:none; }
select { font-size:100%; }
input, textarea { padding:5px; border:1px solid #ddd; }
table { border-collapse:collapse; border-spacing:0; }
td    { padding:0; }
a:link    { color:#88c23f; text-decoration:none; }
a:visited { color:#88c23f; text-decoration:none; }
a:hover, a:active, a:focus { text-decoration:none; }

/* ●769px以上 */
@media screen and (min-width:769px){
  .caution { background-color:#88c23f; padding:10px 0; color:#fff; text-align:center; }
  .caution b { display:block; font-size:24px; }

  .container { max-width:1400px; margin:0 auto; }
  .container2 { max-width:960px; margin:0 auto; }
  header > div { display:flex; justify-content:space-between; align-items:center; margin:0 50px; padding:20px 0; }
  header nav ul { display:flex; margin:0 50px; }
  header nav ul li { width:20%; }
  header nav ul li:first-child { border-left:1px dashed #684f40; }
  header nav ul li a { display:block; padding:10px 0; border-right:1px dashed #684f40; color:#684f40 !important; text-align:center; line-height:1; }
  header nav ul li a span { font-size:6px; }
  h1 { margin:30px 0 60px; text-align:center; }
  h1 span { display:inline-block; padding-bottom:5px; border-bottom:2px solid #684f40; letter-spacing:10px; text-indent:10px; }

  footer { background-color:#88c23f; padding:35px 0; color:#fff; font-size:16px; }
  footer > div { display:flex; justify-content:space-between; align-items:center; margin:0 50px; }
  footer .info { background:url(/img/ft-char.png)left top no-repeat; background-size:100px auto; width:400px; padding-left:120px; font-size:14px; line-height:2; }
  footer .info img { margin-bottom:10px; }
  footer .hour { width:50%; }
  footer .hour .tbl { width:100%; margin:0 auto 20px; }
  footer .hour .tbl th,
  footer .hour .tbl td { padding:5px 0; border-bottom:1px solid #fff; font-weight:normal; text-align:center; }
  footer .hour .tbl th { padding-top:0; }
  footer .hour .tbl td:first-child { width:35%; }
  footer .hour p { text-align:center; }
  footer .hour p:first-of-type { margin-bottom:.5em; }
  .copyright { background-color:#88c23f; padding:15px 0; color:#fff; font-size:11px; text-align:center; }

  .topSlide { margin:0 auto 40px; }
  .topChild { display:flex; justify-content:center; align-items:center; margin-bottom:40px !important; border-radius:10px; }
  .topChild img { margin-right:20px; }
  .topChild p b { display:block; font-size:2vw; color:#88c23f; }
  .topChild p span { display:block; font-size:1.5vw; }
  .topNews { display:flex; justify-content:space-between; margin-bottom:40px !important; }
  .topNews dl { width:48%; min-height:124px; background-color:#f5f5d0; padding:20px 10px 0 30px; border-radius:10px; }
  .topNews dl div { display:flex; flex-wrap:wrap; margin-bottom:10px; }
  .topNews dl div:last-child { margin-bottom:0; }
  .topNews dl div dt { width:10em; margin-bottom:10px; }
  .topNews dl div dd { width:calc(100% - 10em); margin-bottom:10px; }
  .topNews dl div dt:last-of-type,.topNews dl div dd:last-of-type { margin-bottom:0; }
  .topNews a { display:block; width:48%; min-height:124px; background:url(/img/reservation.png) 90% center no-repeat #ff8c1a; background-size:20%; padding-left:1.6em; color:#fff; font-size:2.2vw; line-height:124px; border-radius:10px; }
  .topInquiry { text-align:center; }
  .topInquiry a { display:flex; align-items:center; justify-content:center; max-width:740px; background:#88c23f; margin:0 auto 40px; padding:15px 0; border-radius:10px; color:#fff; font-size:24px; line-height:1.8; text-align:left; }
  .topInquiry a::after { display:inline-block; content:'≫'; margin-left:20px; }

  .clinicSec1 { display:flex; justify-content:space-between; align-items:center; margin-bottom:60px; }
  .clinicSec1 h2 { width:250px; background-color:#88c23f; margin:0; padding:90px 0; color:#fff; text-align:center; border-radius:50%; }
  .clinicSec1 p { width:640px; line-height:1.8; }
  .clinicSec2 { margin-bottom:60px; }
  .clinicSec2:last-of-type { margin-bottom:100px; }
  .clinicSec2 .leftItem img { border-top-left-radius:10px; border-bottom-left-radius:10px; }
  .clinicSec2 .rightItem img { border-top-right-radius:10px; border-bottom-right-radius:10px; }
  .clinicSec2 h3 { margin-bottom:10px; text-align:center; letter-spacing:1em; text-indent:1em; }
  .clinicSec2 div { display:flex; }
  .clinicSec2 div h3 { width:50%; }
  .clinicSec3 { margin-bottom:100px; }
  .clinicSec3 h2::before { content: "・"; }
  .clinicSec3 h2 { padding-left: 1em; text-indent: -1em; }
  .clinicSec3 h2:not(:first-of-type){ margin-top:2em; }
  .clinicSec3 p { margin:1em 1em 0 1.5em; line-height:1.6; }
  .last { margin-bottom:100px; }
  .last h3 { letter-spacing:.5em; text-indent:2em; }

  .staffSec1 { display:flex; justify-content:space-between; margin-bottom:60px; }
  .staffSec1 img { width:480px; border-radius:10px; }
  .staffSec1 div { width:440px; }
  .staffSec1 h2 { margin-bottom:20px; color:#88c23f; }
  .staffSec1 p { line-height:1.7; }
  .staffSec3 { display:flex; justify-content:center; align-items:center; }
  .staffSec3 img { margin:0 20px; }

  .staffSec2 { display:flex; justify-content:space-between; background-color:#88c23f; margin-bottom:60px; padding:30px 50px; border-radius:10px; color:#fff; }
  .staffSec2 dl { display:flex; margin:0; }
  .staffSec2 dl:nth-child(2) { margin-top:20px; }
  .staffSec2 dt { margin:0 20px 0 0; border-right:1px solid #fff; }
  .staffSec2 .career1 dt { width:3em; }
  .staffSec2 .career1 dd { display:flex; }
  .staffSec2 .career2 dt { width:6em; }
  .staffSec2 dd { margin:0; }

  .treatmentSec1 { display:flex; justify-content:space-between; align-items:center; margin-bottom:60px; }
  .treatmentSec1 h2 { width:220px; background-color:#88c23f; margin:0; padding:90px 0; color:#fff; text-align:center; border-radius:50%; }
  .treatmentSec1 p { width:680px; line-height:1.6; }
  .treatmentSec1 img { margin-top:10px; border-radius:10px; }

  .reservationInfo { margin-bottom:50px; font-size:17px; text-align:center; line-height:2; }
  .monthly-calendar,
  .day-calendar { max-width:1400px; margin:0 50px 80px; font-family:"fot-udmarugo-large-pr6n"; }
  .day-calendar table { margin:0 auto; }
  .day-calendar h3 { display:none; }
  .day-calendar p { width:80%; margin:0 auto 10px; font-size:1rem; font-weight:bold; text-align:center; }
  .day-calendar p::after { content:"のご予約" }
  .monthly-calendar table { width:100%; margin-bottom:20px; }
  .monthly-calendar caption,
  .monthly-calendar th,
  .monthly-calendar td { border-bottom:1px solid #ccc; }
  .monthly-calendar caption { padding-bottom:30px; }
  .monthly-calendar th { padding:10px 0; }
  .monthly-calendar td { padding:10px 0 6px; }
  .day-box.no-day { background-color:#fff; }
  .monthly-prev-next a { color:#88c23f; text-decoration:underline; }
  .monthly-prev-next .monthly-prev::before { content:"≪"; padding-right:5px; }
  .monthly-prev-next .monthly-next { margin:0; }
  .monthly-prev-next .monthly-next::after { content:"≫"; padding-left:5px; }
  .container .container { margin:0 50px; }
  .container .container > div { margin-bottom:80px; text-align:center; }
  .container .container h2 { margin:30px 0 30px; font-size:2em; text-align:center; }
  .container .container th { padding:0 20px 0 0; border-bottom:none; line-height:1; vertical-align:middle; }
  .container .container td { padding:0 0 0 20px; border-right:none; border-bottom:none; text-align:left; }
  #booking-form { margin-bottom:80px; }
  #booking-form fieldset { width:100%; padding-right:0; }
  #booking-form fieldset table { width:100%; margin:-10px 0 10px; border-spacing:10px; }

  .swiper-container { width:960px; height:320px; }
  .swiper-pagination,
  .swiper-button-prev,
  .swiper-button-next { display:none !important; }

  .pc { display:block !important; }
  .sp { display:none !important; }
}

/* ●768pxまで */
@media screen and (max-width:768px){
  a:hover { opacity:1; filter:alpha(opacity=100); -ms-filter:"alpha( opacity=100 )"; }

  .caution { background-color:#88c23f; padding:10px; color:#fff;font-size:3.3vw; }
  .caution b { display: block; font-size:7vw; text-align:center; }
  .caution a { color:#fff; }

  header { padding:3%; }
  header > div { text-align:center; }
  /* header > div img { width:100%; height:auto; margin-bottom:10px; } */
  header > div a:first-child img { width:90%; height:auto; margin-bottom:10px; }
  header > div a:last-child img { width:95%; height:auto; margin-bottom:10px; }
  header nav ul { display:flex; flex-wrap:wrap; justify-content:center; }
  header nav ul li a { display:block; padding:0 .5em; font-size:4.5vw; line-height:2; text-decoration:underline !important; }
  header nav ul li a span { display:none; }
  h1 { margin:20px 0 30px; text-align:center; font-size:6vw; }
  h1 span { display:inline-block; padding-bottom:5px; border-bottom:2px solid #684f40; letter-spacing:10px; text-indent:10px; }
  footer { background-color:#88c23f; padding:5% 0; color:#fff; font-size:3.6vw; }
  footer a { color:#fff !important; }
  footer > div { margin:0 4%; }
  footer .info { background:url(/img/ft-char.png)left top no-repeat; background-size:80px auto; margin-bottom:20px; padding-left:95px; line-height:1.6; }
  footer .info img { width:100%; height:auto; margin-bottom:10px; }
  footer .hour { width:100%; }
  footer .hour .tbl { width:100%; margin:0 auto 20px; }
  footer .hour .tbl th,
  footer .hour .tbl td { padding:5px 0; border-bottom:1px solid #fff; font-weight:normal; text-align:center; }
  footer .hour .tbl th { padding-top:0; }
  footer .hour .tbl td:first-child { width:35%; }
  footer .hour p { text-align:center; }
  footer .hour p:first-of-type { margin-bottom:.5em; }
  .copyright { background-color:#88c23f; padding:15px 0; color:#fff; font-size:3vw; text-align:center; }

  .topSlide { margin:0 0 20px; }
  .topChild { display:flex; justify-content:center; align-items:center; margin-bottom:20px !important; line-height:1.4; }
  .topChild img { width:22vw; height:auto; margin-right:5vw; }
  .topChild p b { display:block; margin-bottom:5px; font-size:5vw; color:#88c23f; }
  .topChild p span { display:block; font-size:4vw; }
  .topNews { margin:0 !important; }
  .topNews dl { background-color:#f5f5d0; margin-bottom:20px; padding:5% 8%; }
  .topNews dl dt { margin-bottom:3px; font-size:13px; }
  .topNews dl dd { margin-bottom:10px; padding-bottom:10px; border-bottom:1px dotted #684f40; }
  .topNews dl dd:last-of-type { margin-bottom:0; padding-bottom:0; border-bottom:0; }
  .topNews a { display:block; min-height:100px; background:url(/img/reservation.png) 92% center no-repeat #ff8c1a; background-size:20%; margin:0 5% 20px; padding-left:1.4em; color:#fff; font-size:5.8vw; line-height:100px; border-radius:10px; }
  iframe { width:100%; height:100vw; }
  .topInquiry a { display:flex; align-items:center; justify-content:center; background:#88c23f; margin:0 auto 5vw; padding:3vw; border-radius:10px; color:#fff; font-size:3.6vw; line-height:1.8; text-align:left; }
  .topInquiry a::after { display:inline-block; content:'≫'; margin-left:1vw; }
  .topInquiry a br { display:none; }

  .clinicSec1 { margin-bottom:30px; }
  .clinicSec1 h2 { width:56vw; height:56vw; display:flex; justify-content:center; align-items:center; background-color:#88c23f; margin:0 auto 20px; color:#fff; font-size:5vw;  text-align:center; border-radius:50%; }
  .clinicSec1 p { margin:0 10vw; line-height:1.6; }
  .clinicSec2 { margin-bottom:30px; text-align:center; }
  .clinicSec2 h3 { background-color:#88c23f; padding:5px 0; color:#fff; font-size:5vw; text-align:center; }
  .clinicSec2 img { width:100%; height:auto; }
  .clinicSec3 { margin:50px 5vw 60px; }
  .clinicSec3 h2::before { content: "・"; }
  .clinicSec3 h2 { padding-left: 1em; text-indent: -1em; font-size:4.5vw; }
  .clinicSec3 h2:not(:first-of-type){ margin-top:2em; }
  .clinicSec3 p { margin:.6em 1em 0 1.2em; line-height:1.6; }
  .last { margin-bottom:0; }
  .last h3 { text-indent:1em; }
  /* .clinicSec2 { margin-bottom:60px; }
  .clinicSec2:last-of-type { margin-bottom:100px; }
  .clinicSec2 img { border-radius:10px; }
  .clinicSec2 h3 { margin-bottom:10px; text-align:center; letter-spacing:1em; text-indent:1em; }
  .clinicSec2 div { display:flex; }
  .clinicSec2 div h3 { width:50%; } */
  .treatmentSec1 { margin-bottom:30px; }
  .treatmentSec1 h2 { background-color:#88c23f; margin-bottom:10px; padding:5px 0; color:#fff; font-size:5vw; text-align:center; }
  .treatmentSec1 p { margin:0 5vw; }
  .treatmentSec1 span { display:block; text-align:center; }
  .treatmentSec1 img { margin-top:10px; border-radius:10px; }
  .treatmentSec1 img.t1 { width:100%; height:auto; }
  .treatmentSec1 img.t2 { width:60%; height:auto; }
  .staffSec1 { margin:0 5vw 30px; }
  .staffSec1 img { width:100%; height:auto; margin-bottom:15px; border-radius:10px; }
  .staffSec1 h2 { margin:0 0 10px; color:#88c23f; font-size:5vw; line-height:1.3; }
  .staffSec1 p { margin:0; }
  .staffSec2 { background-color:#88c23f; margin-bottom:30px; padding:5vw; color:#fff; }
  .staffSec2 .career1 { margin-bottom:15px; }
  .staffSec2 dt { margin-bottom:10px; padding-bottom:5px; border-bottom:1px dashed #fff; font-size:bold; }
  .staffSec2 dd { display:flex; }
  .staffSec2 dd p:first-child { width:6.5em; }
  .staffSec3 { text-align:center; }
  .staffSec3 img:nth-child(-n+2) { width:85%; height:auto; margin:0 auto 20px; }
  .staffSec3 img:last-child { width:70%; height:auto; }

  .reservationInfo { margin:0 3vw 7vw 5vw; font-size:4.2vw; line-height:1.8; }
  .monthly-calendar,
  .day-calendar { margin:0 0 40px; font-family:"fot-udmarugo-large-pr6n"; }
  .day-calendar table { margin:0 auto; }
  .day-calendar h3 { display:none; }
  .day-calendar p { width:80%; margin:0 auto 10px; font-size:1rem; font-weight:bold; text-align:center; }
  .day-calendar p::after { content:"のご予約" }
  .monthly-calendar table { width:100%; margin-bottom:20px; }
  .monthly-calendar caption,
  .monthly-calendar th,
  .monthly-calendar td { border-bottom:1px solid #ccc; }
  .monthly-calendar caption { padding-bottom:30px; }
  .monthly-calendar th { padding:10px 0; }
  .monthly-calendar td { padding:10px 0 6px; }
  .day-box.no-day { background-color:#fff; }
  .monthly-prev-next a { color:#88c23f; text-decoration:underline; }
  .monthly-prev-next .monthly-prev::before { content:"≪"; padding-right:5px; }
  .monthly-prev-next .monthly-next { margin:0; }
  .monthly-prev-next .monthly-next::after { content:"≫"; padding-left:5px; }
  .container .container { margin:0 5vw; }
  .container .container > div { margin-bottom:40px; text-align:center; }
  .container .container h2 { margin:20px 0 30px; font-size:6vw; text-align:center; }
  .container .container th { padding:0 20px 0 0; border-bottom:none; line-height:1; vertical-align:middle; }
  .container .container td { padding:0 0 0 10px; border-right:none; border-bottom:none; text-align:left; }
  #booking-form { margin-bottom:40px; }
  #booking-form fieldset { width:100%; padding-right:0; }
  #booking-form fieldset table { width:100%; margin:-10px 0 10px; border-spacing:10px; }

  .swiper-pagination-bullet-active { background-color:#fff; }
  .swiper-button-prev { background-size:24px 39px;  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); }
  .swiper-button-next { background-size:24px 39px;  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); }

  .pc { display:none !important; }
  .sp { display:block !important; }
}

/* ●596px〜768pxまで iPad用 */
@media screen and (min-width:596px) and (max-width:768px)  {
}

/* iPhone7用 */
@media screen and (min-width:375px) and (max-width:413px)  {
  .staffSec2 dd p:first-child { width:7.5em; }
  .swiper-button-prev { background-size:20px 33px; }
  .swiper-button-next { background-size:20px 33px; }
}

/* iPhone5以下用 */
@media screen and (max-width:374px) {
  .staffSec2 dd p:first-child { width:8.5em; }
  .swiper-button-prev { background-size:20px 33px; }
  .swiper-button-next { background-size:20px 33px; }
}
