@charset "UTF-8";
img{width: 100%; height: auto;}
html{scroll-behavior: smooth;}

.btn img {
  animation: anime1 0.5s ease 0s infinite alternate;
  transform-origin:center;
}
@keyframes anime1 {
  from {
    transform: scale(0.9,0.9);
  }
  to {
    transform: scale(1,1);
  }
}
.btn:hover{opacity: 0.8;}

body{background: #fff; max-width: 800px; margin: 0 auto; font-family: 'Noto Serif JP', serif;}
/*header .fixedbox{position: fixed; top: 0; left: 0; width: 100%; background: #fff; z-index: 10000; height: 75px; max-width: 800px; left: 50%;
transform: translate(-50%, 0);}*/

header{position: relative; text-align: center; margin: 0 auto; max-width: 900px; padding: 4px 0 7px 5px; line-height: 1.5;}
header #logo img{width: 130px; height: auto; padding-top: 3px;}
header a{text-decoration: none; color: #666; font-family: 'Noto Sans JP', sans-serif; font-weight: 700;}
header ul{display: flex; position: absolute; right: 0; top: 7px;}
header ul li{width: 75px;  text-align: center; border-left: 1px solid #808080;}
header ul li img{width: 65px; margin: 0 auto; text-align: center;}
header ul li.telephone{position: relative; padding:0 5px;}
header ul li.webreserve{position: relative; padding:0 5px;}
header .tel{position: absolute; bottom: 3.3px; font-size: 10px; letter-spacing: 0; left: 0; right: 0; margin: auto;}
header .web{position: absolute; bottom: 3px; font-size: 10px; letter-spacing: 0; left: 0; right: 0; margin: auto;}
.hh_free01{width: 100%; margin: 0 auto 5% auto;}
.hh_free02{width: 100%; margin: 0 auto 5% auto;}

@media only screen and (min-width:380px) {
header{ padding: 5px 0 8px 5px; line-height: 1.5;}
header #logo img{width: 150px; height: auto; padding-top: 3px;}
header ul{display: flex; position: absolute; right: 0px; top: 7px;}
header ul li{width: 85px;  text-align: center;}
header ul li img{width: 70px; margin: 0 auto; text-align: center;}
header ul li.telephone{padding:0 5px;}
header .tel{font-size: 11px; bottom: 4.5px;}
header ul li.webreserve{padding:0 5px;}
header .web{font-size: 11px; bottom: 4.5px;}
}

@media only screen and (min-width:500px) {
header{ padding: 10px 0 8px 5px; line-height: 1.5;}
header #logo img{width: 160px; height: auto; padding-top: 0;}
header ul{display: flex; position: absolute; right: 0px; top: 7px;}
header ul li{width: 98px;  text-align: center;}
header ul li img{width: 75px; margin: 0 auto; text-align: center;}
header ul li.telephone{padding:0 5px;}
header ul li.webreserve{padding:0 5px;}
header .tel{font-size: 12px; bottom: 4px; }
header .web{font-size: 12px; bottom: 4px;}
}

@media only screen and (min-width:650px) {
header{ padding: 4px 0 12px 5px; line-height: 1.5;}
header #logo img{width: 170px; height: auto; padding-top: 5px;}
header ul{display: flex; position: absolute; right: 0px; top: 10px;}
header ul li{width: 105px;  text-align: center;}
header ul li img{width: 83px; margin: 0 auto; text-align: center;}
header ul li.telephone{position: relative; padding:0 5px;}
header .tel{bottom: 5.5px; font-size: 13px;}
header .web{bottom: 5.5px; font-size: 13px;}
}

@media only screen and (min-width:800px) {
header{ padding: 10px 0 7px 5px; line-height: 1.5;}
header #logo img{width: 190px; height: auto; padding-top: 1px;}
header ul{display: flex; position: absolute; right: 0px; top: 7px;}
header ul li{width: 110px;  text-align: center;}
header ul li img{width: 92px; margin: 0 auto; text-align: center;}
header ul li.telephone{position: relative; padding:0 5px;}
header .tel{position: absolute; bottom: 6px; font-size: 14px;}
header .web{position: absolute; bottom: 6px; font-size: 14px;}
}



section, .counceling, .order{max-width: 900px; margin: 0 auto;}
.m20{margin-bottom: 20px;}
.m30{margin-bottom: 30px;}

.counceling{ padding: 15px;}

.order{padding: 40px 0 30px 0;}
.order ul{margin: 0 auto; width: 90%; left: 5%;}
.order ul li{margin-bottom: 10px;}
.order ul li img{width: 100%;}

#sec01 h3{background: #e65078; padding: 15px 10px 0 10px;}
#sec01{background: url("../lib/sec01_bg02.jpg"); background-size: 100%;}
#sec01 .box{padding: 3%;}


#sec02{background: url("../lib/sky02.jpg"); background-size: contain;}
#sec02 .zikkan{padding: 0 5%; margin-top: -22vw;}
#sec02 h4{padding: 20px 5%;}
@media only screen and (min-width:800px) {
#sec02 .zikkan{padding: 0 5%; margin-top: -150px;}
}

#sec03{background: url("../lib/sky03.jpg"); background-size: cover;}
#sec03 .txt{padding: 7% 15% 0 15%;}
#sec03 .img001{padding: 7% 5% 7% 5%;}

#sec04 h3{background: url("../lib/sec15_bg.jpg"); background-size: contain; padding: 4% 0;}
#sec04 h4{background: url("../lib/sec15_bg.jpg"); background-size: contain; padding: 6% 0;}

#sec05{background: url("../lib/sec05_bg.jpg"); background-size: 2.5%; padding:10% 0 5% 0; }
#sec05 h3{margin: 0 auto 40px auto; width: 80%; max-width: 500px;}

#sec05 .slide-items {border: 1px solid #333;
  width: 87%;
  margin: auto;
}
#sec05 .slide-items img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#sec05 .slick-prev:before,
#sec05 .slick-next:before {
  color: black;
}
#sec05 .slick-dots li button:before {
  font-size: 18px;
  top: 6px;
}
#sec05 .txt{margin-top: 60px; color: #666666;}
#sec05 p{margin-top: 20px; padding: 0 5%; font-size: clamp(0.813rem, 0.688rem + 0.63vw, 1rem); line-height: 1.7;}
#sec05 ul.attention{font-size: clamp(0.688rem, 0.563rem + 0.63vw, 0.875rem); padding: 5%; margin-left: 20px; line-height: 1.7;}
#sec05 ul.attention li:before {
	content: '※';  margin-left:-20px;}

#sec06 h3{background: url("../lib/sec15_bg.jpg"); background-size: contain; padding: 4% 0;}
#sec06{background: url("../lib/sec06_bg.jpg"); background-size: 100%;}

#sec07{background: url("../lib/sec07_bg.jpg"); background-size: cover; padding: 5% 0;}
#sec07 h3{padding: 5% 0;}
#sec07 .txt{padding: 2.5% 0 ;}
#sec07 p.attention{font-size: clamp(0.688rem, 0.563rem + 0.63vw, 0.875rem);  color: #666; margin-top: 5px; margin-left: 5%; line-height: 1.7;}

#sec08{background: url("../lib/sky03.jpg"); background-size: cover; padding-bottom: 5%;}
#sec08 .txt{padding: 8% 0 0 0;}
#sec08 p.attention{font-size: clamp(0.688rem, 0.563rem + 0.63vw, 0.875rem);  color: #666; margin-top: 5px; margin-left: 5%; line-height: 1.7;}

#sec09{background: url("../lib/sec15_bg.jpg"); background-size: contain; padding: 5%;}
#sec09 h3{margin-bottom: 30px;}
#sec09 p.attention{font-size: clamp(0.688rem, 0.563rem + 0.63vw, 0.875rem);  color: #fff; margin-top: 15px; line-height: 1.7;}

#sec10{background: url("../lib/sec07_bg.jpg"); background-size: cover; padding: 8% 5%;}
.youtube{margin-top: 30px;
    padding-top: 56.25%;
    width: 100%;
    position: relative;
}
 
.youtube iframe{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
}
#sec11{background: url("../lib/sky02.jpg"); background-size: contain; padding-bottom: 5%;}
#sec11 .image02{width: 96%;  margin: 20px auto 0 auto;}
#sec11 h3{margin: 3% 0 7% 0;}
#sec11 h4{width: 25%; margin: 0 auto;}
#sec11 h5{width: 85%; margin: 0 auto; margin-top: 3%;}
#sec11 ul li{border: 1px solid #ef868d; background: #fff; margin: 2.5% 5%; padding-bottom: 5%;}
#sec11 ul li .image{margin-top: 3%;}
#sec11 ul li p{color: #5a5a5a; padding: 15px 4% 0 4%; line-height: 1.8; font-size: 14px;}
#sec11 ul li p.attention{padding: 10px 4% 0 4%; font-size: 12px;}

#sec11 ul.pointlist{display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: 30px auto 0 auto;}
#sec11 ul.pointlist li{background: #ef868d; color: #fff; text-align: center; border-radius: 5px; width: 40%;  padding: 2px; margin: 0; font-size: clamp(0.75rem, 0.474rem + 1.38vw, 1.25rem);}

@media only screen and (min-width:450px) {
#sec11 ul li p{font-size: 16px;}
#sec11 ul li p.attention{font-size: 14px;}
}
@media only screen and (min-width:550px) {
#sec11 ul li p{font-size: 18px;}
#sec11 ul li p.attention{font-size: 14px;}
}

@media only screen and (min-width:650px) {
#sec11 ul li p{font-size: 20px;}
#sec11 ul li p.attention{font-size: 14px;}
}

@media only screen and (min-width:700px) {
#sec11 ul li p{font-size: 22px;}
#sec11 ul li p.attention{font-size: 14px;}
}



#sec13{background: url("../lib/sec13_bg.jpg"); background-size: contain; padding: 8% 5% 5% 5%;}
#sec13 h3{width: 65%; margin: 0 auto; margin-bottom: 7%;}
#sec13 .youtube{margin-bottom: 10%;}
#sec13 .yazirushi{width: 5%; margin: 0 auto; margin-bottom: 5%;}
#sec13 .m30{margin-top: 10%;}

#faq{background: url("../lib/sky02.jpg"); background-size: contain; padding: 10% 6%; font-family: 'Noto Sans JP', sans-serif;}
#faq h3{width: 70%; max-width: 300px; margin: 0 auto;}
#faq{color: #666666; font-family: 'Noto Serif JP', serif;}
#faq ul li.question{font-size: 16px; background: #dad9d4; padding: 15px 5px 15px 60px; position: relative; line-height: 1.5;}
#faq ul li.question::before{content: ""; display: block; background: url("../lib/question.png") no-repeat; background-size: contain; width: 50px; height: 30px; position: absolute; left: 15px; top: 0; bottom: 0; margin: auto;}
#faq ul li.answer{font-size: 14px; padding: 20px 5px 20px 60px; position: relative; line-height: 1.8;}
#faq ul li.answer::before{content: ""; display: block; background: url("../lib/answer.png") no-repeat; background-size: contain; width: 50px; height: 30px; position: absolute; left: 15px;}
.adobepdf{margin: 20px 0; font-size: 12px;}
.adobepdf img{width: 200px;}
@media only screen and (min-width:450px) {

#faq ul li.question{font-size: 20px; padding: 15px 5px 15px 60px;}
#faq ul li.question::before{width: 50px; height: 30px; position: absolute; left: 15px; top: 0; bottom: 0; margin: auto;}
#faq ul li.answer{font-size: 16px; padding: 20px 5px 20px 60px; position: relative;}
#faq ul li.answer::before{width: 50px; height: 30px; position: absolute; left: 15px;}
.adobepdf{font-size: 14px;}
}

@media only screen and (min-width:550px) {

#faq ul li.question{font-size: 22px; padding: 20px 5px 20px 75px;}
#faq ul li.question::before{width: 70px; height: 40px; position: absolute; left: 15px; top: 0; bottom: 0; margin: auto;}
#faq ul li.answer{font-size: 17px; padding: 25px 5px 25px 75px; position: relative;}
#faq ul li.answer::before{width: 70px; height: 40px; position: absolute; left: 15px;}
}

@media only screen and (min-width:740px) {

#faq ul li.question{font-size: 26px; padding: 20px 5px 20px 95px;}
#faq ul li.question::before{width: 80px; height: 50px; position: absolute; left: 15px; top: 0; bottom: 0; margin: auto;}
#faq ul li.answer{font-size: 20px; padding: 25px 5px 25px 95px; position: relative;}
#faq ul li.answer::before{width: 80px; height: 50px; position: absolute; left: 15px;}
}


.tab_container {
  margin: 0 auto; margin-top: 20px;}
.tab_item {
  width: calc(86%/2);
  padding:5px 0; 
  border: 2px solid #ef868d;
  background-color: #fff;
  text-align: center;
  color: #ef868d ;
  display: block;
  float: left; 
  text-align: center;
  transition: all 0.2s ease;
}
.tableft{margin-left: 7%;}

input[name="tab_item"] {
  display: none;
}
.tab_content {
  display: none;
  padding: 1em 0 0 0;
  clear: both;
  overflow: hidden;
}
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content{
  display: block;
}
.tab_container input:checked + .tab_item {
  background-color: #ef868d ;
  color: #fff;
}

@media only screen and (min-width:700px) {
.tab_item {font-size: 14px; font-size: 1.4rem;}
}

.accordion {width: 100%;}
.attention{font-size: 12px; line-height: 1em;}
.accordion-box{color: #000;}

a{color: #000;}
a:visited{color: #000;}
.whitebox label{color: #3282dc;}
.acrobat{max-width: 200px; margin: 0 5%;}
.privacybox label{color: #fff; font-size: 20px; text-align: center; }
/* inputのチェックボックスを非表示 */
.accordion-hidden {
  display: none;
}
.accordion-hidden001 {
  display: none;
}

/* 見出しボタン部分 */
.accordion-open {
  display: block; 
  padding: 10px 80px 10px 10px;
  cursor: pointer;
  margin: 5px 0 0 0;
  position: relative;
  border-bottom: 1.5px solid #ef868d;
}
.accordion-open001 {
  display: block; 
  padding: 10px 80px 10px 10px;
  cursor: pointer;
  margin: 5px 0 0 0;
  position: relative;
  border-bottom: 1.5px solid #ef868d;
}

#clinic .accordion-open {
  display: block; 
  padding: 40px 30px 40px 30px;
  cursor: pointer;
  margin: 5px 0;
  position: relative;
  border-bottom: none;
}


/* ＋アイコン */
.accordion-open001::after{
  content: '';
background:url("../lib/qaplus.png") no-repeat;
height: 50px; width: 50px;
 position: absolute; background-size: 30px;
vertical-align: middle; right: 0px; top: 35%;
}

.accordion-hidden001:checked+.accordion-open001:after {
background:url("../lib/qaminus.png") no-repeat;
height: 50px; width: 50px;
 position: absolute; background-size: 30px;
vertical-align: middle; right: 0px; top: 35%;
}



.accordion-open::before,
.accordion-open::after {
  content: '';
  width: 20px;
  height: 1.5px;
  background: #ef868d;
  position: absolute;
  top: 50%;
  right: 5%;
  transform: translateY(-50%);
}



.accordion-open::after {
  transform: translateY(-50%) rotate(90deg);
  transition: .5s;
}

/* アコーディオンが開いたらーに */
.accordion-hidden:checked+.accordion-open:after {
  transform: translateY(-50%) rotate(0);
}



/* アコーディオン中身部分 */
.accordion-inner {
  display: block;
  height: 0;
  overflow: hidden;
  padding: 0;
  opacity: 0;
  transition: 0.5s;
  /* 表示速度の設定 */
  cursor: pointer;
}

/* チェックボックスにチェックが入ったら中身部分を表示する */
.accordion-hidden:checked+.accordion-open+.accordion-inner {
  height: auto;
  opacity: 1;
  padding: 10px;
}


/* ↑ここまで共通 */
/* 中にいろいろ入れたいとき */
.accordion-box {background: #fff;
  display: block;
  height: 0;
  overflow: hidden;
  padding: 0;
  opacity: 0;
  transition: 1s;
}
#faq .accordion-box p{padding: 2% 5% 2% 5%;}
#faq .accordion-box p.attext{line-height: 1.4; font-size: 12px; padding-bottom: 5%;}
#clinic .accordion-box{padding:0 2%;}
#clinic .accordion-box p{margin-bottom: 5px;}
.accordion02 .accordion-box {
  display: block; padding: 0 20%;
  height: 0;
  overflow: hidden;
  padding: 0;
  opacity: 0;
  transition: 1s;
}

.privacybox .accordion-box {
  display: block; padding: 0 20%;
  height: 0;
  overflow: hidden;
  padding: 0;
  opacity: 0;
  transition: 1s;
}

.whitebox{background: #fff; border-radius: 20px; padding-left: 25px;}
.privacybox{background: #ef868d; border-radius: 20px; text-align: center; margin: 0 auto; margin-top: 30px; }

.accordion-hidden:checked+.accordion-open+.accordion-box {
  height: auto;
  opacity: 1;
}
.accordion-hidden001:checked+.accordion-open001+.accordion-box {
  height: auto;
  opacity: 1;
}

#faq h3{margin-bottom: 30px;}
#faq label{color: #ef868d; font-weight: 600; background: #fff; padding: 7% 5%; border-radius: 20px; font-size: 16px;}
#faq label .circle2{vertical-align: middle; display: inline-block; margin-right: 4%; width: 40px; text-align: center; margin-bottom: 1%;}
#faq label .text{display: inline-block; width: calc(88% - 50px); vertical-align: middle;}
#faq label.one, #faq label.one02, #faq label.one03, #faq label.one04, #faq label.one05, #faq label.one06, #faq label.one07{border-radius: 20px 20px 0 0;}
#faq label.two{border-radius: 20px;}
#faq .yazirushi{width: 50px; margin: 0 auto; margin-top: 20px;}
/* 見出しボタン部分 */


@media only screen and (min-width:600px) {
#faq label{font-size: 18px;}
}


.pagetop {
    height: 40px;
    width: 40px;
    position: fixed;
    right: 10px;
    bottom: 30%;
    background: #ef868d;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
}

.pagetop__arrow {
    height: 10px;
    width: 10px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: translateY(20%) rotate(-45deg);
}



/*footernav*/
#footernv {width: 96%; max-width: 800px; 
    position: fixed;
    bottom: 1%;
	left: 50%;
	transform: translateX(-50%) translateY(0);    overflow: hidden;
    width: 100%;
    z-index: 2;
}
#footernv ul{display: flex; gap: 1%; margin: 0 2% 1% 2%;}
#footernv ul li{width: 33.3%;}

/*footer*/

footer{padding:2% 2% 32% 2%; margin: 0 auto; max-width: 900px; text-align: center ; font-family: 'Noto Sans JP', sans-serif;}
footer .copyright{font-size: 10px; margin-top: 10px; }
@media only screen and (min-width:900px) {
footer .copyright{font-size: 14px;}
}

.u-txt-pink{color: #ef868d; font-size: 14px;}
.p-bg-pink-area p, .p-bg-pink-area ul{margin-bottom: 10px;}
dt.p-price__ttl{ font-weight: 600; margin-bottom: 10px;}
.p-bg-pink-area h5{border: 1px solid #3282dc; color: #3282dc; text-align: center; width: 300px; margin:  0 auto; padding: 2px;}
/*--------------------------------------------------------------
clinics_list
--------------------------------------------------------------*/
#clinic{background: url("../lib/sec15_bg.jpg"); background-size: contain; padding:10% 7% 7% 7%; font-family: 'Noto serif JP', sans-serif;}
#clinic h3{width: 70%; margin: 0 auto; margin-top: 30px; margin-bottom: 50px;}

#clinic label{color: #ef868d; font-weight: 600; font-size: 18px; text-align: center; letter-spacing:0.5em; background: #fff;
}
@media only screen and (min-width:600px) {
#clinic label{font-size: 22px;}
}

@media only screen and (min-width:800px) {
#clinic label{font-size: 24px;} 
#clinic .accordion-open {
display: block;
padding: 80px 30px 80px 30px;
cursor: pointer;
margin: 5px 0;
position: relative;
border-bottom: none;
}}


.clinics_list {
    width: 100%;
    max-width: 990px;
    margin: 0 auto 10px;
}

.clinics_list_area{
    text-align: center;
    margin-bottom: 3rem;
}

.clinics_list_area_title{
    margin: 100px auto 50px;
    color: #3282dc;
}

.clinics_list .clinics_list_title{
    display: table;
    background: url(../lib/clinics_list_bg.jpg) no-repeat;
    width: 100%;
    max-width: 930px;
    height: 60px;
    margin: 0 auto;
    position:relative;
    line-height: 40px;
    cursor: pointer;
    padding: 0;
    color: #333;
    font-size: 26px;
    text-align: center;
    box-sizing: border-box;
}

.clinics_list .clinics_list_title h3{
    color: #fff;
    display: table-cell;
    vertical-align: middle;
}

.clinics_list .clinics_list_title::after{
    content:"";
    font-family:fontawesome;
    position:absolute;
    right: 20px;
    top: 20px;
    width: 20px;
    height: 20px;
    background: url(../images/icon_open_white.png) no-repeat 50% 50%;
}

.clinics_list .clinics_list_title.is-active::after{
    content:"";
    font-family:fontawesome;
    position:absolute;
    right: 20px;
    top: 20px;
    width: 20px;
    height: 20px;
    background: url(../images/icon_close_white.png) no-repeat 50% 50%;
}

.clinics_list .clinics_list_item_wrap{
    display:none;
    width: 100%;
    max-width: 930px;
    margin: 0 auto;
    line-height:40px;
    font-size:85%;
    color:#777;
    border: 1px solid #ef868d;
    box-sizing: border-box;
}

.clinics_list_title.is-active ~ .clinics_list_item_wrap{
    display: block;
}

.clinics_list_item{padding: 0 5px;
    justify-content: flex-start;
    padding-bottom: 20px;
}

.clinics_list_item li{
    width: 100%; border-bottom: 1px solid #ef868d;
    margin: 10px 0;
    text-align: left;
 padding-bottom: 10px;
    padding-right: 10px;
}

.clinics_list_item li:nth-child(4n){
    border-right: none;
}

.clinics_list_item li .title{
    font-size: 18px;
    line-height: 1.2;
    font-weight: bold;
    color: #ef868d;
}

.clinics_list_item li .address{
    font-size: 14px;
    line-height: 1.4;
    margin: 3px 0;
}

.clinics_list_item li .tel{
    font-size: 18px;
    color: #ef868d;
    position: relative;
    padding-left: 35px;
}

.clinics_list_item li .tel::after{
    content: "";
    position: absolute;
    left: 3px;
    top: 12px;
    width: 25px;
    height: 16px;
    background: url(../lib/clinics_list_tel_icon.png) no-repeat 50% 50%;     background-size: contain;

}

.clinics_list_item li .access{
    font-size: 17px;
    line-height: 1.1;
    color: #ef868d;
    padding-left: 35px;
    position: relative;
    margin: 3px 0;
}

.clinics_list_item li .access::after{
    content: "";
    position: absolute;
    left: 7px;
    top: -2px;
    width: 17px;
    height: 23px;
    background: url(../lib/clinics_list__access_icon.png) no-repeat 50% 50%;     background-size: contain;

}

.clinics_list_item li .time{
    font-size: 16px;
    color: #ef868d;
    padding-left: 35px;
    position: relative;
}

.clinics_list_item li .time::after{
    content: "";
    position: absolute;
    left: 5px;
    top: 3px;
    width: 20px;
    height: 20px;
    background: url(../lib/clinics_list_time_icon.png) no-repeat 50% 50%;     background-size: contain;

}

.clinics_list_item li .parking{
    font-size: 16px;
    color: #ef868d;
    padding-left: 35px;
    position: relative;
}

.clinics_list_item li .parking::after{
    content: "";
    position: absolute;
    left: 5px;
    top: 3px;
    width: 20px;
    height: 20px;
    background: url(../lib/privacys_list_parking_icon.png) no-repeat 50% 50%;     background-size: contain;

}

.info_box{
    position: relative;
    z-index: 999;
    width: 100%;
    background: #FFF;
    margin-top: 8px;
}

.info_title{
    cursor: pointer;
    font-size: 16px;
    line-height: 1.2;
    position: relative;
    padding-left: 25px;
    margin: 15px 0;
}


.info_txt{
    display: none;
    margin: 20px 0;
    font-size: 16px;
    line-height: 1.2;
    padding-right: 5px;
}

.clinics_reservation .line{
    width: 45%;
    text-align: center;
    line-height: 2;
    vertical-align: middle;
    margin-right: 1%;
    display: inline-grid;
    background-color: #12cc4f;
    border-radius: 5px;
    padding: 0;
}

.clinics_reservation .line a{
    color: #fff;
    font-size: 13px;
}

.clinics_reservation .mail{
    width: 45%;
    text-align: center;
    line-height: 2;
    vertical-align: middle;
    display: inline-grid;
    background-color: #3282dc;
    border-radius: 5px;
    padding: 0;
}

.clinics_reservation .mail a{
    color: #fff;
    font-size: 13px;
}

@media screen and (max-width: 650px){
    .clinics_list_area {
        text-align: center;
        padding-top: 10%;
    }

    .clinics_list_area_title {
        margin-top: 2%;
        margin-bottom: 5%;
    }

    .clinics_list {
        margin: 0 auto 2%;
    }

    .clinics_list .clinics_list_title {
        width: 95%;
        height: calc(95vw*0.1);
        background: url(../lib/clinics_list_bg_sp.jpg) no-repeat center bottom;
        background-size: cover;
    }

    .clinics_list .clinics_list_title h3 {
        line-height: 1;
    }

    .clinics_list .clinics_list_title::after {
        top: 25%;
        right: 3%;
        width: 6%;
        height: 50%;
    }

    .clinics_list_title.is-active .clinics_list_item_wrap {
        display: inline-block;
    }

    .clinics_list .clinics_list_title.is-active::after {
        top: 25%;
        right: 3%;
        width: 6%;
        height: 50%;
    }

    .clinics_list .clinics_list_item_wrap {
        width: 95%;
        line-height: 60%;
    }

    .clinics_list .clinics_list_item {
        padding-bottom: 5%;
    }

    .clinics_list .clinics_list_item li {
        width: 47%;
        margin: 5% 0 0;
        padding: 0 1%;
    }

    .clinics_list .clinics_list_item li:nth-child(2n) {
        border-right: none;
    }

    .clinics_list .clinics_list_item li:after {
        content: '';
        width: 90%;
        height: 1px;
        margin: 7% auto 0;
        display: block;
        background: #23bbd7;
    }

    .clinics_list .clinics_list_item li .tel,
    .clinics_list .clinics_list_item li .access,
    .clinics_list .clinics_list_item li .time,
    .clinics_list .clinics_list_item li .parking,
    .clinics_list .info_title {
        padding-left: 20%;
    }

    .clinics_list_item li .tel::after {
        left: 0px;
        top: -2px;
        width: 25px;
        height: 13px;
        background-size: contain;
    }

    .clinics_list_item li .access::after {
        left: 4px;
        top: -1px;
        width: 17px;
        height: 19px;
        background-size: contain;
    }

    .clinics_list_item li .time::after {
        left: 3px;
        top: 5px;
        width: 20px;
        height: 17px;
        background-size: contain;
    }

    .clinics_list_item li .parking::after {
        left: 3px;
        width: 18px;
        background-size: contain;
    }

    .clinics_list .clinics_reservation {
        text-align: center;
        margin-left: 2%;
        padding: 0;
        display: inline-block;
        width: 100%;
    }

    .clinics_list .clinics_reservation .line {
        padding: 1% 0 2%;
        line-height: 1.5;
        margin-right: 1%;
        text-align: center;
    }

    .clinics_list .clinics_reservation .mail {
        padding: 1% 0 2%;
        line-height: 1.5;
    }

    .clinics_list .clinics_reservation .line::after,
    .clinics_list .clinics_reservation .mail::after {
        content: '';
        display: none;
    }
}
#hairhealth{background: url("../lib/sky02.jpg"); background-size: 100%; background-color:rgba(255,255,255,0.4);
background-blend-mode:lighten; }
.shindanbox{padding-bottom: 40px; background: #ffe2e6;}
#hairhealth h3{margin-bottom: 25px;}
#hairhealth .txt{margin: 15px 5%; }
#hairhealth .txt.white{margin: 15px auto; background: #fff; max-width: 600px; width: 90%;}
#hairhealth .yazirushi{margin: 30px auto; width: 20%; max-width: 120px;}
#hairhealth .shindan{padding: 1% 5%; background: #ffe2e6;}
#hairhealth .shindan.kadomaru img{border-radius: 15px;}

#flow{padding: 40px 5%;}
.youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtube iframe {
  width: 100%;
  height: 100%;
}
#flow .attention{font-size: clamp(0.688rem, 0.563rem + 0.63vw, 0.875rem);  color: #666; line-height: 1.5; margin-top: 10px;}
#flow h4{margin: 40px 0;}
#flow ul li{margin:0 auto 3% auto; max-width: 600px;}

