/* --------------------------------------------------------
1201px -
----------------------------------------------------------*/
@media screen and (min-width: 1201px) {

ul#gNav li{
margin:0 12px;
}
}/* over 1201px*/
/* --------------------------------------------------------
1200px
----------------------------------------------------------*/
@media screen and (max-width: 1200px) {
ul#gNav li a{
font-size:1.5vw;
}
ul#gNav li ul.child li a{
font-size:1.4vw;
}
div#header .block .info p a{
font-size:1.5vw;
}
div#header.fixed .block .info p a{
font-size:1.4vw;
}
.content main{
margin:0 1rem 1rem;
}
div#header .block .info p a{
height:4.6vw;
}

div#header.fixed .block .infohead{
width:12%;
}
div#header.fixed .block nav{
width:calc(88% - 150px);
}

}/* 1200px*/
/* --------------------------------------------------------
1000px
----------------------------------------------------------*/
@media screen and (max-width: 1000px) {
.sbjox{
width:calc(50% - 16px);
}
}/* 1000px*/
/* --------------------------------------------------------
912px
----------------------------------------------------------*/
@media screen and (max-width: 912px) {

div#news {
margin: 0 0 60px;
overflow: hidden;
}
div#doctor{
margin:0 auto;
}
div.cPhoto {
margin: 0 20px 0 20px;
overflow: hidden;
}
main .inner{
padding:0 0.4rem 3rem;
margin:0 1rem;
}
}/* 912px*/
/* --------------------------------------------------------
890px
----------------------------------------------------------*/
@media screen and (max-width: 890px) {
.fixed ul#gNav{
justify-content:flex-start;
}
.greetingInner .doctor{
margin:0;
}
#others table td div{
flex-wrap:wrap;
}
#others table td div span:first-of-type{
width:100%;
border-bottom:1px solid #bebebe;
}
#others table td div span:nth-of-type(2){
border-left:none;
}
#others table td div span, #others table tr.color.course th{
width:25%;
}
#others table tr.color th:first-of-type{
display:none;
}
}/* 890px*/
/* --------------------------------------------------------
830px
----------------------------------------------------------*/
@media screen and (max-width: 830px) {
ul#gNav li{
margin:0 0.7vw
}
#doctorInfo .col .sub{
display: inline-block;
width:100%;
margin:0 0 20px;
}
#general .gcol, #general .gcol .gcoltxt, #general .gcol .gcolimg{
width:100%;
flex-direction:column;
}
#general .gcol:nth-of-type(1) .gcolimg{
background-size:contain;
}
#general .gcol .gcolimg{
height:260px;
width:auto;
margin:1rem 1rem 0;
}
div#header .block .info p a{
padding:0.8rem 1.6rem 0.8rem;
}
}/* 830px*/
/* --------------------------------------------------------
750px spmode
----------------------------------------------------------*/
@media screen and (max-width: 750px) {
html {
 font-size: 2.4vw;
}
.accessmap, .transport, ul.monshin_btn li,#feature #f05.intro .introcontent .mn_col div, main .inner .introduction, main .inner .doctor, section#info .inner > div, #map, #mapaccess, #news h2, #news .inner ul, #introduction .inner figure, #introduction .inner > div, #about .about_list li, #about .about_list li:nth-of-type(n+3), #speciality .list li, div#footer div#fInfo, div#footer > div, #service ul.submenu li, #news .inner, dl.pill_list dt, dl.pill_list dd, .greeting .greeting-inner .doctor, .greeting .greeting-inner .doctor_message{
width:100%;
max-width:none;
}
#news .allinner, #specialty .intro, #cashless ul, .map, ul.monshin_btn, #greeting .gcol .gcoltxt, section#accessinfo .inner, section#info .inner, #introduction .inner, .greeting .greeting-inner{
flex-direction:column;
}
.info-area picture{
max-width:none;
}
.block nav, #service #others ul.dot li{
width:auto;
}
#general .gcol:last-of-type{
margin:0;
}
main .inner{
padding: 0 0.4rem 3rem;
margin:0;
}
section#info{
font-size:1rem;
}
section#info .inner{
margin:2rem 0 3rem;
}
section#info .inner:after{
content:none;
}
section#info .inner > div{
position: relative;
margin:0;
}
section#info .inner > div:after{
position: absolute;
top: 0;
display: block;
content: "";
width: 100%;
height: 1px;
background: #bebebe;
}
div#header.fixed{
padding-top:0;
}
div#header.fixed .block .logo a img.mainlogo{
display:block;
}
div#header.fixed .block .logo a img.single{
display:none;
}
.telink{pointer-events:auto;}
#subject h2{
padding: 1rem 0 3rem;
}
main section{
padding: 9rem 6% 8rem;
}
.content main{
margin: 0 0.6rem 1rem;
}
h1{
position:static;
background:none;
padding:0;
text-align:center;
max-width:none;
font-size:2.8vw;
}
h1 span{
display:inline-block;
}
main p.ttl{
padding: 3rem 0 0;
}
main p.ttl, main h1{
padding:1rem 0;
}
ul#gNav, .fixed ul#gNav{
position: fixed;
opacity:0;
pointer-events: none;
background:transparent;
z-index: 20000;
padding:14px;
-webkit-transition: opacity 0.4s ease-out;
-moz-transition: opacity 0.4s ease-out;
transition: opacity 0.4s ease-out;
margin:0;
flex-direction:column;
}
.openNav ul#gNav {
top:60px;
left:0;
bottom: auto;
opacity:1;
pointer-events: auto;
}
#navToggle, .openNav ul#gNav{
background:#57c1d7;
}
ul#gNav li + li{
margin-left:0;
}
ul#gNav li + li a:after{
content:none;
}
ul#gNav li{
width:100%;
}
ul#gNav li a{
font-size:1.1rem;
border-bottom:1px solid rgba(135, 121, 98, 0.3);
padding:1rem;
margin:0;
text-align:center;
color:#fff;
}
ul#gNav li a:hover{
opacity:0.7;
background:none;
color:#fff;
}
ul#gNav li a:hover::after{
content:none;
}
ul#gNav li.parent a{
position:relative;
}
ul#gNav li.parent a .arrow{
position:absolute;
top:calc(50% - 15px);
right:0;
display:flex;
align-items:center;
justify-content:center;
width:30px;
height:30px;
color:#fff;
}
ul#gNav li.parent a .arrow::before{
color:#fff;
}
ul#gNav li.parent.on a .arrow:before{
content: "\f057";
}
ul#gNav li:hover ul.child{
visibility: hidden;
opacity: 0;
}
ul#gNav li.parent.on ul.child{
position:static;
display:flex;
width:100%;
margin:0;
display:none;
visibility: hidden;
opacity:0;
}
ul#gNav li.parent.on ul.child li{
width:50%;
border:none;
}
ul#gNav li.parent.on ul.child li a{
font-size:1rem;
display: flex;
justify-content:center;
border-bottom:1px dashed rgba(135, 121, 98, 0.3);
background:none;
position:relative;
}
ul#gNav li.parent.on ul.child li a:after{
position:absolute;
width:10px;
left:calc(100% - 12px);
top:calc(50% - 5px);
font: var(--fa-font-thin);
content: "\f054";
font-size:80%;
}
ul#gNav li.parent.on ul.child{
visibility: visible;
opacity:1;
display:flex;
flex-wrap:wrap;
flex-direction: row;
}
div#header .bgimg{
height:100%;
}
div#header{
height:300px;
}
.content-page div#header{
height:auto;
}
div#header .block{
border-bottom:1px solid rgba(146,120,100,0.4);
}
div#header .block, div#header .src_content + .block{
position:fixed;
width:calc(100% - 60px);
height:60px;
z-index:200;
padding:0;
text-align:left;
justify-content:flex-end;
background:rgba(255,255,255,0.9);
}
div#header .infohead, div#header.fixed .block .infohead{
width:100%;
}
div#header .logo, div#header.fixed .block .logo{
width:50%;
max-width:260px;
}
div#header .logo a{
width:100%;
padding:0 0.4rem;
box-sizing:border-box;
overflow:hidden;
display: flex;
align-items:center;
}
div#header .logo a img{
max-height:100%;
margin: 0 auto;
padding:0;
}
div#header .block .info, div#header.fixed .block .info{
width:50%;
padding:0;
position:static;
flex-direction:row;
}
div#header .block .info p, div#header.fixed .block .info p{
padding:0;
width:50%;
max-width:none;
margin:0;
}
div#header .block .info p:nth-of-type(2n):after{
position: absolute;
display: block;
background:rgba(129,141,147,0.4);
content: "";
width: 1px;
height: 60%;
top: 20%;
left: 0;
}
div#header .block .info p.monshin, div#header .block .info p.online{
position:fixed;
bottom:0;
background:rgba(0,106,72,0.6);
z-index:1000;
}
div#header .block .info p.monshin a, div#header .block .info p.online a, div#header .block .info p.monshin a i, div#header .block .info p.online a i{
color:#fff;
}
div#header .block .info p.monshin{
left:0;
}
div#header .block .info p + p.monshin:after{
content:none;
}
div#header .block .info p.online{
left:50%;
}
div#header .block .info p + p.online:after, div#header.fixed .block .info p + p.online:after{
background:#fff;
}
div#header .block .info p.online a span.line{
width:auto;
}
div#header .block .info p span.pc{
display:none;
}
div#header .block .info p span.sp, div#header.fixed .block .info p.resv span{
display:block;
}
div#header .block .info p a,div#header.fixed .block .info p.tel a, div#header.fixed .block .info p.resv a, div#header.fixed .block .info p.monshin a, div#header.fixed .block .info p.instagram a{
text-align:center;
box-sizing:border-box;
width:100%;
height:60px;
border-radius:0;
font-size:0.7rem;
flex-direction:column;
justify-content:space-around;
letter-spacing:0.1vw;
border: none;
line-height:1.1;
padding:0.4rem 0;
}
div#header .block .info p a span{
font-size:0.6rem;
}
div#header.fixed .block .info p i{
margin:0;
}
div#header .block .info p a i{
display:block;
position:relative;
margin-right:0;
}
div#header .block .info p.tel a, div#header .block .info p.resv a, div#header .block .info p.monshin a, div#header .block .info p.online a{
border:none;
background:none;
}
div#header.fixed .block .info p.tel a, div#header.fixed .block .info p.resv a, div#header.fixed .block .info p.monshin a{
border-radius:0;
}
div#header.fixed .block{
display: flex;
height:60px;
width:calc(100% - 60px);
flex-direction:column;
}
div#header.fixed .logo, div#header.fixed .block .info{
display:flex;
max-width: none;
}
#navToggle{
display:block;
position:fixed;
right:0;
top:0;
cursor:pointer;
color:#fff;
font-size:0.7rem;
box-sizing:border-box;
height:60px;
width:60px;
text-align:center;
z-index:200;
letter-spacing:0;
}
.openNav #navToggle span:nth-child(1) {
top: 20px;
-webkit-transform: rotate(-45deg);
-moz-transform:rotate(-45deg);
transform:rotate(-45deg)
}
.openNav #navToggle span:nth-child(2),
.openNav #navToggle span:nth-child(3) {
top: 20px;
-webkit-transform:rotate(45deg);
-moz-transform:rotate(45deg);
transform:rotate(45deg)
}
.btn{
text-align:center;
}
.btn a{
min-width:60%;
width:90%;
}
div#header .catch{
font-size:1rem;
letter-spacing:0;
padding:0;
bottom:18%;
}
#content-top section#news{
padding:2rem 0.4rem 4rem;
}
ul.breadcrumb{
text-align:center;
margin:0;
}
.photo {
text-align:center;
display:block;
margin:0 auto 20px;
width: 100%;
float:none;
max-width:none;
}
.photo img{
width:60%;
}
.calinner{
padding-top:550px;
}
.fixed + .topimg img{
  padding-top:0;
}
#info .contact p a{
padding:0.6rem;
font-size:1.1rem;
height:12vw;
}
div#footer #fNav ul {
font-size:0.8rem;
padding:1rem;
}
div#footer #fNav ul li a{
text-align:center;
}
div#footer div#fInfo img {
width: auto;
}
div#footer #fNav ul li ul.submenu{
margin:0;
padding:0.6rem 0.6rem 1rem;
}
#service ul.submenu li + li a{
border-top: 1px dashed #818d93;
border-left:none;
}
.sig{
flex-direction:column;
}
.sig p{
margin:0;
}
.sig p.clinicName{
margin:0 0 10px;
}
.servicecal{
width: 90%;
}
#content-top #introduction h2{font-size:1.6rem;}
#speciality .list li:nth-of-type(n+4){
margin: 1rem 0.6rem 40px;
}
#speciality .list li:last-of-type{
margin: 1rem 0.6rem 0;
}
.flow{
justify-content:space-around;
}
.profileInner{
flex-direction:column;
}
.profile, .profile:first-of-type{
width:100%;
}
.profile.media{
margin:0 0 3rem;
}
#clinic .clinicflow .circleset:first-of-type{
padding-left:1.3rem;
}
#clinic .clinicflow .circleset span{
width:30vw;
height:30vw;
}
ul.submenu li {
width: calc(50% - 8px);
}
#service .msl_outer div.txt, #service .msl_outer div.mimage{
width:100%;
}
.msl_outer div.mimage{
max-width:380px;
}
#service .product{
flex-direction:column;
}
#service .product > div{
width:100%;
margin: 0 0 0.6rem;
}
#service .product div.producttxt{
padding:0
}
#service .example p span{
width:46%;
}
#service .product.doc + p.price{
display:block;
margin:0 0 2rem;
}
.echophoto{
flex-wrap:wrap;
justify-content:center;
}
#service .scol{
flex-direction:column;
}
#service .scol h3, #service .scol p{
width:auto;
}
#service .scol h3{
margin:0 0 1rem;
}
.route div.route_photo{
width:100%;
}
.route div.route_photo + div figure:after{
content:none;
position:static;
}
.route div.route_photo + div:before{
font-family: "Font Awesome 6 Pro";
font-weight: 900;
font-size: 2rem;
content: "\f175";
display:flex;
justify-content:center;
margin:0 0 1rem;
}
.profilecol{
padding:0;
}
.staffinner div{
flex-direction:column;
margin:0 0 1rem;
}
.staffinner div h3, .staffinner div p{
width:100%;
}
.close, div#header.fixed .block .info .close{
display:none;
}
section#accessinfo .transport{
padding:1rem 0 0;
}
.sbjinner .sbjbox{
padding:0.6rem;
}
#service .symptoms p span.sttl, #service .sleep_cause p span.sttl{
margin:0 0 1rem;
}
#counseling .introduction{
flex-direction:column;
}
#counseling .introduction .counselor_photo, #counseling  .introduction .counselor_txt{
width:100%;
}
div#header .open{
bottom:0
}
#news p.cal-top{
position:static;
margin:1rem 1rem 2rem;
width:auto;
}
#news .inner ul.newslist li{
padding:1rem 0.4rem;
}
.payment{
margin:0 auto 2rem;
}
}/* 750px end */
/* --------------------------------------------------------
730px
----------------------------------------------------------*/
@media screen and (max-width: 730px) {
.scol{
text-align:center;
margin-bottom:0;
}
.scol img{
float:none;
margin:0 auto 20px;
}
table.feeTable span:before {
content: "\A" ;
white-space: pre ;
}
div#map {
height: 300px;
}
}/* 730px */
/* --------------------------------------------------------
710px
----------------------------------------------------------*/
@media screen and (max-width: 710px) {
.sub-menu{
width:100%;
padding: 20px;
}
.sub-menu + main{
width:100%;
}
.sub-menu ul .smsb li{
display:inline-block;
}
}/* 710px */
/* --------------------------------------------------------
640px
----------------------------------------------------------*/
@media screen and (max-width: 640px) {
html {
font-size: 3vw;
}
}/* 640px */
/* --------------------------------------------------------
480px
----------------------------------------------------------*/
@media screen and (max-width: 480px) {
html {
font-size: 3.8vw;
}
ul#gNav li.servicelist a{
min-height:60px;
}
main section#accessinfo{
padding: 3rem 6% 8rem;
}
#news .btn{
margin: 0 5%;
width:90%;
}
.checktb{
font-size:0.9em;
}
.doctorInfo .col {
width:100%;
}
.pCol ul span:after{
content:"\A" ;
white-space: pre ;
}
div#header .block .hinfo {
text-align: center;
width: 66%;
}
div#header .block .hinfo .btn p {
font-size: 12px;
}
div#footer p.copy {
font-size:12px;
letter-spacing:0.1rem;
}
.newscol {
margin: 70px 0 120px;
}
div#footer ul#fNav li +li::before{
content:none;
}
div#header .block p{
font-size:0.7em;
}
a.spTel {
   pointer-events: auto;
   cursor: default;
}
div#logoCol {
height: auto;
}
.calTxt{
font-size:0.6rem;
}
#feature h2{
letter-spacing:0;
}
#news .inner{
min-height:50vh;
}
}/* 480px */
/* --------------------------------------------------------
430px
----------------------------------------------------------*/
@media screen and (max-width: 430px) {
#news .instagram{
text-align:center;
}
.calinner {
padding-top: 500px;
}
table.cal td {
height: 60px;
}
.docfee dt,.docfee dd{
width:100%;
display:inline-block;
}
.docfee dd{
text-align:center;
}
.sub-menu.fixed ul{
display:block;
}
/*#service h2, #service h3{
padding-top: 90px;
margin-top: -90px;
}*/
.sub-menu ul .smsb li {
width:48%;
vertical-align:top;
}
.sub-menu ul .smsb li:nth-child(3) {
width:100%;
}
ul.cPhoto li span{
bottom:6px;
left:8px;
}
.doctorInfo h3{
font-size:1.2em;
}
p.backToTop a {
bottom: 10px;
right: 10px;
}
.doctorInfo .col, .doctorInfo .col .sub  {
width: 100%;
}
.featurecol p.ttl {
font-size:1em;
letter-spacing:0;
}
div#content-top {
margin: 0 auto;
}
ul#gNav li a {
height:auto;
}
.nosp{
display:none;
}
div#header{
margin: 0;
padding:0;
text-align:center;
}
.docttl span:after{
content: "\A" ;
white-space: pre ;
}
div#footer div#fInfo .flogo{
font-size:5vw;
}
}/* 430px */
/* --------------------------------------------------------
360px
----------------------------------------------------------*/
@media screen and (max-width: 360px) {
ul.cPhoto li span{
font-size:0.7em;
padding:2px 4px;
}

}/* 360px */
/* --------------------------------------------------------
340px
----------------------------------------------------------*/
@media screen and (max-width: 340px) {

html {
font-size: 4vw;
}

#feature h2{
margin: 2rem 0 3rem;
}

#feature h2, ul#gNav li.parent.on ul.child li a{
letter-spacing:0;
}

.btn {
width: 100%;
}

}
/* 340px */