@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');
@import url('https://use.typekit.net/esu3ubd.css');


/*
	旧設定
*/
#top nav.header_nav {
	display: none;
}

@media only screen and (width <= 768px) {
	.pc_only {
		display: none !important;
	}
	
	.sp_only {
		display: block !important;
	}
}

@media only screen and (width > 768px) {
	.sp_only {
		display: none !important;
	}
}


/*
	共通設定
*/
/* ダイアログ表示/非表示時アニメーション */
@keyframes dialogFadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes dialogFadeOut {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

/* 近くのWEを探す 地域ボタンアニメーション */
@keyframes secMapShine {
	0% {
		opacity: 0;
		translate: -120% -50%;
	}

	33% {
		opacity: 0;
		translate: -120% -50%;
	}

	50% {
		opacity: 1;
		translate: 0 -50%;
	}

	67% {
		opacity: 0;
		translate: 20% -50%;
	}

	100% {
		opacity: 0;
		translate: 20% -50%;
	}
}


.topContents {
	/*
		色
	*/
	/* color */
	--cl-brand01: #004EA2;
	--cl-brand02: #007BC7;
	--cl-brand03: #EC6B81;
	
	--cl-brand01_20: rgb(from var(--cl-brand01) r g b / 0.2);
	--cl-brand01_65: rgb(from var(--cl-brand01) r g b / 0.65);
	
	--cl-gry01: #888888;
	--cl-gry02: #D9D9D9;
	
	--cl-gld01: #B67715;
	--cl-yel01: #A37F00;
	
	--cl-marker01: #FDFF95;
	
	--cl-bg01: #F7FAFF;
	--cl-bg02: #E9F3FF;
	--cl-bg03: #F6F6F1;
	--cl-bgPopup: rgb(from var(--cl-brand01) r g b / 0.5);
	
	--cl-line: #06C755;
	--cl-rakuten: #BF0000;
	--cl-yahoo: #FF0033;
	
	/* linear-gradient */
	--lg-blu01: linear-gradient(45deg, var(--cl-brand01), #009BFA);
	--lg-blu02: linear-gradient(to right, var(--cl-brand01), #379ACC);
	--lg-blu03: linear-gradient(to right, #0251D3, #2CB5FF 30%, #9FFCF9 70%, #D7FFF4);
	--lg-blu04: linear-gradient(45deg, #DCF0FF, #FFFFFF);
	
	--lg-pnk01: linear-gradient(45deg, #FF4767, #FF8C72);
	
	--lg-gld01: linear-gradient(35deg, var(--cl-gld01), #FBDB78 50%, var(--cl-gld01));
	
	
	/*
		フォント
	*/
	/* font-family */
	--ff-basic: 'Noto Sans JP', sans-serif;
	--ff-en: 'futura-pt', 'Noto Sans JP', sans-serif;
	
	/* font-size */
	--fs-basicNum: 14;
	--fs-smallerNum: 12;
	--fs-smallNum: 10;
	--fs-bigNum: 19;
	
	@media (width > 768px) {
		--fs-basicNum: 16;
		--fs-smallerNum: 14;
		--fs-smallNum: 12;
		--fs-bigNum: 28;
	}
	
	--fs-basic: calc(var(--fs-basicNum) * 1px);
	--fs-smaller: calc(var(--fs-smallerNum) * 1px);
	--fs-small: calc(var(--fs-smallNum) * 1px);
	--fs-big: calc(var(--fs-bigNum) * 1px);
	
	/* font-weight */
	--fw-regular: 400;
	--fw-book: 400;
	--fw-medium: 500;
	--fw-bold: 700;
	
	/* letter-spacing */
	--ls-basic: 0.05em;
	
	/* line-height */
	--lh-basic: 2.0;
	--lh-small: 1.3;
	--lh-smaller: 1.8;
	
	
	/*
		幅・余白
	*/
	/* width */
	@media (width <= 768px) {
		--w-designNum: 414;
	}
	@media (width > 768px) {
		--w-contentsNum: 1000;
		--w-contentsNarrowNum: 800;
		--w-contentsWideNum: 1200;
		
		--w-contents: calc(var(--w-contentsNum) * 1px);
		--w-contentsNarrow: calc(var(--w-contentsNarrowNum) * 1px);
		--w-contentsWide: calc(var(--w-contentsWideNum) * 1px);
	}
	
	/* padding */
	--pd-h: 5dvw;
	
	--pd-vSec: 100px;
	--pd-vGroup: 40px;
	--pd-vItem: 24px;
	--pd-vSmall: 10px;
	
	@media (width > 768px) {
		--pd-hNum: 50;
		
		--pd-h: calc(var(--pd-hNum) * 1px);
	
		--pd-vSec: 120px;
		--pd-vGroup: 60px;
		--pd-vItem: 40px;
		--pd-vSmall: 12px;
	}
	
	
	/*
		装飾
	*/
	/* border-radius */
	--br-basic: 12px;
	--br-small: 6px;
	
	@media (width > 768px) {
		--br-basic: 16px;
		--br-small: 8px;
	}
	
	/* box-shadow */
	--bs-basic: 0 0 20px 0 var(--cl-brand01_20);
	--bs-narrow: 0 0 6px 0 var(--cl-brand01_65);
	
	--bs-basic-filter: 0 0 20px var(--cl-brand01_20);
	--bs-narrow-filter: 0 0 6px var(--cl-brand01_65);
	
	/* text-shadow */
	--ts-basic: 0 0 6px var(--cl-brand01_65);
	
	/* transition */
	--tr-basic: all 300ms ease;
	
	--tr-opacity: 0.7;
	
	
	/*
		ノーマライズ
	*/
	/* 全体 */
	color: var(--cl-brand01);
	font-family: var(--ff-basic);
	font-size: var(--fs-basic);
	font-weight: var(--fw-regular);
	line-height: var(--lh-basic);
	
	* {
		border: none;
		margin: 0;
		padding: 0;
		background: none;
		color: inherit;
		font: inherit;
		letter-spacing: var(--ls-basic);
		line-height: inherit;
		text-decoration: none;
	}
	
	.contents {
		min-width: 0;
	}

	/* 画像 */
	img,
	svg {
		display: block;
		width: 100%;
		max-width: 100%;
		height: auto;
	}

	/* ボタン・リンク */
	@media (width > 768px) {
		a,
		button {
			display: block;
			width: 100%;
			cursor: pointer;
			transition: var(--tr-basic);
			transition-property: opacity;

			&:hover {
				opacity: var(--tr-opacity);
			}
		}
	}

	/* ダイアログ */
	dialog {
		--openAnimation: dialogFadeIn both 400ms ease;
		--closeAnimation: dialogFadeOut both 300ms ease;

		width: fit-content;
		margin: auto;
		padding: 0;
		border: none;
		color: inherit;
		font-family: inherit;
		font-size: inherit;
		font-weight: inherit;
		line-height: inherit;

		&::backdrop {
			background: var(--cl-bgPopup);
			animation: var(--openAnimation);
		}
		
		&:not([open]) {
			display: none;
		}

		&[open] {
			animation: var(--openAnimation);

			&.fadeOut {
				animation: var(--closeAnimation);

				&::backdrop {
					animation: var(--closeAnimation);
				}
			}
		}
	}
	
	
	/*
		汎用
	*/
	> :nth-child(n+2) {
		margin-top: var(--pd-vSec);
	}
	
	@media (width <= 768px) {
		.pcOnly {
			display: none;
		}
	}

	@media (width > 768px) {
		.spOnly {
			display: none;
		}
	}
	
	/* 下からふわっと表示アニメーション */
	.fadeInUp {
		--fadeInUp-translate: 0 30px;

		opacity: 0;
		translate: var(--fadeInUp-translate);
		
		&.pseudo {
			opacity: 1;
			translate: 0;
			
			&::before,
			&::after {
				opacity: 0;
				translate: var(--fadeInUp-translate);
			}
		}
	}
	
	.fadeInUpDone {
		&,
		&::before,
		&::after {
			transition: 500ms ease;
			transition-property: opacity, translate;
		}
	}



	/*
		コンテンツ幅
	*/
	.contentsInner {
		width: 100%;
		padding: 0 var(--pd-h);

		@media (width > 768px) {
			--baseWidthNum: var(--w-contentsNum);
			--w-contentsInnerNum: calc(var(--baseWidthNum) + var(--pd-hNum) * 2);

			max-width: calc(var(--w-contentsInnerNum) * 1px);
			margin: 0 auto;

			&.narrow {
				--baseWidthNum: var(--w-contentsNarrowNum);
			}

			&.wide {
				--baseWidthNum: var(--w-contentsWideNum);
			}
		}
	}


	/*
		タイトル
	*/
	/* セクションタイトル */
	.ttlSection {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 19px;
		margin-bottom: 40px;
		color: var(--cl-brand01);
		font-family: var(--ff-en);
		font-size: min(var(--fs-big), calc(var(--fs-bigNum) * 100dvw / var(--w-designNum)));
		font-weight: var(--fw-medium);
		line-height: var(--lh-smaller);
		text-align: center;
		white-space: nowrap;

		@media (width > 768px) {
			gap: 30px;
			margin-bottom: 90px;
			font-size: var(--fs-big);
		}

		&::before,
		&::after {
			content: '';
			flex: 0 0 auto;
			display: block;
			width: 18px;
			aspect-ratio: 18 / 37;
			background: url(/common/images/img_diamond.webp) no-repeat center / contain;

			@media (width > 768px) {
				width: 32px;
			}
		}

		.text {
			flex: 0 0 auto;
			display: block;
		}

		/* 小さめ行 */
		.smaller {
			display: inline-block;
			font-size: min(var(--fs-basic), calc(var(--fs-basicNum) * 100dvw / var(--w-designNum)));
			line-height: var(--lh-basic);

			@media (width > 768px) {
				font-size: var(--fs-basic);
			}
		}
	}

	/* 白ダイヤタイトル */
	.ttlDiamondWht {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		gap: 15px;
		margin-bottom: 20px;
		color: var(--cl-brand01);
		font-family: var(--ff-basic);
		font-size: min(17px, calc(17 * 100dvw / var(--w-designNum)));
		font-weight: var(--fw-bold);
		line-height: var(--lh-smaller);
		white-space: nowrap;

		@media (width > 768px) {
			gap: 24px;
			margin-bottom: 40px;
			font-size: 20px;
		}

		&::before {
			content: '';
			flex: 0 0 auto;
			display: block;
			width: 13px;
			aspect-ratio: 18 / 37;
			background: url(/common/images/img_diamond_line.svg) no-repeat center / contain;

			@media (width > 768px) {
				width: 18px;
			}
		}

		.text {
			flex: 0 0 auto;
			display: block;
		}
	}

	/* グラデ下線タイトル */
	.ttlBorderGrad {
		color: var(--cl-brand01);
		font-family: var(--ff-basic);
		font-size: min(var(--fs-big), calc(var(--fs-bigNum) * 100dvw / var(--w-designNum)));
		font-weight: var(--fw-medium);
		line-height: var(--lh-smaller);
		text-align: center;
		white-space: nowrap;

		@media (width > 768px) {
			font-size: var(--fs-big);
		}

		.border {
			display: inline-block;
			width: fit-content;
			background: var(--lg-blu03) no-repeat center bottom / 100% 3px;
		}

		/* 小さめ行 */
		.smaller {
			display: inline-block;
			font-size: min(var(--fs-basic), calc(var(--fs-basicNum) * 100dvw / var(--w-designNum)));
			line-height: var(--lh-basic);

			@media (width > 768px) {
				font-size: var(--fs-basic);
			}
		}
	}

	/* Our Commitment */
	.ttlCommitment {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 17px;
		font-family: var(--ff-en);
		font-size: 12px;
		font-weight: var(--fw-medium);
		letter-spacing: 0.4em;
		line-height: 1.0;
		text-align: center;
		white-space: nowrap;

		@media (width > 768px) {
			gap: 19px;
			font-size: 20px;
		}

		&::before {
			content: '';
			display: block;
			width: 68px;
			aspect-ratio: 68 / 50;
			background: url(/common/images/logo_we.svg) no-repeat center / contain;

			@media (width > 768px) {
				width: 145px;
			}
		}
	}


	/*
		テキストスタイル
	*/
	/* 本文 */
	.txtBasic {
		font-family: var(--ff-basic);
		font-size: var(--fs-basic);
		font-weight: var(--fw-regular);
		line-height: var(--lh-basic);

		/* 本文・強調 */
		&.strong {
			font-weight: var(--fw-medium);
		}

		/* 本文小さめ */
		&.smaller {
			font-size: var(--fs-smaller);
			line-height: var(--lh-small);

			/* 本文小さめ・強調 */
			&.strong {
				font-weight: var(--fw-medium);
			}
		}
	}

	/* 注釈 */
	.txtSmall {
		font-family: var(--ff-basic);
		font-size: var(--fs-small);
		font-weight: var(--fw-regular);
		line-height: var(--lh-small);

		/* 注釈・強調 */
		&.strong {
			font-weight: var(--fw-bold);
		}
	}

	/* タイトル・強調 */
	.txtTitle {
		font-family: var(--ff-basic);
		font-size: var(--fs-big);
		font-weight: var(--fw-medium);
		line-height: var(--lh-smaller);

		/* タイトル・強調_英語 */
		&.en {
			font-family: var(--ff-en);
		}
	}


	/*
		装飾
	*/
	/* 縦棒 */
	.decoBorder01 {
		--borderHeight: 60px;

		@media (width > 768px) {
			--borderHeight: 100px;
		}

		position: relative;

		&::before {
			content: '';
			display: block;
			width: 1px;
			height: var(--borderHeight);
			margin: 0 auto var(--pd-vItem);
			background: var(--cl-brand01);
		}
		&::after {
			content: '';
			display: block;
			position: absolute;
			left: 50%;
			top: var(--borderHeight);
			width: 3px;
			aspect-ratio: 1;
			background: var(--cl-brand01);
			border-radius: 50%;
			translate: -1px -100%;
		}
	}


	/*
		テキストリンク
	*/
	/* テキストリンク */
	.linkBasic {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		gap: 14px;
		width: fit-content;
		background: linear-gradient(currentColor) no-repeat center bottom / 100% 1px;
		font-family: var(--ff-basic);
		font-size: var(--fs-basic);
		font-weight: var(--fw-medium);
		line-height: var(--lh-basic);
		white-space: nowrap;

		@media (width > 768px) {
			gap: 16px;
		}

		&::after {
			content: '';
			flex: 0 0 auto;
			display: block;
			width: 9px;
			aspect-ratio: 1;
			border: 1px currentColor;
			border-style: solid solid none none;
			clip-path: polygon(0 0, 100% 0, 100% 100%);
			rotate: 45deg;
			translate: -30% 0;
		}

		/* 注釈サイズ */
		&.small {
			padding-bottom: 4px;
			font-size: var(--fs-small);
			font-weight: var(--fw-bold);
			line-height: var(--lh-small);

			&::after {
				width: 7px;
			}
		}

		/* 下矢印 */
		&.down::after {
			margin-left: 5px;
			rotate: 135deg;
			translate: -25% -20%;
		}

		/* 上矢印 */
		&.up::after {
			margin-left: 5px;
			rotate: -45deg;
			translate: -25% 40%;
		}

		/* ？マーク */
		&.qMark {
			&::after {
				width: 14px;
				background: url(/common/images/ico_question.svg) no-repeat center / contain;
				border: none;
				clip-path: none;
				rotate: none;
				translate: none;
			}

			&.small::after {
				width: 12px;
			}
		}
	}


	/*
		ボタン
	*/
	/* 汎用ボタン */
	.btnBasic {
		--height: 56px;

		@media (width > 768px) {
			--height: 64px;
		}

		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		width: 318px;
		max-width: 100%;
		height: var(--height);
		margin: 0 auto;
		background: var(--lg-blu01) no-repeat center / cover;
		border-radius: calc(var(--height) / 2);
		color: #fff;
		font-family: var(--ff-basic);
		font-size: min(var(--fs-basic), calc(var(--fs-basicNum) * 100dvw / var(--w-designNum)));
		font-weight: var(--fw-bold);
		line-height: var(--lh-basic);
		white-space: nowrap;

		@media (width > 768px) {
			width: 366px;
			font-size: var(--fs-basic);
		}

		&::after {
			content: '';
			display: block;
			position: absolute;
			right: 18px;
			top: 50%;
			width: 9px;
			aspect-ratio: 1;
			border: 1px currentColor;
			border-style: solid solid none none;
			rotate: 45deg;
			translate: 0 -50%;

			@media (width > 768px) {
				right: 20px;
			}
		}

		/* CTAボタン */
		&.cta {
			background-image: var(--lg-pnk01);
		}

		/* 濃い色背景ボタン */
		&.darkBg {
			background: rgb(from #fff r g b / 0.2);
			border: 1px solid #fff;
		}

		/* 低優先ボタン */
		&.lowPrio {
			background: #fff;
			border: 1px solid currentColor;
			color: var(--cl-brand01);

			&::before {
				content: none;
				display: block;
				position: absolute;
				left: 30px;
				top: 50%;
				height: 30px;
				background: no-repeat center / contain;
				translate: 0 -50%;

				@media (width > 768px) {
					height: 34px;
				}
			}

			/* 人アイコン */
			&.icoPerson::before {
				content: '';
				aspect-ratio: 1;
				background-image: url(/common/images/ico_person.svg);
			}

			/* ピンアイコン */
			&.icoPin::before {
				content: '';
				aspect-ratio: 24 / 30;
				background-image: url(/common/images/ico_pin.svg);
			}
		}

		/* 外部リンクボタン */
		&.ext {
			--bg: var(--lg-blu01);

			background:
				url(/common/images/ico_window.svg) no-repeat right 18px center / 12px auto,
				var(--bg) no-repeat center / cover;

			@media (width > 768px) {
				background-position:
					right 20px center,
					center;
			}

			&::after {
				content: none;
			}

			/* Amazon */
			&.amazon {
				--bg: linear-gradient(#ff9900);
			}

			/* 楽天 */
			&.rakuten {
				--bg: linear-gradient(var(--cl-rakuten));
			}

			/* Yahoo! */
			&.yahoo {
				--bg: linear-gradient(var(--cl-yahoo));
			}

			/* Qoo10 */
			&.qoo10 {
				--bg: linear-gradient(to right, #FC4231, #B235DC);
			}
		}
	}

	/* 開閉ボタン */
	.btnOpenClose {
		display: block;
		position: relative;
		width: 18px;
		aspect-ratio: 1;
		color: var(--cl-brand01);

		@media (width > 768px) {
			width: 24px;
		}

		&::before,
		&::after {
			content: '';
			display: block;
			position: absolute;
			top: 50%;
			left: 50%;
			width: 100%;
			height: 1px;
			background: currentColor;
			translate: -50% 0;
		}
		&::after {
			rotate: -90deg;
			transition: var(--tr-basic);
			transition-property: rotate;
		}

		.open &::after {
			rotate: 0deg;
		}

		.text {
			display: block;
			width: 1px;
			height: 1px;
			clip-path: inset(50%);
			overflow: hidden;
		}
	}

	/* 閉じるボタン */
	.btnClose {
		display: block;
		position: relative;
		width: 16px;
		aspect-ratio: 1;
		color: var(--cl-brand01);

		@media (width > 768px) {
			width: 20px;
		}

		&::before,
		&::after {
			content: '';
			display: block;
			position: absolute;
			top: 50%;
			left: 50%;
			width: 100%;
			height: 1px;
			background: currentColor;
			rotate: 45deg;
			translate: -50% -50%;
		}
		&::after {
			rotate: -45deg;
		}

		.text {
			display: block;
			width: 1px;
			height: 1px;
			clip-path: inset(50%);
			overflow: hidden;
		}
	}


	/*
		ダイアログ共通パーツ
	*/
	dialog {
		.dialogInner {
			--padV: 60px;

			max-width: calc(100dvw - var(--pd-h) * 2);
			max-height: 90dvh;
			padding: 0 var(--pd-h) var(--padV);
			background: #fff;
			overflow: clip auto;

			@media (width > 768px) {
				--padV: 100px;

				max-width: min(var(--w-contents), calc(100dvw - var(--pd-h) * 2));
			}

			.dialogTopClose {
				position: sticky;
				top: 0;
				right: 0;
				width: 0;
				height: var(--padV);
				margin-left: auto;

				.btn {
					position: absolute;
					top: 20px;
					right: 0;
				}
			}
		}
	}


	/*
		FV下ナビゲーション
	*/
	.layoutPageNavi {
		.itemList {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			align-items: stretch;
			gap: 14px;

			@media (width > 768px) {
				gap: 16px;
			}
		}

		.item {
			color: var(--cl-brand01);

			.button {
				display: flex;
				flex-direction: column;
				justify-content: flex-start;
				align-items: center;
				height: 100%;
				padding: 12px 0;
				background: var(--lg-blu04) no-repeat center / cover;
				border: 1px solid currentColor;
				border-radius: var(--br-small);

				@media (width > 768px) {
					padding: 16px 0;
				}

				&::before {
					content: '';
					display: block;
					width: 100%;
					height: 30px;
					margin-bottom: 12px;
					background: no-repeat center / auto 100%;

					@media (width > 768px) {
						height: 34px;
						margin-bottom: 16px;
					}
				}

				&::after {
					content: '';
					display: block;
					width: 7px;
					aspect-ratio: 1;
					margin-top: 7px;
					border: 1px currentColor;
					border-style: none solid solid none;
					rotate: 45deg;

					@media (width > 768px) {
						margin-top: 9px;
					}
				}

				&.guarantee::before {
					background-image: url("/common/images/ico_guarantee.svg");
				}

				&.person::before {
					background-image: url("/common/images/ico_person.svg");
				}

				&.pin::before {
					background-image: url("/common/images/ico_pin.svg");
				}

				&.qa::before {
					background-image: url("/common/images/ico_qa.svg");
				}

				&.tooth::before {
					background-image: url("/common/images/ico_tooth.svg");
				}

				&.we::before {
					background-image: url("/common/images/ico_we.svg");
				}

				&.yen::before {
					background-image: url("/common/images/ico_yen.svg");
				}

				&.noArrow::after {
					content: none;
				}
			}

			.text {
				display: flex;
				justify-content: center;
				align-items: center;
				font-size: var(--fs-small);
				font-weight: var(--fw-bold);
				line-height: var(--lh-small);
				text-align: center;
				white-space: nowrap;

				@media (width <= 768px) {
					height: calc(var(--fs-small) * var(--lh-small) * 2);
				}

				@media (width > 768px) {
					font-size: var(--fs-smaller);
					font-weight: var(--fw-medium);
				}
			}
		}

		.expandButton {
			margin-top: var(--pd-vItem);

			@media (width > 768px) {
				display: none;
			}

			.button {
				margin: 0 auto;

				&.down .close {
					display: none;
				}

				&.up .more {
					display: none;
				}
			}

			.slash {
				display: inline-block;
				width: 1px;
				height: 1px;
				clip-path: inset(50%);
				overflow: hidden;
			}
		}

		@media (width <= 768px) {
			&:has(.expandButton .button.down) {
				.item:nth-child(n+4) {
					display: none;
				}
			}
		}
	}


	/*
		近くのWEを探す
	*/
	.secMap {
		.contents {
			display: flex;
			flex-direction: column;
			align-items: center;
			gap: var(--pd-vItem);
		}

		.action .slash {
			display: inline-block;
			width: 1px;
			height: 1px;
			clip-path: inset(50%);
			overflow: hidden;
		}

		.mapContainer {
			width: 100%;

			@media (width > 768px) {
				max-width: 700px;
			}
		}

		.map {
			--w: 372;
			--h: 380;

			@media (width > 768px) {
				--w: 512;
				--h: 524;
			}

			position: relative;
			width: 100%;
			aspect-ratio: var(--w) / var(--h);
			background: url("/common/images/img_japan_map.svg") no-repeat center / contain;

			@media (width > 768px) {
				max-width: calc(var(--w) * 1px);
				margin: 0 auto;
			}
		}

		.clinicNum {
			display: flex;
			flex-direction: column;
			align-items: center;
			position: absolute;
			left: calc(45 / var(--w) * 100%);
			top: calc(53 / var(--h) * 100%);

			@media (width > 768px) {
				left: calc(35 / var(--w) * 100%);
				top: calc(82 / var(--h) * 100%);
			}

			&::before {
				content: '';
				display: block;
				width: calc(41 / var(--w-designNum) * 100dvw);
				aspect-ratio: 68 / 50;
				margin-bottom: calc(12 / var(--w-designNum) * 100dvw);
				background: url("/common/images/logo_we.svg") no-repeat center / contain;

				@media (width > 768px) {
					width: 50px;
					margin: 0;
				}
			}

			&::after {
				content: '';
				display: block;
				width: 100%;
				height: calc(3 / var(--w-designNum) * 100dvw);
				background: var(--lg-blu03) no-repeat center / cover;

				@media (width > 768px) {
					height: 3px;
				}
			}

			.text {
				position: relative;
				font-size: calc(var(--fs-bigNum) / var(--w-designNum) * 100dvw);
				font-weight: var(--fw-medium);
				line-height: var(--lh-smaller);

				@media (width > 768px) {
					font-size: var(--fs-big);
				}
			}

			.num {
				font-family: var(--ff-en);
				font-size: calc(40 / var(--w-designNum) * 100dvw);
				line-height: 1.0;
				letter-spacing: 0;

				@media (width > 768px) {
					font-size: 80px;
				}
			}

			.noteMark {
				position: absolute;
				left: 100%;
				top: 25%;
				font-size: calc(var(--fs-smallNum) / var(--w-designNum) * 100dvw);
				line-height: var(--lh-small);

				@media (width > 768px) {
					font-size: var(--fs-small);
				}
			}
		}

		.areaList {
			.area {
				position: absolute;
				width: calc(100 / var(--w) * 100%);
				aspect-ratio: 100 / 30;

				@media (width > 768px) {
					width: calc(120 / var(--w) * 100%);
					aspect-ratio: 120 / 40;
				}

				&[data-target="hokkaido"] {
					left: calc(262 / var(--w) * 100%);
					top: calc(97 / var(--h) * 100%);

					@media (width > 768px) {
						left: calc(365 / var(--w) * 100%);
						top: calc(133 / var(--h) * 100%);
					}
				}

				&[data-target="koshinetsu"] {
					left: calc(173 / var(--w) * 100%);
					top: calc(186 / var(--h) * 100%);

					@media (width > 768px) {
						left: calc(256 / var(--w) * 100%);
						top: calc(262 / var(--h) * 100%);
					}
				}

				&[data-target="kanto"] {
					left: calc(261 / var(--w) * 100%);
					top: calc(237 / var(--h) * 100%);

					@media (width > 768px) {
						left: calc(376 / var(--w) * 100%);
						top: calc(329 / var(--h) * 100%);
					}
				}

				&[data-target="tokai"] {
					left: calc(211 / var(--w) * 100%);
					top: calc(281 / var(--h) * 100%);

					@media (width > 768px) {
						left: calc(303 / var(--w) * 100%);
						top: calc(391 / var(--h) * 100%);
					}
				}

				&[data-target="kansai"] {
					left: calc(167 / var(--w) * 100%);
					top: calc(325 / var(--h) * 100%);

					@media (width > 768px) {
						left: calc(227 / var(--w) * 100%);
						top: calc(453 / var(--h) * 100%);
					}
				}

				&[data-target="chugoku"] {
					left: calc(99 / var(--w) * 100%);
					top: calc(260 / var(--h) * 100%);

					@media (width > 768px) {
						left: calc(132 / var(--w) * 100%);
						top: calc(363 / var(--h) * 100%);
					}
				}

				&[data-target="kyushu"] {
					left: calc(18 / var(--w) * 100%);
					top: calc(305 / var(--h) * 100%);

					@media (width > 768px) {
						left: calc(36 / var(--w) * 100%);
						top: calc(424 / var(--h) * 100%);
					}
				}
			}

			.btn {
				display: flex;
				justify-content: center;
				align-items: center;
				position: relative;
				width: 100%;
				height: 100%;
				background: var(--lg-blu04) no-repeat center / cover;
				border: 1px solid var(--cl-brand01);
				border-radius: calc(21 / var(--w-designNum) * 100dvw);
				font-size: calc(var(--fs-smallerNum) / var(--w-designNum) * 100dvw);
				font-weight: var(--fw-medium);
				white-space: nowrap;
				overflow: hidden;

				@media (width > 768px) {
					border-radius: 21px;
					font-size: var(--fs-smaller);
					font-weight: var(--fw-bold);
					transition-property: background, color;

					&:hover {
						background: linear-gradient(to right, var(--cl-brand01), var(--cl-brand01));
						color: #fff;
						opacity: 1;
					}
				}

				&::after {
					content: '';
					display: block;
					position: absolute;
					left: 50%;
					top: 50%;
					width: 250%;
					height: 150%;
					background: linear-gradient(to bottom, transparent, #fff 45%, #fff 55%, transparent) no-repeat center / cover;
					mix-blend-mode: overlay;
					rotate: 30deg;
					animation: secMapShine 3.5s linear infinite;
				}
			}
		}

		.noteList {
			margin-top: var(--pd-vSmall);
			color: var(--cl-gry01);
			font-size: var(--fs-small);
			line-height: var(--lh-small);
		}

		.prefecturesList {
			position: relative;

			&:has(.active) {
				margin-top: var(--pd-vItem);
			}

			.area {
				position: absolute;
				left: 0;
				top: 0;
				height: 0;
				overflow: hidden;
				opacity: 0;

				&.active {
					position: relative;
					height: auto;
					opacity: 1;
					transition: var(--tr-basic);
					transition-property: opacity;
					transition-delay: 100ms;
					transition-duration: 800ms;
				}
			}

			.areaName {
				display: flex;
				justify-content: center;
				align-items: center;
				background: var(--cl-brand01);
				border-radius: var(--br-small);
				color: #fff;
				font-weight: var(--fw-medium);
			}

			.prefectures {
				margin-top: var(--pd-vItem);
			}

			.list {
				display: grid;
				grid-template-columns: repeat(3, 1fr);
				gap: 10px 40px;

				@media (width > 768px) {
					grid-template-columns: repeat(4, 1fr);
					gap: 24px var(--pd-h);
				}
			}

			.link {
				justify-content: space-between;
				width: 100%;

				&.disabled {
					color: var(--cl-gry01);
				}
			}
		}

		.search {
			width: 100%;
		}
	}


	/*
		よくある質問
	*/
	.secFaq {
		--padH: 18px;
		--padV: 8px;

		@media (width > 768px) {
			--padH: var(--pd-h);
		}

		.faq {
			&:nth-child(n+2) {
				margin-top: var(--pd-vItem);
			}
		}

		.question,
		.aInner {
			display: flex;
			align-items: center;
			gap: var(--padH);
			padding: var(--padV) var(--padH);
		}

		.tag {
			flex: 0 0 auto;
			color: var(--cl-brand02);
			font-family: var(--ff-en);
			font-size: var(--fs-big);
			font-weight: var(--fw-medium);
			line-height: var(--lh-smaller);
		}

		.qText,
		.aContents {
			flex: 1 1 auto;
		}

		.question {
			background: var(--cl-bg01);
			border-radius: var(--br-basic);
			transition: var(--tr-basic);
			transition-property: opacity;

			@media (width > 768px) {
				cursor: pointer;

				&:hover {
					opacity: var(--tr-opacity);
				}
			}

			.button {
				flex: 0 0 auto;

				.btnOpenClose:hover {
					opacity: 1;
				}
			}
		}

		.qText {
			font-weight: var(--fw-medium);
		}

		.answer {
			display: grid;
			grid-template-rows: 0fr;
			transition: var(--tr-basic);
			transition-property: grid-template-rows, margin-top;

			.faq.open & {
				grid-template-rows: 1fr;
				margin-top: var(--pd-vItem);
			}

			.tag {
				color: var(--cl-brand03);
			}
		}

		.aInner {
			align-items: flex-start;
			padding-top: 0;
			padding-bottom: 0;
			overflow: hidden;

			.faq.open & {
				padding-top: var(--padV);
				padding-bottom: var(--padV);
			}
		}
	}


	/*
		監修医師
	*/
	.secDoctors {
		.doctor {
			padding: var(--pd-h);
			border: 1px solid var(--cl-brand01);
			border-radius: var(--br-basic);

			&:nth-child(n+2) {
				margin-top: var(--pd-vItem);
			}

			> :nth-child(n+2) {
				margin-top: var(--pd-vItem);
			}
		}

		.photo {
			max-width: 240px;
			aspect-ratio: 1;
			margin: 0 auto var(--pd-vSmall);
			border-radius: var(--br-basic);
			overflow: hidden;

			@media (width > 768px) {
				max-width: 288px;
			}
		}

		.nameArea {
			display: flex;
			justify-content: center;
			gap: 1.0em;
			font-weight: var(--fw-medium);
		}

		.additional {
			font-size: var(--fs-smaller);
			line-height: var(--lh-small);
		}
	}


	/*
		限定解除要件
	*/
	.secLimited {
		color: var(--cl-gry01);
		font-size: var(--fs-small);
		line-height: var(--lh-small);

		.partTitle {
			&:nth-child(n+2) {
				margin-top: calc(var(--lh-small) * 1em);
			}

			&::before {
				content: '■';
			}
		}

		.itemTitle,
		.itemDetail {
			display: inline;
		}

		.itemTitle {
			&::after {
				content: '：';
			}
		}
	}
	
	
	/*
		追加共通パーツ
	*/
	/* LP7980バナー */
	.bnr7980 {
		aspect-ratio: 366 / 142;

		@media (width > 768px) {
			aspect-ratio: 800 / 236;
		}
	}
	
	/* ページネーション */
	.paginationStyle01 {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 13px;

		> * {
			flex: 0 0 auto;
		}

		.splide__arrow {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 40px;
			aspect-ratio: 1;
			background: #fff;
			border-radius: 50%;

			&::before {
				content: '';
				flex: 0 0 auto;
				display: block;
				width: 10px;
				aspect-ratio: 1;
				border: 1px var(--cl-brand01);
				border-style: solid none none solid;
				rotate: -45deg;
				translate: 20% 0;
			}

			&.splide__arrow--next::before {
				rotate: 135deg;
				translate: -20% 0;
			}

			.text {
				display: inline-block;
				width: 1px;
				height: 1px;
				clip-path: inset(50%);
				overflow: hidden;
			}
		}

		.splide__pagination {
			display: flex;
			gap: 13px;

			> * {
				flex: 0 0 auto;
			}
		}

		.splide__pagination__page {
			width: 8px;
			aspect-ratio: 1;
			background: var(--cl-gry02);
			border-radius: 50%;

			&.is-active {
				background: var(--cl-brand01);
			}
		}
	}
}


/*
	セクション個別設定
*/
/* topMv */
#topMv {
	> :nth-child(n+2) {
		margin-top: var(--pd-vGroup);
	}
	
	.mv {
		--w: 414;
		--h: 618;
		
		@media (width > 768px) {
			--w: 1200;
			--h: 550;
		}

		@media (width <= 768px) {
			.contentsInner {
				padding: 0;
			}
		}

		.container {
			position: relative;
			aspect-ratio: var(--w) / var(--h);
			white-space: nowrap;
			
			@media (width > 768px) {
				border-radius: var(--br-basic);
				overflow: hidden;
			}

			> * {
				position: absolute;
			}
		}

		.catchImage {
			position: static;
		}

		.catchText {
			left: 50%;
			bottom: calc(155 / var(--h) * 100%);
			color: #fff;
			font-size: calc(16 / var(--w-designNum) * 100dvw);
			font-weight: var(--fw-medium);
			line-height: 1.8;
			text-align: right;
			text-shadow: var(--ts-basic);
			translate: -50% 0;
			
			@media (width > 768px) {
				left: calc(113 / var(--w) * 100%);
				bottom: calc(182 / var(--h) * 100%);
				font-size: min(16px, calc(16 / var(--w-contentsWideNum) * 100dvw));
				line-height: 2.0;
				text-align: left;
				translate: none;
			}
		}

		.title {
			left: 50%;
			bottom: calc(98 / var(--h) * 100%);
			color: #fff;
			font-size: calc(16 / var(--w-designNum) * 100dvw);
			font-weight: var(--fw-medium);
			line-height: 1.5;
			text-shadow: var(--ts-basic);
			translate: -50% 0;
			
			@media (width > 768px) {
				left: calc(120 / var(--w) * 100%);
				bottom: calc(140 / var(--h) * 100%);
				font-size: min(19px, calc(19 / var(--w-contentsWideNum) * 100dvw));
				translate: none;
			}

			.bigger {
				font-size: calc(22 / var(--w-designNum) * 100dvw);

				@media (width > 768px) {
					display: inline-block;
					margin-left: 0.1em;
					font-size: min(28px, calc(28 / var(--w-contentsWideNum) * 100dvw));
					letter-spacing: 0;
				}
			}
		}

		.numbers {
			display: flex;
			justify-content: flex-start;
			align-items: flex-end;
			gap: calc(40 / var(--w-designNum) * 100dvw);
			left: calc(43 / var(--w) * 100%);
			bottom: calc(52 / var(--h) * 100%);
			font-family: var(--ff-en);
			font-size: calc(18 / var(--w-designNum) * 100dvw);
			line-height: 1.3;
			
			@media (width > 768px) {
				--contents: calc(var(--w-contentsWideNum) + var(--pd-hNum) * 2);
				
				gap: min(56px, calc(56 / var(--contents) * 100dvw));
				left: calc(370 / var(--w) * 100%);
				bottom: calc(77 / var(--h) * 100%);
				font-size: min(25px, calc(25 / var(--contents) * 100dvw));
				translate: -50% 0;
			}

			.num {
				font-size: calc(28 / var(--w-designNum) * 100dvw);
				font-weight: var(--fw-book);

				@media (width > 768px) {
					font-size: min(40px, calc(40 / var(--contents) * 100dvw));
				}
			}

			.post {
				font-size: calc(20 / var(--w-designNum) * 100dvw);
				font-weight: var(--fw-book);

				@media (width > 768px) {
					font-size: min(28px, calc(28 / var(--contents) * 100dvw));
				}
			}

			.note {
				position: absolute;
				font-size: calc(var(--fs-smallNum) / var(--w-designNum) * 100dvw);

				@media (width > 768px) {
					font-size: min(14px, calc(14 / var(--contents) * 100dvw));
				}
			}
		}

		.clinics,
		.cases {
			flex: 0 0 auto;
			position: relative;
		}

		.noteDetail {
			left: calc(10 / var(--w) * 100%);
			bottom: calc(8 / var(--h) * 100%);
			color: var(--cl-bg02);
			font-size: calc(var(--fs-smallNum) / var(--w-designNum) * 100dvw);
			line-height: var(--lh-small);
			
			@media (width > 768px) {
				left: calc(12 / var(--w) * 100%);
				bottom: calc(9 / var(--h) * 100%);
				font-size: min(var(--fs-small), calc(var(--fs-smallNum) / var(--w-contentsWideNum) * 100dvw));
			}
		}
	}
	
	.newOpens {
		position: relative;
		white-space: nowrap;
		
		&.loading::after {
			content: 'Loading...';
			display: flex;
			justify-content: center;
			align-items: center;
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			background: rgb(from #fff r g b / 0.9);
			font-weight: var(--fw-medium);
		}
		
		.container {
			display: flex;
			flex-direction: column;
			align-items: center;
		}
		
		.link {
			margin-top: var(--pd-vSmall);
		}
	}
	
	.reserve {
		.links {
			display: flex;
			justify-content: center;
			gap: 10px;
			
			@media (width > 768px) {
				gap: var(--pd-h);
			}
		}
		
		.link {
			flex: 1 1 auto;
			width: 0;
			
			@media (width > 768px) {
				flex: 0 0 auto;
				width: auto;
			}
		}
		
		.btn {
			&.line {
				background: var(--cl-line);
			}
		}
	}
	
	.banners {
		.list > :nth-child(n+2) {
			margin-top: var(--pd-vSmall);
			
			@media (width > 768px) {
				margin-top: var(--pd-vItem);
			}
		}
		
		.banner {
			aspect-ratio: 366 / 142;
			
			@media (width > 768px) {
				aspect-ratio: 800 / 236;
			}
		}
	}
}


/* topAbout */
#topAbout {
	padding: var(--pd-vGroup) 0;
	background: url("/images/img_about_bg_sp.webp") no-repeat center top / cover;
	
	@media (width > 768px) {
		padding: var(--pd-vSec) 0;
		background-image: url("/images/img_about_bg_pc.webp");
	}
	
	.secTitle {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: var(--pd-vItem);
		font-family: var(--ff-en);
		font-size: var(--fs-big);
		font-weight: var(--fw-medium);
		line-height: var(--lh-smaller);
		text-align: center;
		
		.en {
			background: var(--lg-blu01) no-repeat center / cover;
			background-clip: text;
			color: transparent;
		}
	}
	
	.catchList {
		margin-top: var(--pd-vItem);
		
		> :nth-child(n+2) {
			margin-top: var(--pd-vItem);
		}
	}
	
	.catch {
		aspect-ratio: 372 / 248;
		border-radius: var(--br-basic);
		overflow: hidden;
		
		@media (width > 768px) {
			aspect-ratio: 1000 / 330;
		}
	}
	
	.message {
		margin-top: var(--pd-vItem);
		font-size: var(--fs-big);
		font-weight: var(--fw-medium);
		line-height: var(--lh-smaller);
		text-align: center;
	}
	
	.effects {
		aspect-ratio: 372 / 396;
		margin-top: var(--pd-vItem);
		border-radius: var(--br-basic);
		overflow: hidden;
		
		@media (width > 768px) {
			aspect-ratio: 1000 / 330;
		}
	}
}


/* topAmbience */
#topAmbience {
	margin: 0;
	padding: var(--pd-vGroup) 0;
	background: url("/images/img_relax_bg_sp.webp") no-repeat center top / cover;
	
	@media (width > 768px) {
		padding: var(--pd-vSec) 0;
		background-image: url("/images/img_relax_bg_pc.webp");
	}
	
	.catch {
		font-size: var(--fs-big);
		font-weight: var(--fw-medium);
		line-height: var(--lh-smaller);
		text-align: center;
	}
	
	.catchDetail {
		max-width: 340px;
		margin: var(--pd-vItem) auto 0;
		text-align: center;
		
		@media (width > 768px) {
			max-width: none;
		}
	}
	
	.images {
		margin: var(--pd-vGroup) calc(var(--pd-h) * -1) 0;
		
		@media (width > 768px) {
			margin: var(--pd-vGroup) 0 0;
		}

		.bottoms {
			margin-top: var(--pd-vItem);
			
			@media (width > 768px) {
				margin-top: var(--pd-vGroup);
			}
		}
	}
	
	.image {
		width: calc(100% - var(--pd-h) * 2);
		aspect-ratio: 372 / 248;
		border-radius: var(--br-basic);
		overflow: hidden;
		
		@media (width > 768px) {
			width: 100%;
			aspect-ratio: 1000 / 330;
		}
	}
}


/* topFeatures */
#topFeatures {
	margin: 0;
	padding: var(--pd-vSec) 0;
	background: url("/images/img_top_bg_sp.webp") no-repeat center top / cover;
	
	@media (width > 768px) {
		background-image: url("/images/img_top_bg_pc.webp");
	}
	
	.achievement {
		.catch {
			font-family: var(--ff-en);
			font-size: var(--fs-big);
			font-weight: var(--fw-medium);
			line-height: var(--lh-smaller);
			
			@media (width > 768px) {
				text-align: center;
			}
			
			.note {
				font-size: var(--fs-small);
				font-weight: var(--fw-regular);
				
				@media (width > 768px) {
					font-size: var(--fs-basic);
				}
			}
		}
		
		.about {
			aspect-ratio: 372 / 254;
			margin-top: var(--pd-vGroup);
			border-radius: var(--br-small);
			overflow: hidden;
			
			@media (width > 768px) {
				aspect-ratio: 800 / 450;
				border-radius: var(--br-basic);
			}
		}
		
		.noteDetail {
			margin-top: var(--pd-vSmall);
			color: var(--cl-gry01);
			font-size: var(--fs-small);
			line-height: var(--lh-small);
		}
	}
	
	.targets {
		margin-top: var(--pd-vGroup);
		
		.catch {
			font-family: var(--ff-en);
			font-size: var(--fs-big);
			font-weight: var(--fw-medium);
			line-height: var(--lh-smaller);
		}
		
		.targetsList {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			gap: var(--pd-vSmall);
			margin-top: var(--pd-vItem);
			
			@media (width > 768px) {
				grid-template-columns: repeat(3, 1fr);
				gap: 24px;
			}
		}
		
		.target {
			aspect-ratio: 181 / 122;
			border-radius: var(--br-small);
			overflow: hidden;
			box-shadow: var(--bs-narrow);
			
			@media (width > 768px) {
				aspect-ratio: 260 / 175;
			}
		}
	}
	
	.reason {
		margin-top: var(--pd-vItem);
		
		@media (width > 768px) {
			margin-top: var(--pd-vGroup);
		}
		
		&::after {
			content: '';
			display: block;
			aspect-ratio: 372 / 272;
			margin-top: var(--pd-vItem);
			background: url("/images/img_top_various_sp.webp") no-repeat center / contain;
			
			@media (width > 768px) {
				aspect-ratio: 1000 / 350;
				margin-top: var(--pd-vGroup);
				background-image: url("/images/img_top_various_pc.webp");
				filter: drop-shadow(var(--bs-basic-filter));
			}
		}
		
		.catch {
			text-align: center;
			font-weight: var(--fw-medium);
			
			.text {
				display: block;
				background: var(--lg-blu01);
				background-clip: text;
				color: transparent;
			}
		}
		
		.numbers {
			max-width: 373px;
			margin: var(--pd-vItem) auto 0;
			
			@media (width > 768px) {
				width: fit-content;
				max-width: none;
			}
			
			.list {
				display: flex;
				justify-content: space-between;
				align-items: flex-end;
				color: var(--cl-gld01);
				font-family: var(--ff-en);
				font-weight: var(--fw-medium);
				text-align: center;
				
				@media (width > 768px) {
					justify-content: center;
					gap: 19px;
					font-size: 20px;
					line-height: 1.3;
				}

				.item {
					flex: 0 0 auto;
					display: flex;
					justify-content: center;
					align-items: center;
					gap: 6px;
					
					@media (width > 768px) {
						&.clinics .title {
							font-size: 26px;
						}
					}

					&::before,
					&::after {
						content: '';
						flex: 0 0 auto;
						display: block;
						width: min(32px, calc(32 / var(--w-designNum) * 100dvw));
						aspect-ratio: 35 / 79;
						background: url("/common/images/img_leaves.svg") no-repeat left center / contain;
						
						@media (width > 768px) {
							width: 48px;
						}
					}

					&::after {
						scale: -1 1;
					}
				}

				.text {
					flex: 0 0 auto;
				}

				.number {
					position: relative;
					line-height: 1.0;
					font-size: min(var(--fs-big), calc(var(--fs-bigNum) / var(--w-designNum) * 100dvw));
					
					@media (width > 768px) {
						font-size: 30px;
					}

					.num {
						display: inline-block;
						font-size: min(40px, calc(40 / var(--w-designNum) * 100dvw));
						letter-spacing: 0;

						@media (width > 768px) {
							font-size: 64px;
						}
					}

					.post {
						display: inline-block;
						font-size: var(--fs-basic);

						@media (width > 768px) {
							font-size: 24px;
						}
					}

					.note {
						position: absolute;
						right: 0;
						top: 10%;
						font-size: var(--fs-small);
						font-weight: var(--fw-bold);

						@media (width > 768px) {
							font-weight: var(--fw-regular);
						}
					}
				}
			}

			.noteDetail {
				margin-top: var(--pd-vSmall);
				color: var(--cl-gry01);
				font-size: var(--fs-small);
				line-height: var(--lh-small);
			}
		}
	}
	
	.dialogRisk {
		--w-image-pc: 540;
		
		.dialogContents {
			> :nth-child(n+2) {
				margin-top: var(--pd-vItem);
			}
			
			.image {
				aspect-ratio: var(--w-image-pc) / 360;
				border-radius: var(--br-small);
				overflow: hidden;
				
				@media (width > 768px) {
					max-width: calc(var(--w-image-pc) * 1px);
					margin-right: auto;
					margin-left: auto;
					border-radius: var(--br-basic);
				}
				
				&.yellow {
					aspect-ratio: 540 / 263;
					border-radius: 0;
				}
			}

			.note {
				color: var(--cl-gry01);
				font-size: var(--fs-small);
				line-height: var(--lh-small);
				
				@media (width > 768px) {
					margin-top: var(--pd-vSmall);
				}
			}
			
			.menuList {
				:nth-child(n+2) {
					margin-top: var(--pd-vItem);
				}
			}
			
			.menuTitle {
				font-size: var(--fs-big);
				font-weight: var(--fw-medium);
				line-height: var(--lh-smaller);
			}
			
			.menuDetail {
				&::before {
					content: '';
					display: block;
					aspect-ratio: var(--w-image-pc) / 360;
					margin-bottom: var(--pd-vItem);
					background: no-repeat center / cover;
					border-radius: var(--br-small);

					@media (width > 768px) {
						max-width: calc(var(--w-image-pc) * 1px);
						margin-right: auto;
						margin-left: auto;
						border-radius: var(--br-basic);
					}
				}
				
				&.reflexology::before {
					background-image: url("/images/img_popup_or.webp");
				}
				
				&.lipSpa::before {
					background-image: url("/images/img_popup_or2.webp");
				}
			}
		}
		
		&#dialogRisk02 {
			.note {
				margin-top: var(--pd-vSmall);
				
				@media (width > 768px) {
					max-width: calc(var(--w-image-pc) * 1px);
					margin-right: auto;
					margin-left: auto;
				}
			}
		}
	}
}


/* topSupport */
#topSupport {
	margin: 0;
	padding-top: var(--pd-vGroup);
	background: url("/images/img_top_technology_sc_sp.webp") no-repeat center top / 100% auto;
	
	@media (width > 768px) {
		padding-top: var(--pd-vSec);
		background-image: url("/images/img_top_technology_sc_pc.webp");
	}
	
	.catch {
		position: relative;
		font-weight: var(--fw-medium);
		text-align: center;
		
		@media (width > 768px) {
			font-size: var(--fs-big);
			line-height: var(--lh-smaller);
		}
		
		&::after {
			content: '';
			display: block;
			position: absolute;
			left: 50%;
			bottom: -30px;
			width: 372px;
			aspect-ratio: 372 / 65;
			background: linear-gradient(to top, #5CBEFF, 18%, transparent 52%, transparent) no-repeat center / cover;
			clip-path: polygon(0 28%, 100% 28%, 50% 100%);
			translate: -50% 0;
			
			@media (width > 768px) {
				top: 100%;
				bottom: auto;
				width: 880px;
				aspect-ratio: 880 / 116;
				background: linear-gradient(to top, #5CBEFF, 20%, transparent 70%, transparent) no-repeat center / cover;
				clip-path: polygon(0 0, 100% 0, 50% 100%);
			}
		}
	}
	
	.main {
		margin-top: var(--pd-vItem);
		font-size: var(--fs-big);
		font-weight: var(--fw-medium);
		line-height: var(--lh-smaller);
		text-align: center;
		
		@media (width > 768px) {
			margin-top: var(--pd-vSec);
		}
	}
	
	.image {
		aspect-ratio: 372 / 234;
		margin-top: 69px;
		
		@media (width > 768px) {
			aspect-ratio: 804 / 432;
			margin-top: var(--pd-vSec);
		}
	}
}


/* topDiagnose */
#topDiagnose {
	.container {
		padding: var(--pd-h);
		background: var(--lg-blu04) no-repeat center / cover;
		border-radius: var(--br-basic);
	}
	
	.details {
		margin: 0 calc(var(--pd-h) * -1);
		
		.splide__track {
			overflow: clip visible;
		}
		
		.bottoms {
			margin-top: var(--pd-vItem);
		}
	}
	
	.detail {
		width: 220px;
		aspect-ratio: 220 / 270;
		background: #fff;
		border-radius: var(--br-small);
		text-align: center;
		overflow: hidden;
		box-shadow: var(--bs-basic);
		
		@media (width > 768px) {
			display: flex;
			flex-direction: column;
			width: 300px;
			aspect-ratio: 300 / 345;
		}
		
		&::before {
			content: '';
			display: block;
			aspect-ratio: 220 / 130;
			background: no-repeat center / cover;
			
			@media (width > 768px) {
				flex: 0 0 auto;
				aspect-ratio: 300 / 178;
			}
		}
		
		&.color::before {
			background-image: url("/images/img_measurement_card_sp.webp");
			
			@media (width > 768px) {
				background-image: url("/images/img_measurement_card_pc.webp");
			}
		}
		
		&.simulation::before {
			background-image: url("/images/img_simulation_card_sp.webp");
			
			@media (width > 768px) {
				background-image: url("/images/img_simulation_card_pc.webp");
			}
		}
		
		&.microscope::before {
			background-image: url("/images/img_microscope_card_sp.webp");
			
			@media (width > 768px) {
				background-image: url("/images/img_microscope_card_pc.webp");
			}
		}
		
		.textArea {
			margin-top: var(--pd-vSmall);
			padding: 0 10px;
			
			@media (width > 768px) {
				flex: 1 0 auto;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				margin: 0;
			}
		}
		
		.title {
			font-weight: var(--fw-medium);
			
			@media (width > 768px) {
				line-height: 1.2;
			}
		}
		
		.text {
			margin-top: var(--pd-vSmall);
			font-size: var(--fs-smaller);
			line-height: var(--lh-small);
		}
	}
	
	.description {
		margin-top: var(--pd-vGroup);
		text-align: center;
		
		&::after {
			content: '';
			display: block;
			aspect-ratio: 330 / 220;
			margin-top: var(--pd-vItem);
			background: url("/images/img_non_counseling_sp.webp") no-repeat center / cover;
			border-radius: var(--br-basic);
			
			@media (width > 768px) {
				aspect-ratio: 900 / 400;
				background-image: url("/images/img_non_counseling_pc.webp");
			}
		}
	}
	
	.reserve {
		margin-top: var(--pd-vItem);
	}
	
	.banner {
		margin-top: var(--pd-vItem);
	}
}


/* topMenu */
#topMenu {
	padding: var(--pd-vGroup) 0;
	background: url("/images/img_top_bg_sp.webp") no-repeat center top / cover;
	
	@media (width > 768px) {
		padding: var(--pd-vSec) 0;
		background-image: url("/images/img_top_bg_pc.webp");
	}
	
	.we {
		padding: 1px;
		background: var(--lg-gld01) no-repeat center / cover;
		border-radius: var(--br-basic);
		overflow: hidden;
		box-shadow: var(--bs-basic);
		
		.inner {
			padding-bottom: 35px;
			background: #fff;
			border-radius: var(--br-basic);
			overflow: hidden;
			
			@media (width > 768px) {
				padding-bottom: var(--pd-vItem);
			}
		}
		
		.detail {
			aspect-ratio: 372 / 627;
			
			@media (width > 768px) {
				aspect-ratio: 800 / 725;
			}
		}
		
		.more {
			margin-top: 32px;
			padding: 0 var(--pd-h);
			
			@media (width > 768px) {
				margin-top: var(--pd-vItem);
			}
		}
	}
	
	.about {
		margin-top: var(--pd-vGroup);
		
		@media (width > 768px) {
			text-align: center;
		}
	}
	
	.services {
		margin-top: var(--pd-vItem);
		
		@media (width <= 768px) {
			> :nth-child(n+2) {
				margin-top: var(--pd-vItem);
			}
		}
		@media (width > 768px) {
			display: grid;
			grid-template-columns: 1fr 1fr;
			gap: 24px 20px;
		}
	}
	
	.service {
		aspect-ratio: 372 / 155;
		border-radius: var(--br-small);
		overflow: hidden;
		box-shadow: var(--bs-basic);
		
		@media (width > 768px) {
			aspect-ratio: 390 / 160;
		}
	}
}


/* topMap */
#topMap {
}


/* topNewOpens */
@keyframes dotAnimation1st {
	0% {
		visibility: hidden;
	}
	
	24.9% {
		visibility: hidden;
	}
	
	25% {
		visibility: visible;
	}
	
	100% {
		visibility: visible;
	}
}

@keyframes dotAnimation2nd {
	0% {
		visibility: hidden;
	}
	
	49.9% {
		visibility: hidden;
	}
	
	50% {
		visibility: visible;
	}
	
	100% {
		visibility: visible;
	}
}

@keyframes dotAnimation3rd {
	0% {
		visibility: hidden;
	}
	
	74.9% {
		visibility: hidden;
	}
	
	75% {
		visibility: visible;
	}
	
	100% {
		visibility: visible;
	}
}

#topNewOpens {
	.contentsInner {
		@media (width <= 768px) {
			&.pc {
				padding: 0;
			}
		}
		
		@media (width > 768px) {
			&.sp {
				max-width: none;
				padding: 0;
			}
		}
	}
	
	.dotAnimation > .dot {
		margin-left: 0.3em;
		animation-duration: 2000ms;
		animation-iteration-count: infinite;

		&:nth-child(1) {
			animation-name: dotAnimation1st;
		}
		&:nth-child(2) {
			animation-name: dotAnimation2nd;
		}
		&:nth-child(3) {
			animation-name: dotAnimation3rd;
		}
	}

	.secTitle {
		background: var(--lg-blu01) no-repeat center / cover;
		background-clip: text;
		color: transparent;
		font-family: var(--ff-en);
		font-weight: var(--fw-medium);
		line-height: 1.5;
		text-align: center;
		text-transform: uppercase;

		@media (width > 768px) {
			font-size: 30px;
		}
	}

	.loadingArea {
		position: relative;
	}

	.loading {
		display: flex;
		justify-content: center;
		align-items: center;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: rgba(255, 255, 255, 0.8);
		z-index: 1000;
	}

	.info {
		display: flex;
		justify-content: center;
		align-items: flex-end;
		gap: 1.0em;
		width: fit-content;
		margin: 0 auto;
		padding-bottom: 5px;
		background: var(--lg-blu03) no-repeat center bottom / 100% 3px;
		font-size: 16px;
		font-weight: var(--fw-medium);
		line-height: 1.3;

		@media (width <= 768px) {
			&:not(:has(.number)) {
				margin-top: 10px;
			}

			.number .num {
				font-size: 24px;
			}
		}
		@media (width > 768px) {
			margin-top: 20px;
			padding: 0;
			font-size: 28px;
			line-height: var(--lh-smaller);
		}

		> * {
			flex: 0 0 auto;
		}
	}

	.clinics {
		margin-top: 30px;

		@media (width > 768px) {
			margin-top: 60px;
		}

		&.splide {
			visibility: visible;
		}

		.splide__track {
			overflow: clip visible;
		}

		&:not(.is-overflow):not(.uni) .splide__list {
			justify-content: center;
		}
	}

	.clinic {
		width: 100%;
		max-width: 220px;
		background: #fff;
		border-radius: var(--br-small);
		font-weight: var(--fw-medium);
		line-height: 1.5;
		overflow: hidden;
		box-shadow: var(--bs-basic);

		.photoArea {
			position: relative;
		}

		.pref {
			display: flex;
			justify-content: center;
			align-items: center;
			position: absolute;
			left: 9px;
			top: 12px;
			height: 24px;
			padding: 0 12px;
			background: var(--cl-bg02);
			border: 1px solid currentColor;
			border-radius: 12px;
			font-size: 12px;
		}

		.photo {
			aspect-ratio: 220 / 130;
			background: url("/images/img_clinic_default.webp") no-repeat center / cover;

			.noImage {
				display: block;
				position: absolute;
				width: 1px;
				height: 1px;
				clip-path: inset(100%);
				overflow: hidden;
			}

			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}
		}

		.textArea {
			padding: 14px;
		}

		.name {
			font-size: 16px;
		}

		.open {
			margin-top: 5px;
			color: var(--cl-gry01);
			font-size: 12px;
			text-transform: uppercase;
		}

		.links {
			display: grid;
			grid-template-columns: 1fr 1fr;
			gap: 12px;
			margin-top: 9px;

			a {
				display: flex;
				justify-content: center;
				align-items: center;
				position: relative;
				height: 46px;
				padding: 0 25px;
				background: linear-gradient(to right, #DCF0FF 0%, #fff 100%) no-repeat center / cover;
				border: 1px solid currentColor;
				border-radius: 23px;
				font-size: 12px;
				font-weight: var(--fw-bold);
				text-decoration: none;

				&.reserve {
					background-image: var(--lg-pnk01);
					border: none;
					color: #fff;
				}

				&::after {
					content: '';
					display: block;
					position: absolute;
					right: 14px;
					top: 50%;
					width: 0.65em;
					aspect-ratio: 1;
					border: 1px currentColor;
					border-style: solid solid none none;
					translate: 0 -50%;
					rotate: 45deg;
				}
			}
		}
	}

	.near {
		margin-top: 30px;

		@media (width > 768px) {
			margin-top: 60px;
		}

		a {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 100%;
			height: 45px;
			border: 1px solid currentColor;
			border-radius: var(--br-small);
			font-weight: var(--fw-bold);
			font-size: 12px;
			line-height: 1.4;
			text-decoration: none;

			@media (width > 768px) {
				max-width: 366px;
				height: 64px;
				margin: 0 auto;
				font-size: 14px;
			}

			&::before {
				content: '';
				flex: 0 0 auto;
				display: block;
				width: 17px;
				aspect-ratio: 17 / 21;
				margin-right: 12px;
				background: url("/images/ico_pin.svg") no-repeat center / contain;

				@media (width > 768px) {
					width: 24px;
					margin-right: 16px;
				}
			}
		}
	}
}


/* topSystem */
#topSystem {
	.secTitle {
		margin: 0 auto;
		
		@media (width <= 768px) {
			max-width: 318px;
		}
		
		&::before {
			content: '';
			display: block;
			aspect-ratio: 158 / 121;
			margin-bottom: -2%;
			background: url("/images/img_nonok.webp") no-repeat center bottom / contain;
			
			@media (width > 768px) {
				max-width: 360px;
				margin: 0 auto -2%;
			}
		}
		
		.bg {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			aspect-ratio: 318 / 120;
			background: url("/images/img_pentagon_sp.svg") no-repeat center top / contain;
			color: #fff;
			font-size: var(--fs-big);
			font-weight: var(--fw-medium);
			line-height: var(--lh-smaller);
			
			@media (width > 768px) {
				aspect-ratio: 800 / 132;
				background-image: url("/images/img_pentagon_pc.svg");
			}
		}
		
		.pre,
		.main {
			display: block;
		}
		
		.pre {
			font-size: var(--fs-basic);
			line-height: var(--lh-basic);
		}
	}
	
	.systems {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: var(--pd-vItem);
		margin-top: var(--pd-vGroup);
	}
	
	.system {
		display: flex;
		flex-direction: column;
		border: 1px solid var(--cl-brand01);
		border-radius: var(--br-basic);
		overflow: hidden;
		
		.title {
			flex: 0 0 auto;
			display: flex;
			justify-content: center;
			align-items: center;
			width: 100%;
			min-height: 36px;
			background: var(--lg-blu01) no-repeat center / cover;
			color: #fff;
			font-size: min(17px, calc(17 / var(--w-designNum) * 100dvw));
			font-weight: var(--fw-medium);
			line-height: 1.5;
			white-space: nowrap;
			
			@media (width > 768px) {
				min-height: 65px;
				font-size: var(--fs-big);
				line-height: var(--lh-smaller);
			}
		}
		
		.detail {
			flex: 1 0 auto;
			display: flex;
			flex-direction: column;
			align-items: center;
			width: 100%;
			padding: 20px 0 10px;
			background: var(--lg-blu04);
			
			@media (width > 768px) {
				padding: 30px 0 25px;
			}

			.text {
				flex: 1 0 auto;
				display: flex;
				flex-direction: column;
				justify-content: center;
				font-size: 16px;
				font-weight: var(--fw-medium);
				line-height: 1.5;
				text-align: center;
				
				@media (width > 768px) {
					font-size: 20px;
					line-height: var(--lh-basic);
				}

				.pre,
				.main {
					display: block;
				}

				.pre {
					font-size: 12px;
					
					@media (width > 768px) {
						font-size: var(--fs-basic);
					}
				}
			}

			.link {
				flex: 0 0 auto;
				margin-top: 15px;
				
				@media (width > 768px) {
					margin-top: 30px;
					
					a {
						font-size: var(--fs-basic);
						font-weight: var(--fw-medium);
						line-height: var(--lh-basic);
						
						&::before {
							width: 9px;
						}
					}
				}
			}
		}
	}
}


/* topFaq */
#topFaq {
	.aContents > :nth-child(n+2) {
		margin-top: var(--pd-vItem);
	}
	
	.flows {
		> :nth-child(n+2) {
			margin-top: var(--pd-vItem);
		}
		
		.title {
			&::before {
				content: '【';
			}
			
			&::after {
				content: '】';
			}
		}
		
		.detail {
			margin-top: var(--pd-vItem);
		}
		
		.step {
			--pd: 34px;
			
			display: flex;
			flex-wrap: wrap;
			align-items: flex-start;
			gap: 0 18px;
			position: relative;
			padding: 8px;
			background: var(--cl-bg01);
			border-radius: var(--br-basic);
			
			@media (width > 768px) {
				align-items: center;
				gap: var(--pd-vSmall) var(--pd-h);
				padding: var(--pd-h) 18px;
			}
			
			&:nth-child(n+2) {
				margin-top: var(--pd);
				
				&::before {
					content: '';
					display: block;
					position: absolute;
					left: 50%;
					bottom: calc(100% + var(--pd) / 2);
					width: 0;
					height: 0;
					border-color: var(--cl-brand02) transparent;
					border-width: 8px;
					border-style: solid solid none;
					translate: -50% 50%;
				}
			}
			
			&::after {
				content: '';
				flex: 0 0 auto;
				display: block;
				width: 100px;
				aspect-ratio: 1;
				background: no-repeat center / cover;
				border-radius: var(--br-small);
				
				@media (width > 768px) {
					width: 152px;
					aspect-ratio: 152 / 100;
				}
			}
		}
		
		.textArea {
			flex: 1 1 auto;
			width: 0;
		}
		
		.num {
			font-family: var(--ff-en);
			font-size: var(--fs-big);
			font-weight: var(--fw-medium);
			line-height: var(--lh-smaller);
		}
		
		.text {
			font-size: var(--fs-smaller);
			line-height: var(--lh-small);
			
			@media (width > 768px) {
				font-size: var(--fs-basic);
				line-height: var(--lh-basic);
			}
		}
		
		.option {
			margin-top: var(--pd-vSmall);
			color: var(--cl-gry01);
			font-size: var(--fs-small);
			line-height: var(--lh-small);
		}
		
		.yellow {
			flex: 0 0 auto;
			order: 10;
			display: flex;
			justify-content: flex-start;
			align-items: center;
			gap: 10px;
			width: 100%;
			
			.image {
				flex: 0 0 auto;
				width: 150px;
				aspect-ratio: 150 / 92;
			}
			
			.text {
				font-size: var(--fs-basic);
				line-height: var(--lh-basic);
				
				@media (width <= 768px) {
					max-width: 110px;
				}
			}
		}
		
		.ow .step {
			&:nth-child(1)::after {
				background-image: url("/images/img_owflow-01_sp.webp");
				
				@media (width > 768px) {
					background-image: url("/images/img_owflow-01_pc.webp");
				}
			}
			
			&:nth-child(2)::after,
			&:nth-child(4)::after {
				background-image: url("/images/img_owflow-02_sp.webp");
				
				@media (width > 768px) {
					background-image: url("/images/img_owflow-02_pc.webp");
				}
			}
			
			&:nth-child(3)::after {
				background-image: url("/images/img_owflow-03_sp.webp");
				
				@media (width > 768px) {
					background-image: url("/images/img_owflow-03_pc.webp");
				}
			}
		}
		
		.hw .step {
			&:nth-child(1)::after {
				background-image: url("/images/img_hwflow-01_sp.webp");
				
				@media (width > 768px) {
					background-image: url("/images/img_hwflow-01_pc.webp");
				}
			}
			
			&:nth-child(2)::after {
				background-image: url("/images/img_hwflow-02_sp.webp");
				
				@media (width > 768px) {
					background-image: url("/images/img_hwflow-02_pc.webp");
				}
			}
			
			&:nth-child(3)::after {
				background-image: url("/images/img_hwflow-03_sp.webp");
				
				@media (width > 768px) {
					background-image: url("/images/img_hwflow-03_pc.webp");
				}
			}
			
			&:nth-child(4)::after {
				background-image: url("/images/img_hwflow-04_sp.webp");
				
				@media (width > 768px) {
					background-image: url("/images/img_hwflow-04_pc.webp");
				}
			}
		}
	}
	
	.noteList {
		color: var(--cl-gry01);
		font-size: var(--fs-small);
		line-height: var(--lh-small);
	}
	
	.link {
		width: fit-content;
		margin-right: auto;
		margin-left: auto;
	}
}


/* topDoctor */
#topDoctor {
}


/* topInformation */
#topInformation {
	padding: 50px 0;
	background: var(--cl-bg01);
	
	@media (width > 768px) {
		padding: 100px 0;
	}
	
	.secTitle {
		text-align: center;
		
		.en {
			font-family: var(--ff-en);
			font-size: 29px;
			font-weight: var(--fw-medium);
			line-height: var(--lh-smaller);
		}
	}
	
	.container {
		margin: var(--pd-vItem) auto 0;
		padding: var(--pd-h);
		background: #fff;
	}
	
	iframe {
		display: block;
		width: 100%;
		height: 100%;
		margin-bottom: -5px;
		overflow: hidden;
	}
}


/* topMovie */
#topMovie {
	.secTitle {
		text-align: center;
		
		.en {
			font-family: var(--ff-en);
			font-size: 29px;
			font-weight: var(--fw-medium);
			line-height: var(--lh-smaller);
		}
	}
	
	.movies {
		max-width: 660px;
		margin: var(--pd-vItem) auto 0;
	}
	
	.movie {
		&:nth-child(n+2) {
			margin-top: var(--pd-vItem);
		}
		
		&.cm {
			.btn {
				aspect-ratio: 660 / 370;
			}
		}
		
		&.making {
			.btn {
				aspect-ratio: 660 / 370;
				border: 1px solid var(--cl-gry02);
			}
		}
	}
	
	.catch {
		margin-bottom: var(--pd-vItem);
		font-size: var(--fs-big);
		font-weight: var(--fw-medium);
		line-height: var(--lh-smaller);
		text-align: center;
	}
	
	.dialogMovie {
		.movie {
			display: block;
			width: 660px;
			aspect-ratio: 16 / 9;
			max-width: 100%;
			
			&#movieMaking {
				border: 1px solid var(--cl-gry02);
			}
		}
	}
}


/* topLimited */
#topLimited {
}


/* topFooterContents */
#topFooterContents {
	@media (width > 768px) {
		display: flex;
		flex-direction: column;
		
		> :not(dialog) {
			width: 100%;
		}
	}
	
	> :nth-child(n+2):not(dialog) {
		margin-top: var(--pd-vGroup);
	}
	
	.recruit {
		@media (width <= 768px) {
			.contentsInner {
				padding: 0;
			}
		}
		@media (width > 768px) {
			.splide__list {
				display: flex;
				gap: 15px;
			}
		}
		
		.banner {
			width: 70dvw;
			aspect-ratio: 520 / 94;
			
			@media (width > 768px) {
				flex: 1 1 auto;
				width: 100%;
				aspect-ratio: 255 / 46;
			}
		}
	}
	
	.sns {
		@media (width > 768px) {
			order: 1;
		}
		
		.list {
			display: flex;
			justify-content: center;
			align-items: center;
			gap: var(--pd-h);
		}
		
		.sns {
			flex: 0 0 auto;
			
			&.ig {
				width: 12.5dvw;
				aspect-ratio: 1;
				
				@media (width > 768px) {
					width: 40px;
				}
			}
			
			&.youtube {
				width: 16.7dvw;
				aspect-ratio: 214 / 150;
				
				@media (width > 768px) {
					width: 52px;
				}
			}
		}
	}
	
	.ec {
		.banner {
			aspect-ratio: 318 / 100;
			border-radius: var(--br-small);
			overflow: hidden;
			
			@media (width > 768px) {
				aspect-ratio: 800 / 222;
				border-radius: var(--br-basic);
			}
		}
	}
}

#dialogRecruit {
	.dialogInner {
		background: var(--cl-bg02);
	}

	.links > :nth-child(n+2) {
		margin-top: var(--pd-vItem);
	}
	
	.link {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 280px;
		max-width: 100%;
		height: 70px;
		border: 1px solid #fff;
		border-radius: var(--br-small);
		color: #fff;
		font-size: var(--fs-big);
		font-weight: var(--fw-medium);
		line-height: var(--lh-smaller);
		
		&.career {
			background: #05b9b3;
		}
		
		&.new {
			background: #c2a682;
		}
	}
}

#dialogEc {
	.text {
		text-align: center;
	}
	
	.links {
		display: grid;
		grid-template-columns: repeat(auto-fill, 151px);
		justify-content: center;
		gap: 15px;
		width: 318px;
		max-width: 100%;
		margin-top: var(--pd-vItem);
		
		@media (width > 768px) {
			grid-template-columns: repeat(2, 1fr);
			gap: var(--pd-vItem) var(--pd-vGroup);
			width: 100%;
			margin-top: var(--pd-vGroup);
		}
	}
}


/* topFixedBottom */
#topFixedBottom {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	margin: 0;
	z-index: 9999;
	
	@media (width > 768px) {
		display: none;
	}

	.reserve {
		display: flex;
		align-items: stretch;

		.btn {
			flex: 1 1 auto;
			width: 100%;
			
			&.web .link {
				background-image: var(--lg-pnk01);
				
				&::before {
					aspect-ratio: 35 / 30;
					background-image: url("/images/ico_calendar.svg");
				}
			}
		}

		.link {
			display: flex;
			justify-content: center;
			align-items: center;
			gap: 12px;
			min-height: 52px;
			background: var(--lg-blu01) no-repeat center / cover;
			border-radius: var(--br-basic) var(--br-basic) 0 0;
			color: #fff;
			font-size: 20px;
			font-weight: var(--fw-bold);
			white-space: nowrap;
			overflow: hidden;

			&::before {
				content: '';
				flex: 0 0 auto;
				display: block;
				width: auto;
				height: 30px;
				aspect-ratio: 1;
				background: url("/images/ico_phone.svg") no-repeat center / contain;
			}
		}
	}
	
	.line {
		position: absolute;
		right: 6px;
		bottom: calc(100% + 22px);
		opacity: 0;
		visibility: hidden;
		transition: var(--tr-basic);
		transition-property: opacity, visibility;
		
		&.show {
			opacity: 1;
			visibility: visible;
		}
		
		.close {
			position: absolute;
			top: 0;
			right: -5px;
			width: 30px;
			aspect-ratio: 1;
			background: #fff;
			border: 1px solid currentColor;
			border-radius: 50%;
			translate: 0 -66.6%;

			&::before,
			&::after {
				content: '';
				display: block;
				position: absolute;
				top: 50%;
				left: 50%;
				width: 60%;
				height: 1px;
				background: currentColor;
				rotate: 45deg;
				translate: -50% -50%;
			}

			&::after {
				rotate: -45deg;
			}
			
			.text {
				display: block;
				width: 1px;
				height: 1px;
				clip-path: inset(50%);
				overflow: hidden;
			}
		}
		
		.link {
			display: block;
			width: 186px;
			aspect-ratio: 186 / 52;
			border-radius: var(--br-small);
			overflow: hidden;
		}
	}
}