/*
Theme Name: vbc2025-04
Version: 1.0
/wp-content/themes/vbc2025-04/
*/

@charset "UTF-8";

/*====================
ローディングアニメーション
====================*/
/* 1 */
@keyframes loading-overlay {
	0% {
		opacity: 1;
	}

	75% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

/* 2 */
@keyframes loading-background-change {
	0% {
		background-color: #fff;
	}

	20% {
		background-color: #F4F0ED;
	}

	100% {
		background-color: #fff;
	}
}

/* 3 */
@keyframes logo-mask-reveal {
	0% {
		mask-position: 100% 0%;
		-webkit-mask-position: 100% 0%;
		opacity: 0.15;
		transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0);
	}

	3% {
		/* すぐに本格的な表示開始 */
		opacity: 0.4;
		transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0);
	}

	8% {
		/* スムーズに濃くなる */
		opacity: 0.65;
		transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0);
	}

	15% {
		/* さらに濃く */
		opacity: 0.8;
		transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0);
	}

	30% {
		/* ほぼ完全表示 */
		opacity: 0.95;
		transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0);
	}

	45% {
		/* 完全表示開始 */
		mask-position: 0% 0%;
		-webkit-mask-position: 0% 0%;
		opacity: 1;
		transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0);
	}

	75% {
		mask-position: 0% 0%;
		-webkit-mask-position: 0% 0%;
		opacity: 1;
		transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0);
	}

	100% {
		mask-position: 0% 0%;
		-webkit-mask-position: 0% 0%;
		opacity: 0;
		transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0);
	}
}

/* 4 iOS Safari用フォールバック */
@keyframes logo-simple-fade {
	0% {
		opacity: 0.15;
		/* 最初から薄く見える */
		transform: translate3d(0, 0, 0) scale(0.95);
		-webkit-transform: translate3d(0, 0, 0) scale(0.95);
	}

	5% {
		/* すぐに濃くなり始める */
		opacity: 0.5;
		transform: translate3d(0, 0, 0) scale(0.98);
		-webkit-transform: translate3d(0, 0, 0) scale(0.98);
	}

	15% {
		/* 早めに完全表示 */
		opacity: 1;
		transform: translate3d(0, 0, 0) scale(1);
		-webkit-transform: translate3d(0, 0, 0) scale(1);
	}

	75% {
		/* 静止時間は維持 */
		opacity: 1;
		transform: translate3d(0, 0, 0) scale(1);
		-webkit-transform: translate3d(0, 0, 0) scale(1);
	}

	100% {
		opacity: 0;
		transform: translate3d(0, 0, 0) scale(1.1);
		-webkit-transform: translate3d(0, 0, 0) scale(1.1);
	}
}

/* 5 */
@keyframes loading-container-fade {
	0% {
		mask-position: 0% 0%;
		-webkit-mask-position: 0% 0%;
		opacity: 1;
	}

	90% {
		mask-position: 100% 100%;
		-webkit-mask-position: 100% 100%;
		opacity: 1;
	}

	100% {
		mask-position: 100% 100%;
		-webkit-mask-position: 100% 100%;
		opacity: 0;
	}
}

/* ローディング画面の基本スタイル */
.p-top__loading {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 99999;
	/* iPhone最適化追加 */
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	mask-image: none;
	-webkit-mask-image: none;
	animation:
		loading-background-change 3.5s ease-in-out forwards,
		loading-container-fade 3.5s ease-in-out forwards;
	animation-play-state: paused;
	will-change: transform, opacity, background-color, mask-position;
}

.p-top__loading.animate-in {
	mask-image: linear-gradient(315deg,
			rgba(0, 0, 0, 0) 0%,
			rgba(0, 0, 0, 0) 40%,
			rgba(0, 0, 0, 0.1) 45%,
			rgba(0, 0, 0, 0.8) 50%,
			rgba(0, 0, 0, 1) 55%,
			rgba(0, 0, 0, 1) 100%);
	-webkit-mask-image: linear-gradient(315deg,
			rgba(0, 0, 0, 0) 0%,
			rgba(0, 0, 0, 0) 40%,
			rgba(0, 0, 0, 0.1) 45%,
			rgba(0, 0, 0, 0.8) 50%,
			rgba(0, 0, 0, 1) 55%,
			rgba(0, 0, 0, 1) 100%);

	mask-size: 200% 200%;
	-webkit-mask-size: 200% 200%;
	mask-position: 0% 0%;
	-webkit-mask-position: 0% 0%;
}

/* iOS Safari用フォールバック（タイミング同じ） */
@supports not ((-webkit-mask-image: linear-gradient(to right, black, black)) or (mask-image: linear-gradient(to right, black, black))) {
	.p-top__logo {
		display: block !important;
		visibility: visible !important;
		position: relative !important;
		z-index: 10 !important;
	}
}

.p-top__loading.animate-in .p-top__logo {
	animation: none !important;
	animation-play-state: paused !important;
	mask: none !important;
	-webkit-mask: none !important;
}

/* ロゴコンテナ */
.p-top__loading__inner {
	position: relative;
	z-index: 3;
	max-width: 200px;
	width: 100%;
	/* iPhone最適化追加 */
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	will-change: transform, opacity;
}

.p-top__loading__inner img {
	width: 100%;
	height: auto;
	display: block;
}

/* ロゴ画像のマスクアニメーション */
.p-top__logo {
	/* iPhone最適化追加 */
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	will-change: transform, opacity, mask-position;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	/* マスク設定 */
	mask-image: linear-gradient(115deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 25%, rgba(0, 0, 0, 0) 50%);
	-webkit-mask-image: linear-gradient(115deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 25%, rgba(0, 0, 0, 0) 50%);
	mask-size: 400% 200%;
	-webkit-mask-size: 400% 200%;
	mask-position: 100% 100%;
	-webkit-mask-position: 100% 100%;

	/* アニメーション設定 */
	animation: logo-mask-reveal 2.5s ease-in-out forwards;
	animation-play-state: paused;

	opacity: 0.15;
}

/* iOS Safari用フォールバック（タイミング同じ） */
@supports not ((-webkit-mask-image: linear-gradient(to right, black, black)) or (mask-image: linear-gradient(to right, black, black))) {
	.p-top__logo {
		animation:
			logo-simple-fade 2.5s ease-in-out forwards;
	}
}

/* オーバーレイ */
.p-top__overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: radial-gradient(ellipse at center,
			rgba(189, 167, 119, 0.1) 0%,
			rgba(189, 167, 119, 0.05) 30%,
			rgba(244, 240, 237, 0.2) 50%,
			rgba(248, 245, 242, 0.3) 70%,
			rgba(244, 240, 237, 0.4) 100%);
	z-index: 2;
	/* iPhone最適化追加 */
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	will-change: opacity, transform;
	/* アニメーション設定（初期状態は停止） */
	animation: loading-overlay 1.2s ease-in-out 2.5s forwards;
	animation-play-state: paused;
}

/* フレア効果（より分からないように） */
.p-top__flare {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 1;
	/* iPhone最適化追加 */
	will-change: transform, opacity;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;

	/* アニメーション設定（初期状態は停止） */
	animation: loading-flare 3.5s ease-in-out forwards;
	animation-play-state: paused;
}

/* フレア効果の内部要素（極限までぼかし） */
.p-top__flare__inner {
	width: 400px;
	height: 400px;
	border-radius: 50%;
	position: relative;
	/* iPhone最適化追加 */
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	/* 非常に薄い光効果 */
	background: radial-gradient(ellipse at center,
			rgba(189, 167, 119, 0.15) 0%,
			rgba(189, 167, 119, 0.08) 30%,
			rgba(212, 195, 162, 0.05) 50%,
			rgba(244, 240, 237, 0.03) 70%,
			transparent 85%);

	filter: blur(80px);
	/* 極限のぼかし */
	-webkit-filter: blur(80px);
}

/* 追加の光の効果（ほぼ見えないレベル） */
.p-top__flare__inner::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate3d(-50%, -50%, 0);
	width: 600px;
	height: 600px;
	border-radius: 50%;
	background: radial-gradient(ellipse at center,
			rgba(244, 240, 237, 0.1) 0%,
			rgba(189, 167, 119, 0.06) 40%,
			rgba(212, 195, 162, 0.04) 60%,
			rgba(248, 245, 242, 0.02) 80%,
			transparent 90%);
	filter: blur(100px);
	/* 極限のぼかし */
	-webkit-filter: blur(100px);
}

/* 中央の明るいスポット（ほとんど見えないレベル） */
.p-top__flare__inner::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate3d(-50%, -50%, 0);
	width: 200px;
	height: 200px;
	border-radius: 50%;
	background: radial-gradient(ellipse at center,
			rgba(189, 167, 119, 0.2) 0%,
			rgba(212, 195, 162, 0.12) 50%,
			rgba(244, 240, 237, 0.06) 80%,
			transparent 90%);
	filter: blur(60px);
	/* 極限のぼかし */
	-webkit-filter: blur(60px);
}

/* スマホ対応 */
@media (max-width: 768px) {
	.p-top__loading.animate-in {
		/* SP画面でも同じマスク設定を適用 */
		mask-image: linear-gradient(315deg,
				rgba(0, 0, 0, 0) 0%,
				rgba(0, 0, 0, 0) 40%,
				rgba(0, 0, 0, 0.1) 45%,
				rgba(0, 0, 0, 0.8) 50%,
				rgba(0, 0, 0, 1) 55%,
				rgba(0, 0, 0, 1) 100%);
		-webkit-mask-image: linear-gradient(315deg,
				rgba(0, 0, 0, 0) 0%,
				rgba(0, 0, 0, 0) 40%,
				rgba(0, 0, 0, 0.1) 45%,
				rgba(0, 0, 0, 0.8) 50%,
				rgba(0, 0, 0, 1) 55%,
				rgba(0, 0, 0, 1) 100%);

		mask-size: 200% 200%;
		-webkit-mask-size: 200% 200%;
		mask-position: 0% 0%;
		-webkit-mask-position: 0% 0%;

		/* SP用のアニメーション設定 */
		animation:
			loading-background-change 3.5s ease-in-out forwards,
			loading-container-fade 3.5s ease-in-out forwards;
	}

	.p-top__loading.hide-diagonal {
		transition: mask-position 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94),
			-webkit-mask-position 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
		mask-position: 100% 100%;
		-webkit-mask-position: 100% 100%;
	}
}

.p-top__loading,
.p-top__logo,
.p-top__overlay,
.p-top__flare {
	will-change: transform, opacity;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translate3d(0, 0, 0);
	-webkit-transform: translate3d(0, 0, 0);
}

/* アクセシビリティ：動きを抑える設定 */
@media (prefers-reduced-motion: reduce) {

	.p-top__loading,
	.p-top__overlay,
	.p-top__flare,
	.p-top__loading__inner,
	.p-top__logo {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}

:root {
	--font-shippori-mincho: "Shippori Mincho", serif;
	--font-castoro-titling: "Castoro Titling", serif;
	--font-noto-serif-jp: "Noto Serif JP", serif;
	--font-bodoni: "bodoni-std", serif;
	--font-main-text-small: clamp(14px, 0.8vw, 16px);
	--font-main-text-medium: clamp(16px, 1vw, 20px);
	--font-main-text-large: clamp(20px, 1.6vw, 35px);
	--font-promise-text-small: 1.1rem;
	--font-promise-text-large: 1.5rem;
	--font-button-text-medium: clamp(22px, 1.3vw, 26.98px);
	--header-height: 80px;
	--header-height-sp: 50px;
	--sec-title-font-size-l: 45px;
	--sec-title-font-size-ja: 30px;
}

/* ========
    共通
======== */
html {
	font-size: 100%;
	height: 100%;
	background-color: #F4F0ED;
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body {
	font-family: "Hiragino Sans", "ヒラギノ角ゴ ProN W3",
		"Hiragino Kaku Gothic ProN", sans-serif;
	overflow-x: hidden;
	font-weight: 400;
	color: #2a2825;
	width: 100%;
	height: 100%;
	background-color: #F4F0ED;
}

.site__content__wrapper {
	max-width: 1470px;
	width: 100%;
	margin: 0 auto;
	position: relative;
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	text-decoration: none;
	display: block;
}

a:hover {
	opacity: 0.8;
}

ul {
	list-style: none;
}

.pc-only {
	display: block;
}

.pc-only-inline {
	display: inline;
}

.sp-only {
	display: none;
}

/* コンテンツ幅1000px */
.base-container {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
}

.section__title {
	font-family: var(--font-castoro-titling);
	font-size: var(--sec-title-font-size-l);
	letter-spacing: -0.05em;
	line-height: 0.8;
	color: #5e5a5a;
	text-align: center;
	font-weight: 400;
}

.section__title--ja {
	font-family: var(--font-shippori-mincho);
	font-size: 14px;
	line-height: 1.5;
	letter-spacing: 0.16em;
	text-align: center;
	margin-top: 10px;
}

.section-message__title--ja {
	font-family: var(--font-shippori-mincho);
	font-size: 12px;
	line-height: 2.47;
	letter-spacing: 0.3em;
	color: #000000;
}

.bg_fixed-sp {
	display: none;
	background-image: url(../img/top202504/bg_fixed-sp.webp);
	background-size: cover;
	background-position: center center;
	position: fixed;
	top: 0;
	width: 100%;
	height: 100vh;
	z-index: -1;
}

.red-letter {
	color: #EB586E;
}

.pink-line {
	text-decoration: underline;
	text-decoration-color: rgba(255,149,149,0.20); /* FF9595 / 20% */
	text-decoration-thickness: 6px;                /* 高さ6px */
	text-underline-offset: -2px; 
}

/* ========
    ヘッダー
======== */
header {
	max-width: 100%;
	background-color: #fff;
}

.header-wrapper {
	background-color: #fff;
	/* max-width: 1470px; */
	
	width: 100%;
	position: fixed;
	top: 0;
	left: 50%;
	visibility: hidden;
	/* opacity: 0; */
	transform: translate(-50%, -100%);
	z-index: 100;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	height: var(--header-height);
	-webkit-transform: translate3d(-50%, -100%, 0);
	/* iPhone最適化追加 */
	will-change: transform, opacity;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transition: transform 1.5s ease-out, opacity 1.5s ease-out;
}

.header-wrapper.animate-in {
	visibility: visible;
	opacity: 0.8;
	transform: translate(-50%, 0);
}



/* セクションごとのスクロールマージン調整 */
section[id] {
	scroll-margin-top: var(--header-height);
}

#message,
#menu,
#case,
#celebrity,
#reason,
#promise,
#movie,
#doctor,
#topics,
#clinic,
#qa {
	scroll-margin-top: var(--header-height);
}

/* ===========
fv
============== */
section[id]:not(.main-visual) {
	scroll-margin-top: var(--header-height);
}

@media (max-width: 768px) {
	.header-wrapper {
		height: var(--header-height-sp);
		transform: translate(-50%, -100%) !important;
		opacity: 0;
		animation: none;
	}

	.header-wrapper.animate-in {
		transform: translate(-50%, 0) !important;
		opacity: 0.8;
		visibility: visible;
		transition: transform .4s ease, opacity .4s ease;
		/* 任意 */
	}

	section[id]:not(.main-visual) {
		scroll-margin-top: var(--header-height-sp);
	}

	section[id]:not(.main-visual) {
		scroll-margin-top: var(--header-height-sp);
	}
}

/* メインビジュアルスライダー */
.main-visual {
	width: 100%;
	height: auto;
	position: relative;
	overflow: hidden;
	padding-top: var(--header-height-sp) !important;
	transition: padding-top 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.main-visual .splide {
	height: 100%;
}

.main-visual .splide__track,
.main-visual .splide__list {
	height: 100%;
}

.main-visual .splide__slide {
	width: 100%;
	height: 100%;
	position: relative;
}

.main-visual .splide__slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	aspect-ratio: 147 / 80;
}

/* ページネーションのカスタマイズ */
.main-visual .splide__pagination {
	bottom: 30px;
}

.main-visual .splide__pagination__page {
	width: min(0.8vw, 16px);
	height: min(0.8vw, 16px);
	opacity: 1;
	background: #d9d9d9;
	border-radius: 50%;
	margin: 0 min(1vw, 20px);
}

.main-visual .splide__pagination__page.is-active {
	background: #747474;
	transform: scale(1);
	opacity: 1;
}

/* FV-text */
.fv-text {
	position: absolute;
	left: 10%;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	color: #606060;
	font-family: var(--font-shippori-mincho);
	font-weight: 500;
	letter-spacing: 0.2em;
	display: flex;
	flex-direction: column;
	gap: min(2.5vw, 40px);
	pointer-events: none;
	text-align: left;
}

.fv-text__top {
	font-size: clamp(20px, 2.17vw, 32px);
	line-height: 0.8;
	margin: 0;
}

.fv-text__logo {
	width: 25vw;
	max-width: 374px;
	aspect-ratio: 341 / 101.02;
	height: auto;

}

.fv-text__bottom {
	font-size: clamp(16px, 1.6vw, 24px);
	line-height: 1.8;
	margin: 0;
}

.main-visual .splide__slide .co-founder {
	position: absolute;
	top: 20%;
	right: 17%;
	z-index: 3;
	color: #695D47;
	font-weight: 500;
	writing-mode: vertical-rl;
	font-family: var(--font-shippori-mincho);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	pointer-events: none;
}
.main-visual .splide__slide .fv-doctor {
	position: absolute;
	top: 62%;
	z-index: 3;
	color: #595959;
	font-weight: 400;
	writing-mode: vertical-rl;
	font-family: var(--font-shippori-mincho);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 3.5px;
	pointer-events: none;
}
.main-visual .splide__slide .fv-doctor__role,
.main-visual .splide__slide .fv-doctor__name {
  display: inline-block; 
  padding: 3px; 
  background: linear-gradient(
    90deg,
    #ffffff 0%,
    #d6d6d6 29%,
    #ffffff 64%,
    #cecece 100%
  ); 
}

.co-founder__role {
	font-size: clamp(14px, 1.3vw, 20px);
	line-height: 1.1;
}

.co-founder__name {
	font-size: clamp(16px, 2vw, 30px);
	line-height: 1;
}

.fv-doctor__role {
	/* font-size: 12.91px; */
	font-size: clamp(9px, 0.89vw, 26px);
	line-height: 1.12;
}
.fv-doctor__name {
	font-size: clamp(12px, 1.42vw, 42px);
	line-height: 1.15;
}
.fv-doctor01 .fv-doctor__name {
	font-size: clamp(12px, 1.49vw, 44px);
	line-height: 1.15;
}
.fv-doctor01 {
	right: 46%;
}
.fv-doctor02 {
	right: 29%;
}
.fv-doctor03 {
	right: 12.5%;
}

.fv__bottom {
	max-width: 516px;
	width: 100%;
	height: auto;
	margin: 47px auto;
}

/* ================
背景
====================*/
.main-contents__wrapper {
	background-image: url(../img/top202504/bg_fixed.png);
	background-attachment: fixed;
	background-position: top;
	background-size: cover;
	width: 100%;
}

/* =================
アニメーション
=================*/
.fade-up {
	opacity: 0;
	transform: translateY(50px);
	transition: opacity 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 1.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.fade-up.active {
	opacity: 1 !important;
	transform: translateY(0) !important;
}

.fade-left.active {
	opacity: 1 !important;
	transform: translateX(0) !important;
}

.fade-right.active {
	opacity: 1 !important;
	transform: translateX(0) !important;
}

/* ===========
message
=============== */

.message__title {
	text-align: center;
	position: relative;
}

.message__title::after {
	content: "";
	position: absolute;
	bottom: -45%;
	left: 50%;
	transform: translateX(-50%);
	width: 1px;
	height: min(4.7vw, 95px);
	background-color: #d2d1d1;
	z-index: 1;
}

.message__title img {
	margin-inline: auto;
	width: min(26.1vw, 518.62px);
	margin-bottom: 2.32%;
}

.message {
	padding-block: 119px 0;
}

.message__container {
	max-width: 1105px;
	width: 55.8%;
	margin: 140px auto 200px;
}

.message__text {
	font-family: var(--font-shippori-mincho);
	font-size: 18px;
	font-weight: 400;
	line-height: 2.1;
	letter-spacing: 0.04rem;
	max-width: 855px;
	width: 65%;
	margin-top: -5%;
	display: block;
}

.message__text-sp {
	display: none;
}

.img_vbc {
	width: 100%;
	height: auto;
}

/* =====================
section-nav
===================== */
.section-nav__list{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:30px;
  list-style:none;
  padding:0;
  margin:0 auto;
  max-width: 960px;
}
.section-nav__list li{ 
	margin:0;
	max-width: 300px;
}

/* ボタン本体：斜め帯 + ベース */
.section-nav__list a{
	max-width: 300px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 26px;
  padding:10px 20px;
  border-radius:5px;
  color:#fff;
  text-decoration:none;
  font-size: 20px;
  line-height:1.2;
  background:
    /* 斜線帯（境界くっきり） */
    linear-gradient(139deg,
      transparent 0 42%,
      rgba(255,255,255,.14) 42% 58%,
      transparent 58% 100%) no-repeat,
    linear-gradient(139deg, #435168 0 70%, #334159 70% 100%) no-repeat;
background-size: 220% 220%, cover;  
  background-position: 120% 50%, center; 
  box-shadow: inset 0 2px 6px rgba(0,0,0,.18);
  overflow: hidden; 
  transition: none; 
}

.section-nav__list a > img{
  width:50px;
  height:50px;
  flex:0 0 50px;
  display:block;
}

.section-nav__list a::after{
  content:"";
  width:10px; height:6px; margin-left:auto;
  border-left:6px solid transparent;
  border-right:6px solid transparent;
  border-top:6px solid rgba(255,255,255,.9);
  opacity:.95;
}

/* モバイル */
@media (max-width:768px){
  .section-nav__list{ 
	grid-template-columns:repeat(2, minmax(0, 1fr)); 
	gap:14px;
	width: 100%;
	padding-inline: 20px;
	margin-inline: auto;  
}
.section-nav__list li{ 
	max-width: none;
}
  .section-nav__list a{ 
	padding:7px 10px;
	font-size: 12px;
	gap: 12px;
	max-width: none; 
    width: 100%;
 }
 .section-nav__list a > img {
	width: 28px;
	height: 28px;
	flex:0 0 28px;
 }
}

/* ================
今月のおすすめメニュー
====================*/
.recommended {
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
	padding-block: 150px 200px;
	overflow: hidden;
}

.recommended__slider {
	width: 100%;
	margin-top: 85px;
	position: relative;
	overflow: visible;
}

.recommended__slider .splide__track {
	overflow: visible;
}

.recommended__slider .splide__list {
	overflow: visible;
	display: flex;
	align-items: center;
}

.recommended__slide {
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all 0.3s ease;
	z-index: 1;
}

.recommended__link {
	display: block;
	width: 100%;
	height: 100%;
	transition: all 0.3s ease;
}

.recommended__link:hover {
	transform: scale(1.1);
	z-index: 10;
}

.recommended__image {
	width: 800px;
	height: auto;
	aspect-ratio: 80 / 35;
	object-fit: contain;
	flex-shrink: 0;
}

/* ページネーション専用スタイル */
.recommended__pagination {
	position: static;
	display: flex;
	justify-content: center;
	gap: 12px;
	margin-top: 40px;
}

.recommended__pagination .splide__pagination__page {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: rgba(217, 217, 217, 1);
	border: none;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.recommended__pagination .splide__pagination__page.is-active {
	background-color: rgba(116, 116, 116, 1);
	transform: scale(1, 1);
}

/* スマホ用スタイル（768px以下） */
@media (max-width: 768px) {
	.recommended {
		padding-block: 88px 40px;
	}

	.recommended__slider {
		margin-top: 35px;
	}

	.recommended__image {
		width: 320px;
		height: 320px;
		flex-shrink: 0;
	}
}

@media (max-width: 500px) {
	.recommended__slide {
		justify-content: center;
	}

	.recommended__link {
		display: flex;
		justify-content: center;
	}
}

/* =================
reason
==================*/
.reason__container{
	max-width: 999px;
	width: 100%;
	margin: 48px auto 0;
}
.reason__top{
	display: flex;
	gap: 2%;
	position: relative;
	width: calc(100% - 40px);
	margin-inline: auto;
}
.reason__text{
	width: 53%;
	font-family: var(--font-shippori-mincho);
	font-size: 18px;
	font-weight: 400;
	letter-spacing: 0.04rem;
	line-height: 2.144;
}
.reason__top--image{
  position: relative;        
  width: 45%; 
  aspect-ratio: 400 / 270; 
}
.reason__top--image img, 
.reason__middle--image img {
	width: 100%;
	max-width: 400px;
	height: auto;
	aspect-ratio: 400 / 270;
}
.reason__top--image01 {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 10;
}
.reason__top--image02 {
	position: absolute;
	top: 10%;
	right: -3%;
	z-index: 0;
}
.reason__top--image02.fade-up {
  transition-delay: .35s;
}
.reason__middle{
	display: flex;
	flex-direction: row-reverse;
	justify-content: space-between;
	gap: 5%;
	margin: 60px auto 72px;
	width: calc(100% - 40px);
}
.reason__text{
}
.reason__middle--image{
	padding-left: 17px;
}
.reason__bottom{
	width: 100%;
	max-width: 999px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}
.reason__bottom img {
	width: 100%;
	height: auto;
	max-width: 333px;
	aspect-ratio: 332.89 / 203.4;
}

@media screen and (max-width: 768px) {
	.promise-reason__wrapper {
		padding-block: 30px 76px !important;
		background-image: url(../img/top202504/bg_reason-promise_sp.jpg);
		background-position: center top;
		background-size: cover;
		padding-top: 30%;
	}
	.reason__promise-reason__wrapper {
		padding-block: 73px 58px !important;
	}
	.reason__top{
		flex-direction: column-reverse;
	}
	.reason__top--image{
		width: 83%;
		aspect-ratio: 323.41 / 230.3;  
		margin-inline: auto;
  	}
	.reason__text{
		width: 100%;
		font-size: 16px;
		line-height: 2;
		letter-spacing: -0.01rem;
		padding-inline: 0;
		margin-top: 24px;
	}
	.reason__top--image01 {
		left: 50%;
		transform: translateX(-50%);
	}
	.reason__top--image02 {
		top: 6%;
		left: 55%;
		transform: translateX(-50%);
	}
	.reason__top--image img, .reason__middle--image img {
		max-width: none;
		aspect-ratio: 300 / 202.5;  
	}
	.reason__middle{
		flex-direction: column-reverse;
		gap: 24px;
	}
	.reason__middle--image{
		padding-left: 0;
		margin-left: auto;
	}
	.reason__bottom{
		grid-template-columns: repeat(3, 1fr);
	}
	.reason__bottom img {
		max-width: 100%;
	}
	
}

/* ========
menuバナー、手術ボタン
========== */

.surgery {
	padding-bottom: 198px;
}

.menu__title {
	font-family: var(--font-shippori-mincho);
	text-align: center;
	font-size: var(--sec-title-font-size-ja);
	color: #2a2825;
	font-weight: 400;
}

.menu__title--en {
	font-size: 14px;
	line-height: 1.54;
	letter-spacing: 0;
	margin-top: 10px;
	font-family: var(--font-castoro-titling);
}

.menu__title--ja {
	margin-bottom: 10px;
	margin-top: 0;
	letter-spacing: initial;
}

.menu__banner--container {
	max-width: 860px;
	width: calc(100% - 20px);
	margin: 125px auto 142px;
}

.menu__surgical--container {
	max-width: 806.12px;
	width: 100%;
	margin: 74px auto 0;
}

.menu__banner--list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 5%;
}

.menu__banner--list li {
	width: 47.5%;
	position: relative;
}

.menu__banner--list a {
	width: 100%;
	max-width: 390px;
}

.menu__banner--list li:nth-child(1) {
	margin-bottom: 40px;
}

.menu__banner--list li:nth-child(2) {
	margin-bottom: 40px;
}

.menu__surgical--list {
	max-width: 1040px;
	width: calc(100% - 20px);
	margin-inline: auto;
	display: flex;
	justify-content: space-between;
	gap: 40px;
	flex-wrap: wrap;
}

.menu__surgical--list a {
	width: 47%;
	display: block;
}

/* ===================
facial menu pc
====================*/
.facial-pc {
	display: block;
}

.facial-sp {
	display: none;
}

.facial__title {
	font-size: var(--sec-title-font-size-l);
	font-family: var(--font-castoro-titling);
	color: #3E3D3A;
	font-weight: 400;
	line-height: 1.53;
	text-align: center;
	padding-top: 105px;
}

.facial__title--ja {
	font-size: 14px;
	margin-bottom: 24px;
}

.facial {
	background-image: url(../img/top202504/bg_facial-pc.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center top;
}

.facial-pc__container {
	position: relative;
	width: 753px;
	height: 664px;
	margin-inline: auto;
}

.facial-pc__image {
	height: 664px;
	width: auto;
}

.facial-pc__menu-left {
	position: absolute;
	top: 52px;
	left: 40px;
}

.facial-pc__menu-right {
	position: absolute;
	top: 52px;
	right: 0;
}

.facial-button {
	width: 100%;
	height: 40px;
	border-radius: 50px;
	color: #fff;
	font-weight: 600;
	font-size: 16px;
	padding: 8px 30px;
	margin-bottom: 16px;
	transition: all 0.4s ease;
}

.facial-button:hover,
.facial-pc__menu-left .facial-button:hover,
.facial-pc__menu-right .facial-button:hover,
.facial-sp__menu-left .facial-button:hover,
.facial-sp__menu-right .facial-button:hover {
	transform: scale(1.1) !important;
	opacity: 0.8;
	cursor: pointer;
}

.facial-button:active {
	transform: scale(1.1);
	opacity: 0.9;
}

.color-surgery {
	background: linear-gradient(to right, #A9AEEE 0%, #8088DA 100%);
	width: fit-content;
}

.color-other {
	background: linear-gradient(to right, #7CCDEA 0%, #5FB8D9 100%);
	width: fit-content;
}

.color-skin {
	background: linear-gradient(to right, #FFA0A3 0%, #FD797B 100%);
	width: fit-content;
}

.menu__surgical--wrapper {
	padding-top: 88px;
}

.facial-guide {
	max-width: 528px;
	border-radius: 64px;
	width: 100%;
	background-color: rgba(255, 255, 255, 0.9);
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 17px 38px 17px 32px;
	position: absolute;
	bottom: 105px;
	left: 50%;
	transform: translateX(-50%);
}

.facial-guide__color {
	display: flex;
	gap: 10px;
	align-items: center;
}

.facial-guide__round {
	border-radius: 50%;
	width: 27px;
	height: 27px;
	aspect-ratio: 1 / 1;
}

.facial-guide__text {
	color: #3E3D3A;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0;
}

@media screen and (max-width: 768px) {
	.facial-sp__menu--wrapper {
		width: 328px;
		height: auto;
		position: absolute;
		bottom: 20%;
		left: 50%;
		transform: translateX(-50%);
		display: flex;
		gap: 8px;
		justify-content: space-between;
	}

}

@media screen and (max-width: 768px) {
	.facial-pc {
		display: none;
	}

	.facial-sp {
		display: block;
	}

	.facial {
		background-image: url(../img/top202504/bg_facial-sp.png);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center top;
	}

	.facial__title {
		font-size: 30px;
		color: #5E5A5A;
		line-height: 1.16;
		padding-top: 79px;
	}

	.facial__title--ja {
		color: #000000;
		font-size: 12px;
		line-height: 1.65;
		letter-spacing: 0.03em;
		margin-bottom: 65px;
	}

	.facial-sp__container {
		position: relative;
		width: 100%;
		margin-inline: auto;
	}

	.facial-sp__image--wrapper {
		width: 100%;
		max-width: none;
	}

	.facial-sp__image--wrapper img {
		object-fit: cover;
		width: 100%;
		max-width: none;
	}

	.facial-sp__numbers {
		width: 294px;
		height: 198px;
		position: absolute;
		top: 155px;
		left: calc(50% - 357.5px + 230px);
		display: flex;
		justify-content: space-between;
	}

	.facial-button {
		width: fit-content;
		height: 33px;
		border-radius: 55px;
		color: #fff;
		font-size: 16px;
		padding: 10px 16px;
		margin-bottom: 12px;
		display: flex;
		align-items: center;
	}

	.facial-button:hover,
	.facial-button:active {
		transform: scale(1.1) !important;
		opacity: 0.8;
	}

	.facial-guide {
		max-width: 280px;
		width: 100%;
		background-color: rgba(255, 255, 255, 0.9);
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		row-gap: 16px;
		column-gap: 11px;
		padding: 23px 45px;
		position: absolute;
		bottom: 3%;
		left: 50%;
		transform: translateX(-50%);
	}

	.facial-guide__color {
		display: flex;
		gap: 10px;
		align-items: center;
	}

	.facial-guide__round {
		border-radius: 50%;
		width: 17.6px;
		height: 17.6px;
		aspect-ratio: 1 / 1
	}

	.facial-guide__text {
		font-size: 12px;
		font-weight: 600;
	}

	.facial-guide__other {
		margin-top: 5px;
	}
}


/* ===========
症例
============== */
.case__title {
	position: relative;
}

.case__title--bg {
	width: 100%;
	height: auto;
	display: block;
}

.case__title--text {
	font-size: var(--sec-title-font-size-ja);
	font-family: var(--font-shippori-mincho);
	line-height: 1.07;
	color: #fbfbfb;
	position: absolute;
	top: 64px;
	left: 50%;
	transform: translateX(-50%);
	font-weight: 500;
	text-align: center;
	width: 100%;
}

.case__container {
	width: 100%;
	max-width: 1000px;
	margin: -3% auto 100px;
	padding-top: 5.5%;
	padding-inline: 6.3%;
	position: relative;
	z-index: 3;
	background-color: #fff;
	transition: width 0.3s ease;
}

/* タブメニュー */
.tab-menu {
	display: flex;
	justify-content: space-between;
	margin-bottom: 6.5%;
	border-bottom: 0.8px solid #a1a1a1;
}

.tab-item {
	flex: 1;
	text-align: center;
	padding: 15px 0;
	cursor: pointer;
	font-size: var(--font-main-text-medium);
	transition: all 0.3s ease;
	position: relative;
	color: #a1a1a1;
}

.tab-item::before {
	content: "";
	position: absolute;
	bottom: -1px;
	left: 0;
	width: 0%;
	height: 2.41px;
	background-color: #2a2825;
	transition: width 0.3s ease;
}

.tab-item:hover::before {
	width: 100%;
}

.tab-item:hover {
	color: #2a2825;
}


.tab-item.active {
	font-weight: 500;
	color: #2a2825;
}

.tab-item.active:after {
	content: "";
	position: absolute;
	bottom: -1px;
	left: 0;
	width: 100%;
	height: 2.41px;
	background-color: #2a2825;
}

.tab-item.active::before {
	display: none;
}

/* コンテンツエリア */
.tab-content {
	display: none;
}

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

/* カード */
.card-container {
	max-width: 830px;
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 4%;
}

.card {
	/* width: calc(50% - 48px); */
	width: 46%;
	margin-bottom: 4.3%;
}

.card-header {
	background-color: #435168;
	color: #fff;
	padding: 15px 0;
	text-align: center;
	font-size: clamp(12px, 1vw, 1.3rem);
}

.card-image {
	display: flex;
	justify-content: space-around;
}

.card img {
	width: 378px;
	height: 222.5px;
	object-fit: contain;
}

#case02 .card-container .card img {
	width: 378px;
	height: auto;
	object-fit: contain;
}

.card-image-caption {
	text-align: center;
	padding-top: 16.56px;
	font-weight: 500;
	font-family: var(--font-bodoni);
	line-height: 1.7;
}

/* アコーディオン */
.accordion {
	border: 1px solid #435168;
	margin-top: 10px;
}

.accordion-header {
	font-family: var(--font-castoro-titling);
	font-size: var(--font-main-text-medium);
	color: #435168;
	padding-top: 5px;
	cursor: pointer;
	background-color: #f9f9f9;
	position: relative;
	text-align: center;
}

.accordion-header:after {
	content: "▼";
	font-size: 12px;
	transition: transform 0.3s;
	position: absolute;
	right: 3%;
	top: 25%;
}

.accordion-header.active:after {
	transform: rotate(180deg);
}

.accordion-content {
	display: none;
	font-size: var(--font-main-text-small);
	font-weight: 300;
}

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

/* テーブルスタイル */
.info-table {
	width: 100%;
	border-collapse: collapse;
}

.info-table tr {
	border-bottom: 1px solid #eee;
}

.info-table th {
	width: 35%;
	padding: 15px 10px;
	text-align: left;
	vertical-align: top;
	font-weight: 300;
	background-color: rgba(67, 81, 104, 0.05);
}

.info-table td {
	padding: 15px 10px;
}

.side-effect-list {
	list-style-type: none;
}

.side-effect-list li {
	margin-bottom: 10px;
	padding-left: 15px;
	position: relative;
}

.side-effect-list li:before {
	content: "・";
	position: absolute;
	left: 0;
}

.case__bottom-link {
	background-color: #435168;
	color: #fbfbfb;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8.5px;
	padding: 13px 3%;
	margin-inline: auto;
	width: min(50%, 377px);
	font-family: var(--font-shippori-mincho);
	font-size: var(--font-button-text-medium);
	border: 2px solid transparent;
}

.case__bottom-link img {
	width: min(1.3vw, 26px);
	height: auto;
}

.case__bottom-link:hover {
	background-color: #fbfbfb;
	color: #435168;
	transition: all 0.3s ease;
	border: 2px solid #435168;
}

/* =========
インフルエンサー
＝＝＝＝＝＝＝＝ */
.celebrity {
	background-image: url(../img/top202504/bg_celebrity.png);
	background-position: center;
	background-size: cover;
	padding-block: 7.91% 10.5%;
}

.celebrity__title {
	width: 54%;
	margin-inline: auto;
}

.celebrity__scroll {
	width: 100%;
	overflow: hidden;
	position: relative;
	padding: 60px 0;
}

@media screen and (max-width: 768px) {
	.celebrity__scroll {
		padding: 60px 0 100px;
	}
}

.pt-6percent {
	padding-top: 6%;
}

.pb-6percent {
	padding-bottom: 6%;
}

.celebrity__image {
	aspect-ratio: 225 / 300;
	width: 100%;
	flex-shrink: 0;
	background-size: cover;
	background-position: center;
}

/* 偶数番目の画像を下にずらす */
.celebrity__image:nth-child(even) {
	transform: translateY(6%);
	/* 縦に3%ずらす */
}

/* 奇数番目の画像を上にずらす */
.celebrity__image:nth-child(odd) {
	transform: translateY(-6%);
	/* 縦に-3%ずらす */
}

/* ==========
promise strengths
============ */
.promise-reason__wrapper {
	padding-block: 214px 165px;
	background-image: url(../img/top202504/bg_reason-promise.png);
	background-position: center;
	background-size: cover;
}
.strengths {
	margin: 90px auto 130px;
}
.strengths__wrapper {
	max-width: 1011px;
	margin: 0 auto 200px;
	display: flex;
	align-items:stretch;
	gap: 31px;
}

.strengths__title .section__title {
	font-family: var(--font-shippori-mincho);
}
.strengths__wrapper{ counter-reset: strengths; }
.strengths__container{ counter-increment: strengths; }
.strengths__container {
	background-color: #fff;
	width: 100%;
	margin: 116px auto 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	border-radius: 70px 0 70px 0;
	/* overflow:hidden;  */
	overflow: visible;
	position:relative;
	border:1px solid #BABABA;
}
.strengths__container::after{
  content:"";
  position:absolute;
  top:7px; right:-7px; bottom:-7px; left:7px;
  border:1px solid #BABABA; 
  border-color: transparent #BABABA #BABABA #BABABA;
  border-radius:77px 0 77px 0;
  transform:translate(4px,4px);
  pointer-events:none;
  z-index:1;
  background:
    linear-gradient(#BABABA,#BABABA) top right / 32px 1px no-repeat;
}
.strengths__container::before{
  content: counter(strengths, decimal-leading-zero);
  position:absolute;
  left:50%;
  top: -11%; 
  transform: translateX(-50%);
font-family: "Petit Formal Script", system-ui, "Noto Sans JP", sans-serif;
font-weight: 400;
  font-size: 50px; 
  line-height:1;
  color:#D3D3D3;   
  letter-spacing: .05em;
  pointer-events:none;
  z-index:2; 
}
.strengths__inner{
  background:#fff;  
  border-radius:70px 0 70px 0;
  overflow:hidden;                 /* ★ここでクリップ */
  display:flex;                    /* 元のレイアウトを内側に移管 */
  flex-direction:column;
  /* justify-content:space-between; */
  height: 100%;
  flex: 1;
  position:relative;
  z-index:2;                       /* 外枠線より上に中身を表示 */
}

@media screen and (max-width: 1004px) {
	.strengths__wrapper {
		padding-inline: 20px;
	}
}

.strengths__container--img {
	display: block;
	max-width: 330px;
	width: 100%;
	height: auto;
	aspect-ratio: 330 / 232;
	object-fit: cover;
}
.strengths__container--text-img {
	width: 70%;
}
.strengths__container--text {
	padding: 15px 18px 13px;
}
.strengths__container--text-l {
	font-family: var(--font-shippori-mincho);
	font-size: clamp(20px, 1.76vw, 26px);
	font-weight: 600;
	letter-spacing: 0.1em;
	margin-bottom: 12px;
}

.title__silver {
	background: linear-gradient(to right,
			#313131 0%,
			#7f7f7f 24%,
			#313131 50%,
			#7f7f7f 73%,
			#313131 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	font-weight: 500;
}

.strengths__container--text-s {
	font-family: var(--font-noto-serif-jp);
	font-size: 16px;
	line-height: 1.5;
	letter-spacing: 0.1em;
	margin-bottom: 5%;
	color: #2a2825;
}

.strengths__link {
	width: 65%;
	min-width: 135px;
	max-width: 211.38px;
	font-size: clamp(12px, 1.02vw, 15px);
	/* font-size: 15px; */
	line-height: 1.71;
	margin-inline: auto;
	margin-top: 5px;
	padding-block: 9px;
}

.strengths__link img {
	width: clamp(12px, 0.9vw, 18.95px);
}

.promise__wrapper {
	margin-top: 70px;
	max-width: 1040px;
	width: calc(100% - 20px);
	margin-inline: auto;
	display: flex;
	justify-content: space-between;
	gap: 70px;
}

.promise__content {
	width: 28%;
	max-width: 320px;
	color: #2a2825;
	display: flex;
	flex-direction: column;
}

.promise__number {
	font-family: var(--font-castoro-titling);
	font-size: clamp(32px, 2.5vw, 50px);
	text-align: center;
	display: inline-block;
}

.promise__heading {
	font-family: var(--font-shippori-mincho);
	margin-block: 30px 20px;
	font-size: 20.56px;
	letter-spacing: 0.1em;
	line-height: normal;
	font-weight: 600;
}

.promise__text {
	font-family: var(--font-noto-serif-jp);
	font-size: 16.45px;
	line-height: 1.8;
	text-align: left;
	color: #2a2825;
}

/* ===========
movie
============= */
#movie {
	padding: 0 0 100px;
}

.movie__title--text {
	font-family: var(--font-castoro-titling);
	font-size: var(--sec-title-font-size-l);
	line-height: 0.7;
	font-weight: 400;
	top: 58px;
}

.movie__container__wrapper {
	max-width: 1000px;
	background-color: #fff;
	width: 85.7%;
	margin: -5% auto 0;
	overflow: auto;
}

.movie__container {
	background-color: #fff;
	padding-inline: 3%;
	display: flex;
	gap: 3%;
	justify-content: space-between;
	position: relative;
	width: fit-content;
}

.movie__content {
	padding-block: 90px 60px;
	width: 500px;
}

.movie__title {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 11.5px;
	padding: 0 0 9.5px;
	color: #435168;
	border-bottom: 1px solid #afafaf80;
}

.movie__thumb {
	max-width: 559.27px;
	width: 100%;
	margin-bottom: 1.8%;
	transition: opacity 0.3s ease;
}

.movie__desc {
	font-size: 12.85px;
	text-align: left;
}

.movie__player {
	position: relative;
	width: 100%;
	margin-bottom: 15px;
}

.movie__thumbnail {
	position: relative;
	cursor: pointer;
	display: block;
	width: 100%;
}

.movie__thumbnail:hover .movie__thumb {
	opacity: 0.8;
	transition: opacity 0.3s ease;
}

.movie__iframe {
	position: relative;
	width: 100%;
	height: auto;
}

.movie__iframe iframe {
	position: relative;
	width: 100%;
	max-width: 559.27px;
	/* サムネイルと同じmax-width */
	aspect-ratio: auto;
	/* 動画の本来のアスペクト比を維持 */
	height: auto;
}

.scroll-icon__wrapper {
	margin: 20px auto;
	max-width: 1000px;
	width: 85.7%;
}

.scroll-icon {
	margin: 0 0 0 auto;
	width: 6%;
	animation: scroll 2.5s infinite;
	transform: translateX(-50%);
}

@keyframes scroll {
	0% {
		transform: translateX(-50%);
	}

	35% {
		transform: translateX(0%);
	}

	70% {
		transform: translateX(-50%);
	}

	100% {
		transform: translateX(-50%);
	}
}

/* =========
doctor
========== */

.doctor {
	background-color: #f3f7fd;
	padding-block: 140px 8.29%;
}

.doctor__title {
	font-size: var(--sec-title-font-size-l);
	font-family: var(--font-castoro-titling);
	line-height: 0.7;
	letter-spacing: 0;
	font-weight: 400;
	text-align: center;
	color: #2a2825;
}

.doctor__wrapper {
	max-width: 990px;
	width: calc(100% - 40px);
	margin: 88px auto 0;
}

.doctor__container {
	max-width: 909px;
	width: 100%;
	display: flex;
	justify-content: space-between;
	gap: 7.3%;
}

.doctor__profile {
	width: 35%;
	position: relative;
	padding-bottom: 150px;
}

.doctor__image {
	position: relative;
}

.doctor__img--top {
	display: block;
	position: absolute;
	width: 35%;
	max-width: 115px;
	top: -5%;
	left: -7%;
}

.doctor__profile-imgs {
	position: relative;
}

.doctor__img--right {
	position: absolute;
	/* top: calc(100% - 160px); */
	bottom: -16%;
	right: -19%;
	width: 55%;
	z-index: 2;
}

.doctor__name {
	font-family: var(--font-shippori-mincho);
	font-size: clamp(12px, 1.8vw, 35.97px);
	text-shadow: 0px 0px 15.55px rgba(255, 255, 255, 0.5),
		0px 0px 30.58px rgba(255, 255, 255, 0.5);
	font-weight: 500;
	line-height: 1.2;
	color: #2a2a2a;
}

.doctor__role {
	display: block;
	font-size: clamp(12px, 1.17vw, 23.33px);
	text-shadow: 0px 0px 15.55px rgba(255, 255, 255, 0.5),
		0px 0px 30.58px rgba(255, 255, 255, 0.5);
	line-height: 2;
}

.doctor__links {
	width: 100%;
	max-width: 189.76px;
	font-size: clamp(12px, 0.68vw, 13.56px);
}

.doctor__links li {
	width: 100%;
}

.doctor__links a {
	color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 5.5px;
	border-radius: 28.25px;
	padding-block: 6.5px 5.5px;
}

.doctor__img {
	max-width: 100%;
	width: 100%;
	height: auto;
	object-fit: contain;
}

.doctor__case {
	width: 70%;
}

/* ここからタブメニュー */
.doctor__heading {
	font-size: 18px;
	font-weight: 400;
	margin-bottom: 14px;
}

.doctor__tabs {
	display: flex;
	gap: 1.6%;
	margin-bottom: 20px;
	position: relative;
}

.doctor__tab {
	padding-block: 10px;
	border-radius: 30px;
	background-color: #ffffff;
	color: #426597;
	font-size: clamp(12px, 0.9vw, 18px);
	cursor: pointer;
	border: 1px solid #426597;
	transition: all 0.3s ease;
	flex: 0 1 auto;
	text-align: center;
	min-width: 100px;
	width: 32.8%;
}

.doctor__tab:hover:not(.doctor__tab--active) {
	background-color: #f5f5f5;
}

.doctor__tab--active {
	background-color: #426597;
	color: white;
	border: 1px solid #426597;
	position: relative;
}

/* 吹き出しの矢印 */
.doctor__tab--active::after {
	content: "";
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #426597;
}

/* コンテンツエリア */
.doctor__content-wrapper {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	max-width: 575px;
	width: 100%;
}

.doctor__content-item {
	display: none;
	width: 100%;
}

.doctor__content-item--active {
	display: flex;
	flex-wrap: wrap;
	gap: 13px;
	width: 100%;
}

/* カードスタイル */
.doctor__card {
	background-color: #fff;
	border-radius: 7.78px;
	border: 1px solid #e0e0e0;
	overflow: hidden;
	flex: 1 1 calc(50% - 10px);
	max-width: 282px;
	width: 100%;
	height: fit-content;
	padding: 20px;
	font-size: 0.8rem;
}

/* 画像スタイル */
.doctor__card-image {
	width: 100%;
	margin-bottom: 10px;
}

.doctor__card-image img {
	width: 100%;
	height: auto;
	display: block;
}

/* タイトルスタイル */
.doctor__card-title {
	font-size: min(1.3vw, 18px);
	font-weight: 600;
	color: #426597;
	text-align: center;
	margin-bottom: 20px;
}

/* 説明文スタイル */
.doctor__card-description {
	margin: 0;
}

/* 区切り線 */
.doctor__card-divider {
	height: 1px;
	background-color: #e0e0e0;
	margin: 15px 0;
}

.doctor__card-subtitle {
	margin: 0 0 5px 0;
}

.doctor__card-text {
	margin: 0;
}

/* 詳しくボタン */
.doctor__card-button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 7%;
	width: 80%;
	height: 38px;
	margin: 20px auto;
	padding: 8px;
	background-color: #8f8f8f;
	color: #fff;
	text-align: center;
	text-decoration: none;
	border-radius: 5px;
	/* font-size: clamp(9px, 0.6vw, 13.56px); */
	font-size: min(1.1vw, 16.28px);
	transition: background-color 0.3s;
}

.doctor__card-button::after {
	content: "";
	background-image: url(../img/top202504/arrow.svg);
	background-size: contain;
	width: 10px;
	height: 10px;
}

/* ====================
equipment
=====================*/
.equipment__inner {
	padding-block: 150px;
}

.equipment__title {
	font-size: 30px;
	font-family: var(--font-shippori-mincho);
	font-weight: 400;
	text-align: center;
}

.equipment__title--en {
	font-family: var(--font-castoro-titling);
	font-size: 14px;
	display: block;
	margin-top: 10px;
}

.equipment__lead {
	font-family: var(--font-shippori-mincho);
	font-size: 18px;
	line-height: 2.1;
	letter-spacing: 0.04em;
	max-width: 800px;
	width: calc(100% - 40px);
	margin: 60px auto;
}

.equipment__items {
	max-width: 800px;
	width: calc(100% - 40px);
	display: flex;
	flex-direction: column;
	gap: 80px;
	margin-inline: auto;
	font-family: var(--font-shippori-mincho);
	color: #2A2825;
}

.equipment__item {
	display: flex;
	gap: 28px;
}

.equipment__image {
	width: 320px;
	height: auto;
	aspect-ratio: 32 / 24;
	flex-shrink: 0;
}

.equipment__tagline {
	font-size: 16px;
	line-height: 1.93;
	letter-spacing: 0.04em;
	font-weight: bold;
}

.equipment__name {
	font-size: 32px;
	font-weight: 600;
	margin-bottom: 24.8px;
}

.equipment__detail {
	font-size: 15px;
	font-weight: 400;
	line-height: 2.06;
	letter-spacing: 0.04em;
}


/* ==============
topics
============== */
.topics {
	background-image: url(../img/top202504/bg_topics.jpg);
	background-position: center;
	background-size: cover;
	padding-block: 164px;
}

.topics__title {
	font-size: var(--sec-title-font-size-l);
	font-family: var(--font-castoro-titling);
	color: #2a2825;
	font-weight: 400;
	line-height: 0.7;
	margin-bottom: 60px;
}

.topics__container {
	max-width: 1000px;
	width: 70%;
	margin-inline: auto;
	display: flex;
	justify-content: space-evenly;
	gap: 3%;
	padding-inline: 1.5%;
	margin-bottom: 3%;
}

.topics__text {
	color: #2a2a2a;
	font-size: 15px;
	font-weight: 500;
}

.topics__card {
	max-width: 296px;
	width: 21%;
}

.topics__card img {
	aspect-ratio: 296 / 218;
	object-fit: cover;
	margin-bottom: 16px;
}

.topics-date {
	color: #929292;
	font-size: 12px;
	font-weight: 400;
	margin-bottom: 8px;
}

.topics__link {
	width: 265px;
	margin-inline: auto;
}

/* ==========
clinic
========== */
.clinic {
	max-width: 774px;
	margin-inline: auto;
	padding-block: 174px 205px;
}

/* タブメニュー */
.clinic__tab-container {
	display: flex;
	justify-content: center;
	margin-bottom: 30px;
	position: relative;
}

.clinic__tab {
	width: 90%;
	padding: 10px 0;
	text-align: center;
	background-color: #fff;
	border: 1px solid #435168;
	cursor: pointer;
	font-size: 18px;
	transition: all 0.3s;
}

.clinic__tab:first-child {
	margin-right: 5%;
}

.clinic__tab--active {
	background-color: #435168;
	color: #fff;
	position: relative;
}

/* 吹き出しの三角形 */
.clinic__tab--active:after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -10px;
	border-width: 10px;
	border-style: solid;
	border-color: #435168 transparent transparent transparent;
}

/* クリニックの内容 */
.clinic__content {
	display: none;
}

.clinic__content--active {
	display: flex;
	gap: 36px;
}

/* 左カラム */
.clinic__image-block {
	width: 100%;
	max-width: 360px;
}

.clinic__image {
	width: 100%;
	height: auto;
}

/* 右カラム */
.clinic__info-block {
	width: 380px;
}

.clinic__name {
	margin-bottom: 10px;
	font-family: var(--font-bodoni);
}

.clinic__branch {
	font-size: 32px;
	margin-bottom: 20px;
}

.clinic__contact-button {
	width: 62%;
	max-width: 254.79px;
}

.clinic__contact-icon {
	width: 30px;
	height: 30px;
	object-fit: contain;
	margin-right: 10px;
}

.clinic__info-table {
	margin-top: 14px;
	width: 100%;
	border-collapse: collapse;
}

.clinic__info-table th,
.clinic__info-table td {
	padding-bottom: 10px;
	text-align: left;
	vertical-align: top;
	font-weight: 300;
	font-size: 14px;
	line-height: 1.3;
}

.clinic__info-table th {
	width: 84px;
}

.clinic__info-table td {
	padding-left: 10px;
}

.clinic__info-table a {
	color: #1da8ff;
}

.clinic__map-container {
	margin: 20px 0;
	padding-top: 14px;
}

.clinic__map {
	width: 100%;
	height: auto;
}

.iframe-container {
	width: 100%;
	max-width: 460px;
	aspect-ratio: 460 / 264;
}

.iframe-container iframe {
	width: 100%;
	height: 100%;
	border: 0;
}

.clinic__social-links {
	display: flex;
	justify-content: flex-start;
	margin-top: 30px;
}

.clinic__social-link {
	display: inline-block;
	margin-right: 10px;
}

.clinic__social-icon {
	width: 40px;
	height: 40px;
}

/* =========
recruit
========== */
.recruit {
	width: 100%;
	max-width: 800px;
	margin-inline: auto;
	padding-bottom: 91px;
}

/* =========
Q&A
==========*/
.qa {
	background-color: #fdfcf8;
	padding: 122px 20px;
}

.qa__title {
	color: #2a2a2a;
	letter-spacing: -0.05em;
	margin-bottom: 4.95%;
	font-weight: 400;
	font-family: var(--font-castoro-titling);
	font-size: var(--sec-title-font-size-l);
	line-height: 0.8;
}

.qa__wrapper {
	max-width: 1000px;
	width: 100%;
	margin-inline: auto;
}

.item_container {
	margin: 0 auto 30px;
	width: 94.8%;
	border-bottom: 0.74px solid #8a8a8a;
	color: #595959;
	font-weight: 400;
}

.item_container:last-of-type {
	margin-bottom: 0;
}

.item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: var(--font-promise-text-large);
	line-height: 2.1;
	cursor: pointer;
	margin-bottom: 10px;
	font-weight: 400;
}

.q_area {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 7%;
}

.q_text {
	display: flex;
	align-items: center;
	gap: 15px;
	font-size: 18px;
}

.faq_icon {
	background-image: url("../img/top202504/arrow_close.svg");
	width: 20px;
	height: 20px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	transition: transform 0.3s ease;
	flex-shrink: 0;
}

.item.open .faq_icon {
	background-image: url("../img/top202504/arrow_open.svg");
}

.item_open {
	display: none;
	margin-bottom: 20px;
}

.item_open.open {
	width: 94.8%;
	padding-block: 33px 7.5px;
	display: flex;
	align-items: flex-start;
	gap: 20px;
	font-size: 18px;
}

.item_open.open a {
	color: #595959;
}

.faq_q,
.faq_a {
	color: #958d5d;
	font-family: var(--font-castoro-titling);
	font-size: 24px;
	font-weight: bold;
	line-height: 1.6;
}

.bottom-cta {
	margin-bottom: 30%;
}



/* ========
    レスポンシブ
======== */
@media (max-width: 768px) {

	.pc-only {
		display: none;
	}

	.pc-only-inline {
		display: none;
	}

	.sp-only {
		display: block;
	}


	.bg_fixed-sp {
		display: block;
	}
	.main-contents__wrapper {
		background-image: none;
	}
	.main-visual .splide__slide img {
		aspect-ratio: 39 / 60;
	}

	.main-visual .splide {
		height: initial;
	}

	.main-visual {
		padding-top: var(--header-height-sp);
		/* padding-top: 0; */
		height: auto;
	}

	.fv-text {
		left: 5%;
		bottom: 10%;
		top: auto;
		transform: none;
		text-align: left;
		gap: 18px;
	}

	.fv-text__top {
		font-size: clamp(12px, 4.6vw, 24px);
		line-height: 1.6;
	}

	.fv-text__logo {
		width: 50%;
	}

	.fv-text__bottom {
		font-size: clamp(12px, 3.5vw, 21px);
		line-height: 1.6;
	}

	.main-visual .splide__slide .co-founder {
		gap: 3.5px;
		top: 10%;
		right: 10%;
	}
	.co-founder__role, 
	.co-founder__name {
		font-size: max(9px, 3.5vw);
	}
	.main-visual .splide__slide .fv-doctor__role, .main-visual .splide__slide .fv-doctor__name {
		padding: 2px;
	}
	.fv-doctor__role {
		/* font-size: 9.85px; */
		font-size: clamp(9px, 2.52vw, 18px);
	}
	.fv-doctor__name {
		font-size: clamp(12px, 4.1vw, 32px);
		/* font-size: 16px; */
	}
	.fv-doctor01 .fv-doctor__role {
		/* font-size: 10.27px; */
		font-size: clamp(10px, 2.63vw, 22px);
	}
	.fv-doctor01 .fv-doctor__name {
		font-size: clamp(9px, 4.2vw, 33px);
		/* font-size: 16.69px; */
	}
	.fv-doctor01 {
		right: 79%;
	}
	.fv-doctor02 {
		right: 48%;
	}
	.fv-doctor03 {
		right: 17%;
	}

	.main-visual .splide__slide .fv-doctor {
		top: 32.5%;
	}

	.message {
		padding-block: 0;
	}

	#ginza-branch,
	#shinjuku-branch {
		scroll-margin-top: 100px;
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
	}

	/* ページ全体のスムーズスクロールを確保 */
	html,
	body {
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
	}

	/* SNSアイコン */
	.sp-nav-sns {
		display: flex;
		justify-content: center;
		margin-top: 30px;
		gap: 20px;
	}

	.sp-nav-sns-link {
		display: inline-block;
	}

	.sp-nav-sns-link img {
		width: 35px;
		height: 35px;
		object-fit: contain;
	}

	.sp-nav-copyright {
		color: #999;
		text-align: center;
		font-size: 10px;
		padding: 20px;
		margin-top: 20px;
	}

	/* 閉じるボタン */
	.sp-close-btn {
		position: absolute;
		top: 15px;
		right: 15px;
		width: 20px;
		height: 20px;
		cursor: pointer;
	}

	.sp-close-btn::before,
	.sp-close-btn::after {
		content: "";
		position: absolute;
		top: 50%;
		left: 0;
		width: 100%;
		height: 2px;
		background-color: #fff;
	}

	.sp-close-btn::before {
		transform: rotate(45deg);
	}

	.sp-close-btn::after {
		transform: rotate(-45deg);
	}

	.fv__bottom {
		width: 65%;
		margin: 26px auto;
	}


	.icon-bubble {
		top: -45.588%;
		left: 50%;
		transform: translate(-50%, 0);
		animation: upDown 2s infinite;
	}

	@keyframes upDown {
		0% {
			transform: translate(-50%, 0);
		}

		50% {
			transform: translate(-50%, 20%);
		}

		100% {
			transform: translate(-50%, 0);
		}
	}

	/* ==============
    message
    ============== */
	.section__title {
		font-size: min(7.69vw, 30px);
	}

	.section__title--ja {
		font-size: min(2.5vw, 10px);
	}

	.message__title img {
		width: 65.9%;
		margin: 55px auto 17px;
	}

	.message__title::after {
		height: min(12vw, 47px);
		bottom: -55%;
	}

	.message-top_img {
		display: block;
		width: 100%;
		aspect-ratio: 319 / 462.58;
	}

	.message-top_img {
		margin-top: min(23.85%, 93px);
		width: 90%;
	}

	.message__text-sp {
		display: block;
		font-family: var(--font-shippori-mincho);
		line-height: 2.1;
		text-align: left;
		margin-top: min(5.13%, 20px);
		margin-inline: auto;
		/* font-size: clamp(12px, 4.1vw, 16px); */
		font-size: 1rem;
		width: 92%;
	}

	.message__text {
		display: none;
	}

	.message__container {
		width: 100%;
		margin: 6% auto 10%;
		padding-inline: 5%;
	}

	.img_vbc {
		height: 135px;
		width: 100%;
		object-fit: cover;
	}


	.menu {
		padding-block: 92px 0;
	}

	.surgery {
		padding-bottom: 0;
	}

	.menu__title {
		font-size: min(7.6vw, 30px);
		line-height: 1.5;
	}

	.menu__title--en {
		font-size: min(3.8vw, 15px);
	}


	.menu__banner--container {
		margin: 35% auto 25%;
	}

	.menu__banner--list {
		flex-direction: column;
		margin-inline: auto;
		width: 70%;
		gap: 33px;
	}

	.menu__banner--list a {
		width: 100%;
		max-width: none;
	}

	.menu__banner--list li {
		max-width: 100%;
		width: 100%;
	}

	.menu__banner--list li:nth-child(1),
	.menu__banner--list li:nth-child(2) {
		margin-bottom: 0;
	}

	.menu__surgical--wrapper {
		padding-top: 75px;
	}

	.menu__surgical--container {
		margin-top: 10%;
	}

	.menu__surgical--list {
		flex-direction: column;
		gap: 30px;
	}

	.menu__surgical--list a {
		width: 100%;
		padding-inline: 20px;
		margin-inline: auto;
	}

	/* ==========
    case症例
    ============*/
	.case__title--bg {
		height: min(38.4vw, 150px);
	}

	.case__title--text {
		font-size: min(6.1vw, 24px);
	}

	.case__container {
		margin: -7% auto 34%;
		padding-top: 9%;
	}

	.tab-menu {
		align-items: flex-end;
	}

	.card {
		width: 100%;
		margin-right: 0;
		margin-left: 0;
	}

	.card-container {
		margin-bottom: 8.7%;
	}

	.card img {
		width: 100%;
		height: auto;
	}

	.card-header {
		padding: 8px 0;
	}

	.card-image-caption {
		font-size: clamp(10px, 3.7vw, 14.64px);
		line-height: 1.7;
	}

	.case__container {
		width: 90%;
		padding-inline: 4%;
	}

	.case__bottom-link {
		width: 90%;
		font-size: var(--font-promise-text-small);
	}

	.tab-item {
		font-size: clamp(12px, 3.8vw, 15px);
		padding: 10px 0;
	}

	.case__bottom-link img {
		width: min(4.3vw, 17px);
	}

	/* ===================
	facial sp
	=================*/
	.facial {
		background-image: url(../img/top202504/bg_facial-sp.png);
	}

	.facial__title {
		padding-top: 79px;
		font-size: 30px;
		line-height: 1.167;
		margin-bottom: 65px;
	}

	.facial__title--ja {
		font-size: 12px;
		margin-bottom: 0;
	}


	/* ==========
    celebrity
    ============== */
	.celebrity {
		padding-block: 95px 70px;
	}

	.celebrity__title {
		width: 95%;
	}

	.celebrity__image {
		width: 100%;
	}

	/* =========
    reason promise
    ================ */
	.promise-strengths__wrapper {
		background-image: url(../img/top202504/bg_reason-promise_sp.jpg);
		background-position: center top;
		background-size: cover;
		padding-top: 30%;
	}

	.strengths__wrapper {
		padding-inline: 5%;
		margin-bottom: 30px;
		flex-direction: column;
	}

	.strengths__container {
		width: 87%;
		flex-direction: column;
		margin: 91px auto 0;
	}

	.strengths__container--text {
		padding: 14px 16px 16px;
		width: 100%;
	}

	.strengths__container--img {
		width: 100%;
		max-width: 100%;
	}
	.strengths__container::before {
		font-size: 52px;
	}

	.strengths__container--text-l {
		/* font-size: clamp(12px, 5.1vw, 20px); */
		/* font-size: 24px; */
		font-size: clamp(20px, 6.1vw, 24px);
	}

	.strengths__container--text-s {
		/* font-size: clamp(10px, 4.1vw, 16px); */
		font-size: 15px;
		margin-top: 5%;
	}

	.strengths__container--text-img {
		width: 70%;
	}

	.promise {
		padding-top: 50px;
	}

	.promise__wrapper {
		flex-direction: column;
		width: 90%;
	}

	.promise__content {
		width: 100%;
		max-width: 100%;
		margin-bottom: 18.7%;
	}

	.promise__number {
		font-size: min(7.6vw, 30px);
	}

	.promise__img {
		width: 255px;
		margin: 6% auto 10%;
	}

	.promise__heading {
		font-size: 20px;
		margin-bottom: 5%;
		letter-spacing: 0.1em;
	}

	.promise__text {
		font-size: min(4.1vw, 16px);
		line-height: 2.1;
		letter-spacing: 0.1em;
	}

	.strengths__link {
		margin-inline: auto;
		margin-bottom: 10px;
	}

	/* ==========
    movie
    ========== */
	.movie__container {
		width: 100%;
		overflow-x: auto;
		padding-inline: 5%;
		margin-top: 6.4%;
		display: flex;
		flex-wrap: nowrap;
		justify-content: flex-start;
		gap: 20px;
	}

	.movie__content {
		flex: 0 0 300px;
		/* 幅300pxで固定、縮小しない */
		width: 300px;
		padding-block: 25px 21px;
	}

	.scroll-icon {
		width: 16%;
	}

	/* ==========
    DOCTOR
    =========== */
	.doctor__title {
		font-size: clamp(12px, 7.6vw, 30px);
	}

	.doctor {
		padding-block: 77px;
		padding-inline: 20px;
	}

	.doctor__container {
		flex-direction: column;
		padding-inline: 0px;
	}

	.doctor__img {
		width: 80%;
		margin-inline: auto;
	}

	.doctor__img--top {
		width: 22vw;
	}

	.doctor__img--top {
		left: 5.5%;
	}

	.doctor__content-item--active {
		flex-direction: column;
	}

	.doctor__profile {
		width: 100%;
		padding-bottom: 0;
	}

	.doctor__img--right {
		bottom: -17%;
		right: 0;
		width: 42%;
		margin-top: -80px;
	}

	.doctor__name {
		font-size: clamp(10px, 6.9vw, 27px);
		margin-bottom: 10px;
	}

	.doctor__role {
		font-size: clamp(10px, 4.6vw, 18px);
	}

	.doctor__wrapper {
		width: 100%;
		margin-top: 50px;
	}

	.doctor__content-wrapper {
		flex-direction: column;
		max-width: 100%;
	}

	.doctor__heading {
		margin-top: 35%;
	}

	.doctor__case {
		width: 100%;
	}

	.doctor__card {
		flex: 1 1 100%;
		max-width: 100%;
	}

	.doctor__card-button {
		width: 60%;
		font-size: 16px;
	}

	.doctor__card-title {
		font-size: 16px;
	}

	.doctor__tabs {
		flex-wrap: wrap;
		width: 100%;
		gap: 2%;
		justify-content: space-between;
	}

	.doctor__tab {
		flex: 0 0 48%;
		padding: 8px 0;
		width: 48%;
		margin-bottom: 8%;
	}

	.doctor__tab:nth-child(3) {
		flex: 0 0 48%;
		/* 他のタブと同じサイズにする */
	}

	.doctor__links a {
		font-size: 10px;
		padding-inline: 10px;
	}

	/* =================
	equipment
	==================*/
	.equipment__title--en {
		padding-top: 20px;
	}

	.equipment__lead {}

	.equipment__items {
		flex-direction: row;
		gap: 22px;
		max-width: none;
		width: 1588px;
		padding-inline: 25px;
	}

	.equipment__items--wrapper {
		overflow-x: auto;
		padding-bottom: 50px;
	}

	.equipment__item {
		width: 300px;
		flex-direction: column;
		gap: 26px;
	}

	.equipment__image {
		width: 300px;
		height: auto;
		aspect-ratio: 300 / 225;
	}

	.equipment__tagline {
		font-size: 18px;
		line-height: 1.6;
		margin-bottom: 7px;
	}

	.equipment__name {
		font-size: 24px;
		line-height: 1.2;
	}

	.equipment__line {
		width: 15px;
		height: 3px;
		margin-block: 23.25;
	}

	.equipment__detail {
		font-size: 16px;
		line-height: 1.8;
	}

	/* ==========
    TOPICS
    ============= */

	.topics {
		padding-block: 115px;
		background-image: url(../img/top202504/bg_topics-sp.png);
		background-position: top center;
	}

	.topics__title {
		margin-block: 0 8.4%;
		font-size: min(10.2vw, 40px);
	}

	.topics__container {
		flex-wrap: wrap;
		justify-content: center;
		padding-inline: 5%;
		margin-bottom: 15%;
		width: 100%;
	}

	.topics__card {
		width: 48%;
		margin-bottom: 9%;
	}

	.topics-date {
		color: #929292 !important;
		display: block;
		font-size: 10px;
		margin-block: 10px;
	}

	.topics__text {
		font-size: clamp(10px, 3.5vw, 14px);
	}

	/* =========
    CLINIC
    ===========*/
	.clinic {
		padding-block: 130px;
	}

	.clinic__tab {
		border: 2px solid #435168;
	}

	.clinic__name {
		font-size: 24px;
	}

	.clinic__tab-container {
		padding-inline: 5%;
	}

	.clinic__content--active {
		flex-direction: column-reverse;
	}

	.clinic__info-block {
		width: 100%;
		padding: 0 5%;
	}

	.clinic__social-icon {
		width: 30px;
		height: 30px;
	}

	.clinic__contact-button {
		margin-inline: auto;
		width: 69%;
	}

	.clinic__image-block {
		width: 100%;
		padding-bottom: 10%;
	}

	.clinic__info-table th {
		margin-right: 30px;
	}

	.recruit {
		width: 84.615%;
		padding-bottom: 0;
	}

	/* ==============
    Q&A
    ============== */
	.qa__title {
		font-size: clamp(12px, 10.2vw, 30px);
		line-height: 1.3;
	}

	.item,
	.item_open.open {
		font-size: clamp(12px, 4vw, 16px);
	}

	.faq_q,
	.faq_a {
		font-size: 14px;
	}

	.faq_icon {
		width: 12px;
	}

	.q_text {
		align-items: baseline;
	}
}