/*================================================================
  html
================================================================*/
html {
	font-size: calc(1.3333vw);
}
@media screen and (min-width:600px) {
	html {
	 font-size: calc(10px * 0.8);
	}
}

/*================================================================
  body
================================================================*/
body {
	color: #1A1A1A;
	max-width: 600px;
	margin: 0 auto;
	width: 100%;
	padding-top: 10rem;
	/* ヘッダーの後ろに要素が隠れないようにするため */
	font-size: 2.8rem;
	line-height: 1.4;
	font-family: "Yu Gothic", "YuGothic", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN",
		"Noto Sans JP", "メイリオ", sans-serif;
}

img {
	margin: 0 auto;
	width: 100%;
	height: auto;
}

/*================================================================
  共通
================================================================*/

h2 {
	margin: 0 auto;
	text-align: center;
	padding-top: 4rem;
}

.sub-title {
	font-size: 3rem;
	display: block;
	margin: 0 0 0 0;
}

h2 .en-title {
	display: inline-block;
}

h2 .en-title img {
	height: 6rem;
	width: 100%;
	object-fit: contain;
}

h2 .jp-title {
	display: block;
	font-size: 5rem;
	font-weight: bold;
	padding: 3rem 0 6rem;
}
h4{
	font-size: 3.2rem;
}

.br-none {
	display: none;
}

.cta {
	margin-top: 10%;
	position: relative;
	transition: transform 0.2s ease;
}

.cta:hover {
	opacity: 0.8;
}

.cta-img-ribon {
	width: 90%;
	height: auto;
	object-fit: contain;
	margin-bottom: -6%;
	z-index: 1;
	transition: transform 0.2s ease;
}

.cta-img-button {
	display: block;
	width: 90%;
	height: auto;
	object-fit: contain;
	border-radius: 3rem;
	box-shadow: 0 0.5rem 0 #387427;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
	border: 0.2rem solid #fff;
}

.cta:active .cta-img-ribon,
.cta:hover .cta-img-ribon,
.cta:hover .cta-img-button,
.cta:active .cta-img-button {
	box-shadow: none;
	transform: translateY(0.8rem);
}

.cta a {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.marker-yellow {
	background: linear-gradient(to right, #FBE675 100%, transparent 100%);
	background-size: 0% 100%;
	background-repeat: no-repeat;
	background-position: left center;
	transition: background-size 1.5s ease-in-out;
}

.marker-yellow.inview {
	background-size: 100% 100%;
}

.line-through{
	text-decoration: line-through;
}

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

	.br-none {
		display: block;
	}
	.br-pc-none {
		display: none;
	}


}

/*================================================================
  header
================================================================*/
header {
	width: 100%;
	background: #fff;
	position: fixed;
	top: 0;
	right: 0;
	box-shadow: 0 0.3rem 0.6rem rgba(118, 118, 118, .30);
	z-index: 999;
}

.header-wrapper {
	max-width: 75rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 10rem;
	padding: 0 1rem;
	margin: 0 auto;
}

header h1 {
	width: 40%;
}

header h1 img {
	height: 6rem;
	width: 100%;
	object-fit: contain;
}

header .header-btn {
	display:flex;
	align-items: center;
	justify-content: center;
	/* aタグなので必要 */
	text-align: center;
	text-decoration: none;
	/* aタグの下線を消す */
	background-image: linear-gradient(180deg, rgba(45, 205, 20, 1), rgba(14, 164, 5, 1));
	color: #fff;
	font-weight: bold;
	border-radius: 3rem;
	font-size: 2.4rem;
	height: 6rem;
	line-height: 3.6rem;
	/* 垂直中央揃え */
	width: 45%;
	opacity: 1;
	/* 通常状態は100%表示 */
	transition: opacity 0.3s ease;
}

header .header-btn:hover {
	opacity: 0.6;
}

/*================================================================
  追従ボタン
================================================================*/
.fix-link {
	position: fixed;
	width: 100%;
	z-index: 90;
	margin: 0 auto;
	bottom: 0;
	right: 0;
}

.fix-link div {
	background: rgba(129, 129, 129, .5) no-repeat top 1.2rem center;
	width: 100%;
}

.fix-link p {
	text-align: center;
	font-weight: bold;
	font-size: 2.6;
	position: relative;
}

.fix-link p::before,
.fix-link p::after {
	content: "＼";
	font-size: 1.8rem;
	font-weight: bold;
	margin: 0 0.3rem;
	color: #1a1a1a;
	display: inline-block;
	transform: rotate(13deg);
}

.fix-link p::after {
	transform: rotate(77deg);
}

ul.flex {
	max-width: 75rem;
}

.flex,
.flexA,
.flexB,
.flexC {
	display: flex;
	flex-wrap: wrap;
	margin: 0 auto;
}

.fix-link a {
	height: 8rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	color: #fff;
	font-weight: bold;
	letter-spacing: -0.03em;
	background-size: 2.5rem auto;
	box-sizing: border-box;
	margin: 0.6rem;
	border-radius: 1.4rem;
	font-size: 2.4rem;
	filter: drop-shadow(0 0 1.5rem rgba(0, 0, 0, 0.3));
}

.fix-link .br-none {
	display: block;
}

.fix-link a img {
	width: 3rem;
	height: auto;
	margin-bottom: 0.5rem;
}

.fix-link li {
	width: 30%;
	box-sizing: border-box;
}

.fix-link li.mail {
	width: 40%;
}

.fix-link li.tel a {
	background-color: #6997BF;
	border: 0.2rem solid #fff;
	margin-right: 0;
}

.fix-link li.tel a:hover {
	background-color: #497ca8;
}

.fix-link li.mail a {
	background-image: linear-gradient(180deg, rgba(45, 205, 20, 100%), rgba(14, 164, 5, 1));
	border: 0.2rem solid #fff;
}

.fix-link li.mail a:hover {
	background-image: linear-gradient(180deg, rgb(73, 220, 50), rgb(35, 179, 28));
}

.fix-link li.line a {
	background-color: #fff;
	border: 0.2rem solid #0DC754;
	color: #19B20C;
	margin-left: 0;
}

.fix-link li.line a:hover {
	background-color: #ededed;
}

.fix-link li:last-child {
	border-right: none;
}

.is-hidden {
	display: none;
}

/*================================================================
  fv
================================================================*/

.fv {
	position: relative;
}

.cta-wrapper {
	width: 100%;
	margin: 0 auto;
}

.cta-wrapper .cta{
	margin: 5% 0;
}

.note {
	text-align: right;
	color: #707070;
	padding: 0;
	font-size: 2rem;
}


/*================================================================
  Youtube
================================================================*/
.youtube h2 {
	padding-top: 0;
	background-image: linear-gradient(180deg, rgba(237, 214, 140, 100%), rgba(202, 176, 117, 1));
	font-weight: bold;
	padding: 3% 0;
	font-size: 3.6rem;
}

.youtube-detail {
	text-align: center;
	color: #fff;
	display: flex;
	background-image: url(../img/youtube-bg.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 9.2rem;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding: 8% 5%;
	font-size: 2.8rem;
}

.youtube-detail p {
	margin-bottom: 5%;
}

.youtube-detail iframe {
	width: 100%;
	max-width: 64rem;
	/* 最大幅を設定 */
	aspect-ratio: 16 / 9;
	/* 16:9の比率を維持 */
}

.youtube-detail p .br-none {
	display: block;
}


/*================================================================
  case
================================================================*/

.case {
	background-color: #C8E6FC;
	padding-bottom: 3%;
}

.case .case-title-wrapper {
	display: flex;
	background-image: url(../img/case-title-bg.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	width: 100%;
	min-height: 9.2rem;
	align-items: center;
	justify-content: center;
	gap: 2%;
}

.case h2 {
	font-size: 4rem;
	color: #CB8F21;
	font-weight: bold;
	text-align: center;
	padding-top: 0;
	margin: 0;
	line-height: 1.2;
}

.case .case-title-wrapper::before {
	content: '';
	background-image: url(../img/case-title-ornament.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	display: block;
	width: 5rem;
	height: 18rem;
}

.case .case-title-wrapper::after {
	content: '';
	background-image: url(../img/case-title-ornament.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	display: block;
	width: 5rem;
	height: 18rem;
	margin-right: 1rem;
	transform: rotateY(180deg);
}

.case .case-comment{
	font-size: 3rem;
	margin: 4%;
}

.case .case-catchcopy{
	font-size: 3.4rem;
	font-weight: bold;
	line-height: 2;
	margin: 4%;
	text-align: center;
}

.case .vg-card-grid {
	width: 100%;
}
.case .vg-card-grid .vg-card {
	background: url(../img/treatment-slider-bg.jpg) bottom;
	background-size: 500%;
	border-radius: 2rem;
	padding: 5rem;
	margin: 0 2rem;
}

.case .vg-card-grid img {
	width: 80%;
}

.case .vg-card-title{
	font-size: 4rem;
	font-weight: bold;
	text-align: center;
}

.case .vg-icon{
	border: 0.5em solid #999;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 1em auto 1.5em;
	height: 30rem;
	width: 30rem;
}
.case .vg-treatment{
	margin-top: 1em;
}
.case .vg-treatment ul{
	list-style: disc;
}
.case .vg-treatment li{
	margin-left: 2em;
}
.case .vg-treatment a{
	text-decoration: underline;
}

.case .text-wrapper .treatment-hope p,
.case .text-wrapper .treatment-effect p {
	padding: 3% 3% 5%;
}

.case .text-wrapper {
	width: 92%;
	margin: 0 auto;
}

.case .text-wrapper div {
	background-color: #fff;
	margin-bottom: 1rem;
	border: 0.1rem solid #325686;
}

.case .text-wrapper div p {
	padding: 2% 6% 3%;
	font-weight: 300;
	font-size: 2.8rem;
}


.treatment-background {
	display: flex;
	align-items: center;
}

.text-wrapper .treatment-background p,
.text-wrapper {
	padding: 0;
	margin: 0 auto;
}

.treatment-detail p {
	padding: 3% 2rem;
}

.treatment-background {
	justify-content: center;
	width: 70%;
	margin: 0 auto;
	width: 21.2rem;
}

.case .slider .treatment-background h3 {
	padding: 1% 1rem 1% 2rem;
}

.treatment-background {
	background: -webkit-linear-gradient(143deg, #fff 0 36%, #F25A91 36%);
}

.treatment01 h3 span.treatment-kana,
.treatment02 h3 span.treatment-kana {
	display: inline;
	font-size: 3.6rem;
}

/* slick */
.slick-track {
  display: flex;
}
.slick-slide {
  height: auto !important;
}

/* slick-prev と slick-next のデフォルト矢印を完全に削除 */
.slick-prev::before,
.slick-next::before {
	content: '' !important;
	/* コンテンツを空に */
	display: none !important;
	/* 非表示に */
}

/* 丸いボタンのスタイル */
.slick-prev,
.slick-next {
	position: absolute;
	z-index: 10;
	width: 5rem;
	height: 5rem;
	background-color: rgba(112, 112, 112, .6);
	border: none;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background-color 0.3s;
}

.slick-prev {
	left: 1.5rem;
}

.slick-next {
	right: 1.5rem;
}

/* ホバー時 */
.slick-prev:focus,
.slick-next:focus,
.slick-prev:hover,
.slick-next:hover {
	background-color: #505050;
}

/* カスタム矢印 */
.slick-prev::after,
.slick-next::after {
	content: '';
	display: block;
	width: 2rem;
	height: 2rem;
	border-top: 0.2rem solid white;
	border-right: 0.2rem solid white;
}

/* 左矢印 */
.slick-prev::after {
	transform: rotate(-135deg) translate(-15%, 20%)
}

/* 右矢印 */
.slick-next::after {
	transform: rotate(45deg) translate(-15%, 10%);
}

.slick-dots {
	bottom: -5rem;
	width: 100%;
}
.slick-dots li,
.slick-dots li button{
	margin: 0;
	padding: 0;
	height: 4rem;
	width: 4rem;
}
.slick-dots li button:before{
    font-size: 2rem;
    line-height: 4rem;
    width: 4rem;
    height: 4rem;
}

/*================================================================
  offer
================================================================*/
.offer {
	background-image: url(../img/offer-bg.jpg);
	background-repeat: no-repeat;
	width: 100%;
	background-size: cover;
	background-position: top;
	padding-top: 7%;
}

.offer .speech-box {
	margin: 0 auto 5%;
	background: #fff;
	border-radius: 1.5rem;
	padding: 2% 3%;
	position: relative;
	border: 0.4rem solid transparent;
	box-shadow: inset 0 0 0 0.1rem #715413;
	width: 80%;
}

.offer-bnr {
	width: 90%;
	margin: 0 auto;
	display: block;
}

.offer .speech-box p {
	font-size: 3.8rem;
	font-weight: bold;
	margin: 0;
	text-align: center;
	color: #715413;
	margin: 0 auto;
}

.offer .text-orange {
	color: #EF7268;
}

.offer .emphasis {
	font-size: 4.4rem;
}

/* 下の吹き出し三角 */
.speech-box::after {
	content: "";
	position: absolute;
	bottom: -18%;
	left: 50%;
	transform: translateX(-50%);
	border-width: 2vw 3vw 0 3vw;
	border-style: solid;
	border-color: #fff transparent transparent transparent;
}

.tess-table .num {
	width: 15%;
}

.tess-table .regular {
	width: 25%;
}

.tess-table .monitor {
	width: 30%;
}

.tess-table .cp {
	width: 30%;
}

.hyaluron-table .type {
	width: 20%;
}

.hyaluron-table .regular {
	width: 40%;
}

.hyaluron-table .cp {
	width: 40%;
}

.tess-table,
.hyaluron-table {
	width: 90%;
	border-collapse: collapse;
	font-family: "Helvetica", "Arial", sans-serif;
	text-align: center;
	margin: 3rem auto 0;
	border: 0.1rem solid #ccc;
	background-color: #fff;
	color: #707070;
	white-space: nowrap;
}

.tess-table td,
.hyaluron-table td {
	font-size: 3.4rem;
	vertical-align: middle;
}

.tess-table th,
.hyaluron-table th {
	vertical-align: middle;
}

.tess-table thead .title-row th,
.hyaluron-table thead .title-row th {
	background-color: #325686;
	color: white;
	font-size: 3.0rem;
	padding: 1rem 0.5rem;
	text-align: center;
	font-weight: 500;
}

.tess-table thead tr:nth-child(2) th,
.hyaluron-table thead tr:nth-child(2) th {
	padding: 0.75rem;
	border-bottom: 0.1rem solid #ccc;
}

.tess-table td,
.tess-table th,
.hyaluron-table td,
.hyaluron-table th {
	border: 0.1rem solid #ccc;
	padding: 1rem;
	text-align: center;
}

.tess-table td.content-highlight,
.hyaluron-table td.content-highlight {
	color: #EB3B2F;
	font-weight: bold;
	background-color: #ECF2F7;
}

.tess-table th .tax,
.hyaluron-table th .tax {
	font-size: 0.8em;
	display: block;
}

.tess-table thead tr:nth-child(2) th.title-highlights,
.hyaluron-table thead tr:nth-child(2) th.title-highlights,
th.title-highlights {
	background-color: #58A1DE;
	color: #fff;
}

.title-grey {
	background-color: #F7F6F2;
}

.mid-title {
	font-size: 2.9rem;
	font-weight: 500;
}

.small-title {
	font-size: 2.6rem;
}

td.small-title {
	font-size: 2.4rem;
}

.yen {
	font-size: 2.4rem;
}

.table-scroll {
	width: 90%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin: 0 auto;
}

.tess-table,
.hyaluron-table {
	min-width: 40rem;
	border-collapse: collapse;
	width: 100%;
}

.campaign-notes {
	font-size: 2.2rem;
	color: #707070;
	width: 90%;
	margin: 5% auto 0;
}

.note-section {
	margin-bottom: 2%;
}

.note-section ul {
	list-style: disc;
	padding-left: 2.6rem;
}

.offer .cta {
	padding-bottom: 10%;
}

/*================================================================
  fair
================================================================*/
.fair .fair-intro {
	background-image: url(../img/fair-intro-bg.png);
	background-repeat: no-repeat;
	width: 100%;
	background-size: cover;
	background-position: bottom;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.fair .fair-intro h3 {
	text-align: center;
	font-size: 3.6rem;
	margin: 0 auto;
	padding: 9% 0;
	font-weight: bold;
	line-height: 1.5;
}

.fair .fair-intro h3 span {
	font-size: 4.8rem;
}

.fair .fair-intro p {
	font-size: 2.8rem;
	padding: 0 9% 12%;
	line-height: 1.5;
}

.fair-main h2 {
	padding-top: 0;
}

.fair-list {
	width: 90%;
	margin: 0 auto;
	padding: 8% 0;
}

.fair-list li {
	display: flex;
	padding: 3% 0;
}

.fair-list li img {
	width: 25%;
	object-fit: contain;
	padding-right: 5%;
	min-width: 10rem;
}

.fair-list-item .item-text {
	width: 80%;
}

.fair-list-item .item-text h3 {
	font-weight: bold;
	font-size: 3.2rem;
	padding-bottom: 2%;
}

.fair-list-item .item-text p {
	font-size: 2.8rem;
}

.fair-more {
	background-image: url(../img/fair-more-bg.png);
	background-repeat: no-repeat;
	width: 100%;
	background-size: cover;
	background-position: top;
	padding: 10% 0 0;
}

.fair-more-text {
	padding: 5% 0;
}

.fair-more-text h4 {
	font-weight: bold;
	position: relative;
	display: inline-block;
	padding-left: 5%;
}

.fair-more-text h4::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 0.1rem;
	background-color: #BFA66F;
}

.fair-more-text p {
	width: 90%;
	margin: 2% auto 0;
	font-size:2.8rem;
}

.fair-last {
	margin: 0 auto;
}

.fair .last-text {
	font-weight: bold;
	text-align: center;
	font-size: 3.6rem;
	padding: 5%;
}

.therefore {
	background-image: url(../img/therefore-bg.png);
	background-repeat: no-repeat;
	background-size: contain;
	display: flex;
	justify-content: center;
}

span.bg-brown {
	background-color: #BFA66F;
	color: #fff;
	font-weight: bold;
	padding: 1% 3%;
	font-size: 3.6rem;
	text-align: center;
	display: inline-block;
}

/*================================================================
  treatment
================================================================*/
.treatment {
	background: linear-gradient(to bottom, #F7FCFF, #E8F7FF);
}

.treatment h2 .en-title img {
	height: 2.8rem;
}

.treatment h2 span.jp-title {
	font-size: 4rem;
	padding-bottom: 0;
}

.treatment-item {
	width: 95%;
	background-color: #FFFEF5;
	margin: 0 auto 2em;
	padding-bottom: 2em;
}

.treatment-item-detail {
	display: flex;
	padding-top: 10%;
	width: 95%;
	margin: 0 auto;
}

.treatment-item-detail .text-wrapper {
	width: 60%;
}
.treatment-item-detail .text-wrapper.no-image {
	width: 94%;
}

.treatment-item-detail img {
	object-fit: contain;
	width: 30%;
}

/* h3 */
.treatment-item h3 {
	position: relative;
	padding: 4%;
	border-radius: 0.5rem;
	border: 0.1rem solid #80C4FF;
	color: #80C4FF;
	font-weight: bold;
	font-size: 3.2rem;
	text-align: center;
	background-color: #fff;
	line-height: 1.5;
}

.treatment-item h3:before {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	height: 1.5rem;
	width: 0.1rem;
	background-color: #80C4FF;
	content: "";
}

/* title-line */
.title-line {
	margin-bottom: 2rem;
	flex-direction: column;
}

.title-line h4 {
	font-weight: bold;
	margin: 0;
	flex-shrink: 0;
	position: relative;
	display: inline-block;
	margin-bottom: 2%;
}

.title-line p {
	font-size: 2.6rem;
	font-weight: 600;
	white-space: nowrap;
	margin: 0;
	display: flex;
	align-items: center;
}

.title-line p::before {
	content: "";
	display: inline-block;
	height: 0.1rem;
	background-color: #1a1a1a;
	width: 100%;
	margin-right: 1rem;
	transform: translateY(0.05rem);
}

/* text-content */
.treatment .text-content {
	font-size: 2.8rem;
}
.treatment .note {
	padding: 2% 2% 0 0;
}

/* recommendation */
.recommendation {
	margin: 5%;
}

.recommendation p {
	font-size: 3.2rem;
	font-weight: bold;
	text-align: center;
	position: relative;
	margin-bottom: -3%;
}

.recommendation-title:before,
.recommendation-title:after {
	position: relative;
	display: inline-block;
	content: "";
	background: #1a1a1a;
	width: 0.2rem;
	height: 1.4em;
	margin: 0 3%;
	margin-top: -.2em;
	vertical-align: middle;
}

.recommendation-title:before {
	transform: rotate(335deg);
}

.recommendation-title:after {
	transform: rotate(-335deg);
}

.recommendation ul {
	font-size: 2.9rem;
	background-color: #fff;
	font-weight: bold;
	padding: 8% 5% 5%;
}

.recommendation ul li {
	display: inline-block;
	margin-bottom: 1.2rem;
	font-size: 2.7rem;
	font-weight: bold;
	display: flex;
	align-items: center;
}

.recommendation ul li::before {
	content: '';
	background-image: url(../img/check-icon02.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	width: 1.6rem;
	height: 1.6rem;
	float: left;
	margin-right: 0.4rem;
}

/* price */
.treatment-price{
	margin: auto;
	width: 90%;
}
.price-title{
	font-weight: bold;
	text-align: center;
}
.price-subtitle{
	font-weight: bold;
	margin-top: 1.5em;
	text-align: center;
}
.treatment-price table{
	border-top: 0.1rem solid #BFA66F;
	margin: 0.8em auto;
}
.treatment-price th,
.treatment-price td{
	border-bottom: 0.1rem solid #BFA66F;
	padding: 0.5em 0.5em;
}
.treatment-price th{
	padding-top: 1.1em;
}
.treatment-price td{
	font-weight: bold;
	text-align: right;
}
.treatment-price td .num{
	line-height: 1.1;
	font-size: 6rem;
}
.treatment-price .campaign{
	color: #E4416B;
}

/* accordion */
.treatment .accordion-item{
	margin: 0 5%;
	padding: 0 5%;
	width: 90%;
}
.treatment .accordion-head{
	font-weight: bold;
}
.treatment .accordion-body{
	display: block;
}
.treatment .accordion-body img{
	margin: 1.5em auto;
	height: auto;
	width: 80%;
}
.treatment .accordion-body p{
	font-size: 2.6rem;
}
.treatment .accordion-body h5{
	border-bottom: 0.1rem solid #BFA66F;
	font-size: 3.0rem;
	font-weight: bold;
	margin: 2em 0 1em;
}
.treatment .accordion-body dl{
	margin: 1.5em 0;
}
.treatment .accordion-body dd{
	margin-top: 0.5em;
	display: flex;
}
.treatment .accordion-body .image{
	padding-right: 1em;
	width: 40%;
}
.treatment .accordion-body .image img{
	margin: 0;
	height: auto;
	width: 100%;
}
.treatment .accordion-body .text{
	width: 60%;
}

/* downtime */
.treatment-downtime{
	font-size: 2.4rem;
}
.treatment-downtime th,
.treatment-downtime td{
    border: 1px solid #D8BB7B;
	padding: 0.5em 1em;
}
.treatment-downtime th{
	width: 6.5em;
}

/* last-text */
.treatment .last-text {
	background-image: url(../img/treatment-last-text-bg.png);
	background-size: cover;
	height: 100%;
	width: 100%;
	background-repeat: no-repeat;
	background-position: bottom;
	padding: 15% 0;
	line-height: 1.6;
	text-align: center;
	font-size: 2.9rem;
	font-weight: bold;
}

.treatment .last-text span {
	text-align: center;
	font-size: 3.2rem;
}

/*================================================================
  know
================================================================*/
.know {
	background-image: url(../img/know-bg.png);
	background-position: 0% 118%;
	background-repeat: no-repeat;
	width: 100%;
	height: auto;
	background-size: 200%;
}

.know-title-wrapper {
	background-image: url(../img/know-title-bg.png);
	background-size: cover;
	background-position: center;
	background-repeat: repeat-x;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 100%;
	padding: 0 0 15% 0;
	min-height: 20rem;
}

.know .note {
	color: #fff;
	text-align: left;
	width: 90%;
	margin-top: 3%;
}

.know-title {
	position: relative;
	width: 100%;
}

.know-title h2 {
	padding-top: 0;
	margin-top: -8%;
}

.know-title h2 img {
	width: 67%;
	height: auto;
	max-width: 48rem;
}

.know-title p {
	font-size: 3.0rem;
	color: #fff;
	text-align: center;
	display: block;
	padding: 8% 0 1%;
	font-weight: bold;
	line-height: 1.6;
}

.debut {
	width: 21%;
	position: absolute;
	right: 0.1rem;
	top: 0.8rem;
	max-width: 15rem;
}

.know-title .text-brown {
	font-size: 3.4rem;
	color: #E4D0A7;
	position: relative;
}

.know-title .text-small {
	font-size: 3.0rem;
}

sup {
	font-size: 0.5em;
	vertical-align: super;
	color: #fff;
	font-weight: 300;
	position: absolute;
	right: -4%;
	top: 0;
}

.know-fairclinic {
	display: flex;
	position: relative;
}

.know-fairclinic-text {
	width: 80%;
	background-color: #fff;
	filter: drop-shadow(0 0.4rem 0.2rem rgba(208, 208, 208, 0.3));
}

.know-fairclinic-text .title {
	font-weight: bold;
	padding: 3rem 0 2rem 2rem;
	font-size: 3.8rem;
}

.know-fairclinic-text .detail {
	font-size: 2rem;
	padding: 0 0 3rem 2rem;
	font-size: 3.4rem;
}

.know-fairclinic-text .detail .marker-yellow {
	font-weight: bold;
}

.know-doctor {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 45%;
	object-fit: contain;
	max-width: 20rem;
}

.know-reason {
	text-align: center;
	/* 全体のコンテンツを中央寄せ */
	position: relative;
	/* 背景を考慮して配置 */
}

.know-reason .arrow-text {
	background-image: url(../img/know-arrow.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	color: #fff;
	display: block;
	margin: 0 auto;
	font-size: 3.8rem;
	padding: 0.5rem 0 4% 0;
	max-width: 17rem;
	height: auto;
	display: block;
	margin: 0 auto -2%;
	text-align: center;
	z-index: 1;
	position: relative;
}

.know-reason .bg-gold {
	text-align: center;
	background-image: linear-gradient(180deg, rgba(237, 214, 140, 100%), rgba(202, 176, 117, 1));
	font-size: 4.4rem;
	font-weight: bold;
	padding: 3%;
	filter: drop-shadow(0 0.3rem 0.6rem rgba(118, 118, 118, 0.3));
}

.trouble {
	background-image: url(../img/trouble-bg.png);
	background-size: cover;
	height: 100%;
	width: 100%;
	border-radius: 0 10rem 0 0;
	background-repeat: no-repeat;
	overflow: hidden;
}

/*================================================================
  about
================================================================*/
.about {
	background-color: #F8F8F8;
	padding-top: 3%;
}

.fairclinic {
	background-image: url(../img/fairclinic-bg.png);
	background-size: cover;
	height: 100%;
	width: 100%;
	background-repeat: no-repeat;
	padding: 10% 0;
	position: relative;
}

.trouble h2 {
	width: 75%;
	padding-top: 2rem;
	max-width: 46rem;
	margin-bottom: 0;
}

.trouble h2 img {
	object-fit: contain;
}

.trouble-list-item {
	background-color: #fff;
	display: inline-block;
	padding: 0.6rem 0.8rem;
	margin-bottom: 1.2rem;
	font-size: 2.7rem;
	font-weight: bold;
	display: flex;
	align-items: center;
}

.trouble-list-item::before {
	content: '';
	background-image: url(../img/check-icon.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	width: 1.6rem;
	height: 1.6rem;
	margin-right: 0.4rem;
}

.trouble-content {
	display: flex;
	position: relative;
}

.trouble-list {
	z-index: 1;
	margin: 1rem 0 3rem;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.trouble-content img {
	width: 45%;
	height: auto;
	object-fit: contain;
	position: absolute;
	z-index: 0;
	bottom: 0;
	right: -2.5rem;
	max-width: 21rem;
}

.about-title-img {
	position: absolute;
	width: 90%;
	margin: 0 auto 0;
	display: block;
	top: -1.5%;
	right: 5%;
}

.about-list {
	display: flex;
	flex-direction: column;
}

.about-title {
	display: flex;
	align-items: center;
}

.about-list-item {
	background-color: #fff;
	border-radius: 0 5rem 0 0;
	box-shadow: 0 0 0.6rem rgba(118, 118, 118, .30);
	margin-right: 5%;
	position: relative;
	margin-top: 8%;
}

li.about-list-item.item02,
li.about-list-item.item04 {
	margin-left: 5%;
	border-radius: 5rem 0 0 0;
	margin-right: 0;
}

.about-list-item .sub-title {
	font-size: 2.8rem;
	margin-bottom: 0.5rem;
}

.about-title img {
	object-fit: contain;
	width: auto;
	height: 20rem;
}

li.about-list-item.item04 .about-title img {
	padding-right: 0;
}

.about-list-item h3 {
	font-size: 3.4rem;
	padding: 10% 1% 4% 6%;
	width: 75%;
	font-weight: bold;
}

.about-list-item h3::before {
	content: '';
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	width: 28%;
	height: 28%;
	margin-right: 1rem;
	position: absolute;
	top: -12%;
}

/* .about-list-item.item04 .about-title h3 {
	width: 80%;
} */

.about-list-item.item01 h3::before {
	background-image: url(../img/about-list-num01.png);
}

.about-list-item.item02 h3::before {
	background-image: url(../img/about-list-num02.png);
}

.about-list-item.item03 h3::before {
	background-image: url(../img/about-list-num03.png);
}

.about-list-item.item04 h3::before {
	background-image: url(../img/about-list-num04.png);
}

.about-list-item p {
	border-top: 0.1rem solid #1A1A1A;
	padding: 5% 0 5% 5%;
	margin-right: 6%;
	font-size: 2.8rem;
	font-weight: 300;
}

/*================================================================
  doctor
================================================================*/
.doctor {
	overflow: hidden;
}

.doctor-bg {
	background-color: #FAF8F3;
	margin: 0 auto;
	position: relative;
}

.doctor h2 {
	font-size: 3.8rem;
	font-weight: bold;
	color: #C8AF77;
	position: relative;
	padding: 5% 0 10%;
}

.doctor h2 .text-big {
	font-size: 4.4rem;
}

.doctor h2 .text-space {
	letter-spacing: -0.3em;
}

.doctor h2:after {
	content: "";
	display: block;
	position: absolute;
	width: 107%;
	height: 100%;
	background-image: url(../img/doctor-gold-line.png);
	background-size: 120%;
	background-repeat: no-repeat;
	top: 10rem;
	right: 0;
	transform: rotate(0deg);
}

.doctor .sub-title {
	font-size: 3.0rem;
	text-align: center;
	font-weight: bold;
	margin: 0;
}

.tab-group {
	margin-top: 2rem;
	width: 100%;
	list-style: none;
	text-align: center;
	width: 95%;
	margin: 0 auto;
}

.doctor-img {
	width: 95%;
	display: block;
	margin-bottom: 5%;
}

.tab-button {
	display: flex;
	justify-content: space-between;
	list-style: none;
	/* カーソル形状を指先にする */
	cursor: pointer;
	background: #EAEAEA;
}

.tab-group .tab-button {
	font-size: 3.4rem;
	font-weight: bold;
}

.tab-button .is-active {
	background: #BFA66F;
	color: #FFF;
}

.tab {
	width: calc(100% / 2);
	padding: 0.8rem;
	border-bottom: none;
}

.tab-contents {
	border-top: none;
	background: #fff;
}

.doctor-content {
	display: none;
	padding: 1.8rem 1.4rem 0;
	text-align: left;
}

.doctor-content.is-display {
	display: block;
	border: 0.1rem solid #BFA66F;
}

.doctor-content .post {
	font-size: 3.4rem;
	font-weight: bold;
}

.doctor-content .name {
	font-size: 5.4rem;
	margin-bottom: 2rem;
	font-weight: bold;
}

.doctor-content .name .name-kana {
	font-size: 3.0rem;
}

.doctor-detail h4 {
	border-bottom: 0.1rem solid #BFA66F;
	padding-bottom: 1%;
	margin-bottom: 1rem;
	font-weight: bold;
}

.doctor-detail .detail-list {
	font-size: 2.9rem;
	margin-bottom: 2rem;
	font-weight: 300;
	line-height: 1.5;
}

.doctor-last-text {
	position: relative;
	font-size: 3.4rem;
	font-weight: bold;
	padding-top: 15%;
}

.doctor-last-text span {
	font-size: 4.6rem;
	color: #C8AF77;
}

.doctor-last-text::before {
	content: "";
	display: block;
	position: absolute;
	width: 110%;
	height: 100%;
	background-image: url(../img/doctor-gold-line.png);
	background-size: 100%;
	background-repeat: no-repeat;
	top: 0;
	right: -3rem;
	transform: rotate(358deg);
}

.doctor-bg::after {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	/* 背景と同じ幅いっぱい */
	height: 4rem;
	/* 矢印の高さ（調整可能） */
	background-color: #FAF8F3;
	/* 指定された色 */
	clip-path: polygon(50% 100%, 0 0, 100% 0);
	/* 下向き矢印 */
	bottom: -4rem;
	/* `.docter` の下に配置 */
	left: 0;
}

.doctor .cta {
	margin: 15% 0 10%;
}

/*================================================================
  flow
================================================================*/
.flow {
	width: 97%;
	margin: 0 auto;
}

.flow h2 .jp-title {
	font-size: 4.6rem;
}

.flow-num img {
	width: auto;
	display: block;
	object-fit: contain;
	height: 5rem;
	position: absolute;
	top: -9rem;
	left: -2.8rem;
}

.flow-list .flow-item h3 .flow-title {
	font-size: 3.8rem;
	color: #8AB6DC;
	font-weight: bold;
	border-bottom: 0.3rem dotted #8AB6DC;
	padding: 3% 0;
	margin-top: 5%;
	font-weight: bold;
}

.flow-list .flow-item h3 .flow-title span {
	font-size: 3.4rem;
}

.flow-item {
	font-size: 2.9rem;
	padding: 3rem 1.6rem 2rem;
	position: relative;
	filter: drop-shadow(0 0 0.3rem rgba(118, 118, 118, 0.3));
	font-weight: 300;
}

.flow-item.item01 {
	background-color: #F3F7F8;
	z-index: 0;
}

.flow-item.item01 .flow-title-wrapper {
	align-items: center;
}


.flow-item.item02 {
	background-color: #E8F6F6;
	z-index: -1;
	padding-top: 8rem;
}

.flow-item.item03 {
	background-color: #D3E9F1;
	z-index: -2;
	padding-top: 8rem;
}

.flow-item.item02 .flow-description-list,
.flow-item.item03 .flow-description-list {
	margin-top: 0;
}

.flow-item.item02 .flow-description-list,
.flow-item.item03 .flow-description-list {
	margin-top: 0;
}

.flow-item.item02 .flow-title-wrapper,
.flow-item.item03 .flow-title-wrapper {
	align-items: flex-end;
}

.flow-item.item01::after,
.flow-item.item02::after {
	content: '';
	position: absolute;
	bottom: -5rem;
	left: 0;
	width: 101%;
	height: 5rem;
	background-image: url(../img/step01-arrow.png);
	background-size: 100% auto;
	background-repeat: no-repeat;
}

.flow-item.item02::after {
	background-image: url('../img/step02-arrow.png');
}

.flow-description-list {
	margin-top: 3rem;
}

.flow-description-list-item {
	margin-bottom: 1rem;
}

.flow-description-list-item h4 {
	display: inline-block;
	background-color: #80C4FF;
	color: #fff;
	padding: 1% 3%;
	font-weight: bold;
	position: relative;
	top: 1.2rem;
}

.flow-description-list-item p {
	background-color: #fff;
	padding: 2rem;
}

.flow-title-wrapper {
	display: flex;
	justify-content: space-between;
}

.flow-title-wrapper h3 {
	margin-bottom: 2rem;
	position: relative;
}

.flow-item01 {
	width: 80%;
}

.flow-icon {
	width: 20%;
	object-fit: contain;
	max-width: 13.5rem;
	height: auto;
	min-width: 7rem;
	margin-right: 0;
}

.flow02-last-text {
	font-weight: bold;
	text-align: center;
	padding-top: 3%;
}

.flow-appeal {
	display: flex;
	align-items: center;
	margin-top: 2rem;
	position: relative;
	max-width: 75rem;
}

.flow-appeal img {
	width: 25%;
	object-fit: contain;
	position: absolute;
	right: 0;
	z-index: -1;
}

.flow-appeal-text {
	position: relative;
	width: 80%;
	min-height: 1.35rem;
	padding: 4% 9% 6% 5%;
	font-size: 2.9rem;
	background-image: url(../img/flow-speech-bubble.png);
	background-size: contain;
	background-repeat: no-repeat;
	z-index: 0;
	line-height: 1.6;
}

.flow-appeal-text .marker-yellow {
	font-weight: bold;
}

.flow .cta {
	margin: 5% 0 10%;
}

/*================================================================
  question
================================================================*/
.question {
	background-color: #FFF5F5;
	padding-bottom: 10%;
}

/*アコーディオン*/
.accordion-list {
	width: 93%;
	margin: 0 auto;
}

.accordion-item {
	width: 100%;
	background-color: #fff;
	padding: 0 2rem;
	box-shadow: 0 0.3rem 0.6rem rgba(118, 118, 118, .30);
	border-radius: 1rem;
}

.accordion-head {
	padding: 2rem 0;
}

.accordion-head,
.accordion-body {
	width: 90%;
	display: flex;
	align-items: center;
}

.accordion-body {
	align-items: flex-start;
}

.accordion-head img,
.accordion-body img {
	width: 3rem;
	height: 100%;
	display: block;
}

.q-title,
.q-answer {
	width: 100%;
	padding-left: 2rem;
}

.q-title {
	font-weight: bold;
	position: relative;
	font-size: 3.0rem;
	padding-left: 2rem;
	padding-right: 4rem;
	/* +ボタンと被らないよう余白を確保 */
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}


.q-answer {
	font-size: 3.0rem;
}

/*
	アコーディオンの2つ目以降、上に余白を取る。
	開閉動作に影響なし。
  */
.accordion-item:nth-child(n+2) {
	margin-top: 2rem;
}

/*
	アコーディオンの開閉ボタンの装飾。
	position: relative;が無いと、
	「+」「-」の位置がずれるので注意。
  */
.accordion-head {
	position: relative;
	width: 100%;
	background: #fff;
	cursor: pointer;
}

/*
	アコーディオンの開閉ボタンの右側に「+」を表示。
  */

.open-close-btn {
	position: absolute;
	top: 50%;
	right: -1rem;
	/* 右端に配置 */
	transform: translateY(-50%);
	background-color: #E08C97;
	width: 4rem;
	height: 4rem;
	border-radius: 50%;
	transition: 0.5s;
}

.open-close-btn::before {
	content: "";
	position: absolute;
	top: 50%;
	right: 50%;
	transform: translate(50%, -50%);
	width: 0.2rem;
	height: 1.2rem;
	background: #FFF;
	transition: all 0.2s 0s ease;
}

.open-close-btn::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 50%;
	transform: translate(50%, -50%);
	width: 1.2rem;
	height: 0.2rem;
	background: #FFF;
	transition: all 0.2s 0s ease;
}

.accordion-item.active .open-close-btn::before {
	background-color: #EB959D;
}

.accordion-item.active .open-close-btn {
	background-color: #EB959D;
	transition: all 0.2s 0s ease;
}

/*
  アコーディオンの閉じている部分の装飾。
  height: 0; overflow: hidden;にすることで、
  通常時は表示されないようにする。
*/
.accordion-body {
	overflow: hidden;
	width: 100%;
	height: 0;
	transition: all .25s ease;
	border: none;
}

/*
	アコーディオンが開いた際に、
	heightを0からautoに、paddingの上下を0から10に。
  */
.accordion-item.active .accordion-body {
	height: auto;
	border-top: 0.1rem solid #1A1A1A;
	padding: 2rem 0;
}

/*================================================================
  access
================================================================*/
.access {
	background-color: #EBF3FB;
	margin: 0 auto;
	padding-bottom: 4rem;
}

.access h2 {
	padding-top: 5rem;
	padding-bottom: 2rem;
}

.bg-white {
	background-color: #fff;
	padding: 3rem 2rem 2rem 2rem;
	margin: 1rem 1rem 0 1rem;
}

.clinic-title {
	width: 100%;
	margin: 0 auto 3rem;
}

.clinic-title p {
	text-align: right;
	font-size: 2.4rem;
	padding-bottom: 1%;
}

.shop-appearance {
	width: 100%;
	height: 100%;
	margin: 0 auto 10%;
}

.shop-appearance img {
	width: 100%;
	height: 100%;
}

.access iframe {
	width: 100%;
	max-height: 30rem;
	display: block;
	margin: 0 auto;
}

.access-list {
	padding: 10% 0 0;
}

.access-item {
	padding-bottom: 10%;
}

.access-item h3 {
	font-size: 3.4rem;
	border-left: 0.2rem solid #1A1A1A;
	padding-left: 2%;
	margin-bottom: 3%;
	font-weight: bold;
}

.access-item p {
	font-size: 3.0rem;
}

/*================================================================
  form
================================================================*/
#wrapper {
	width: 86%;
	margin: 0 auto;
}

.form h2 {
	background-image: url(../img/contact-title-bg.png);
	background-size: 100%;
	object-fit: contain;
	max-width: 75rem;
	width: 100%;
	height: 100%;
	color: #fff;
	background-repeat: no-repeat;
	padding-top: 8%;
	margin-bottom: 0%;
}

.mfp_element_select-one,
.mfp_rows,
form#mailformpro label.mfp_not_checked,
form#mailformpro .mailform .form-title,
.mfp_element_textarea {
	border-style: none;
	box-shadow: none;
	align-items: center;
}

form#mailformpro .mailform .form-title.form-title {
	border: none;
	font-size: 3.4rem;
	display: flex;
	margin-bottom: 1rem;
	border-left: 0.2rem solid #1A1A1A;
	padding-left: 2%;
	background-color: transparent;
	font-weight: bold;
}

.mailform .note {
	color: #1a1a1a;
	padding-left: 0;
	margin-bottom: 3%;
	font-size: 1.6rem;
	text-align: left;
}

.mfp_rows.tel {
	border: none;
	display: flex;
}

.mfp_rows.name {
	display: flex;
	border: none;
}

.mfp_rows.name .sei {
	margin-right: 2%;
}

.mfp_rows.name .mfp_col5 input[type="text"],
.mfp_element_select-one,
.mailform input[type="tel"],
.mailform input[type="number"],
input[type="email"],
input[type="date" i],
.mailform .ar select,
form#mailformpro label.mfp_not_checked,
.mfp_element_textarea {
	border-radius: 0.5rem;
	border: 0.1rem solid #1A1A1A;
	height: 3.6rem;
	padding: 0 1rem;
	width: 100%;
	font-size: 3.0rem;
	box-shadow: none;
}

.mfp_element_textarea {
	height: 10rem !important;
	/* 必要なら高さ調整 */
	padding: 1% 3%;
	width: 100% !important;
	display: block;
	/* 念のため */
}

.mailform input[type="number"] {
	width: 30%;
}

.must,
.optional {
	background-color: #E4416B;
	border: none;
	text-shadow: none;
	padding: 0.3rem 1.2rem;
	font-size: 3.0rem;
	color: #FFF;
	margin: 0.4rem 1rem;
	border-radius: 0.5rem;
	box-shadow: 0 0 0.6rem rgba(118, 118, 118, .30);
	background-image: none;
	font-weight: bold;
}

.optional {
	background-color: #717171;
}

form#mailformpro .mailform .mfp:not(textarea) {
	margin-bottom: 2.8rem;
	padding: 0;
	background-color: transparent;
}

form#mailformpro .mailform .other-information {
	margin-bottom: 2.8rem;
	padding: 0;
	background-color: #fff;
	border: 0.1rem solid #1A1A1A;
	border-radius: 0.5rem;
}

form#mailformpro .mailform .other-information textarea {
	width: 100%;
	height: 100%;
}

.mailform input[type="radio"],
input#mfp_element_57,
input#mfp_element_16 {
	width: 1.5rem;
	height: 1.5rem;
	display: block;
}

input#mfp_element_57 {
	margin-right: 5%;
}

form#mailformpro label,
.mailform select,
input[type="date" i] {
	font-size: 3.0rem;
}

input[type="date" i],
.mailform .ar select {
	font-size: 3.0rem;
}

form#mailformpro label.mfp_not_checked {
	display: flex;
	width: auto;
	border: none;
	padding: 0;
	height: auto;
}

form#mailformpro label.mfp_checked {
	border: none;
	background: none;
	box-shadow: none;
	width: auto;
	padding: 0;
}

form#mailformpro .mfp.radio label,
form#mailformpro label {
	border: none;
	background: none;
	box-shadow: none;
	width: 100%;
	margin: 0;
	display: flex;
	align-items: center;
}

form#mailformpro .mfp.radio label,
form#mailformpro label.mfp_checked {
	display: flex;
	align-items: center;
	height: auto;
}

form#mailformpro .mailform .mfp.gender {
	display: flex;
}

#errormsg_性別 {
	margin-bottom: 4rem;
	margin-top: -2rem;
}

form#mailformpro .mailform .mfp.gender label {
	width: 4em;
}

.mfp.mfp_achroma.calendar {
	display: flex;
	align-items: center;
	height: 3rem;
	box-sizing: initial;
}

.mfp_element_submit:hover,
.mfp_element_reset:hover,
.mfp_element_button:hover,
button.mfp_next:hover,
button.mfp_prev:hover {
	background: none;
	background-color: #22C00F;
	opacity: 0.6;
}

div.mfp_btn {
	width: 90%;
	margin: 0 auto;
	text-align: center;
}

div.mfp_btn button {
	height: 5rem;
	background: none;
	background-color: #22C00F;
	color: #fff;
	border-radius: 3.5rem;
	font-size: 3.4rem;
	width: 90%;
	box-shadow: 0 0.3rem 0.6rem rgba(118, 118, 118, .30);
	border: none;
	text-shadow: none;
}

/* 送信ボタン */
div.mfp_btn button.send {
	background-color: #22C00F;
	margin: 5% 0;
}

div.mfp_btn button.send:hover {
	opacity: 0.6;
}

/* リセットボタン */
div.mfp_btn button.reset {
	background-color: #686868;
}

div.mfp_btn button.reset:hover,
div.mfp_btn button.reset:active {
	opacity: 0.6;
}

.mfp_rows.tel {
	display: flex;
	align-items: center;
}

.mfp_rows.tel .mfp_col3 {
	position: relative;
	display: flex;
	align-items: center;
}

.mfp_rows.tel .mfp_col3 input[type="tel"] {
	width: 90%;
	height: 4rem;
	text-align: center;
	font-size: 3.0rem;
	background: transparent;
}

/* ハイフンのスタイル */
.mfp_rows.tel .mfp_col3:not(:last-child)::after {
	content: '-';
	font-size: 3.4rem;
	padding-left: 1%;
}

form#mailformpro .cal-select {
	font-size: 3.4rem;
	margin-bottom: 1rem;
	font-weight: bold;
}

/* セレクトボックスのカスタマイズ */
select {
	appearance: none;
	/* デフォルトの矢印を非表示 */
	-webkit-appearance: none;
	-moz-appearance: none;
	background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>');
	background-repeat: no-repeat;
	background-position: right 1rem center;
	background-size: 2rem;
}

input[type="date"],
select#mfp_element_51,
select.mfp_element_select-one.mfp_element_all,
.mailform .ar select {
	background-color: white;
	color: black;
	border: 0.1rem solid #1A1A1A;
	width: 100%;
}

input::placeholder {
	color: #999;
	/* プレースホルダーの色を指定 */
	opacity: 1;
	/* Safariでの透明度を調整 */
}

input[type="date"] {
	margin-right: 5%;
	width: 10em;
}

form#mailformpro label.ar {
	width: 13em;
}

form#mailformpro label.cal {
	width: 8em;
}

table#mfp_confirm_table tr th {
	width: 40%;
}

div.mfp_err {
	font-size: 1.6rem;
}


.mfp_element_submit:hover,
.mfp_element_reset:hover,
.mfp_element_button:hover,
button.mfp_next:hover,
button.mfp_prev:hover {
	background: none;
	background-color: #22C00F;
	opacity: 0.6;
}

div.mfp_buttons button {
	height: 5rem;
	background: none;
	background-color: #22C00F;
	color: #fff;
	border-radius: 3.5rem;
	font-size: 3.4rem;
	width: 90%;
	box-shadow: 0 0.3rem 0.6rem rgba(118, 118, 118, .30);
	border: none;
	text-shadow: none;
}

div.mfp_buttons button#mfp_button_send {
	background-color: #22C00F;
	margin: 5% 0;
}

div.mfp_buttons button#mfp_button_send:hover {
	opacity: 0.6;
}

div.mfp_buttons button#mfp_button_cancel {
	background-color: #666;
}

div.mfp_buttons button#mfp_button_cancel:hover {
	opacity: 0.6;
}

div.mfp_buttons button#mfp_button_cancel {
	background-color: #686868;
}

div.mfp_buttons button#mfp_button_cancel:hover {
	opacity: 0.6;
}

div.mfp_buttons button#mfp_button_cancel:active {
	opacity: 0.6;
}

/*================================================================
  footer
================================================================*/
footer {
	background-color: #1e2428;
	margin: 0 auto;
	text-align: center;
	padding: 10% 0 10%;
	color: #1a1a1a;
	margin: 7% 0 0;
	font-size: 2.6rem;
}
footer,
footer a{
	color: #fff;
}

footer div {
	margin-bottom: 2%;
}

footer p {
	font-size: 2.6rem;
}


/* animation keyframes */
.pekopeko {
	animation: pekopeko 2s infinite;
}

@keyframes pekopeko {
	0% {
		box-shadow: 0 0.3rem 0 rgb(0, 0, 0, 0.3);
		top: 0;
	}

	10% {
		box-shadow: 0 0 0 rgb(0, 0, 0, 0.3);
		top: 0.3rem;
	}

	20% {
		box-shadow: 0 0.3rem 0 rgb(0, 0, 0, 0.3);
		top: 0;
	}

	30% {
		box-shadow: 0 0 0 rgb(0, 0, 0, 0.3);
		top: 0.3rem;
	}

	40% {
		box-shadow: 0 0.3rem 0 rgb(0, 0, 0, 0.3);
		top: 0;
	}
}


.reflection {
	display: inline-block;
	position: relative;
	overflow: hidden;
}

.reflection:after {
	content: "";
	height: 100%;
	width: 3rem;
	position: absolute;
	top: -18rem;
	left: 0;
	background-color: #fff;
	opacity: 0;
	-webkit-transform: rotate(45deg);
	-webkit-animation: reflection 2s ease-in-out infinite;
}

@keyframes reflection {
	0% {
		-webkit-transform: scale(0) rotate(45deg);
		opacity: 0;
	}

	80% {
		-webkit-transform: scale(0) rotate(45deg);
		opacity: 0.5;
	}

	81% {
		-webkit-transform: scale(4) rotate(45deg);
		opacity: 1;
	}

	100% {
		-webkit-transform: scale(50) rotate(45deg);
		opacity: 0;
	}
}

body.public-page {
	font-size: 1.7rem;
	background-color: #F4F4F4;
}

.content {
	margin: 0;
}

.entry-content {
	font-size: 1.6rem;
	margin: 0;
}

/*================================================================
  250403
================================================================*/
.treatment-price-img-new {
	margin: 5% 0;
	width: 100%;
	max-width: 100%;
}

.treatment-price-img01 {
	margin: 5% auto 1%;
}

.treatment-wrapper .note-toggle {
	text-align: left;
	padding-right: 0;
}

.treatment-wrapper .note-toggle .toggle-content {
	list-style-type: disc;
}

.toggle-section {
	border-bottom: 0.1rem solid #ddd;
	font-size: 1rem;
}

.toggle-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	cursor: pointer;
	font-weight: bold;
	padding: 0.5rem 0.5rem 0;
	margin-bottom: 0.5rem;
}

.toggle-header:hover {
	opacity: 0.8;
}

.toggle-content {
	display: none;
	padding-left: 2rem;
}

.arrow {
	transition: transform 0.3s;
}

.open .toggle-content {
	display: block;
	padding: 0 2rem 0.5rem;
}

.open .arrow {
	transform: rotate(180deg);
}

/*================================================================
  250403
================================================================*/
.consent-button-container {
	text-align: center;
}

.consent-button {
	display: inline-block;
	padding: 1.2rem 9%;
	background-color: #7b94b1;
	color: white;
	text-decoration: none;
	font-weight: bold;
	border-radius: 3rem;
	text-align: center;
	transition: background-color 0.3s;
	margin: 5% 0 0;
}

.consent-button:hover {
	background-color: #647a93;
}

.consent {
	margin-top: 2rem;
}

.consent p {
	width: 90%;
	margin: 0 auto;
	text-align: center;
}

.cp-monitor {
	content: '';
	background-image: url(../img/monitor-cp-bg.png);
	background-size: cover;
	background-repeat: no-repeat;
	display: block;
	background-position: top;
	padding: 10% 0 20%;
}

.cp-monitor-wrapper {
	width: 95%;
	margin: 0 auto 0;
	background-color: #fff;
	padding-bottom: 2%;
}

.cp-monitor-price {
	margin: 0 auto 5%;
	width: 90%;
	display: block;
}

.cp-monitor-title {
	margin: 0 auto;
	width: 100%;
	display: block;
	transform: translateY(-2rem);
}

.conditions {
	width: 80%;
	margin: 0 auto;
	font-size: 2.8rem;
}

.conditions ul {
	padding: 3% 0 5%;
}

.conditions ul li {
	list-style-type: disc;
}

.conditions .title {
	font-size: 3.2rem;
	font-weight: bold;
	text-align: center;
	position: relative;
	color: #EC2E7D;
}

.conditions .title::before,
.conditions .title::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 3em;
	height: 0.1rem;
	background: #EC2E7D;
}

.conditions .title::before {
	left: 34%;
	transform: translateX(-100%);
}

.conditions .title::after {
	right: 34%;
	transform: translateX(100%);
}
