@charset "utf-8";
*{margin:0;padding:0;box-sizing:border-box;-webkit-appearance: none;-webkit-text-size-adjust: 100%;}
*:before, *:after {box-sizing: border-box;}
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, p, blockquote, pre,em, img, strong,b,dl, dt, dd, ol, ul, li,fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td,canvas, details,figure,footer, header, hgroup, menu, nav, section, summary,mark, audio, video {margin:0;padding:0;border:0;outline:0;vertical-align: baseline;background: transparent;font-weight: normal;font-style: normal;}
img{max-width: 100%;height:auto;vertical-align: middle;}
ul {list-style: none;}
ol {padding-left: 1.5em;}
a {color: #51a745;vertical-align:baseline;background:transparent;text-decoration: none;}
a:hover{transition-property: all;transition: 0.2s linear;opacity: 0.8;}
a[href^="tel:"] {pointer-events: none;}
hr {display:block;height:1px;border:0;border-top:1px solid #cccccc;margin:1em 0;padding:0;}
input, select {vertical-align:middle;}

/* 共通 */
html, body {overflow-x: hidden;}
body {position:relative;font-feature-settings: "palt";font-family: Meiryo,"Hiragino Sans", "Hiragino Kaku Gothic ProN", "sans-serif";font-weight: 400; color: #4c4c4c;line-height: 1.6;font-size:clamp(16px,calc(18/1500*100vw),18px)!important;}
.inner-box{width:93%;max-width:1500px;padding:clamp(40px,calc(100/1500*100vw),100px) 0; margin:auto;}
.mb20{margin-bottom:clamp(15px, calc(20/1025*100vw),20px)!important;}
.mb40{margin-bottom:clamp(20px,  calc(40/1025*100vw),40px)!important;}
.mb60{margin-bottom:clamp(30px, calc(60/1025*100vw),60px)!important;}
.mb100{margin-bottom:clamp(50px,calc(100/1025*100vw),100px)!important;}
.fs18{font-size:clamp(16px,calc(18/1025*100vw),18px)!important;}/*最小16*/
.fs20{font-size:clamp(16px,calc(20/1025*100vw),20px)!important;}/*最小16*/
.fs22{font-size:clamp(18px,calc(22/1025*100vw),22px)!important;}/*最小18*/
.fs24{font-size:clamp(18px,calc(24/1025*100vw),24px)!important;}/*最小18*/
.fc_w{color:#FFF;}
.bg_o{background:#e08917;}
.bg_g{background:#f4efe7;}
.center,.center_l{text-align: center;}
.wb{font-weight:700;}
.sp_on{display:none !important;}
.flexbox{
	display: flex;
    flex-wrap: wrap;
	row-gap:clamp(20px, calc(40/1500*100vw), 40px);
	margin:auto;
}
.flexbox.c2{column-gap: 3%;}
.flexbox.c3{column-gap: 2.75%;}
.flexbox.c4{column-gap: 2%;}
.c2 > *{width: 48.5%;}
.c3 > *{width: 31.5%;}
.c4 > *{width:23.5%;}
.boxborder{box-shadow: 0 0 10px rgba(0,0,0,0.3);border-radius: 10px;padding:clamp(15px,calc(30/1500*100vw),30px);}
.dot-line {position: relative;padding-bottom: 20px;}
.dot-line::after { content: "";position: absolute;left: 0;bottom: 0;width: 100%;height: 8px;background:radial-gradient(circle, #269117 40%, transparent 41%) repeat-x; background-size: 10px 8px; /* 丸の間隔とサイズ */}

/*見出し*/
h2,h3,h4{color:#2c2c2c; }
.h2{text-align:center;font-size:clamp(18px,calc(26/1025*100vw),26px);}
.h2 span{font-size:clamp(14px,calc(18/1025*100vw),18px);}
.h2::after{content:""; display:block; width:clamp(120px,calc(240/1025*100vw),240px); height: clamp(14px,calc(27/1025*100vw),27px);background:url("../images/h2.svg") no-repeat center bottom / contain;margin:20px auto clamp(20px,calc(60/1025*100vw),60px);}
.h2::before{display:block;font-size:clamp(14px,calc(20/1500*100vw),20px);color:#269117;font-family:"Century Gothic", Arial, Helvetica, "sans-serif";}
h3{font-size:clamp(18px,calc(24/1500*100vw),24px);}

/* ヘッダー
------------------------------------------------------------*/
header{display:flex;justify-content: space-between; width:95%;margin:0  auto 20px;padding-top:10px;}
h1{font-size:14px;margin-bottom: 10px;}
.h_rco{display:flex;flex-direction: column;align-items: flex-end;gap:10px;}
.logo{width:clamp(250px,calc(312/1500*100vw),312px);}

/* ナビゲーション
------------------------------------------------------------*/
/* パソコン用ナビゲーション */
/*固定追従時CSS*/
#navigation.hidden{
  transform: translateY(-100%);
}
#navigation.show{
	position:fixed;
	top:0;
	left:0;
	inset:0;
	margin: 0 auto;
	justify-content: center;
	background:rgba(255,255,255,1.0);
	height:60px;
	width:70%;
	border:1px solid #269117;
	border-radius: 0 0 10px 10px;
    font-size:clamp(18px, calc(20/1500*100vw),20px);
    transform: translateY(0);
    transition: transform 0.3s ease-out;
    z-index:999;
}
/*----固定追従用ここまで*/
.hamburger-button,.hamburger-input,.hamburger-button {display: none;}
.pcnav .drawer-nav{font-size:clamp(1rem, 0.273rem + 0.91vw, 1.125rem);margin:0 auto ;text-align: center;}
.pcnav .drawer-nav > li{display: inline-block;}
.pcnav .drawer-nav a{display:block;	padding:10px 1vw; color:#4c4c4c;font-weight: 600;}
.pcnav .drawer-nav >li a:hover{color: #269117;}
.pcnav .drawer-nav >li:last-child{display:none;}
/*ドロップダウンメニュー*/
.pcnav .subnav > a::after{content:"+ "; border:1px solid #4c4c4c;display:inline-block;width:20px;height:20px; line-height: 20px;  text-align: center;border-radius:50%; margin-left:10px;}
.pcnav .subnav > a:hover::after{content:"- ";}
.pcnav .subnav{position:relative;}
.pcnav .subnav > ul{display:none; /* 下層メニューを非表示 */}
.pcnav .subnav:hover > ul{
	position: absolute;
	top: 100%; /* 親項目の直下に配置 */
	left:50%;
	transform: translateX(-50%);
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width:clamp(600px,calc(900/1920*100vw),900px);

	border-radius: 0 0 10px 10px;
	background:#f9f9f5;
	padding:20px 10px;
	z-index: 999!important;
}
.pcnav .subnav > ul li{
	border-bottom:1px dotted #ccc;
	width:49%;
}

.pcnav .subnav > ul a:hover{background-color:#a6d296;color:#333;border-radius: 0;}
#nav {
  transition: transform 0.3s ease;
}

#nav.hidden {
  transform: translateY(-100%);
}

/* ドロワー */
@media screen and (max-width: 1024px) {
	.drawer{ position: relative;}
	.hamburger-input {display: none;}
	.hamburger-mark {
		background-color: #269117; /* カスタム */
		display: block;
		height: 1px; /* カスタム */
		transition: 0.3s; /* カスタム */
		width: 30px; /* カスタム */
	}
	.drawer-nav {
		position: absolute;
		bottom:0;
		transform: translateY(-100%); /* 縦Y・横Xカスタム */
	}
	#hamburger:checked ~ ul.drawer-nav {
		position:fixed;
		top:0;
		bottom:inherit;
        display:flex;
        flex-direction: column;
		width: 100%;
		inset:0;
		height: 100%;
		margin:auto;
		padding:50px 0px 0;
		background:#e3f1e1;/* カスタム */
		transform: translateY(0%); /* 縦Y・横Xカスタム */
		transition: 0.5s;
		overflow-y: scroll;
		-webkit-overflow-scrolling: touch;
         z-index: 998;
	}
	.hamburger-button {
		position: fixed;
		top:5px;
		right:5px;
		align-items: center;
		background-color: #fcf9f1; /* カスタム */
		border: 1px solid #269117; /* カスタム */
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap: 7px; /* カスタム */
		height:clamp(60px, calc(70/1025*100vw), 70px); /* カスタム */
		width: clamp(60px, calc(70/1025*100vw), 70px);/* カスタム */
		border-radius: 5px;
        z-index: 999;
    }
	.hamburger-button span:last-child {position:absolute;bottom:0; left:50%; transform: translateX(-50%);font-size:11px; color:#4c4c4c;}
	#hamburger:checked ~ .hamburger-button{position: fixed;top:5px;right:5px;z-index: 9999;}
	#hamburger:checked	~ .hamburger-button	.hamburger-mark:nth-of-type(1) {transform:translate(4px, -3px) rotate(45deg); transform-origin: 0%;}
	#hamburger:checked ~ .hamburger-button .hamburger-mark:nth-of-type(2) {opacity: 0;}
	#hamburger:checked ~ .hamburger-button .hamburger-mark:nth-of-type(3) {transform:translate(4px, 3px) rotate(-45deg); transform-origin: 0%;}
	#hamburger:checked ~ .hamburger-button span:last-child{display:none;}

	/*開閉パネル*/
	.drawer-nav a.pc{display:none !important;}
    .drawer-nav{overflow-y: scroll;}
    .drawer-nav > li{width:90%;margin:0 auto;background:#FFF;border-bottom: 1px dotted #269117;}
	.drawer-nav > li  > a{display:block; padding:10px;color:#000;text-align: center;}/*子階層*/	
    .drawer-nav >li:last-child{background:none;border-bottom:none;margin-top:20px;}    
    .drawer-nav .subnav ul{display:flex; flex-wrap: wrap;justify-content:flex-start;}
    .drawer-nav .subnav ul a{display:flex;padding:10px;align-items: center;gap:10px;}
    .drawer-nav .subnav ul a::before{content:"";width:5px; height: 5px;display:inline-block;border-radius:10px;  background:#269117;}
    .drawer-nav .subnav li{width:50%;/*border-right: 1px dotted #269117;*/}    
    .drawer-nav .subnav li:last-child{width:100%;}  
}
/* フッター
------------------------------------------------------------*/
footer h2::before{content:"Clinic hours & Access";}
footer .flc{max-width:613px;margin:auto;}
footer .frc div{border:1px solid #443527; border-radius: 12px;padding:clamp(15px,calc(30/1500*100vw),30px);}
.hour{width:100%;}
footer .left{text-align: left;display: inline-block;}
.border_g{border-bottom:2px solid #269117;padding-bottom: 20px;}
footer .bg_o{padding:clamp(5px,calc(8/1500*100vw),8px);border-radius: 8px;}
footer dl{border-bottom:1px dotted #443527;}
footer dl div{display:flex;flex-wrap: wrap;}
footer dt,footer dd{padding:clamp(10px,calc(20/1500*100vw),20px);border-top:1px dotted #443527;}
footer dt{width:clamp(100px,calc(120/1500*100vw),120px);}
footer dd{width:calc(100% - clamp(100px,calc(120/1500*100vw),120px));}
footer .fbtn{display: flex; justify-content: center;margin-top:30px;}
footer .fbtn img{width:clamp(200px,calc(316/1500*100vw),316px);}
footer .frc .fbtn{justify-content:flex-end;margin-top:30px;}
footer .copyright{background:#269117;padding:clamp(5px,calc(15/1500*100vw),15px) 0;color:#FFF; text-align: center;}
#pagetop {
	position:fixed;
	bottom:60px;
	right:20px;
	opacity: 0;
	transition: 0.8s ease;
	pointer-events: none;
	z-index: 997!important;
}
#pagetop a:hover {opacity: 0.5;}
#pagetop.visible {
  opacity: 1;
  pointer-events: auto;
}

/*下層ページメイン画像*/
#submain_area {
    position: relative;
    padding-bottom: 20px;
    display: flex;
    justify-content:flex-end;
    align-items:flex-end;
    background: linear-gradient(
    to top,
    #e3f1e1 65%,   /* 下70%に色 */
    transparent 65%
    );
}
#submain_area::before{
    position:absolute;
    top:0;
    left: 0;
    content: "";
    display:block;
    width:clamp(200px,calc(1000/1920*100vw),1000px);
    height: clamp(26px,calc(130/1920*100vw),130px);
    background: url("../images/bg_main.svg") no-repeat left top /contain;
    z-index: -1;
}
#submain_area img{
    width:clamp(300px,calc(1200/1920*100vw),1200px);
    border-top-left-radius: clamp(20px,calc(70/1920*100vw),70px);
    border-bottom-left-radius: clamp(20px,calc(70/1920*100vw),70px);
    z-index: 1
}
#submain_area h2 {
    position: absolute;
    left:clamp(50px,calc(200/1920*100vw),200px);
    bottom: clamp(30px,calc(100/1920*100vw),100px);
    font-size:clamp(20px,calc(36/1920*100vw),36px);
}
#submain_area h2::after{display:block;font-family: Arial, Helvetica, "sans-serif";font-size:clamp(14px,calc(20/1920*100vw),20px);color:#269117;}
@media only screen and (max-width:700px){
    #submain_area {
        padding-bottom: 0px;
        flex-direction: column;
        align-items: center;
        height: clamp(270px,calc(400/700*100vw),400px);
        background: linear-gradient(
        to top,
        #e3f1e1 78%,   /* 下70%に色 */
        transparent 78%
        );
    }
    #submain_area::before{
        position:absolute;
        top:0px;
        left: 0;
        content: "";
        display:block;
        width:100%;
        height: 100px;
        background: url("../images/bg_main.svg") contain;
        z-index:-1;
    }
    #submain_area img{
        width:100%;
        border-radius: 0;
    }
    #submain_area h2 {
        position: static;
        text-align: center;
        margin-bottom: 15px;
    }
}


/* 1024px以下から
------------------------------------------------------------*/
@media only screen and (max-width:1024px){
	/* 共通 	------------------------------------------*/
	a[href^="tel:"] {pointer-events: auto;}
	/* ヘッダー---------------------------------------*/
    .tel{display:none;}
    /* フッター	--------------------------------------*/
    footer .flexbox.c2{display:block;}
    footer .flc{width:100%;max-width: 100%;margin-bottom: 50px;}
    footer .frc {width:100%;}
    footer img{display:block;margin:auto;}
    footer .copyright{font-size: 14px;}
    #pagetop {bottom:40px;right:5px;}
    #pagetop img {width:20px;height: auto;}
}
/* 768px以下から
------------------------------------------------------------*/
@media only screen and (max-width:768px){
	.center_l{text-align: inherit;}
	.c2 > *{width: 100%;}
	.c3 > *{width: 48.5%;}
	.c4 > *{width:31.5%;}
    .flexbox.c2{row-gap:30px; }
	.flexbox.c3{column-gap: 3%; row-gap:30px; }
	.flexbox.c4{column-gap: 2.75%;row-gap:30px; }

}
/* 450px以下から
------------------------------------------------------------*/
@media only screen and (max-width:450px){
    body {line-height: 2.0;}
    header{display:block;}
	h1{margin-right:65px;white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
    h2,h3,h4{font-weight: 600;}
	/* 共通 */
	.sp_on{display: inherit !important;}
	.sp_non{display: none !important;}
	.c3 > *{width: 100%;}
	.c4 > *{width:48.5%;}
	.flexbox.c4{column-gap: 3%;}
	.c2,.c3,.c4{row-gap: 15px;}

    /*下層ページメイン画像*/
    #submain_area {
        padding-bottom: 0px;
        flex-direction: column;
        align-items: center;
        height: clamp(200px,calc(300/450*100vw),300px);
        background: linear-gradient(
        to top,
        #e3f1e1 80%,   /* 下70%に色 */
        transparent 80%
        );
    }
}