@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat&family=Noto+Sans+JP:wght@400;700;900&family=Noto+Serif+JP:wght@400;600;700;900&display=swap');

/* constant */
:root {
  --main-color: #5d8383 ;
  --sub-color:#a1cece;
  --sub-color2:#bd4f5e;
  --font-color: #292929;
  --bg-color: #fff;
  --font-family: 'Noto Serif JP', "Meiryo UI", "Hiragino Sans", "Hiragino Kaku Gothic ProN","Yu Gothic UI", "MS PGothic", sans-serif;
  --font-family-gochic: 'Noto Sans JP', sans-serif;
}

/*layout*/
body{font-family:var(--font-family);color:var(--font-color);font-size:16px;background: var(--bg-color);}
p{margin:0;}
a{text-decoration: none;color: inherit;}
a:hover{opacity: 0.7;}
ul{padding: 0;margin: 0;list-style: none;}
section{padding: 80px 0 60px;position: relative;}
article{position: relative;}
img{max-width: 100%;}
#header .h-wrap{margin:0 auto;position:relative;text-align:center;width:100%;max-width: 1200px;}
.content{margin:0 auto;position:relative;width:100%;max-width:1000px;}
#header a,#header #global #nav a, #footer a,#fnav a,#breadcrumbs a, a[href^="tel:"]{text-decoration: none;}
#main{width:100%;margin:0 auto;overflow:hidden;position:relative;padding:0;line-height:1.9;}

@media only screen and (max-width:599px){
  body{font-size: 14px;}
  .content{padding: 0 10px;}
  section{padding: 40px 0;}
  article{padding: 60px 0;}
}

/*main*/
h3,.h3,h4,.h4,h5,.h5,h6,.h6,dl.box>dt{clear:both;font-weight:bold;font-size:1.143em;line-height:1.5;position:relative;margin-bottom:16px;padding:.5em 2px;}

/* clearfix */ 
.cf{overflow: hidden;zoom: 1;}
.cf:after {content: "";display: block;clear: both;}

@media only screen and (min-width:1024px){
  .pc-only{display: block;}
  .tb-only{display: none;}
  .sp-only{display: none;}
}
@media only screen and (min-width:600px){
  .pc-only{display: block!important;}
  .tb-only{display: block!important;}
  .sp-only{display: none!important;}
}
@media only screen and (max-width:599px){
  .pc-only{display: none!important;}
  .tb-only{display: none!important;}
  .sp-only{display: block!important;}
}

/*header*/
#header{display: flex; justify-content: space-between;padding: 15px 60px;align-items:center;background: #fff;z-index: 100;width: 100%;}
#global-nav{display: flex;}
#global-nav li{border-right: 1px solid var(--font-color);padding: 0 10px;line-height: 1;}
#global-nav li:last-child{border: none;}
#humburger{	position: absolute;cursor: pointer; width: 60px; height:60px;z-index: 999999;top:0;right: 0;}
#humburger span{ display: inline-block;transition: all .4s;position: absolute;left:50%;height: 2px;background: var(--main-color);;width: 30px; transform: translate(-50%, 0);}
#humburger span:nth-of-type(1) {top:21px;	}
#humburger span:nth-of-type(2) {top:31px; }
#humburger span:nth-of-type(3) {top:41px; }
#humburger.active span:nth-of-type(1) {top: 50%; transform: translate(-50%, -50%) rotate(-45deg); width: 50%; }
#humburger.active span:nth-of-type(2) { opacity: 0; }
#humburger.active span:nth-of-type(3) { top: 50%; transform: translate(-50%, -50%) rotate(45deg); width: 50%;}
#header .drawer-nav-wrapper{position: fixed; top: 0; left: 100%; z-index: 99999;  width: 100vw;height:100vh; transition: all 0.5s;display: flex;}
#header .drawer-nav-wrapper.open{left:0;}
#header .drawer-nav-wrapper .drawer-nav{width:100vw;background:var(--main-color); opacity: 0.8;color:#fff;}
#header .drawer-nav-wrapper .drawer-nav dl{margin: 100px 0;}
#header .drawer-nav-wrapper .drawer-nav dl dt{border-bottom:1px solid #fff;padding: 15px 40px;font-size: 1.8rem;}
#header .drawer-nav-wrapper .drawer-nav dl dt a{display: block;width: 100%;height: 100%;}
@media only screen and (min-width:1024px){
  #humburger{display: none;}
  .drawer-nav-wrapper{display: none;}
}
@media only screen and (max-width:1023px){
  #header{position: fixed;padding:5px 25px;height: 60px;}
  #header .header-logo img{width:60%;}
  #global-nav{display: none;}
}

/* footer */
#footer{margin-top: 80px;font-family: var(--font-family-gochic);position: relative;overflow-x: hidden;padding-top: 80px;}
#footer .footer__bg{background:#daf0f0;}
#footer .content{;width:100%!important;padding:50px 0 100px;}
#footer .footer__logo-area{margin: 0 80px 0 0;}
#footer .footer__logo-area img{margin-bottom: 20px;}
#footer .footer__logo-area .footer__address{padding-left: 90px;line-height: 2.0;font-family: var(--font-family);}
#footer .footer__navi-area{padding: 0 80px 0 0;}
#footer .footer__navi li{border-bottom: 1px dotted var(--main-color);padding: 10px 0 10px 20px;min-width: 215px;position: relative;}
#footer .footer__navi li:before {content: '●';color: var(--main-color);font-size: 1.2rem;position: absolute;left:0;top:50%;transform: translate(0, -50%);}
#footer .footer__clinic-link{padding: 10px 0 0;}
#footer .footer__clinic-link li{padding: 3px 0 3px 15px;min-width: 215px;position: relative;}
#footer .footer__clinic-link li:before {content: '>';color: var(--main-color);font-size: 0.9rem;position: absolute;left:5px;top:50%;transform: translate(0, -50%);}
#footer .footer__tree{position: absolute;left: 1150px; bottom: 30px;}
#footer .copyright{background:var(--main-color); font-size: 1.8rem; color:#fff;text-align: center;padding: 5px 0;}
@media only screen and (min-width:600px){
  #footer .content{display: flex;justify-content: flex-start;width:100%!important;max-width: 1600px;padding:30px 0 120px;}
}
@media only screen and (max-width:599px){
  #footer .content{padding: 20px 10px 20px;}
  #footer .footer__logo-area{margin: 0;}
  #footer .footer__logo-area img{display: block; margin: 0 auto 20px;}
  #footer .footer__logo-area .footer__address{padding-left: 20px;margin-bottom: 40px;}
  #footer .footer__navi-area{padding: 0;}
  #footer .footer__navi li{padding: 10px 0 10px 50px;}
  #footer .footer__navi li:before{left:20px;}
  #footer .footer__clinic-link li{padding: 3px 0 3px 50px;}
  #footer .footer__clinic-link li:before{left: 20px;}
  #footer .footer__tree{display: none;}
  #footer .copyright{font-size: 1.2rem;}
}

#pagetop{position: fixed;right: 100px; bottom: 80px;; height: 128px; width: 128px;z-index:10;}
@media only screen and (max-width:599px){
  #pagetop{right: 20px;bottom: 20px;height: 60px; width: 60px;}
}

/* common */
.flex{ display:-webkit-box;	display:-ms-flexbox; display:flex; -webkit-box-pack: justify;	-ms-flex-pack: justify;	justify-content: space-between;	-webkit-box-align: start; -ms-flex-align: start; align-items: flex-start;}
.row-reverse{ -webkit-box-orient: horizontal;	-webkit-box-direction: reverse;	-ms-flex-direction: row-reverse; flex-direction: row-reverse; }
@media only screen and (max-width:599px){
  .flex{ display: block; }
}
