@charset "UTF-8";
/* Global.css */
* {
  box-sizing: border-box;
}
html{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-font-smoothing: subpixel-antialiased;/*safariフォント太さ調整*/
-webkit-text-size-adjust: 100%;
}
body{
font-family:"小塚ゴシック",Avenir,"游ゴシック","Yu Gothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
font-weight: 400;
font-size: 100%;
line-height: 1.8;
position: relative;
height: 100vh;
color:#666464;
}
@media (max-width: 375px){
body{
font-size: 90%;
}
}

img{
width: 100%;
height: auto;
line-height: 0;
transition:  all 0.5s;
}
a{
color:#4d4d4d;
text-decoration: none;
transition: all 0.3s;
}
a img{
transition: all 0.3s;
}
a:hover img{
opacity: 0.5;
}

/*TOPページ*/
#mainphoto-box{
position:relative;
}
#mainphoto-box img{
transition: none;
}
/*
#mainphoto-box .photo:before{
content: "";
display: block;
padding-top: 43.8917%; 
}
*/
#mainphoto-box .photo{
z-index: -1;
display: none;
position: relative;
}
#mainphoto-box .photo img{
position: absolute;
top:0;
left: 0;
}
#mainphoto-box p.catch{
position: absolute;
z-index: 20;
margin: 0 auto;
right: 0;
left: 0;
bottom:50%;
display: none;
}

.header-bg.top{
position:absolute;
bottom:-36%;
left:0;
right:0;
margin:auto;
z-index: 1;
}
#header-menu{
position: absolute;
left: 0;
right: 0;
top:104%;
z-index: 2;
}
h1{
width:28.2%;
margin: 0 auto 3.5%;
}

ul.gmenu{
overflow: hidden;
width: 47.96%;
margin: 0 auto;
}
@media (max-width: 1920px){
ul.gmenu{
width: auto;
max-width:820px;
}
}
@media (max-width: 1400px){
h1{
width:35%;
margin: 0 auto 2.5%;
}
ul.gmenu{
max-width: auto;
width:70%;
}
}
@media (max-width: 768px){
h1{
margin: 0 auto 1.5%;
}
ul.gmenu{
width:65%;
}
}
.gmenu li{
float:left;
margin-right: 8%;
}
.gmenu a.gmenu01 li{
width:13.029%;
}
.gmenu a.gmenu02 li{
width:15.96%;
}
.gmenu a.gmenu03 li{
width:19.10%;
}
.gmenu a.gmenu04 li{
width:10.53%;
}
.gmenu a.gmenu05 li{
width: 7.709%;
margin-right: 0;
}
.gmenu a.gmenu06{
display: none;
}
#mainphoto-box .gmenu a img{
transition: all 0.3s;
}
#mainphoto-box .gmenu a:hover img{
opacity: 0.5;
}

@media (max-width: 414px){
#mainphoto-box .photo:before{
padding-top:114.25%; /* 高さ比率 */
}
#mainphoto-box .photo{
z-index: -1;
display: none;
position: relative;
}
#mainphoto-box .photo .slideshow img{
height: 473px;
object-fit: cover;
}
#mainphoto-box .photo img.photo01{
object-position:50% 0;
}
#mainphoto-box .photo img.photo02{
object-position:100% 0;
}
#mainphoto-box p.catch{
position: absolute;
top:41%;
bottom: 0;
width:100%;
display: none;
}
.header-bg.top{
bottom:-42%;
}
#header-menu{
top:102%;
}
h1{
width:66.425%;
margin: 0 auto 3.5%;
}
#sp-box{
width:13.28%;
margin: 8% auto 3%;
}
.gmenu-spicon img.op{
display: none;
}
.gmenu-spicon.close img.op{
display: block;
}
.gmenu-spicon.close img.close{
display: none;
}
ul.gmenu{
width: 100%;
border:1px solid #666464;
border-bottom: none;
box-sizing: border-box;
background: #FFF;
position: absolute;
display: none;
}
.gmenu li{
float:none;
padding: 1.5em 0;
width: 100%;
}
.gmenu a{
width: 100%;
display: block;
border-bottom: 1px solid #666464;
}
.gmenu a li{
margin: 0 auto;
}
.gmenu a.gmenu01 li{
width:25.36%;
}
.gmenu a.gmenu02 li{
width:29.95%;
}
.gmenu a.gmenu03 li{
width:35.5%;
}
.gmenu a.gmenu04 li{
width:20.28%;
}
.gmenu a.gmenu05 li{
width: 15.21%;
margin-right: auto;
}
.gmenu a.gmenu06{
display: block;
}
.gmenu a.gmenu06 li{
width: 12.31%;
margin-right: auto;
}
#mainphoto-box .gmenu a img{
transition: all 0.3s;
}
#mainphoto-box .gmenu a:hover img{
opacity: 0.5;
}

}
.pc{
display: block;
}
.mobile{
display: none;
}
@media (max-width: 414px){
.pc{
display: none;
}
.mobile{
display: block;
}
}

.text-box{
margin-bottom: 3em;
}
.text-box.box01{
background: #CAE2E4;
padding: 5em 0;
margin-top: 18.3%;
}
.text-box.box02{
background:url("../../page-images/top/top-box_bg01.jpg") no-repeat center center;
background-size:cover;
}
.in-box{
max-width:1000px;
width: 90%;
margin: 0 auto;
overflow: hidden;
}
.text-box.box02 .in-box{
width: 90%;
margin: 0 auto;
padding: 15em 0 20em;
}
.in-box.wide01{
max-width: 900px;
}
.in-box.wide02{
max-width: 1200px;
width: 100%;
}

ul.top01{
overflow: hidden;
margin: 0 auto 3em;
max-width:90%;
}
ul.top01 li{
float: left;
width: 45%;
}
ul.top01 li:last-child{
float: right;
width: 40%;
}
ul.top01 li strong{
font-weight:bold;
display: block;
margin-bottom: 0.5em;
}
ul.tel-map{
display: table;
width: 90%;
margin: 0 auto;
}
ul.tel-map.margin01{
margin: 20% auto 10%;
}
ul.tel-map li{
display: table-cell;
}
ul.tel-map li:first-child{
padding-right: 1em;
}
ul.top01 li:last-child p img{
width: auto;
}

.text-box.newsbox{
max-width:1200px;
width: 90%;
margin: 15% auto 5%;
}
.text-box.newsbox strong{
display:block;
text-align: center;
border-bottom:1px solid #6F6F6F;
line-height: 0;
margin-bottom: 2%;
}
.text-box.newsbox strong img{
width:21.91%;
}
ul.news{
overflow: hidden;
border-bottom:1px solid #6F6F6F;
}
ul.news li{
float:left;
width: 18.4%;
margin: 0 2% 2% 0;
border:1px solid #6F6F6F;
}
ul.news li:nth-child(5n){
margin-right:0;
}
ul.news li p{
padding: 1em;
}
ul.news li p em{
display:block;
}

.text-box.staffbox{
background: #CEE6F9;
padding: 5em 0;
}
.text-box.staffbox strong{
width:21.5%;
display: block;
text-align: center;
margin: 0 auto 3em;
}
ul.staff{
overflow: hidden;
}
ul.staff li{
float:left;
width: 38%;
}
ul.staff li:last-child{
float: right;
width:55%;
}
ul.staff li div{
margin-bottom: 2em;
}
ul.staff li:last-child div p img{
width: auto;
}

@media (max-width: 414px){
.text-box.box01{
padding: 2.5em 0;
margin-top: 50%;
}
ul.top01{
max-width:100%;
margin: 0;
}
.text-box.box01 .in-box{
max-width:100%;
width: 100%;
margin: 0 auto;
}
ul.top01 li{
float: none;
width: 80%;
margin:0 auto 3em;
}
ul.top01 li:last-child{
float: none;
width: 80%;
margin:0 auto 3em;
}
ul.tel-map{
display: block;
width: 100%;
}
ul.tel-map li{
display: block;
margin: 0 auto;
}
ul.tel-map li:first-child{
margin: 1em auto;
padding: 0;
}
ul.tel-map li:last-child{
width:23.67%;
}
.text-box.box02{
background:url("../../page-images/top/top-box_bg01.jpg") no-repeat 16% center;
background-size:auto 100%;
}
.text-box.box02 .in-box{
width: 90%;
margin: 0 auto;
padding: 8em 0;
}
.text-box.newsbox{
width: 90%;
}
.text-box.newsbox strong{
margin-bottom: 5%;
}
.text-box.newsbox strong img{
width:44.92%;
}
ul.news{
border-bottom: none;
}
ul.news li{
float:none;
width: 100%;
margin: 0 0 5% 0;
}
.text-box.staffbox{
padding: 2.5em 0;
}
.text-box.staffbox strong{
width:36.71%;
display: block;
text-align: center;
margin: 0 auto 1em;
}
ul.staff li{
float:none;
width: 100%;
margin-bottom: 2em;
}
ul.staff li:last-child{
float: none;
width:100%;
margin-bottom: 0;
}
ul.staff li div{
margin-bottom: 2em;
}
}


/*フッター*/
.text-box.footer{
background:url("../images/footer-bg.jpg") no-repeat 70% center;
background-size: cover;
padding: 7% 0;
}
.text-box.footer strong{
width:28.6%;
margin: 0 auto;
display: block;
}
.access-box{
overflow: hidden;
margin: 5% auto 10%;
}
.ggmap {/*グーグルマップ*/
position: relative;
padding-bottom: 35%;
height: 0;
overflow: hidden;
width:50%;
margin: 0 auto;
float: left;
}
.ggmap iframe,
.ggmap object,
.ggmap embed,.ggmap .acf-map{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
ul.access{
overflow: hidden;
float: left;
width: 40%;
margin-left: 3%;
}
ul.access li{
margin-bottom: 15%;
}
ul.access li:after{
content:' ';
clear: both;
display: block;
}
ul.access li img{
display: block;
float: left;
width: 40%;
}
ul.access li p{
float: right;
width: 55%;
}
ul.access li strong{
font-weight: bold;
display: block;
}
ul.access li span{
font-size:90%;
line-height: 1.2;
}


.text-box.footer-nav{
margin: 5% auto;
}
.text-box.footer-nav strong{
display: block;
width:43.1%;
margin: 0 auto 3em;
}
ul.info{
overflow: hidden;
width: 95%;
margin: 0 auto 8em;
}
ul.info li{
float:left;
margin-top: 3%;
width: 35%;
}
ul.info li:last-child{
float: right;
margin-top: 0;
width: 50%;
}
.text-box.footer-nav ul.gmenu{
width: 70%;
}
.copyright{
padding:5em 0 3em ;
text-align: center;
}

@media (max-width: 414px){
.text-box.footer{
background:url("../images/footer-bg.jpg") no-repeat 45% center;
background-size: cover;
padding: 9% 0;
margin-bottom: 1em;
}
.text-box.footer strong{
width:48.79%;
line-height: 0;
}

.in-box.wide01{
max-width: auto;
width:72.94%;
}
.ggmap {/*グーグルマップ*/
padding-bottom: 100%;
width:100%;
float: none;
}
ul.access{
overflow: hidden;
float: none;
width: 74.63%;
margin:10% auto 0;
}
ul.access li{
margin-bottom: 15%;
}
ul.access li:after{
content:' ';
clear: both;
display: block;
}
ul.access li img{
float: none;
width: 100%;
margin-bottom: 5%;
}
ul.access li p{
float: none;
width: 100%;
}
ul.access li strong{
font-weight: bold;
display: block;
}
ul.access li span{
font-size:90%;
line-height: 1.2;
}
.text-box.footer-nav ul.gmenu{
display: none;
}
.text-box.footer-nav{
margin: 0 auto;
}
.text-box.footer-nav strong{
display: block;
width:80%;
margin: 0 auto 3em;
}
ul.info{
overflow: hidden;
width: 100%;
margin: 0 auto 10%;
}
ul.info li{
float:none;
margin: 0 auto 15%;
width: 70%;
}
ul.info li:last-child{
float:none;
margin: 0 auto;
width: 80%;
}

.pagetop{
width:12.31%;
margin: 3em auto 0;
}
.copyright{
font-size:80%;
padding: 3em 0;
}
}


/*第2階層共通*/
#second-header{
background:url("../images/second-header_bg.png") repeat-x center top;
background-size: auto 100%;
padding: 8% 0 10%;
}
@media (max-width: 414px){
#second-header{
background-size: auto 50%;
}
}
#second-header #header-menu{
position: relative;
top:0;
}

.text-box h2.title{
text-align: center;
margin:0 auto 8%;
}
.center{
text-align: center;
}


/*ごあいさつ*/
.text-box h2.title.message01{
width:20%;
}
ul.frame01 li p.name{
width: 29.27%;
margin-bottom: 2%;
}
ul.frame01 li div.gray-box{
background:#CECECF;
padding: 3%;
}
ul.frame01 li div.gray-box img{
width:60.36%;
}

.message-box{
background:url("../../page-images/message/title_bg.png") no-repeat top center;
background-size:100% auto;
max-width: 1760px;
margin: 5% auto 10%;
padding: 5% 0 14%;
}
.text-box h2.title.message02{
width:24.8%;
margin-bottom: 5%;
}
p.wide02{
width:63.3%;
}
p.wide02.center{
margin-left: auto;
margin-right: auto;
}
.message-box ul{
width:70%;
margin: 5% auto 0;
font-size:140%;
}
.message-box li{
text-indent: -1em;
padding-left:1em;
margin-bottom: 5%;
}
.message-box li span{
color:#232E84;
font-weight: bold;
}
ul.photo-box{
overflow: hidden;
max-width: 1400px;
width: 90%;
margin: 0 auto;
}
.photo-box li{
float: left;
width: 31.2%;
margin: 0 3% 3% 0;
}
.photo-box li:nth-child(3n){
margin-right: 0;
}
.photo-box li p{
padding: 2% 5%;
}


@media (max-width: 1760px){
.message-box{
background-size: cover;
}
}
@media (max-width: 1060px){
.message-box li .pc{
display: none;
}
}
@media (max-width: 414px){
.text-box h2.title.message01{
width:27.05%;
margin-bottom: 3%;
}
ul.frame01.message li,ul.frame01.message li:nth-child(even){
width: 90%;
}
p.wide02{
width:90%;
}
.message-box ul{
width:90%;
font-size:100%;
}
ul.frame01 li p.name{
width:35%;
margin:3% auto 5%;
}
ul.frame01 li div.gray-box{
padding: 5%;
}
ul.frame01 li div.gray-box img{
width:100%;
}
.message p.center{
margin: 5% auto;
}
.text-box h2.title.message02{
width:33.81%;
}
.message-box{
margin: 10% auto;
padding: 8% 0 14%;
}
.photo-box li{
float: none;
width: 100%;
margin: 0 0 10% 0;
}
.photo-box li p{
padding: 2% 5%;
}
}

/*5つのお約束*/
.text-box h2.title.promise{
width:24.36%;
}
p.wide01{
width: 67.70%;
margin: 0 auto;
}
dl.list01{
width: 80%;
margin: 10% auto;
}
dl.list01 dt{
width: 69%;
}
dl.list01 dd{
margin:0 0 8% 9.5%;
}
@media (max-width: 414px){
.text-box h2.title.promise{
width:40%;
}
p.wide01{
width:100%;
}
dl.list01{
width: 90%;
}
dl.list01 dt{
width: 95%;
}
dl.list01 dd{
margin:0 0 8% 14%;
}
}

/*初診の患者様へ*/
.text-box h2.title.first-visit01{
width:29.3%;
}
.text-box h2.title.first-visit02{
width:16.06%;
}

ul.frame01{
overflow: hidden;
margin-bottom: 3%;
}
ul.frame01 li{
width: 47.5%;
float: left;
}
ul.frame01 li:nth-child(even){
float: right;
}
ul.frame02{
overflow: hidden;
padding: 3% 3%;
margin-bottom: 10%;
box-sizing: content-box;
background: #BBDCE1;
}
ul.frame02 li{
width: 30%;
float: left;
margin: 0 5% 0 0;
}
ul.frame02 li:last-child{
margin-right: 0;
}
dl.frame03{
overflow: hidden;
border-top:1.5px solid #CAE2E4;
}
dl.frame03 dt,dl.frame03 dd{
float: left;
width: 47.5%;
}
dl.frame03 dt{
line-height: 0;
}
dl.frame03 dd{
float: right;
padding: 3% 1%;
}
dl.frame03 dd strong{
display: block;
}
dl.frame03 dd p{
margin-top: 5%;
}
dl.frame03 dd p span{
display: block;
color:#3F6EB4;
font-size:110%;
margin-top: 5%;
}
dl.frame03.reverse dt{
float: right;
}
dl.frame03.reverse dd{
float: left;
}

@media(max-width:414px){
.text-box h2.title.first-visit01{
width:39.85%;
}
.text-box h2.title.first-visit02{
width:21.98%;
}
ul.frame01 li,ul.frame01 li:nth-child(even){
width: 80%;
float: none;
margin: 0 auto;
}
ul.frame02{
padding: 10% 0 5%;
}
ul.frame02 li{
width: 70%;
float: none;
margin: 0 auto 5% auto;
}
ul.frame02 li:last-child{
width: 80%;
margin-right: auto;
margin-bottom: 0;
}
dl.frame03{
overflow: hidden;
border-top:1.5px solid #CAE2E4;
}
dl.frame03 dt,dl.frame03 dd{
float: none;
width: 100%;
}
dl.frame03 dd{
float: none;
padding:10% 10% 20%;
}
dl.frame03 dd strong{
display: block;
margin-bottom: 5%;
}
dl.frame03.reverse dt,dl.frame03.reverse dd{
float: none;
}
}


/*ブログ*/
h2.title.blog{
width: 9.83%;
}
h2.title.blog.archive{
margin-bottom: 2%;
}
p.archive-title{
margin-bottom: 8%;
text-align: center;
font-size:120%;
}
.in-box.blog{
width: 90%;
margin: 0 auto;
}
.blog-left{
width: 60%;
float: left;
}
.blog-left h3{
padding-bottom: 12px;
margin-bottom: 10px;
background:url("../../page-images/blog/title-border.png") repeat-x left bottom;
background-size: auto 12px;
font-weight: bold;
font-size:140%;
}
.blog-left .daytime{
font-size:80%;
display: block;
}
.blog-left .blog-content{
margin: 8% auto;
overflow: hidden;
}
.blog-left .blog-content img{
max-width: 720px;
width: auto;
}
.pagenavi{
text-align: center;
margin: 10% auto;
}
.pagenavi .prev,.pagenavi .next{
display: inline-block;
margin: 0 8%;
}
.pagenavi .prev a{
width:96px;
height: 96px;
display: block;
background: url("../../page-images/blog/arrow-left.png") no-repeat center center;
background-size: 100% auto;
}
.pagenavi .next a{
width:96px;
height: 96px;
display: block;
background: url("../../page-images/blog/arrow-right.png") no-repeat center center;
background-size: 100% auto;
}

.blog-right{
width:30%;
float: right;
}
.blog-list{
border:1px solid #CCC;
padding: 5%;
margin-bottom: 10%;
}
.blog-list dt{
text-align: center;
background:#BBDCE1;
border-radius: 50px;
margin-bottom: 5%;
padding: 1% 0;
}

dl.archive{
overflow: hidden;
}
dl.archive dt{
width: 27.12%;
float: left;
}
.blog-left .blog-content dl.archive dt img{
width: 100%;
}

dl.archive dd{
width: 70%;
float: right;
}
dl.archive dd span.more{
display: block;
margin-top: 10%;
font-size:80%;
text-align: right;
}

@media(max-width:414px){
h2.title.blog{
width: 16.18%;
}
.blog-left,.blog-right{
width: 100%;
float: none;
}
.blog-right{
margin: 30% auto;
}
.blog-left h3{
padding-bottom: 6px;
margin-bottom: 6px;
background-size: auto 6px;
font-size:140%;
}
.blog-left .blog-content{
margin: 3% auto 15%;
}
.blog-left .blog-content img{
max-width: 338px;
}
.pagenavi{
margin: 20% auto;
overflow: hidden;
}
.pagenavi .prev{
float: left;
margin: 0;
}
.pagenavi .next{
float: right;
margin: 0;
}
.pagenavi .prev a,.pagenavi .next a{
width: 84px;
height: 84px;
}

dl.archive{
overflow: hidden;
}
dl.archive dt{
width: 100%;
float: none;
margin-bottom: 5%;
}

dl.archive dd{
width: 100%;
float: none;
}
dl.archive dd span.more{
margin-top: 10%;
font-size:80%;
text-align: center;
}
}

@media(max-width:320px){
.blog-left .blog-content img{
max-width: 288px;
}
}