@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;}
.pc{display: none;}

body{background: #fff; max-width: 800px; margin: 0 auto; font-family: 'Noto Serif JP', serif;}
header{max-width: 800px; margin: 0 auto; position: relative;}
h1{width: 35%; position: absolute; margin-top: 5%; left: 5%;}
 
@media only screen and (min-width:800px) {
.pc{display: inherit;}
.smp{display: none;}
}

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

.counceling{ padding: 15px 0;}
.counceling .sec30{width: 70%; margin: 0 auto;}
#fv{margin: 13% 0 0 0;}
.counceling h3{margin-bottom: 5%;}
.counceling .mg30{margin-top: 5%;}
@media only screen and (min-width:800px) {
#fv{margin: 70px 0 0 0;}
}
.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{width: 100%; margin: 0 auto; margin-top: 30px;} */
#sec01 .mg30{padding: 5% 0;}

.toggle {display: none;}
.Label {display: block;}
.Label,
.content {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: all 0.3s;
}
.content {		/*本文*/
	height: 0;
	margin-bottom:10px;
	padding:0 20px;
	overflow: hidden;
}
.toggle:checked + .Label + .content {	/*開閉時*/
	height: auto;
	padding:20px ;
	transition: all .3s;
}
.toggle:checked + .Label::before {
	transform: rotate(-45deg) !important;
}

#sec02{background: #cfe1ff; padding:10% 5%;}
#sec02 h3{width: 60%; margin: 0 auto;}
#sec02 ul li img{
	width: 632px;
	margin: auto;
}
.slick-next {
	height: 55px!important;
    right: -30px!important;
}
.slick-prev {
	height: 55px!important;
    left: -30px!important;
}
@media only screen and (min-width: 700px) {
    .slick-next {
		height: 110px!important;
        width: 65px!important;
		right: -50px!important;
    }
	.slick-prev {
		height: 110px!important;
        width: 65px!important;
		left: -50px!important;
    }
}

@media only screen and (max-width: 699px) {
    #sec02 ul li img{
	width: 93%;
	}
	.hai_n {
		width: 30px!important;
		height: 30px!important;
		right: -18px!important;
	}
	.hai_p {
		width: 30px!important;
		height: 30px!important;
		left: -18px!important;
	}
}

.slick-arrow {
	top: 52% !important;
}

#sec04 ul li{padding: 7% 5%;}
#sec04 ul li.gray{background: #f5f5f5;}


#sec05{background: #cdcdcd; margin-top: 7%; padding-top: 5%;}
#sec05 .mg30{padding: 5% 0;}

#sec07{padding: 5%;}
#sec07 h3{width: 80%; margin: 0 auto; margin-top: 5%;}
#sec07 .mg30{margin: 7% 0;}

#sec08{margin: 0 0 12% 0;}

.slick-prev,
.slick-next
{width: 100%; z-index: 100;}
.slick-prev
{
    left: 50px;
}
.slick-next
{
    right: 50px;
}



#sec09 .mg30{padding: 5% 0;}
#sec09 ul li{margin: 5%;}
#sec09 h4{margin-top: 5%;}

#qa{margin: 5% 0;}
#qa h3{width: 90%; margin: 0 auto;}

#sec10{padding: 8% 5%;}

.accordion {width: 100%;}

/* inputのチェックボックスを非表示 */
.clinic .accordion-hidden {
  display: none;
}
.clinic .accordion-hidden001 {
  display: none;
}

/* 見出しボタンピンク */
.clinic .accordion-open_c {
  display: block; 
  padding: 3%;
  cursor: pointer;
  margin: 3% 0 0 0;
  position: relative;
background: #eaf6fd; border:1px solid #0092dd; font-family: 'Noto Sans JP', sans-serif; font-weight: 400; color:#0092dd; text-align: center; font-size: clamp(0.875rem, 0.392rem + 2.41vw, 1.75rem);}

.clinic label h4{font-weight: normal;}



/* ＋アイコンピンク */
.clinic .accordion-open_c::before,
.clinic .accordion-open_c::after {
  content: '';
  width: 20px;
  height: 1.5px;
  background: #0092dd;
  position: absolute;
  top: 50%;
  right: 5%;
  transform: translateY(-50%);
}

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

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

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

.clinic .accordion-hidden:checked+.accordion-open_c+.accordion-box_c {
  height: auto;
  opacity: 1;
}


/* 中にいろいろ入れたいとき */
.clinic .accordion-box_c {background: #fff;
  display: block;
  height: 0;
  overflow: hidden;
  padding: 0;
  opacity: 0;
  transition: 1s;
}


h3.clinic_title{font-family: 'Noto Sans JP', sans-serif; font-weight: 400; font-size: clamp(1.25rem, 0.078rem + 5vw, 3rem); color: #0092dd; border-bottom: 1px solid #0092dd; padding-bottom: 5px; text-align: center; background: #eaf6fd:}

.clinic .pinkbox{width: 100%; margin:0 auto; padding: 10px; border:1px solid #0092dd; border-top: none;}
.clinic ul{display: flex; flex-wrap: wrap;}
.clinic ul li{padding: 20px 10px; border-bottom:1px solid #0092dd; width: 50%; border-right:1px solid #0092dd; width: 50%;}
.clinic ul li img{width: 100%;}
.clinic ul li:nth-child(2n){border-right: none;}
.clinic ul li.last{border-bottom: none;}


.youtube{margin-top: 30px;
    padding-top: 56.25%;
    width: 100%;
    position: relative;
}
 
.youtube iframe{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
}



.accordion {width: 100%;}

a{color: #000;}
a:visited{color: #000;}

/* inputのチェックボックスを非表示 */
.accordion-hidden {
  display: none;
}
.accordion-hidden001 {
  display: none;
}

/* 見出しボタンよくある質問 */
.accordion-open {
  display: block; 
  padding:  0 3%;
  cursor: pointer;
  margin: 5% 0 0 0;
  position: relative;
}
.accordion-open img{width: 100%; margin: 0 auto;}

/* 見出しボタン部分黄土色 */
.accordion-open001 {
  display: block; 
  padding: 3%;
  cursor: pointer;
  position: relative;
  border-top: 1px solid #a2935f; 
}

/* 20240626料金表用 */
.price {
	padding: 0!important;
	margin: -2px 0 0!important;
}

.price::before,
.price::after {
	right: 5%!important;
	background: #ffffff!important;
}
/* 20240626料金表用 */



/* ＋アイコンブルー */
.accordion-open::before,
.accordion-open::after {
  content: '';
  width: 5%;
  height: 2px;
  background: #33a8fa;
  position: absolute;
  top: 50%;
  right: 10%;
  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-open001::before,
.accordion-open001::after {
  content: '';
  width: 20px;
  height: 1.5px;
  background: #a2935f;
  position: absolute;
  top: 50%;
  right: 5%;
  transform: translateY(-50%);
}

.accordion-open001::after {
  transform: translateY(-50%) rotate(90deg);
  transition: .5s;
}
/* アコーディオンが開いたらーに */
.accordion-hidden:checked+.accordion-open001: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-hidden:checked+.accordion-open+.accordion-box {
  height: auto; margin: 0 5% 0 0;
  opacity: 1;
}

.accordion-hidden:checked+.accordion-open001+.accordion-box001 {
  height: auto;
  opacity: 1;
}

/* 中にいろいろ入れたいとき */
.accordion-box {background: #fff;
  display: block;
  height: 0;
  overflow: hidden;
  padding: 0;
  opacity: 0;
}
.accordion-box001 {background: #fff;
  display: block;
  height: 0;
  overflow: hidden;
  padding: 0;
  opacity: 0;
}
.accordion-box001 img{padding: 5%;}



.pagetop {
    height: 40px;
    width: 40px;
    position: fixed;
    right: 10px;
    bottom: 30vw;
    background: #3282dc;
    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);
}

@media only screen and (min-width:800px) {
.pagetop {
    height: 40px;
    width: 40px;
    position: fixed;
    right: 10px;
    bottom: 150px;}
}

/*20240522_タブ追加*/
.tabs {
    display: flex;
    cursor: pointer;
	justify-content: center;
	width: 632px;
    margin: auto;
	margin-top: 30px;
}

.tab-button {
	color: #fff;
	font-size: 24px;
	font-family: "Yu Gothic", YuGothic, 游ゴシック体, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
	font-weight: bold;
    padding: 10px 20px;
	width: 50%;
	border-top-left-radius: 1rem 1rem;
	border-top-right-radius: 1rem 1rem;
    background-color: #9f9f9f;
    cursor: pointer;
	margin-top: 20px;
	border-style: none;
}
@media only screen and (max-width:799px) {
	.tabs {
		width: 93%;
		padding: 0 18px;
	}
	.tab-button {
		font-size: 14px;
		padding: 8px 10px;
		margin-top: 12px;
	}
}
.tab-button.active {
    background-color: #2e9ad3;
	margin-top: 0;
}

.tab-content {
    display: none;
    padding:  0 20px;
    border-top: none;
}

.tab-content.active {
    display: block;
}

/*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: #3282dc; 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;}


/*料金表テキスト追加*/
p.right {
  text-align: right;
  font-size: 9px;
  margin: 10px 0;
  font-family: 'Noto Sans JP', sans-serif;
}
p.annotation {
  margin: 20px 0;
  font-size: 12px;
  font-family: 'Noto Sans JP', sans-serif;
}

/*20240724 ヘッダー用*/
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 #logo {
    position: absolute;
    left: 20px;
    top: 10px;
    z-index: 100;
	margin-top: 0;
}

header #logo img {
    width: 80%;
    max-width: 450px;
    height: auto;
}

header ul {
    display: flex;
    position: absolute;
    right: 10px;
    top: 10px;
}

header ul li {
    width: 55px;
    margin-right: 10px;
}
@media only screen and (max-width:799px) {
	header #logo img {
		width: 100%;
	}
	header #logo {
		position: absolute;
		top: 18px;
	}
}