@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,600;0,700;1,700&family=M+PLUS+Rounded+1c:wght@400;500&family=Noto+Sans+JP:wght@400;500;700;900&family=Noto+Serif+JP:wght@500;600&family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&family=Spectral:ital,wght@1,500;1,600&family=Ubuntu:ital,wght@0,500;0,700;1,400;1,500;1,700&display=swap');
body{	font:16px/40px 'Noto Sans JP','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
	color:#333333;
	overflow-x:hidden;
  line-height: 1.5;　scroll-behavior: smooth;}
a:hover{ opacity: 0.7; text-decoration: none;}
p{ line-height: 1.5; margin: 0;}
h1,h2,h3,h4,h5,h6{ margin-bottom: 0;}
h1{ font-size:2rem;}
ul,ol{ list-style: none;}
main{ position: relative;}
section{position: relative;}
.bg-white{ background-color: #ffffff !important;}
.text-large{ font-size:4rem; font-weight: 700;}
.text-mlarge{ font-size:2.5rem; font-weight: 600;}
.text-xlarge{ font-size:2rem; font-weight: 500;}
.text-italic{ font-style: italic;}
section[class^="section-0"] p > strong{  background: linear-gradient(transparent 60%, #FFF100 60%);}

.section-01{ display: block; min-height:578px; background-image:url('/assets/templates/main/img/header.png') , url('/assets/templates/main/img/back-01-bg.png'); background-repeat: no-repeat,no-repeat; background-position: top center, top left; background-size: auto 100%, cover;
    z-index: 0; position: relative; }
header + .section-contact::after{ content:""; min-height: 414px; background-image: url('/assets/templates/main/img/back-01-01.png'); background-repeat: no-repeat; background-position: right 0 bottom 0; z-index: 2; display: block; width: 30%; position: absolute; bottom:0; left: 0; background-size: contain;}
.logo-img img{ max-width: 100%; object-fit: contain;}
.site-title{ line-height: .7; text-align: center;}
.shitenmei{ border:solid 1px #ffffff; font-size:1.325rem; color:#ffffff !important; padding:0.25rem 0.5rem;}
.mainsitelink{ display: block; position: absolute; top:0; right:30%; background-color: #4EBDC1; color:#FFF9B1; height: 55px; padding: 1rem; font-weight: 700; text-align: center;}
.mainsitelink:before{
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 40px 55px 0;
    border-color: transparent #4ebdc1 transparent transparent;
    position: absolute;
    top: 0;
    left: -40px;
}
.mainsitelink:after{
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 55px 40px;
    border-color: transparent #4EBDC1 transparent #4EBDC1;
    position: absolute;
    top: 0;
    right: -40px;
}
a.mainsitelink:hover{ text-decoration: none; color:#4ebdc1; background-color: #FFF9B1; opacity: 1;}
a.mainsitelink:hover::before{    
        border-color: transparent #FFF9B1 transparent transparent;
}
a.mainsitelink:hover::after{    
          border-color: transparent #FFF9B1 transparent #FFF9B1;
}
.section-02{background-image: url('/assets/templates/main/img/back-02.png'); background-position: top center; background-repeat: no-repeat; background-color: #8ce0de;}
.section-02::after{ content:""; width: 0;
height: 0;
border-style: solid;
border-width: 50px 50px 0 50px;
border-color: #8ce0de transparent transparent transparent; position: absolute; bottom:-50px; left:46%; z-index: 2;}
.section-02 > div{ position: relative;}
.section-02 > div::after{ content:""; background-image: url('/assets/templates/main/img/back-02-1.png'); background-repeat: no-repeat; background-position: right 0 bottom 0; background-size: contain;display: block; width: 50%; height: 290px; z-index: 1; position: absolute; right:0; bottom:0;}
.section-03{background-color:#CEF1E5; padding: 70px 0;}
.section-03::after{ content:""; width: 0;height: 0;border-style: solid;border-width: 50px 50px 0 50px;border-color: #cef1e5 transparent transparent transparent; position: absolute; bottom:-50px; left:46%; z-index: 2;}
.section-03 .content3-2 .list{ padding:15px 15px 0  15px; }
.section-03 .content3-2 .col{ min-width: 19%;}
.section-03 .content3-2 p{ background-color: #ffffff; text-align: center; padding: 5px; }
.section-04{  background:url('/assets/templates/main/img/back-04.png') no-repeat top center , url('/assets/templates/main/img/back-04-bg.png') repeat-x top left; padding: 3rem 0;}
.section-04 p{ font-size:2rem;}
.section-04 p > strong{ font-size:3rem;}
.section-contact-footer::after{content:""; min-height: 300px; background-image: url('/assets/templates/main/img/back-04-01.png'); background-repeat: no-repeat; background-position: right 0 bottom 0; z-index: 60; display: block; width: 24%; position: absolute; bottom:0; left: 0; background-size: contain;}

.notfront .section-contact-footer::after{min-height: 260px; }
.section-05{ background-color: #F7C7C6; background-image: url('/assets/templates/main/img/back-05.png'); background-position: top center; background-repeat: no-repeat; background-size: contain;padding: 4.5rem 0; position: relative;}
.section-05 .point p{ font-size:1.5rem; font-weight: 600;}
.section-05 p > strong{ font-size:2rem ; line-height: 1.35;}
.section-05 + .section-contact::after{content:""; min-height: 400px; background-image: url('/assets/templates/main/img/back-05-01.png'); background-repeat: no-repeat; background-position: right 0 bottom 0; z-index: 60; display: block; width: 28%; position: absolute; bottom:0; right: 5%; background-size: contain;}
.section-06{background-color:#8CE0DE; background-image: url('/assets/templates/main/img/back-first-1.png'); background-position: top center; background-repeat: no-repeat;padding: 70px 0;}
.section-06 h2{ border-top: solid 1px #ffffff; border-bottom:  solid 1px #ffffff; padding: 5px; font-size: 2rem; color:#ffffff; margin-bottom: 1rem; }
.section-07{ background-color: #ffffff; padding: 70px 0 0 0;}
.section-07 h2{ border-top: solid 1px #4C403B; border-bottom:  solid 1px #4C403B; padding: 5px; font-size: 3rem; color:#4C403B;  margin-bottom: 2rem;     font-style: italic;
    font-weight: 500;    font-family: 'Ubuntu', sans-serif;}
.section-07 h2 > small{ font-size:1.75rem; font-weight: 500;}
.section-08{ background-image: url('/assets/templates/main/img/back-08.png'); background-position: top center; padding: 80px 0;}
.section-08 .table{ background-color: #ffffff;}
.section-08 .table th{ background-color: #EEEEEE; width: 20%; }
.section-08 .table td > p{ margin-bottom: 1rem;}
.section-08 + .section-contact::after{content:""; min-height: 400px; background-image: url('/assets/templates/main/img/back-08-01.png'); background-repeat: no-repeat; background-position: left 0 bottom 0; z-index: 60; display: block; width: 28%; position: absolute; bottom:0; left: 5%; background-size: contain;}

.section-contact{z-index: 1;}
.section-contact h4{ background-color: #f6aa07; height: 55px; color:#ffffff; position: relative; padding: 1rem 0 1rem 240px; z-index: 1; line-height: 1; }
.section-contact h4 > strong{ font-size:1.85rem; font-style: italic; }
.section-contact h4::before{content: "";background-color: #f6aa07;height: 55px;position: absolute;top: 0;left: -25vw;z-index: -10;width: 100%;}
.section-contact h4::after{content:""; width: 0;height: 0;border-style: solid;border-width: 55px 0 0 40px;border-color: transparent transparent transparent #f6aa07; position: absolute; top:0; right: -40px;}
.section-contact .contact-text{ font-size: 1.15rem; color:#cf8d01; font-weight: 500; }
.section-contact .contact-subtext{ padding-left: 240px; font-size: 1.5rem; color:#4C403B; font-weight: 500; margin: 15px 0 0 0; line-height: 1; }
.section-contact .contact-subtext strong{  font-size:1.85rem; font-style: italic;       font-weight: 500;    font-family: 'Ubuntu', sans-serif;}
.border-text{ color:#4C403B; font-size:1rem;  padding:0 0.8rem; display: flex;align-items: center;}
.border-text:before,
.border-text:after {border-top: 1px solid;content: "";flex-grow: 1;}
.border-text:before {margin-right: 1rem;}
.border-text:after {margin-left: 1rem;}
.text-number{font-size:2.5rem; color:#4C403B; font-weight: 800; margin: 5px 0 0 0; line-height: 1;}
.section-contact .btn-pink{ background-color:#E292A6; color:#ffffff; text-align: center; padding: 5px 10px; width: 100%;}
.content2-text{ margin-left: 80px; }
.content2-text hr{ border:0; height: 3px; background-color: #ffffff; }
.bg-creamyellow{ background-color:#FFFCDD; }
.bg-creamgray{ background-color:#EEEEEE;}

.bg-bluegreen{ background-color: #8CE0DE;}
.metatitle{ font-size:30%; color:#cf8d01;}
.point h5{ background-color:#4C403B; color:#FFF100; font-size: 1rem; width: 80%; text-align: center; margin-top: 10px;}
.point h5::after{content:""; width: 0;height: 0;border-style: solid;border-width: 1.2rem 1.2rem 0 0;border-color: #4C403B transparent transparent transparent; position: absolute; right:0.6rem; top:10px;}
.bg-lightblue{ background-color: rgba(78,189,193,.7); padding: 2rem; color:#ffffff; border-radius: 10px;}
.bg-lightblue h3{ font-size:2rem;}
.bg-lightblue h3::before{ content:"/"; font-size: 3rem; font-weight: 900;}

.case{ margin-top: 60px; position: relative; background-color: #FFFCDD;}
.case::before{ content:"";background-image:  url('/assets/templates/main/img/back-05-02.png'); background-repeat: no-repeat;background-position: top  center; display: block; width: 100%; height: 296px; position: absolute; top:-150px; left:0; z-index: 1;}
.case .case-inner{  position: relative; z-index: 2; padding-top: 60px;}
.case .case-desc{ margin: 30px 30px 0 30px;}
.case .case-desc > h3{ margin-bottom: 2rem;}
.case .case-desc .bo-right{ border-right:solid 2px #4C403B;}
.case .case-desc img{ width: 100%; object-fit: contain;}
.case .case-desc h5 { background-color: #4C403B; color:#ffffff; padding: 5px; text-align: center; max-width: 150px;}
.case .case-desc::after{ content:""; display: block; width: 100%; height: 82px; background-image: url('/assets/templates/main/img/back-05-03.png'); background-repeat: no-repeat; background-position: top center; background-size: contain;margin: 15px 0;}
.case .case-result{ padding: 0 2rem 2rem 2rem;   column-count: 2;  column-gap: 20px;}
.bo-brown{ border:solid 1px #4C403B; float: left; margin-bottom: 20px; background-color: #ffffff;  }
.bo-brown > h3{ text-align: center;}
.case .case-result .bo-brown:last-child{ background-color: #cf8d01; color:#ffffff; }

.bo-dark{ border: solid 2px #4C403B; padding: 10px; text-align: center;}
.bo-dark p > strong{ background:none !important; }
.arrow2 { background-color:#4C403B; color: #FFF100; padding: 3px; text-align: center; position: relative;}
.arrow2::after{ content: "";width: 0;height: 0;border-style: solid;border-width: 1.8rem 0 1.8rem 1.8rem;border-color: transparent transparent transparent #4C403B;position: absolute;right: -1.7rem;top: -0.7rem;}

.salepointbox{ background-color: #ffffff; box-shadow: 8px 8px #cf8d01; padding: 15px;}
.salepointbox > img{ width: 100%; object-fit: cover;}
.salepointbox > h3{ margin: .75rem 0; font-size: 1.55rem; font-weight: 500;}
.section-05 + .section-contact h4{ padding-left:0;}
.section-05 + .section-contact .contact-subtext{ padding-left: 0;}

.faq{ margin: 1rem 0;}
.faq dt{ font-size:1.15rem; margin-left: 1.5em;text-indent: -1.8em; padding-left: 10px; margin-top: 2rem; }
.faq dt:before{ content:"Q."; background-color:#E292A6; color:#FFFFFF; padding: 3px; margin-right: 10px;  }
.faq dd{ margin-left: 1.5em;text-indent: -1.8em;margin-bottom: 20px;padding-top: 15px;padding-bottom: 30px;padding-left: 15px;border-bottom: dashed 1px #4C403B;}
.faq dd:before{ content:"A."; color:#cf8d01; margin-right: 7px;font-size: 1.35rem;}

.section-03 img{ max-width: 100%; object-fit: contain;}
.scrolltotop{  position: fixed;    bottom: 25px;    right: 25px;    display: none; width: 3em; height: 3em; z-index: 999;} 

.doctor-title { line-height:1; font-size:0.9rem; color:#e9738a; }
.doctor-name{ margin-top: 0.5rem;  margin-bottom: 0.5rem;}

.doctorslist > .col-md-6:nth-child(odd){ border-right:solid 1px #cccccc;}
.section-counseling{ background: url('/assets/images/counseling/bg.png') no-repeat center center; }
.counseling-bnr-1{ background-image: url('/assets/images/counseling/img003.jpg'); background-size: 100% auto; background-repeat: no-repeat; min-height: 380px; width: 100%; padding: 5rem;}
.counseling-bnr-1 p{ margin-top:2rem; color:#ffffff;}
.section-counseling p + p , .section-program p + p  { margin-top: 1.5rem;}

.title-b{ margin-top: 2rem; margin-bottom: 2rem; color:#ffffff; font-size: 2rem; background-image: url('/assets/images/counseling/img004.jpg'); background-size:100% auto; background-repeat: no-repeat; padding: 5rem 0; width: 100%; text-align: center; display: inline-block; vertical-align: middle;}
.title-c{     margin-top: 2rem;
    margin-bottom: 2rem;
    color: #ffffff;
    font-size: 2rem;
    background-image: url('/assets/images/program/img004.jpg');
    background-size: 100% auto;
    background-repeat: no-repeat;
    padding: 24rem 0 0 0;
    width: 100%;
    text-align: center;
    display: flex;
    min-height: 500px;
    max-height: 550px;
    background-position: center bottom;
    justify-content: center;
    align-items: end;
}
.title-d{ margin-top: 2rem; margin-bottom: 2rem; color:#ffffff; font-size: 2rem; background-image: url('/assets/images/program/img006.jpg'); background-size:100% auto; background-repeat: no-repeat; padding: 5rem 0; width: 100%; text-align: center; display: inline-block; vertical-align: middle;}
.img-row{ max-width: 70%;margin-left: auto; margin-right: auto;}
.img-row img{ width: 100%; height: auto; object-fit: contain;}
*[class^="sectioncounseling-"] p > strong, *[class^="program-"] p > strong{ color: #4EBDC1 !important; font-size:1.35rem;font-weight:bold;}
.sectioncounseling-6{ background-image: url('/assets/images/counseling/img006.jpg'); background-size: 100% auto; background-repeat: no-repeat; min-height: 380px; width: 100%; padding: 4rem 5rem; margin-top: 3rem;}
.sectioncounseling-6 p{ font-size:1.25rem; color:#ffffff;}
.sectioncounseling-6 p strong{color: #C2E2E1 !important; font-size:1.35rem;}

.program-point{ background-image: url('/assets/images/program/img003.jpg');background-size: auto 100%; background-repeat: no-repeat; min-height: 350px; width: 100%;  margin-top: 3rem; padding: 6rem 0 2rem 0;}
.program-point ul{ margin-left: 25%;   list-style-type:none;  counter-reset: item;  }
    .program-point ul li{ font-size:1.35rem; font-weight: bold; margin-bottom: 1rem;}
    .program-point ul li::before{   counter-increment:item;
        content: counter(item);  font-size:1.35rem;
        color: #ffffff;
        text-align: center;
        border: solid 1px #39B9B5;
        background: #39B9B5;
        border-radius: 50%;
        width: 2rem;
        height: 2rem;
        display: flex;
        justify-content: center;
        align-items: center; float: left;   }    

.flowbox{ position: relative;  height: 100%; background-color: #F8F4F5; border-radius: 5px; margin-left: 2rem; z-index: 0; padding: 1rem 2rem; margin-bottom: 3rem;}
.flowbox .circle {z-index: 80;
position: absolute;
top: 0;
left: -2rem;
text-align: center;
width:auto;
height: 100%;

margin: 0 auto;

}

.flowbox .circle span{
    font-size: 2rem;
    color: #ffffff;
    text-align: center;
    border: solid 1px #EF8FA1;
    background: #EF8FA1;
    border-radius: 50%;
    width: 4rem;
    height: 4rem;
    display: flex;
    margin: 0 auto;
    justify-content: center;
    align-items: center;}

.flowbox .circle::after{   content: '';  position: absolute;  top:6rem;  left: 0;  right: 0;  bottom: 0;  width: 1px;  height: 100%; min-height: 250px;  margin: auto;  border-left:dashed 2px #EF8FA1; border-right:dashed 2px #EF8FA1; z-index: -1;}
.flowbox .circle-last::after{ display: none;}
.flowbox .flowboxbody{ margin:0 1rem;}
.flowbox .flowboxbody h4{ font-size:1.35rem; color:#EF8FA1; margin-bottom:1.5rem;}
hr.border-gra{     border: none; /* デフォルトをキャンセル */    height: 2px; /* 線の高さ */    background: linear-gradient(50deg, #8CE0DE, #ffffff);}

.program-1 img{ max-height:240px; object-fit: contain; width: auto;}
.index .cp_box1 *, .cp_box1 *:before, .cp_box1 *:after,
.index .cp_box2 *, .cp_box2 *:before, .cp_box2 *:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.index .cp_box1,
.index .cp_box2
 {
	position: relative;
}
.index .cp_box1 label,
.index .cp_box2 label {
	position: absolute;
	z-index: 1;
	bottom: 0;
	width: 100%;
	height: 140px; /* グラデーションの高さ */
	cursor: pointer;
	text-align: center;
	/* 以下グラデーションは背景を自身のサイトに合わせて設定してください */
	background: linear-gradient(to bottom, rgba(250, 252, 252, 0) 0%, rgba(250, 252, 252, 0.95) 90%);
}
.index .cp_box1 input:checked + label,
.index .cp_box2 input:checked + label {
	background: inherit; /* 開いた時にグラデーションを消す */
}
.index .cp_box1 label:after,
.index .cp_box2 label:after {
	line-height: 2.5rem;
	position: absolute;
	z-index: 2;
	bottom: 20px;
	left: 50%;
	width: 16rem;
	font-family: FontAwesome;
	content: '\f13a'' 続きをよむ';
	transform: translate(-50%, 0);
	letter-spacing: 0.05em;
	color: #ffffff;
	border-radius: 20px;
	background-color: rgba(27, 37, 56, 1);
}
.index .cp_box1 input,
.index .cp_box2 input {
	display: none;
}
.index .cp_box1 .cp_container,
.index .cp_box2 .cp_container {
	overflow: hidden;
	height: 500px; /* 開く前に見えている部分の高さ */
	transition: all 0.5s;
}
.index .cp_box1 input:checked + label,
.index .cp_box2 input:checked + label  {
	/* display: none ; 閉じるボタンを消す場合解放 */
}
.index .cp_box1 input:checked + label:after,
.index .cp_box2 input:checked + label:after {
	font-family: FontAwesome;
	content: '\f139'' 閉じる';
}
.index .cp_box1 input:checked ~ .cp_container,
.index .cp_box2 input:checked ~ .cp_container {
	height: auto;
	padding-bottom: 80px; /* 閉じるボタンのbottomからの位置 */
	transition: all 0.5s;
}
#reserve-log thead th{ text-align: center;  font-weight: normal; background-color:rgba(232, 107, 131, 0.8); color:#ffffff;}

label[for="wlpeUserRegisterUserName"]{ display: none;}
.wlpeMessage{ background-color: #FFE9EF;    color: #ee003b;    width: 100%;    padding: 1rem;    border: solid 1px #ee003b; border-radius: 5px; text-align: center; margin-bottom: 1rem; }
#cp01, #cp02{ display: none;}
#cp01 + label, #cp02 + label { display: none;}
.index .more-link{ display: block; 	width: 100%;
	height: 550px; /* グラデーションの高さ */
	cursor: pointer;
	text-align: center;
    position: absolute;
	/* 以下グラデーションは背景を自身のサイトに合わせて設定してください */
	background: linear-gradient(to bottom, rgba(250, 252, 252, 0) 0%, rgba(250, 252, 252, 0.95) 90%); z-index: 90; }
.index .more-link a{margin: 0 auto;	line-height: 2.5rem;
        position: absolute;
        z-index: 2;
        bottom: 20px;
        left: 50%;
        transform: translate(-50%, 0);
        letter-spacing: 0.05em;
        color: #ffffff;
        border-radius: 20px;
        background-color: rgba(27, 37, 56, 1); width: 16rem;}

#program #cp01, #counseling #cp02{ display: none;}
#program #cp01 + label ,
#counseling #cp02 + label { display: none;}
#program .more-link{ display: none !important;}
#counseling .more-link{ display: none !important;}

.btn-asd{ position: relative; margin-bottom: 1rem; padding: 0.5rem 1rem;}
.btn-asd:after{ content:"\f054"; font-family: FontAwesome; position: absolute; right: 1rem;}



#top .maintop { position:relative; z-index: 0 !important;}
.maintop .h-area{height: 600px; overflow: hidden; margin-top: 0 !important; min-height:600px; background-size:auto,25%;}
.maintop .h-area + div{ margin-top:-25px;}
.step1 input[type="radio"]{ display: none;}
.step1 .form-check{ border:none !important;}

.checkbox-wrapper .form-check label{ display: flex;
    align-items: center;
    justify-content: center;}

.shop-1 .bg-color,
.shop-2 .bg-color{ 
    position:relative; 
    display:flex; 
    flex-wrap: wrap;
    width:100%; 
    height:300px; 
    color:#ffffff; 
    z-index: 0;
    align-items:center; 
    justify-content:center; 
}

.shop-1 > img, .shop-2 > img{ position:absolute; top:0; left:0; z-index:-1; width:100%; height:100%; object-fit:cover; display:block;}
.shop-inner-text{ text-align: center;}


.shop-1{ background:url('/assets/images/bnr_umeda.jpg'); background-size: cover;}
.shop-1 > .bg-color{background-color:rgba(232, 107, 131, 0.7);}
.shop-2{ background:url('/assets/images/bnr_higashi.jpg'); background-size: cover;}
.shop-2 > .bg-color{background-color:rgba(43, 145, 142, 0.8);}
.shop-1 .shop-inner-text h3,
.shop-2 .shop-inner-text h3{ font-size:2rem; font-family: 'Raleway', sans-serif; font-weight: 700; }
.shop-1 .shop-inner-text h3 + p{ background-color: rgba(53, 201, 197, 0.9);margin-top: 1rem; padding: 0.1rem 0.5rem; font-family: 'M PLUS 1p', sans-serif;}
.shop-2 .shop-inner-text h3 + p{ background-color: rgba(232, 107, 131, 0.9);margin-top: 1rem; padding: 0.1rem 0.5rem; font-family: 'M PLUS 1p', sans-serif;}
.btn-white{ border-radius: 3rem; background: #ffffff; margin: 1rem auto 0 auto; }
.btn-white > a{ 
    display: block; 
    width: 100%; 
    height: 100%; 
    color:#4C403B !important; 
    padding: 0.35rem 1rem; 
    text-align: center; 
    line-height: 1; 
    z-index: 99; 
    position: relative;
    cursor: pointer;}
.shop-1:hover .btn-white a:hover, 
.shop-1:hover .btn-white a:active,
.shop-2:hover .btn-white a:hover, 
.shop-2:hover .btn-white a:active{
    border-radius: 3rem; 
    background-color:rgba(0,0,0,0.8) ;
    color:#ffffff !important;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    opacity: 1;
}

p.telnumber{ text-align: center; font-size:2rem;font-family:Georgia, 'Times New Roman', Times, serif; font-weight: 500; font-style: italic; margin-top: 1rem;}
@media (min-width:1630px) {
    .mainsitelink{ right: 50%;}  
}
@media (min-width:1401px) {
 .section-01::after{ right:5%;}   
.mainsitelink{ right: 40%;}  
      
}
@media screen and (max-width: 1024px) {
    h3,.h3{ font-size: 1.5rem;}
    .container {    max-width: 100vw;}
   .section-01{ min-height: 488px; background: url('/assets/templates/main/img/header.png') no-repeat top 60px center , url('/assets/templates/main/img/back-01-bg.png') repeat-x top 60px left; background-size: contain; } 
    #headernav{ margin-top: 0; background: #ffffff; max-height: 60px;}
    #headernav > .col-md-6{ margin: 0 auto; text-align: center;}
    h1.site-title{ font-size: 1rem; line-height: 0.7rem;}
    .metatitle {    font-size: 70%; padding-top: 10px;}
    .logo-img img{ max-height: 40px;}
    header + .section-contact::after, .section-04 + .section-contact::after {       min-height: 300px;    width: 25%;}
     .section-08 + .section-contact::after  {       min-height: 200px;    width: 25%;}
    .section-contact h4 {    font-size: 1rem;}
    .section-contact h4::after {    border-width: 55px 0 0 30px;    right: -30px;    z-index: 0;}
    .section-contact .text-number {    font-size: 1.85rem;}
    .section-contact .text-number + a{ font-size: 0.9rem;}
    .section-contact .contact-subtext{ font-size: 1rem; }
    .section-contact img{ max-height: 90px;}
    .content2-text {    margin-left: 0;}
    .section-02 {    background-position: top left -30px;}
    .section-02 > div::after { height: 230px;}
    .section-04 p, .section-05 p  { font-size: 1rem;}
    .section-04 p > strong{ font-size: 2.3rem;}
    .section-contact .contact-text {    font-size: 1rem;  padding-left: 155px;  }
    .section-05 {    background-position: top left -60px;}
    .text-large{ font-size:2.5rem;}
    .section-05 p > strong {    font-size: 1.5rem;}
    .section-05 .point p{ font-size:1.2rem; line-height: 1;}
    .case::before {    background-position: top left -40px;}
    .section-05 .text-xlarge{ padding-left: 1em;}
    .section-05 + .section-contact::after {    min-height: 300px;    width: 25%;    right: -5%;}
    .section-06 h2{ font-size: 1.5rem;}
    
}
@media screen and (max-width: 896px) {

        *[class^="col-"] img{ max-width: 100%; object-fit: contain;}
        h3,.h3{ font-size: 1.45rem;}
       .section-01{ min-height: 408px; background: url('/assets/templates/main/img/header.png') no-repeat top 60px center , url('/assets/templates/main/img/back-01-bg.png') repeat-x top 60px left; background-size: contain; } 
        .section-contact h4 {    padding: 1rem 0 1rem 180px;    font-size: 1rem; text-align: right;}
        .section-contact h4::after {    border-width: 55px 0 0 30px;    right: -30px;    z-index: 0;}
        .section-contact .text-number {    font-size: 1.4rem;}
        .section-contact .text-number + a{ font-size: 0.9rem;}
        .section-contact .contact-subtext{ font-size: 1rem; padding-left: 180px; text-align: center;}
        .pl-md-5{ padding-left: 0 !important;}
        
    
}
@media (max-width: 768px) {
        .section-contact .text-number {    font-size: 1.3rem; text-align: center;}
    .section-contact .text-number + a {    font-size: 0.85rem;}
    .section-contact h4 {    padding: 1rem 0 1rem 150px;}
  .doctorslist > .col-md-6:nth-child(odd){ border-right:none;}
  .doctorslist > .col-md-6{ border-bottom:  solid 1px #cccccc;}
  .doctorslist p:not(.doctor-title){ font-size:0.8rem;}

}
@media (max-width: 767px) {
    
    h1.site-title{ font-size: 1rem; line-height: 1; text-align: center; margin: 0; }
    h2{ font-size: 2rem;}
    h3{font-size: 1.325rem;}
    h3 > br{ display: none;}
    .text-large {    font-size: 2rem; }
    .text-xlarge {    font-size: 1.5rem; }
    .metatitle{ font-size: 0.6rem;}
    .logo-img img, footer img{ max-height: 30px; object-fit: contain; margin: 0 auto;}
    .section-01{ min-height: 1px; height: 300px; background: url('/assets/templates/main/img/header-mobile.png') no-repeat bottom center , #f4d2d2;   background-size: cover;}   
    .section-contact h4{ height: 3rem; padding: 0.5rem ; font-size: 1rem; margin-left: -15px; margin-right: -15px; text-align: center !important;}
    .section-contact h4::before{display: none; }
    .section-contact h4::after{display: none;}
    .section-contact .contact-subtext {    padding-left: 0;    font-size: 1rem; margin: 5px auto;    text-align: center;}
    .section-contact .text-number {    font-size: 1.8rem; text-align: center;}
    header + .section-contact::after {   bottom: 203px; min-height: 200px;      width: 28%;}
    .section-02{ background-size: contain; padding-top: 2em; padding-bottom: 1em;}
    .section-02::after, .section-03::after {      border-width: 30px 30px 0 30px;    bottom: -30px;    left: 43%;  }
    .section-02 > div::after { width: 20%}
    .content2-text{ margin-left: 0; z-index: 10;}
    .section-03 { padding-bottom: 30px;}
    .section-03 .content3-2 .col{ min-width: 32%;}
    .section-03 .bg-bluegreen{ padding-top: 1rem;}
    .section-03 .list p{ font-size: 0.8rem;}
    .section-04{ background-size: auto 100%; }
    .section-04 p{ font-size: 1rem; padding-left: 45px;}
    .section-04 p > strong { font-size: 1.5rem;	}
    .section-04 + .section-contact{ margin-top: -2rem;}
    .section-04 + .section-contact::after {    min-height: 200px;    width: 20%;    bottom: 280px;   }
    .section-05 {background-position: top left -30px;}
    .section-05 .point p {font-size: 1rem; white-space: pre-line;}
    .section-05 p > strong{font-size: 1.5rem;}
    .case::before { top:0; background-size: contain; background-position: top left 0px;}
    .bo-right{ border-right: 0;}
    .case .case-result {    padding: 0 1rem 1rem 1rem;    column-count: 1;    column-gap:10px;}
    .arrow2{ width: 90%;}
    .section-contact .contact-text {   padding-left: 0px;}
    .section-05 + .section-contact::after {    min-height: 200px;    width: 28%;    bottom: 250px;  right: 0;  z-index: 1;}
    .section-05 .text-xlarge p{ max-width: 80%;}
    .section-contact .contact-text{ font-size: 1rem;}
    .section-06 h2{ font-size: 1.5rem;}
    .table th, .table td{ display: block; width: 100% !important; }
    .section-08 + .section-contact::after {display: none;}
    footer p{ text-align: center !important; font-size: 0.8rem;}

    #mainlink{ position: relative;}
    .scrolltotop{  bottom: 30px;    right: 20px;    display: none; width: 2em; height: 2em; z-index: 999;} 
    .mainsitelinks{ display: block; position: fixed; bottom:0; right:0; background-color: rgba(95, 191, 176, 0.9); color:#FFF9B1; width:100%; padding:1rem 0.5rem; text-align: center; border-radius: 5px; z-index: 80;}
    .mainsitelinks:hover{ text-decoration: none; background-color: hsla(55, 100%, 85%, 0.9); color:#4EBDC1;}
    .scrolltotop{ bottom: 70px;}
    .scrolltotop a{ background-color:hsla(210, 16%, 98%, 0.62);}
    #reserve-log thead{ display: none;}
    #reserve-log tbody > tr td:nth-child(1){ background-color: rgba(232, 107, 131, 0.8); color:#ffffff;}
    #reserve-log tbody > tr td:nth-child(2):before{ content:"予約日"; width: 100px; display: inline-block; border-right: solid 2px #333333; margin-right: 0.5rem; color:#4EBDC1;}
    #reserve-log tbody > tr td:nth-child(3):before{ content:"予約時間";width: 100px; display: inline-block;border-right: solid 2px #333333;margin-right: 0.5rem;color:#4EBDC1;} 
    #reserve-log tbody > tr td:nth-child(4):before{ content:"医院";width: 100px; display: inline-block;border-right: solid 2px #333333;margin-right: 0.5rem;color:#4EBDC1;}
    #reserve-log tbody > tr td:nth-child(5):before{ content:"タイプ";width: 100px; display: inline-block;border-right: solid 2px #333333;margin-right: 0.5rem;color:#4EBDC1;}
    #reserve-log tbody > tr td:last-child{ text-align: center;}
    #reserve-log tbody > tr{ border-bottom:  solid 2px #666666;}
#reservecalendar{ overflow: scroll;}
#reservecalendar ul.theader{ position: absolute; width: 20%; }
#reservecalendar ul:nth-child(2){ margin-left: 20%;}
    .index #cp01 + label,
    .index #cp02 + label { display: block;}
    .index .more-link{ display: none;}

    .title-b{ background-image: url('/assets/images/counseling/sp-img004.png'); }
.title-c{  
    background-image: url('/assets/images/program/sp-img004.png'); font-size:1.5rem; padding:9rem 0 0 0; min-height: 250px; margin-top: 0;}
.title-d{ background-image: url('/assets/images/program/sp-img006.png'); padding: 3rem 0; }
.counseling-bnr-1 { background-image: url('/assets/images/counseling/sp-img003.png'); padding: 1rem; min-height: 630px;}
.sectioncounseling-6{ background-image: url('/assets/images/counseling/sp-img006.png'); padding: 4rem 0; min-height: 700px;}
.sectioncounseling-6 p{ font-size: 1rem;}
.program-point{ background-image: url('/assets/images/program/sp-img003.png'); background-size: 100% auto; min-height: 450px; padding: 2rem;}
.program-point ul{ margin-left: 0;  }
.program-point ul li{ font-size:1rem !important;}
.fs-title{ margin-bottom: 0;}
.confirm .table{ text-align: left;}
.confirm .table th{ background-color: #dedede;}

.shop-1 .shop-inner-text h3,
.shop-2 .shop-inner-text h3{ font-size:1.35rem; }
.shop-1 .shop-inner-text h3 + p{ margin-top: 0.5rem; }
.shop-2 .shop-inner-text h3 + p{margin-top: 0.5rem; }


p.telnumber a{ font-size:1.35rem; margin-top: 0.5rem; color:#ffffff !important; text-decoration:none;}
.btn-white{ margin: 0 ;}
.shop-1 .bg-color, .shop-2 .bg-color{height: 230px;}
p.telnumber{ margin-top: 0 !important;}
}
@media (max-width: 360px) {
    .section-contact h4{ text-align: left; font-size: 0.9rem;}
    .section-contact .text-number {    font-size: 1.5rem; text-align: center;}
}