/* 
 * Main Stylesheet
 * 
 * Styled based on: Simple, stylish, and operable (Reference: shirosato-heartland-dc.jp)
 * Color Scheme: Gentle Pink
 */

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;600&family=Zen+Kaku+Gothic+New:wght@400;500;700&display=swap');

/* ==========================================================================
   CSS Variables & Tokens (Gentle Pink & Soft Tones)
   ========================================================================== */
:root {
	/* Colors - Gentle Pink Palette */
	--color-primary: #eb4773;       /* Logo Pink */
	--color-primary-hover: #cc3560; /* Slightly darker pink for hover */
	--color-accent: #f9e1e6;        /* Very light pink for backgrounds/accents */
	
	/* Neutral Scale (Warm & Soft) */
	--color-gray-50:  #fffafb;      /* Almost white with pink tint */
	--color-gray-100: #fcf5f7;
	--color-gray-200: #f0e6e8;
	--color-gray-300: #d6c6c9;
	--color-gray-500: #6b5f62;
	--color-gray-700: #3d3336;      /* Dark brown-gray for text */
	--color-gray-900: #33292b;      /* Deepest color for headings */
	
	--text-main: var(--color-gray-700);
	--text-heading: var(--color-gray-900);
	--text-muted: var(--color-gray-500);
	--bg-body: var(--color-gray-50);
	--bg-surface: #ffffff;
	--border-color: var(--color-gray-200);

	/* Typography */
	--font-sans: 'Zen Kaku Gothic New', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--font-heading: var(--font-sans);
	--text-base: 16px;
	--line-height-base: 1.8; /* Airy and readable */

	/* Spacing */
	--space-xs: 0.5rem;
	--space-sm: 1.5rem;
	--space-md: 3rem;
	--space-lg: 5rem;
	--space-xl: 8rem;

	/* Border Radius & Shadows (Softer and larger) */
	--radius-sm: 8px;
	--radius-md: 16px;
	--radius-lg: 24px;
	--radius-full: 9999px;
	--shadow-sm: 0 4px 10px rgb(229 159 177 / 0.05);
	--shadow-md: 0 10px 30px rgb(229 159 177 / 0.1);
	--shadow-lg: 0 20px 40px rgb(229 159 177 / 0.15);
	
	/* Layout */
	--container-width: 1080px; /* Slightly narrower for elegance */
}

/* ==========================================================================
   Loading Screen
   ========================================================================== */

#loading-screen {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	opacity: 1;
	transition: opacity 0.6s ease;
}

#loading-screen.is-hidden {
	opacity: 0;
	pointer-events: none;
}

.loading-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.8rem;
}

.loading-logo {
	width: 72px;
	height: 72px;
	object-fit: contain;
	border-radius: var(--radius-sm);
	animation: loading-pulse 1.6s ease-in-out infinite;
}

@keyframes loading-pulse {
	0%, 100% { opacity: 1;   transform: scale(1);    }
	50%       { opacity: 0.7; transform: scale(0.95); }
}

/* ==========================================================================
   Stagger Reveal（診療内容・こだわり）
   ========================================================================== */

/* JS が .will-stagger を付与したときだけ非表示（JS 無効時は普通に表示） */
.will-stagger {
	opacity: 0;
	transform: translateY(32px);
	transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
	            transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.will-stagger.is-stagger-revealed {
	opacity: 1;
	transform: translateY(0);
}

/* 3つの跳ねるドット */
.loading-dots {
	display: flex;
	gap: 6px;
	align-items: center;
	height: 16px;
}

.loading-dots span {
	display: block;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background-color: var(--color-primary);
	animation: loading-bounce 1.2s ease-in-out infinite;
}

.loading-dots span:nth-child(1) { animation-delay: 0s;    }
.loading-dots span:nth-child(2) { animation-delay: 0.2s;  }
.loading-dots span:nth-child(3) { animation-delay: 0.4s;  }

@keyframes loading-bounce {
	0%, 80%, 100% { transform: translateY(0);    opacity: 0.4; }
	40%           { transform: translateY(-8px); opacity: 1;   }
}

/* ==========================================================================
   Scroll Reveal Animation
   ========================================================================== */

/* 初期状態：透明＋少し下にオフセット */
.will-reveal {
	opacity: 0;
	transform: translateY(40px);
	transition: opacity 0.8s ease, transform 0.8s ease;
}

/* スクロールで画面に入ったとき */
.will-reveal.is-revealed {
	opacity: 1;
	transform: translateY(0);
}

/* ==========================================================================
   Reset & Base Styles
   ========================================================================== */
*, *::before, *::after {
	box-sizing: border-box;
}

html {
	font-size: var(--text-base);
	scroll-behavior: smooth;
}

body {
	margin: 0;
	font-family: var(--font-sans);
	font-weight: 500;
	color: var(--text-main);
	background-color: var(--bg-body);
	line-height: var(--line-height-base);
	letter-spacing: 0.05em; /* Stylish wide tracking */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
	color: var(--text-heading);
	font-family: var(--font-heading);
	font-weight: 500; /* Not too bold for a gentle look */
	line-height: 1.4;
	margin-top: 0;
	margin-bottom: var(--space-sm);
	letter-spacing: 0.08em;
}

/* Stylish Subtitles typical in Japanese clinic sites (e.g. English + Japanese) */
.section-title {
	text-align: center;
	margin-bottom: var(--space-md);
}

.section-title-en {
	display: block;
	color: var(--color-primary);
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	margin-bottom: 0.5rem;
}

.section-title-jp {
	font-size: 2rem;
	position: relative;
	padding-bottom: 1rem;
}

.section-title-jp::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 40px;
	height: 2px;
	background-color: var(--color-primary);
}

a {
	color: var(--color-primary);
	text-decoration: none;
	transition: all 0.3s ease;
}

a:hover {
	color: var(--color-primary-hover);
}

img {
	max-width: 100%;
	height: auto;
	display: block;
	border-radius: var(--radius-sm); /* Soft corners on all images */
}

/* Buttons */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 1rem 3rem;
	background-color: var(--color-primary);
	color: #fff;
	border-radius: var(--radius-full);
	font-weight: 500;
	letter-spacing: 0.1em;
	transition: all 0.3s ease;
	box-shadow: var(--shadow-sm);
}

.btn:hover {
	background-color: var(--color-primary-hover);
	color: #fff;
	transform: translateY(-2px);
	box-shadow: var(--shadow-md);
}

/* ==========================================================================
   Layout & Utilities
   ========================================================================== */
.container {
	width: 100%;
	max-width: var(--container-width);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--space-sm);
	padding-right: var(--space-sm);
}

.container--narrow { max-width: 800px; }
.container--flex { display: flex; }
.container--space-between { justify-content: space-between; }
.container--align-center { align-items: center; }

.text-center { text-align: center; }
.margin-bottom-sm { margin-bottom: var(--space-sm); }
.margin-bottom-md { margin-bottom: var(--space-md); }
.margin-bottom-lg { margin-bottom: var(--space-lg); }
.padding-y-sm { padding-top: var(--space-sm); padding-bottom: var(--space-sm); }
.padding-y-md { padding-top: var(--space-md); padding-bottom: var(--space-md); }
.padding-y-lg { padding-top: var(--space-lg); padding-bottom: var(--space-lg); }

.screen-reader-text,
.sr-only {
	border: 0;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	white-space: nowrap;
	width: 1px;
	word-wrap: normal !important;
}

/* ==========================================================================
   Components
   ========================================================================== */

/* ------------------------------------------------------------------ */
/* Header                                                               */
/* ------------------------------------------------------------------ */
.site-header {
	background-color: rgba(255, 255, 255, 0.97);
	backdrop-filter: blur(10px);
	position: relative; /* PCではスクロールで流れる */
	z-index: 300;
	border-bottom: 1px solid var(--border-color);
	box-shadow: 0 2px 12px rgb(229 159 177 / 0.08);
}

/* PC専用：明示的に固定しない */
@media (min-width: 769px) {
	.site-header {
		position: relative !important;
	}
}

/* 上段：ロゴ ／ アクション群 */
.header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: var(--container-width);
	margin: 0 auto;
	padding: 0.9rem var(--space-sm);
	gap: 1rem;
}

/* ロゴ部分が縮みすぎないように */
.site-branding {
	flex-shrink: 1;
	min-width: 0;
}

/* アクション群は縮まないように */
.header-actions {
	flex-shrink: 0;
}

/* ロゴ ＋ 医院名 */
.branding-link {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	text-decoration: none;
	color: var(--text-heading); /* <a> のピンク色を上書き */
}
.branding-link:hover {
	color: var(--text-heading);
}

.site-logo-img {
	width: auto;
	height: 40px;
	border-radius: var(--radius-sm);
	object-fit: contain;
	flex-shrink: 0;
}

.site-name {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--text-heading) !important; /* ピンク継承を確実にブロック */
	letter-spacing: 0.1em;
	white-space: nowrap;
	line-height: 1.3;
}

/* 右側アクション群 */
.header-actions {
	display: flex;
	align-items: center;
	gap: 1.5rem;
}

/* 電話番号 */
.header-tel {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	color: var(--text-heading);
	font-size: 1.5rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-decoration: none;
	transition: color 0.2s;
}
.header-tel svg {
	color: var(--color-primary);
	flex-shrink: 0;
}
.header-tel:hover {
	color: var(--color-primary);
}

/* MAPアイコン */
.header-map {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.1rem;
	color: var(--color-primary);
	text-decoration: none;
	transition: color 0.2s;
	line-height: 1;
}
.header-map svg {
	display: block;
}
.header-map-label {
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.1em;
}
.header-map:hover {
	color: var(--color-primary);
}


/* ハンバーガーボタン本体 */
.menu-toggle {
	background: transparent;
	border: 2.5px solid var(--color-primary);
	cursor: pointer;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 8px;
	transition: background 0.2s, border-color 0.2s;
	position: relative;
	flex-shrink: 0;
	z-index: 300;
}
.menu-toggle:hover {
	background: rgba(235, 71, 115, 0.08);
	border-color: var(--color-primary-hover);
}

/* 三本線アイコン */
.menu-icon,
.menu-icon::before,
.menu-icon::after {
	content: '';
	display: block;
	position: absolute;
	width: 20px;
	height: 2.5px;
	background-color: var(--color-primary);
	border-radius: 2px;
	transition: all 0.3s ease;
}
.menu-icon         { top: 50%; transform: translateY(-50%); }
.menu-icon::before { top: -7px; }
.menu-icon::after  { bottom: -7px; }

/* 開いたとき：× に変形 */
.menu-toggle[aria-expanded="true"] .menu-icon {
	background: transparent;
}
.menu-toggle[aria-expanded="true"] .menu-icon::before {
	top: 0;
	transform: rotate(45deg);
}
.menu-toggle[aria-expanded="true"] .menu-icon::after {
	bottom: 0;
	transform: rotate(-45deg);
}

/* ------------------------------------------------------------------ */
/* PC用ナビゲーションバー（ヘッダー直下に常時表示）                       */
/* ------------------------------------------------------------------ */
.desktop-navigation {
	display: none; /* デフォルト非表示（SPではハンバーガーを使うため） */
	background-color: rgba(255, 255, 255, 0.97);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--border-color);
	box-shadow: 0 2px 12px rgb(229 159 177 / 0.08);
}

@media (min-width: 769px) {
	.desktop-navigation {
		display: block;
		position: sticky;
		top: 0;
		z-index: 250;
	}
}

.desktop-nav-inner {
	max-width: var(--container-width);
	margin: 0 auto;
}

.desktop-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0;
}

.desktop-navigation li {
	border-right: 1px solid var(--border-color);
}

.desktop-navigation li:last-child {
	border-right: none;
}

.desktop-navigation a {
	color: var(--text-main);
	font-weight: 500;
	font-size: 0.85rem;
	padding: 0.75rem 1.6rem;
	display: block;
	letter-spacing: 0.08em;
	transition: background 0.2s, color 0.2s;
	text-decoration: none;
	position: relative;
}

.desktop-navigation a::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%) scaleX(0);
	width: 60%;
	height: 2px;
	background-color: var(--color-primary);
	transition: transform 0.25s ease;
}

.desktop-navigation a:hover {
	background-color: var(--color-accent);
	color: var(--color-primary);
}

.desktop-navigation a:hover::after {
	transform: translateX(-50%) scaleX(1);
}

/* 現在のページをハイライト */
.desktop-navigation .current-menu-item > a,
.desktop-navigation .current_page_item > a {
	color: var(--color-primary);
	font-weight: 700;
}

.desktop-navigation .current-menu-item > a::after,
.desktop-navigation .current_page_item > a::after {
	transform: translateX(-50%) scaleX(1);
}

/* ---- ドロップダウンメニュー ---- */
.desktop-navigation .has-dropdown {
	position: relative;
}

/* ▼ 矢印アイコン */
.dropdown-arrow {
	display: inline-block;
	width: 0;
	height: 0;
	margin-left: 0.4em;
	vertical-align: 0.1em;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 5px solid currentColor;
	transition: transform 0.25s ease;
}

.desktop-navigation .has-dropdown:hover .dropdown-arrow {
	transform: rotate(180deg);
}

/* ドロップダウン本体 */
.dropdown-menu {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	min-width: 200px;
	list-style: none;
	margin: 0;
	padding: 0.4rem 0;
	background-color: rgba(255, 255, 255, 0.98);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid var(--border-color);
	border-top: 2px solid var(--color-primary);
	border-radius: 0 0 var(--radius-sm) var(--radius-sm);
	box-shadow: 0 8px 24px rgb(229 159 177 / 0.12);

	/* 非表示状態 */
	opacity: 0;
	visibility: hidden;
	transform: translateX(-50%) translateY(8px);
	transition: opacity 0.25s ease,
	            visibility 0.25s ease,
	            transform 0.25s ease;
	z-index: 300;
}

/* ホバーで表示 */
.desktop-navigation .has-dropdown:hover .dropdown-menu {
	opacity: 1;
	visibility: visible;
	transform: translateX(-50%) translateY(0);
}

/* ドロップダウン項目 */
.dropdown-menu li {
	border-right: none;
	border-bottom: none;
}

.dropdown-menu a {
	display: block;
	padding: 0.6rem 1.4rem;
	font-size: 0.82rem;
	font-weight: 500;
	color: var(--text-main);
	letter-spacing: 0.06em;
	white-space: nowrap;
	transition: background 0.2s, color 0.2s, padding-left 0.2s;
	text-decoration: none;
}

.dropdown-menu a::after {
	display: none; /* 親メニューのアンダーラインは不要 */
}

.dropdown-menu a:hover {
	background-color: var(--color-accent);
	color: var(--color-primary);
	padding-left: 1.8rem;
}

/* PC時：ハンバーガーボタン非表示 */
@media (min-width: 769px) {
	.menu-toggle {
		display: none !important;
	}
}

/* ------------------------------------------------------------------ */
/* SP用ナビゲーション（固定オーバーレイ・ハンバーガー式）                */
/* ------------------------------------------------------------------ */
.main-navigation {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 200;
}
.admin-bar .main-navigation {
	top: 32px;
}
@media screen and (max-width: 782px) {
	.admin-bar .main-navigation {
		top: 46px;
	}
}
.main-navigation {
	background-color: rgba(255, 255, 255, 0.98);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border-bottom: 1px solid var(--border-color);
	box-shadow: 0 4px 20px rgb(229 159 177 / 0.12);

	/* 閉じているとき：上に隠す */
	transform: translateY(-100%);
	opacity: 0;
	pointer-events: none;
	transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
	            opacity 0.35s ease;
}
.main-navigation.is-open {
	transform: translateY(0);
	opacity: 1;
	pointer-events: auto;
}
.main-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	max-width: var(--container-width);
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0;
}
.main-navigation li {
	border-right: 1px solid var(--border-color);
}
.main-navigation li:last-child {
	border-right: none;
}
.main-navigation a {
	color: var(--text-main);
	font-weight: 500;
	font-size: 0.9rem;
	padding: 0.85rem 2rem;
	display: block;
	letter-spacing: 0.08em;
	transition: background 0.2s, color 0.2s;
}
.main-navigation a:hover {
	background-color: var(--color-accent);
	color: var(--color-primary);
}

/* PCではSP用オーバーレイを完全非表示 */
@media (min-width: 769px) {
	.main-navigation {
		display: none !important;
	}
}

/* ------------------------------------------------------------------ */
/* Hero（メインビジュアル）                                             */
/* ------------------------------------------------------------------ */
.hero-section {
	position: relative;
	width: 100%;
	overflow: hidden;
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
	padding: clamp(2rem, 4vw, 4rem) clamp(1.5rem, 4vw, 4rem);
	/* PC: 2400 × 845 のワイドバナー比率（元画像と一致） */
	aspect-ratio: 2400 / 845;
}

/* 背景画像：picture / img を絶対配置で全面に敷く */
.hero-picture {
	position: absolute;
	inset: 0;
	z-index: 0;
	display: block;
	line-height: 0;
}

.hero-image {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	object-position: center;
}

/* 左下だけ淡く暗くして文字の可読性を補強 */
.hero-section::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(
		120deg,
		rgba(255, 255, 255, 0.55) 0%,
		rgba(255, 255, 255, 0.25) 35%,
		rgba(255, 255, 255, 0) 60%
	);
}

/* SP：画像(1500×1120)を少し上下をトリミングして縦幅を抑える */
@media (max-width: 767px) {
	.hero-section {
		/* 画像比より少し横長に（上下を均等に少しだけクロップ） */
		aspect-ratio: 5 / 3;
		padding: 0.85rem 1rem;
	}
	.hero-image {
		/* 中央配置で上下を均等にトリミング */
		object-fit: cover;
		object-position: center;
	}
	.hero-section::after {
		/* 画像全体が見えるので、下半分をほんのり白く浮かせて文字を読みやすく */
		background: linear-gradient(
			to top,
			rgba(255, 255, 255, 0.65) 0%,
			rgba(255, 255, 255, 0.25) 35%,
			rgba(255, 255, 255, 0) 60%
		);
	}
}

/* ヒーローキャッチ（左下配置・オーバーレイより前面） */
.hero-catch {
	position: relative;
	z-index: 2;
	width: 100%;
	/* 人物に文字がかぶらないよう左側エリアに収める */
	max-width: min(500px, 42vw);
	margin: 0;
}

.hero-catch-inner {
	text-align: left;
	width: 100%;
}

/* ---- 信頼バッジ ---- */
.hero-badges {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.55rem;
	margin: 0 0 1.8rem;
}

.hero-badge {
	display: inline-block;
	padding: 0.4em 1em;
	background-color: #FBEAF0;
	color: #72243E;
	border-radius: var(--radius-full);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.04em;
	line-height: 1.4;
	white-space: nowrap;
}

/* ---- メインキャッチ（明朝・大きめ・1行固定） ---- */
.hero-catch-title-main {
	font-family: 'Noto Serif JP', 'Zen Kaku Gothic New', serif;
	font-size: clamp(1.5rem, 2.4vw, 2.2rem);
	font-weight: 500;
	color: var(--text-heading);
	letter-spacing: 0.08em;
	line-height: 1.4;
	margin: 0 0 1.2rem;
	white-space: nowrap;
}

/* ---- サブコピー ---- */
.hero-catch-sub {
	font-size: clamp(0.82rem, 1.05vw, 0.94rem);
	color: var(--text-main);
	letter-spacing: 0.04em;
	line-height: 1.8;
	margin: 0 0 1.6rem;
	max-width: 100%;
}

.hero-catch-sub strong {
	font-weight: 700;
	color: var(--text-heading);
}

.hero-br-sp {
	display: none;
}

/* 汎用：スマホでのみ改行 */
.br-sp {
	display: none;
}

/* PCでのみ改行（SPでは無効化して自然折り返しに） */
.br-pc {
	display: inline;
}

@media (max-width: 767px) {
	.hero-br-sp {
		display: inline;
	}
	.br-sp {
		display: inline;
	}
	.br-pc {
		display: none;
	}
	.hero-badges {
		gap: 0.4rem;
		margin-bottom: 1.2rem;
	}
	.hero-badge {
		font-size: 0.68rem;
		padding: 0.32em 0.8em;
	}
	.hero-catch {
		/* SP：人物が右〜中央寄りなので、テキストは左約半分に収める */
		max-width: 56%;
	}
	.hero-catch-title-main {
		/* SPはbr.br-spで「一生つきあう、／白い歯を。」に折り返す */
		font-size: clamp(1rem, 4.4vw, 1.4rem);
		letter-spacing: 0.03em;
		line-height: 1.35;
		margin-bottom: 0.5rem;
		white-space: normal;
	}
	.hero-catch-sub {
		font-size: clamp(0.66rem, 2.6vw, 0.74rem);
		letter-spacing: 0.02em;
		line-height: 1.55;
		margin-bottom: 0;
		/* 親（.hero-catch）側で幅を絞っているのでここは100% */
		max-width: 100%;
	}
}

/* ------------------------------------------------------------------ */
/* Hero CTA Buttons                                                    */
/* ------------------------------------------------------------------ */
.hero-cta-row {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 0.9rem;
	flex-wrap: wrap;
}

.hero-cta-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.85rem 1.9rem;
	border-radius: 999px;
	font-size: 0.9rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	transition: all 0.3s ease;
	text-decoration: none;
	border: 1.5px solid transparent;
	min-height: 46px;
}

/* プライマリ：塗りつぶしピンク */
.hero-cta-btn--primary {
	background-color: var(--color-primary);
	color: #fff;
	box-shadow: 0 6px 18px rgba(235, 71, 115, 0.25);
}
.hero-cta-btn--primary:hover {
	background-color: var(--color-primary-hover);
	color: #fff;
	transform: translateY(-2px);
}

/* セカンダリ：白背景＋ピンク枠＋ピンク文字 */
.hero-cta-btn--tel {
	background-color: #ffffff;
	color: var(--color-primary);
	border-color: var(--color-primary);
}
.hero-cta-btn--tel:hover {
	background-color: var(--color-primary);
	color: #ffffff;
}

/* モバイル：CTAは縦積み、左側のみに収める */
@media (max-width: 767px) {
	.hero-cta-row {
		flex-direction: column;
		gap: 0.45rem;
		width: 72%;
		max-width: 240px;
		margin: 0;
		align-items: stretch;
	}
	.hero-cta-btn {
		width: 100%;
		font-size: 0.78rem;
		padding: 0.55rem 0.9rem;
		min-height: 38px;
		letter-spacing: 0.04em;
	}
}

/* ------------------------------------------------------------------ */
/* Whitening CTA Section                                               */
/* ------------------------------------------------------------------ */
.wt-cta-section {
	padding: 5rem 0;
	background: linear-gradient(135deg, #fff5f7 0%, #fff 60%);
	position: relative;
	overflow: hidden;
}

.wt-cta-section::before {
	content: '';
	position: absolute;
	top: -60px;
	right: -60px;
	width: 320px;
	height: 320px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(235,71,115,0.07) 0%, transparent 70%);
	pointer-events: none;
}

.wt-cta-inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4rem;
	align-items: center;
}

.wt-cta-label {
	display: inline-block;
	background-color: var(--color-accent);
	color: var(--color-primary);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.15em;
	padding: 0.35rem 1rem;
	border-radius: var(--radius-full);
	margin-bottom: 1rem;
}

.wt-cta-title {
	font-size: clamp(1.5rem, 3vw, 2.2rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.5;
	margin-bottom: 1.2rem;
}

.wt-cta-lead {
	color: var(--color-gray-700);
	line-height: 2;
	margin-bottom: 2rem;
	font-size: 0.95rem;
}

.wt-cta-btn {
	display: inline-block;
	padding: 0.75rem 2.5rem;
	border: 1px solid var(--color-primary);
	border-radius: var(--radius-full);
	color: var(--color-primary);
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: 0.9rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-decoration: none;
	transition: background 0.2s, color 0.2s;
}

.wt-cta-btn:hover {
	background: var(--color-primary);
	color: #fff;
}

.wt-cta-image {
	position: relative;
}

.wt-cta-image img {
	width: 100%;
	height: 380px;
	object-fit: cover;
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg);
}

.wt-cta-image::after {
	content: '';
	position: absolute;
	bottom: -12px;
	right: -12px;
	width: 100%;
	height: 100%;
	border: 2px solid var(--color-accent);
	border-radius: var(--radius-lg);
	z-index: -1;
}

@media (max-width: 900px) {
	.wt-cta-inner {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}
	.wt-cta-image {
		order: -1;
	}
	.wt-cta-image img {
		height: 260px;
	}
	.wt-cta-image::after {
		display: none;
	}
}

/* ------------------------------------------------------------------ */
/* Reason Section（選ばれる理由）                                      */
/* ------------------------------------------------------------------ */
.reason-section {
	padding: 5rem 0;
	background-color: var(--color-gray-50);
}

.reason-heading {
	text-align: center;
	margin-bottom: 3.5rem;
}

.reason-heading-en {
	display: block;
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: 0.35em;
	color: var(--color-gray-500);
	margin-bottom: 0.6rem;
	text-transform: uppercase;
}

.reason-heading-jp {
	font-size: clamp(1.4rem, 3vw, 1.8rem);
	font-weight: 500;
	color: var(--text-heading);
	letter-spacing: 0.05em;
	margin: 0;
	position: relative;
	display: inline-block;
	padding-bottom: 1rem;
}

.reason-heading-jp::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 32px;
	height: 1px;
	background-color: var(--color-primary);
}

.reason-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2rem;
}

.reason-item {
	background: #fff;
	border-radius: var(--radius-lg);
	padding: 2.5rem 2rem;
	text-align: center;
	position: relative;
	box-shadow: var(--shadow-sm);
	transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.reason-item:hover {
	box-shadow: var(--shadow-md);
	transform: translateY(-4px);
}

.reason-icon {
	width: 64px;
	height: 64px;
	background: var(--color-accent);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 1.2rem;
}

.reason-icon svg {
	width: 28px;
	height: 28px;
	color: var(--color-primary);
}

.reason-num {
	display: block;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	color: var(--color-primary);
	margin-bottom: 0.6rem;
}

.reason-title {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.6;
	margin-bottom: 1rem;
}

.reason-text {
	font-size: 0.9rem;
	color: var(--color-gray-700);
	line-height: 1.9;
	margin: 0;
	text-align: left;
}

/* 選ばれる理由の強調は、太字ではなくピンクのマーカーで表現 */
.reason-text strong {
	font-weight: inherit;
	color: inherit;
	background: linear-gradient(transparent 55%, rgba(235, 71, 115, 0.2) 55%);
	padding: 0 0.05em;
}

@media (max-width: 900px) {
	.reason-list {
		grid-template-columns: 1fr;
		max-width: 480px;
		margin: 0 auto;
		gap: 1.5rem;
	}
	.reason-item {
		padding: 2rem 1.5rem;
	}
}

/* ------------------------------------------------------------------ */
/* Journey Section（美しさのステップ）                                 */
/* ------------------------------------------------------------------ */
.journey-section {
	padding: 6rem 0;
	background-color: #fff;
}

.journey-heading {
	text-align: center;
	margin-bottom: 4rem;
}

.journey-heading-en {
	display: block;
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: 0.35em;
	color: var(--color-gray-500);
	margin-bottom: 0.6rem;
	text-transform: uppercase;
}

.journey-heading-jp {
	font-size: clamp(1.4rem, 3vw, 1.9rem);
	font-weight: 500;
	color: var(--text-heading);
	letter-spacing: 0.05em;
	margin: 0 0 1rem;
}

.journey-heading-sub {
	font-size: 0.95rem;
	color: var(--color-gray-500);
	line-height: 1.9;
	margin: 0;
}

.journey-steps {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.journey-step {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4rem;
	align-items: center;
	padding: 3rem 0;
}

.journey-step--reverse {
	direction: rtl;
}
.journey-step--reverse > * {
	direction: ltr;
}

.journey-step-img img {
	width: 100%;
	height: 300px;
	object-fit: cover;
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-md);
}

.journey-step-num {
	display: inline-block;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.2em;
	color: var(--color-primary);
	background-color: var(--color-accent);
	padding: 0.3rem 0.9rem;
	border-radius: var(--radius-full);
	margin-bottom: 0.8rem;
}

.journey-step-title {
	font-size: 1.6rem;
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 1rem;
	letter-spacing: 0.05em;
}

.journey-step-text {
	font-size: 0.95rem;
	color: var(--color-gray-700);
	line-height: 2;
	margin-bottom: 1.2rem;
}

.journey-step-link {
	display: inline-block;
	color: var(--color-primary);
	font-weight: 700;
	font-size: 0.9rem;
	letter-spacing: 0.05em;
	text-decoration: none;
	border-bottom: 1px solid var(--color-primary);
	padding-bottom: 0.1rem;
	transition: opacity 0.2s;
}
.journey-step-link:hover {
	opacity: 0.75;
	color: var(--color-primary);
}

.journey-arrow {
	text-align: center;
	padding: 0.5rem 0;
}
.journey-arrow svg {
	width: 28px;
	height: 28px;
	color: var(--color-primary);
	opacity: 0.4;
}

@media (max-width: 860px) {
	.journey-step {
		grid-template-columns: 1fr;
		gap: 1.5rem;
		padding: 2rem 0;
	}
	.journey-step--reverse {
		direction: ltr;
	}
	.journey-step-img img {
		height: 220px;
	}
	.journey-step-title {
		font-size: 1.3rem;
	}
}

/* ------------------------------------------------------------------ */
/* Hours time note                                                     */
/* ------------------------------------------------------------------ */
.hours-time-note {
	font-size: 0.78rem;
	color: var(--color-gray-500);
	font-weight: 400;
	display: block;
	margin-top: 0.2rem;
}

/* ------------------------------------------------------------------ */
/* Consultation Hours Section                                          */
/* ------------------------------------------------------------------ */
.hours-section {
	background-color: var(--bg-surface);
	padding: 2.5rem var(--space-sm) 2rem;
}

/* 見出し */
.hours-heading {
	text-align: center;
	margin-bottom: 1.2rem;
}
.hours-heading-en {
	display: block;
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: 0.35em;
	color: var(--color-gray-500);
	margin-bottom: 0.6rem;
	text-transform: uppercase;
}
.hours-heading-jp {
	font-size: 1.6rem;
	font-weight: 500;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	color: var(--text-heading);
	letter-spacing: 0.05em;
	margin: 0;
	position: relative;
	display: inline-block;
	padding-bottom: 1rem;
}
.hours-heading-jp::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 32px;
	height: 1px;
	background-color: var(--color-primary);
}

/* 白いカード */
.hours-card {
	background: #fff;
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
	max-width: 860px;
	margin: 0 auto 2.5rem;
	padding: 2.5rem 2rem;
}

/* テーブル */
.hours-table-wrap {
	overflow-x: auto;
}
.hours-table {
	width: 100%;
	border-collapse: collapse;
	text-align: center;
	font-size: 1rem;
}
.hours-table th {
	padding: 0.9rem 0.5rem;
	color: var(--color-gray-700);   /* 濃く */
	font-weight: 700;               /* 太く */
	border-bottom: 1px solid var(--border-color);
	letter-spacing: 0.08em;
	font-size: 1rem;
}
.hours-table th:first-child {
	text-align: left;
	padding-left: 0;
}
.hours-table td {
	padding: 1rem 0.5rem;
	border-bottom: 1px solid var(--border-color);
	color: var(--color-gray-700);   /* 濃く */
	font-weight: 500;               /* やや太く */
}
.hours-table tr:last-child td {
	border-bottom: none;
}
.hours-time {
	text-align: left;
	padding-left: 0 !important;
	color: var(--color-primary);
	font-weight: 500;
	letter-spacing: 0.05em;
	white-space: nowrap;
}
.hours-mark {
	font-size: 1.2rem;
	font-weight: 700;
}
.hours-mark.open   { color: var(--color-primary-hover); }  /* 濃いピンク */
.hours-mark.closed { color: var(--color-gray-500); }       /* 濃いグレー */

/* 注釈 */
.hours-note-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 1.2rem;
	font-size: 1rem;
	font-weight: 600;
	color: var(--color-gray-700);
	letter-spacing: 0.05em;
	width: 100%;
}

/* クリニック情報 */
.hours-info {
	max-width: 860px;
	margin: 0 auto;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 2rem;
	flex-wrap: wrap;
	padding-left: 2rem;  /* カード内の9:00〜の先頭に合わせる */
}
.hours-info-left,
.hours-info-right {
	line-height: 1.8;
}
.hours-clinic-name {
	font-size: 1.4rem;              /* 大きく */
	font-weight: 700;
	color: var(--color-primary-hover);  /* 少し濃いピンクに */
	margin: 0 0 0.3rem;
	letter-spacing: 0.1em;
}
.hours-tel {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 2rem;                /* 大きく */
	font-weight: 700;
	color: var(--color-primary-hover);  /* 少し濃いピンクに */
	letter-spacing: 0.05em;
	text-decoration: none;
	margin-bottom: 0.3rem;
}
.hours-tel:hover { color: var(--color-primary); }
.hours-reserve {
	font-size: 1rem;                /* 大きく */
	color: var(--color-gray-700);   /* 濃く */
	margin: 0;
}
.hours-info-right p {
	font-size: 1.1rem;              /* 大きく */
	color: var(--color-gray-700);
	margin: 0;
}

/* ------------------------------------------------------------------ */
/* Hours Section - ホームページ専用サイズ調整                          */
/* ※ .clinic-hours-table はサブページ共通パーツで利用しているため、    */
/*    トップページの .hours-section 配下だけを大きくする                */
/* ------------------------------------------------------------------ */
@media (min-width: 768px) {
	.hours-section .hours-card {
		max-width: 960px;
		padding: 3rem 2.5rem;
	}
	.hours-section .clinic-hours-table {
		font-size: 1.1rem;
	}
	.hours-section .clinic-hours-table thead th {
		padding: 1.05rem 0.7rem;
		font-size: 1rem;
	}
	.hours-section .clinic-hours-table thead th:first-child {
		font-size: 1.1rem;
		padding-left: 1.25rem;
	}
	.hours-section .clinic-hours-table tbody td {
		padding: 1.15rem 0.7rem;
	}
	.hours-section .clinic-hours-time {
		font-size: 1.05rem;
		padding-left: 1.25rem !important;
	}
	.hours-section .clinic-hours-mark {
		font-size: 1.35rem;
	}
	.hours-section .clinic-hours-note {
		font-size: 1rem;
		margin-top: 1.2rem;
		/* 上のテーブル「9:00〜11:30」の先頭に合わせる */
		padding-left: 1.25rem;
	}
}

/* SP表示時も、上のテーブルの時間セルの先頭に揃える */
@media (max-width: 767px) {
	.hours-section .clinic-hours-note {
		padding-left: 0.5rem;
	}
}

/* 土曜日の ● の右上に付く ※ を太く見せる（PC・SP共通） */
.hours-section .clinic-hours-mark-asterisk {
	font-size: 0.72rem;
	font-weight: 700;
	color: var(--text-heading);
}

/* ------------------------------------------------------------------ */
/* Philosophy Section（私たちのこだわり）                              */
/* ------------------------------------------------------------------ */
.philosophy-section {
	padding: 5rem 0;
	background-color: #fff;
}

/* 見出し */
.philosophy-heading {
	text-align: center;
	margin-bottom: 3.5rem;
}
.philosophy-heading-en {
	display: block;
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: 0.35em;
	color: var(--color-gray-500);
	margin-bottom: 0.6rem;
	text-transform: uppercase;
}
.philosophy-heading-jp {
	font-size: 1.6rem;
	font-weight: 500;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	color: var(--text-heading);
	letter-spacing: 0.05em;
	margin: 0;
	position: relative;
	display: inline-block;
	padding-bottom: 1rem;
}
.philosophy-heading-jp::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 32px;
	height: 1px;
	background-color: var(--color-primary);
}

/* 3列×2行リスト（下2つは中央寄せ） */
.philosophy-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1.5rem 2.5rem; /* 行間を3rem→1.5remに縮小 */
}

.philosophy-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	width: calc(33.333% - 1.67rem); /* 3列 */
}

/* 番号（非表示） */
.philosophy-num {
	display: none;
}

/* 画像 */
.philosophy-img-wrap {
	width: 60%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: 50%;
	margin-bottom: 1.4rem;
	border: 2px solid var(--color-accent);
}
.philosophy-img-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
	transition: transform 0.6s ease;
}
.philosophy-item:hover .philosophy-img-wrap img {
	transform: scale(1.05);
}

/* テキスト */
.philosophy-title {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--color-primary-hover);
	line-height: 1.7;
	margin: 0 0 0.8rem;
	letter-spacing: 0.05em;
}
.philosophy-text {
	font-size: 1.05rem;
	font-weight: 500;
	color: #111;
	line-height: 1.9;
	margin: 0;
}

/* ------------------------------------------------------------------ */
/* Director Section（理事長挨拶）                                      */
/* ------------------------------------------------------------------ */
.director-section {
	position: relative;
	background-color: #fff;
	padding: 6rem 0 7rem;
	overflow: hidden;
	text-align: center;
}

/* 花の装飾 */
.director-flower {
	position: absolute;
	bottom: 0;
	width: 280px;
	height: auto;
	border-radius: 0;
}
.director-flower--left  { left: 0; }
.director-flower--right {
	right: 0;
}

/* 上部の小花飾り */
.director-deco {
	position: absolute;
	border-radius: 0;
}
.director-deco--top {
	top: 2rem;
	left: 50%;
	transform: translateX(-50%);
	width: 320px;
	height: auto;
	opacity: 0.5;
}

/* コンテンツ */
.director-inner {
	position: relative;
	z-index: 1;
	max-width: 920px;
	margin: 0 auto;
}

.director-title {
	font-size: 1.8rem;
	font-weight: 500;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	color: var(--color-primary-hover);
	letter-spacing: 0.05em;
	margin: 0 0 2.5rem;
	text-align: center;
}

.director-body {
	margin-bottom: 2.5rem;
	text-align: center;
}
.director-body p {
	font-size: 1.05rem;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	color: #111;
	font-weight: 500;
	line-height: 2.1;
	margin: 0 0 1rem;
}

.director-name {
	font-size: 1.1rem;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-weight: 700;
	color: #000;
	letter-spacing: 0.1em;
	margin: 0;
	text-align: center;
}

.director-staff-btn {
	display: inline-block;
	margin-top: 2.5rem;
	padding: 0.75rem 2.5rem;
	border: 1px solid var(--color-primary);
	border-radius: var(--radius-full);
	color: var(--color-primary);
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: 0.9rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-decoration: none;
	transition: background 0.2s, color 0.2s;
}

.director-staff-btn:hover {
	background: var(--color-primary);
	color: #fff;
}

/* ------------------------------------------------------------------ */
/* Medical Section（診療内容）                                         */
/* ------------------------------------------------------------------ */
.medical-section {
	padding: 5rem 0;
	background-color: #fff;
}

/* 見出し */
.medical-heading {
	text-align: center;
	margin-bottom: 3rem;
}
.medical-heading-en {
	display: block;
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: 0.35em;
	color: var(--color-gray-500);
	margin-bottom: 0.6rem;
	text-transform: uppercase;
}
.medical-heading-jp {
	font-size: 1.6rem;
	font-weight: 500;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	color: var(--text-heading);
	letter-spacing: 0.05em;
	margin: 0;
	position: relative;
	display: inline-block;
	padding-bottom: 1rem;
}
.medical-heading-jp::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 32px;
	height: 1px;
	background-color: var(--color-primary);
}

/* カードグリッド（3×2） */
.medical-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.medical-card {
	background: #fff;
	border-radius: var(--radius-md);
	border: 1px solid var(--border-color);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.medical-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 24px rgb(229 159 177 / 0.18);
}

.medical-card-link {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 2.5rem 1.5rem 2rem;
	text-decoration: none;
	color: inherit;
	gap: 0.8rem;
}

.medical-card-icon {
	font-size: 2.6rem;
	line-height: 1;
}

.medical-card-icon-img {
	width: 64px;
	height: 64px;
	object-fit: contain;
}

.medical-card-icon-img--tinted {
	filter: invert(41%) sepia(100%) hue-rotate(311deg) saturate(700%) brightness(115%);
}

.medical-card-icon-mask {
	display: block;
	width: 64px;
	height: 64px;
	background-color: var(--color-primary);
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
}

.medical-card-icon-svg {
	width: 64px;
	height: 64px;
	color: var(--color-primary);
}

.medical-card-title {
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--text-heading);
	letter-spacing: 0.05em;
	margin: 0;
	line-height: 1.5;
}

.medical-card-more {
	font-size: 0.8rem;
	color: var(--color-primary);
	letter-spacing: 0.05em;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	margin-top: 0.2rem;
}

/* 診療内容 - 写真オーバーレイ型グリッド */
.medical-list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.25rem;
}
.medical-item {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: var(--radius-md);
	background-color: var(--color-gray-200);
	text-decoration: none;
	color: inherit;
	transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.medical-item:hover {
	transform: scale(1.04);
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
}
.medical-item-photo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.medical-item-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.medical-item-overlay {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 1rem;
	color: #fff;
	/* 上：少し明るめ、中央〜下：濃いめ。中央に文字が来るので中央を一番濃く */
	background:
		radial-gradient(ellipse at center, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.35) 70%, rgba(0, 0, 0, 0.3) 100%),
		linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.35) 100%);
}
.medical-item-en {
	font-size: 0.72rem;
	letter-spacing: 0.3em;
	color: #fff;
	opacity: 0.95;
	margin: 0 0 0.45rem;
	text-transform: uppercase;
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.55);
}
.medical-item-title {
	font-size: 1.4rem;
	font-weight: 500;
	color: #fff;
	line-height: 1.3;
	letter-spacing: 0.06em;
	margin: 0;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
}
/* 口臭治療カードの「ほんだ式口臭治療」バッジ（他カードには使わない） */
.medical-item-sublabel {
	display: inline-block;
	margin-top: 0.6rem;
	padding: 0.2rem 0.8rem;
	font-size: 0.72rem;
	letter-spacing: 0.08em;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 0.7);
	border-radius: 999px;
	line-height: 1.6;
	white-space: nowrap;
	background-color: rgba(0, 0, 0, 0.25);
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

/* フェードインアニメーション */
.fade-in-left,
.fade-in-right {
	opacity: 0;
	transition: opacity 0.7s ease, transform 0.7s ease;
}
.fade-in-left {
	transform: translateX(-40px);
}
.fade-in-right {
	transform: translateX(40px);
}
.fade-in-left.is-visible,
.fade-in-right.is-visible {
	opacity: 1;
	transform: translateX(0);
}

/* 診療内容グリッド - レスポンシブ */
@media (max-width: 1023px) {
	.medical-list {
		grid-template-columns: repeat(3, 1fr);
	}
}
@media (max-width: 640px) {
	.medical-list {
		grid-template-columns: repeat(2, 1fr);
		gap: 0.75rem;
	}
	.medical-item-title {
		font-size: 1.1rem;
		letter-spacing: 0.04em;
	}
	.medical-item-en {
		font-size: 0.62rem;
		letter-spacing: 0.22em;
		margin-bottom: 0.3rem;
	}
	.medical-item-sublabel {
		font-size: 0.62rem;
		padding: 0.15rem 0.6rem;
		margin-top: 0.4rem;
		letter-spacing: 0.05em;
	}
}

/* タブグリッド（3×2）- 旧レイアウト用（予備） */
.medical-tabs {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border: 1px solid var(--color-gray-300);
	border-radius: var(--radius-sm);
	overflow: hidden;
	margin-bottom: 2rem;
}
.medical-tab {
	background: #fff;
	border: none;
	border-right: 1px solid var(--color-gray-300);
	border-bottom: 1px solid var(--color-gray-300);
	padding: 1.2rem 1rem;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: 1rem;
	font-weight: 500;
	color: var(--text-heading);
	letter-spacing: 0.05em;
	cursor: pointer;
	transition: background 0.2s, color 0.2s;
	text-align: center;
}
.medical-tab:nth-child(3n) {
	border-right: none;
}
.medical-tab:nth-child(4),
.medical-tab:nth-child(5),
.medical-tab:nth-child(6) {
	border-bottom: none;
}
.medical-tab:hover {
	background-color: var(--color-accent);
	color: var(--color-primary);
}
.medical-tab.is-active {
	background-color: var(--color-primary);
	color: #fff;
	font-weight: 700;
}

/* コンテンツパネル */
.medical-panels {
	background: #fff;
	padding: 2.5rem 3rem;
}
.medical-panel {
	display: none;
}
.medical-panel.is-active {
	display: block;
}
.medical-desc {
	font-size: 1rem;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	color: var(--text-main);
	line-height: 1.9;
	margin: 0 0 2rem;
}

/* 問い合わせエリア */
.medical-contact {
	text-align: center;
	padding-top: 2rem;
	border-top: 1px solid var(--border-color);
}
.medical-contact-label {
	font-size: 1rem;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	color: var(--text-muted);
	margin: 0 0 1rem;
	letter-spacing: 0.05em;
}
.medical-tel {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 1.8rem;
	font-weight: 700;
	color: var(--color-primary);
	text-decoration: none;
	letter-spacing: 0.05em;
	transition: color 0.2s;
}
.medical-tel:hover {
	color: var(--color-primary-hover);
}

/* ------------------------------------------------------------------ */
/* Gallery Slider Section（院内写真）                                  */
/* ------------------------------------------------------------------ */
.gallery-section {
	padding: 4rem 0 5rem;
	background: #fff;
	overflow: hidden;
}

/* 見出し */
.gallery-heading {
	text-align: center;
	margin-bottom: 2.5rem;
}
.gallery-heading-en {
	display: block;
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: 0.35em;
	color: var(--color-gray-500);
	margin-bottom: 0.6rem;
	text-transform: uppercase;
}
.gallery-heading-jp {
	font-size: 1.6rem;
	font-weight: 500;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	color: var(--text-heading);
	letter-spacing: 0.05em;
	margin: 0;
	position: relative;
	display: inline-block;
	padding-bottom: 1rem;
}
.gallery-heading-jp::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 32px;
	height: 1px;
	background-color: var(--color-primary);
}

/* スライダー本体 */
.gallery-slider {
	position: relative;
	width: 100%;
}

.gallery-track {
	display: flex;
	gap: 3rem;
	transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	will-change: transform;
}

.gallery-slide {
	min-width: 68%;
	flex-shrink: 0;
	opacity: 0.45;
	transform: scale(0.88);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

.gallery-slide--active {
	opacity: 1;
	transform: scale(1);
}

.gallery-slide img {
	width: 100%;
	height: 460px;
	object-fit: cover;
	display: block;
	border-radius: var(--radius-sm);
}

/* 矢印ボタン（画像の外側） */
.gallery-btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: none;
	border: none;
	font-size: 2.2rem;
	color: var(--color-primary);
	cursor: pointer;
	z-index: 10;
	padding: 0.5rem 1rem;
	line-height: 1;
	transition: color 0.2s, transform 0.2s;
}
.gallery-btn:hover {
	color: var(--color-primary-hover);
	transform: translateY(-50%) scale(1.2);
}
.gallery-btn--prev { left: 1rem; }
.gallery-btn--next { right: 1rem; }

/* もっと見るボタン */
.gallery-more {
	text-align: center;
	margin-top: 2.5rem;
}
.gallery-more-btn {
	display: inline-block;
	padding: 0.75rem 2.5rem;
	border: 1px solid var(--color-primary);
	border-radius: var(--radius-full);
	color: var(--color-primary);
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: 0.9rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-decoration: none;
	transition: background 0.2s, color 0.2s;
}
.gallery-more-btn:hover {
	background: var(--color-primary);
	color: #fff;
}

/* ドットナビ */
.gallery-dots {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin-top: 1.5rem;
}
.gallery-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	border: 1px solid var(--color-primary);
	background: transparent;
	cursor: pointer;
	padding: 0;
	transition: background 0.2s, transform 0.2s;
}
.gallery-dot.is-active {
	background: var(--color-primary);
	transform: scale(1.3);
}

/* ------------------------------------------------------------------ */
/* Access Section（アクセス）                                          */
/* ------------------------------------------------------------------ */
.access-section {
	padding: 5rem 0 6rem;
	background-color: #fff;
}

/* 見出し */
.access-heading {
	text-align: center;
	margin-bottom: 3.5rem;
}
.access-heading-en {
	display: block;
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: 0.35em;
	color: var(--color-gray-500);
	margin-bottom: 0.6rem;
	text-transform: uppercase;
}
.access-heading-jp {
	font-size: 1.6rem;
	font-weight: 500;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	color: var(--text-heading);
	letter-spacing: 0.05em;
	margin: 0;
	position: relative;
	display: inline-block;
	padding-bottom: 1rem;
}
.access-heading-jp::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 32px;
	height: 1px;
	background-color: var(--color-primary);
}

/* 左右レイアウト */
.access-inner {
	display: flex;
	align-items: stretch;
	gap: 4rem;
}

/* SP専用ブロック：PCでは非表示 */
.access-sp-top {
	display: none;
}

/* 左：クリニック情報 */
.access-info {
	flex: 0 0 42%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.access-clinic-header {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	margin-bottom: 1.2rem;
}

.access-logo {
	width: auto;
	height: 52px;
	border-radius: var(--radius-sm);
	object-fit: contain;
	flex-shrink: 0;
}

.access-clinic-name {
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: 2.2rem;
	font-weight: 700;
	color: var(--text-heading);
	letter-spacing: 0.05em;
	margin: 0;
}

.access-detail {
	margin-bottom: 1.6rem;
}

.access-address {
	font-size: 1.05rem;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-weight: 600;
	color: var(--text-main);
	line-height: 1.7;
	margin: 0 0 0.8rem;
}

.access-tel {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 2.2rem;
	font-weight: 700;
	color: var(--color-primary);
	text-decoration: none;
	letter-spacing: 0.05em;
	transition: color 0.2s;
}
.access-tel:hover {
	color: var(--color-primary-hover);
}

/* 診療時間テーブル */
.access-table {
	width: 100%;
	border-collapse: collapse;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: 0.88rem;
	color: var(--text-main);
	margin-bottom: 0.7rem;
}
.access-table th,
.access-table td {
	text-align: center;
	padding: 0.55rem 0.4rem;
	border: 1px solid var(--color-gray-300);
	white-space: nowrap;
}
.access-table thead th {
	background-color: var(--color-primary);
	color: #fff;
	font-weight: 500;
	letter-spacing: 0.03em;
}
.access-table thead th:first-child {
	text-align: left;
	padding-left: 0.7rem;
	min-width: 100px;
}
.access-table tbody td:first-child {
	text-align: left;
	padding-left: 0.7rem;
	font-weight: 500;
}
.access-table tbody tr:nth-child(even) {
	background-color: rgba(253, 244, 246, 0.6);
}

.access-time {
	font-size: 0.85rem;
}

.access-mark {
	font-size: 0.95rem;
}
.access-mark.open   { color: var(--color-primary); }
.access-mark.closed { color: var(--color-gray-500); }

.access-note {
	font-size: 0.82rem;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	color: var(--text-muted);
	margin: 0;
	line-height: 1.6;
}

/* アクセス情報リスト */
.access-directions {
	list-style: none;
	margin: 0 0 1.8rem;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}
.access-directions li {
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: 0.92rem;
	font-weight: 600;
	color: var(--text-main);
	line-height: 1.6;
	padding-left: 1em;
	position: relative;
}
.access-directions li::before {
	content: '―';
	position: absolute;
	left: 0;
	color: var(--color-primary);
	font-size: 0.7rem;
	top: 0.35em;
}

/* Googleマップで開くボタン */
.access-gmaps-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.7rem 1.8rem;
	border: 1px solid var(--color-primary);
	border-radius: var(--radius-full);
	color: var(--color-primary);
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: 0.88rem;
	font-weight: 500;
	letter-spacing: 0.05em;
	text-decoration: none;
	transition: background 0.2s, color 0.2s;
}
.access-gmaps-btn:hover {
	background: var(--color-primary);
	color: #fff;
}

/* 右：Google マップ */
.access-map {
	flex: 1;
	min-height: 400px;
	border-radius: var(--radius-sm);
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}
.access-map iframe {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 400px;
}

/* ------------------------------------------------------------------ */
/* Banner List（アクセスセクション下部）                               */
/* ------------------------------------------------------------------ */
.access-banners {
	padding: 6rem 0 0;
}

.banner-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 1.5rem;
}

.banner-item {
	flex: 1;
}

.banner-item a {
	display: block;
	border-radius: var(--radius-sm);
	overflow: hidden;
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.banner-item a:hover {
	opacity: 0.85;
	transform: translateY(-2px);
}

.banner-item img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 0;
}

/* ------------------------------------------------------------------ */
/* Post Grid / Features Sections */
.post-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: var(--space-md);
	margin-bottom: var(--space-lg);
}

.grid-item {
	background: var(--bg-surface);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
	overflow: hidden;
	transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	display: flex;
	flex-direction: column;
	border: 1px solid var(--border-color);
}

.grid-item:hover {
	transform: translateY(-8px);
	box-shadow: var(--shadow-md);
}

.post-thumbnail {
	overflow: hidden;
}

.post-thumbnail img {
	width: 100%;
	aspect-ratio: 4/3;
	object-fit: cover;
	border-radius: 0; /* Override base rounded corners for inside card */
	transition: transform 0.8s ease;
}

.grid-item:hover .post-thumbnail img {
	transform: scale(1.05); /* Gentle smooth zoom */
}

.post-content {
	padding: 2.5rem 2rem;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	align-items: center; /* Center align for elegance */
	text-align: center;
}

.entry-title {
	font-size: 1.25rem;
	margin-bottom: 1rem;
}

.entry-title a {
	color: var(--text-heading);
}

.entry-summary {
	color: var(--text-muted);
	font-size: 0.95rem;
	flex-grow: 1;
}

/* Single Post / Page */
.entry-meta {
	font-size: 0.875rem;
	color: var(--text-muted);
	margin-bottom: var(--space-md);
	text-align: center;
}

.site-main > .container {
	padding-top: var(--space-lg);
	padding-bottom: var(--space-lg);
}

/* Background Section (Like Shirosato DC aesthetic) */
.section-full {
	padding: var(--space-xl) 0;
	background-color: var(--color-accent);
}

/* Footer */
.site-footer {
	background-color: #fdf4f6;
	color: var(--text-main);
	margin-top: auto;
}

.site-footer a {
	color: var(--text-main);
	text-decoration: none;
}

.site-footer a:hover {
	color: var(--color-primary);
}

.footer-inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-areas:
		"nav medical"
		"social medical";
	gap: 0;
	padding-top: 4rem;
	padding-bottom: 2.5rem;
}

/* 左上：ナビ */
.footer-nav {
	grid-area: nav;
}

/* 左下：Instagram ボタン */
.footer-social {
	grid-area: social;
	margin-top: 1.2rem;
}

.footer-nav-list {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, auto);
	gap: 0.6rem 2.5rem;
}

.footer-nav-list li a {
	font-size: 0.95rem;
	font-weight: 500;
	display: flex;
	align-items: center;
	gap: 0.4rem;
}

.footer-nav-list li a::before {
	content: '›';
	color: var(--color-primary);
	font-size: 1rem;
	line-height: 1;
}

/* Instagram */
.footer-sns {
	margin-top: 1.2rem;
}

.footer-sns-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.95rem;
	font-weight: 500;
	color: var(--text-main);
	text-decoration: none;
	transition: color 0.2s;
}

.footer-sns-link:hover {
	color: var(--color-primary);
}

.footer-sns-link svg {
	color: var(--text-sub);
	transition: color 0.2s;
}

.footer-sns-link:hover svg {
	color: var(--color-primary);
}

/* 右：診療内容リンク */
.footer-instagram {
	grid-area: medical;
	border-left: 1px solid var(--border-color);
	padding-left: 3rem;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

/* 診療内容ラベル */
.footer-medical-heading {
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--text-heading);
	margin: 0 0 1rem;
	letter-spacing: 0.05em;
}

.footer-medical-list {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, auto);
	gap: 0.6rem 2.5rem;
}

.footer-medical-list li a {
	font-size: 0.95rem;
	font-weight: 500;
	display: flex;
	align-items: center;
	gap: 0.4rem;
}

.footer-medical-list li a::before {
	content: '›';
	color: var(--color-primary);
	font-size: 1rem;
	line-height: 1;
}

.footer-instagram-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.6rem 1.4rem;
	border: 1px solid var(--color-primary);
	border-radius: var(--radius-full);
	color: var(--color-primary);
	font-size: 0.88rem;
	font-weight: 500;
	letter-spacing: 0.05em;
	text-decoration: none;
	transition: background 0.2s, color 0.2s;
	align-self: flex-start;
}

.footer-instagram-btn:hover {
	background: var(--color-primary);
	color: #fff;
}

/* コピーライト */
.footer-copy {
	background-color: #f07096;
	padding: 1rem 0;
	text-align: center;
}

.footer-copy p {
	font-size: 0.88rem;
	font-weight: 500;
	color: #fff;
	margin: 0;
}

/* ==========================================================================
   Responsive (Mobile)
   ========================================================================== */
@media (max-width: 767px) {
	/* ヘッダー */
	.site-header {
		position: sticky;
		top: 0;
		z-index: 100;
	}
	.header-inner {
		padding: 0.6rem 1.2rem;
		gap: 0;
	}
	/* ロゴ：はみ出し防止・伸縮させる */
	.branding-link {
		gap: 0.5rem;
		min-width: 0;
	}
	.site-branding {
		flex: 1 1 auto;
		min-width: 0;
	}
	.site-logo-img {
		height: 32px;
		flex-shrink: 0;
	}
	.site-name {
		font-size: 0.9rem;
		letter-spacing: 0.03em;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	/* 右側アクション群 */
	.header-actions {
		gap: 1rem;
		flex-shrink: 0;
		padding-left: 0.8rem;
	}
	/* 電話：テキスト非表示・アイコンのみ */
	.header-tel span {
		display: none;
	}
	.header-tel {
		gap: 0;
	}
	.header-tel svg {
		width: 22px;
		height: 22px;
	}
	/* MAP */
	.header-map-label {
		font-size: 0.55rem;
	}
	.header-map svg {
		width: 18px;
		height: 18px;
	}
	/* ハンバーガー */
	.menu-toggle {
		width: 38px;
		height: 38px;
	}

	/* ナビゲーション（SP） */
	.main-navigation.is-open ul {
		flex-direction: column;
	}
	.main-navigation li {
		border-right: none;
		border-bottom: 1px solid var(--border-color);
	}
	.main-navigation a {
		text-align: center;
	}

	/* その他 */
	.section-title-jp {
		font-size: 1.5rem;
	}
	.post-grid {
		grid-template-columns: 1fr;
	}
	.site-main > .container {
		padding-top: var(--space-md);
		padding-bottom: var(--space-md);
	}
}


/* ==========================================================================
   Responsive (Mobile) - Below Hero Sections
   ========================================================================== */
@media (max-width: 767px) {

	/* -------------------------------------------------- */
	/* 各セクション共通：見出しサイズを控えめに            */
	/* -------------------------------------------------- */
	.medical-heading-en,
	.philosophy-heading-en,
	.gallery-heading-en,
	.hours-heading-en,
	.access-heading-en {
		font-size: 0.68rem;
		letter-spacing: 0.28em;
	}
	.medical-heading-jp,
	.philosophy-heading-jp,
	.gallery-heading-jp,
	.hours-heading-jp,
	.access-heading-jp {
		font-size: 1.3rem;
	}
	.director-title {
		font-size: 1.05rem;
	}

	/* -------------------------------------------------- */
	/* Medical Section（診療内容）                         */
	/* -------------------------------------------------- */
	.medical-section {
		padding: 3rem 0;
	}
	.medical-heading {
		margin-bottom: 2rem;
	}
	.medical-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 1rem;
	}
	.medical-card-link {
		padding: 1.5rem 1rem 1.2rem;
		gap: 0.6rem;
	}
	.medical-card-icon-svg,
	.medical-card-icon-img {
		width: 48px;
		height: 48px;
	}
	.medical-card-title {
		font-size: 0.95rem;
	}
	.medical-card-more {
		font-size: 0.75rem;
	}

	/* -------------------------------------------------- */
	/* Philosophy Section（私たちのこだわり）              */
	/* -------------------------------------------------- */
	.philosophy-section {
		padding: 3rem 0;
	}
	.philosophy-heading {
		margin-bottom: 2rem;
	}
	.philosophy-list {
		flex-direction: column;
		gap: 2.5rem;
		padding: 0 1.5rem;
	}
	.philosophy-item {
		width: 100%;
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
	.philosophy-img-wrap {
		width: 140px;
		min-width: 140px;
		aspect-ratio: 1 / 1;
		margin-bottom: 1rem;
	}
	.philosophy-title {
		font-size: 1.05rem;
		margin-bottom: 0.6rem;
	}
	.philosophy-title br {
		display: none; /* スマホでは改行を無効化して自然な折り返しに */
	}
	.philosophy-text {
		font-size: 0.9rem;
		line-height: 1.8;
		text-align: left;
	}
	.philosophy-list {
		gap: 2rem; /* 項目間の間延びを少し詰める */
	}

	/* -------------------------------------------------- */
	/* Reason Section（選ばれる理由）                     */
	/* -------------------------------------------------- */
	.reason-section {
		padding: 3rem 0;
	}
	.reason-heading {
		margin-bottom: 2rem;
	}
	.reason-heading-jp {
		font-size: 1.3rem;
	}
	.reason-list {
		max-width: 360px;
		gap: 1.2rem;
	}
	.reason-item {
		padding: 1.8rem 1.4rem;
	}
	.reason-icon {
		width: 54px;
		height: 54px;
		margin-bottom: 1rem;
	}
	.reason-icon svg {
		width: 24px;
		height: 24px;
	}
	.reason-title {
		font-size: 1.05rem;
		margin-bottom: 0.7rem;
	}
	.reason-text {
		font-size: 0.88rem;
		line-height: 1.8;
	}

	/* -------------------------------------------------- */
	/* Whitening CTA Section（ホワイトニング導線）         */
	/* -------------------------------------------------- */
	.wt-cta-section {
		padding: 3rem 0;
	}
	.wt-cta-inner {
		gap: 2rem;
	}
	.wt-cta-title {
		font-size: 1.4rem;
		margin-bottom: 1rem;
		text-align: center;
	}
	.wt-cta-lead {
		line-height: 1.85;
		margin-bottom: 1.5rem;
		font-size: 0.92rem;
	}
	/* ボタン：白地にピンク線・ピンク文字のまま、タップしやすい幅・1行収まりに */
	.wt-cta-btn {
		display: block;
		width: 100%;
		max-width: 280px;
		margin: 0 auto;
		padding: 0.75rem 1rem;
		font-size: 0.78rem;
		letter-spacing: 0.05em;
		text-align: center;
	}
	.wt-cta-image img {
		height: 220px;
	}

	/* -------------------------------------------------- */
	/* PC 専用改行の無効化（スマホでは自然な折り返し）     */
	/* -------------------------------------------------- */
	.br-pc {
		display: none;
	}

	/* -------------------------------------------------- */
	/* Director Section（理事長挨拶）                      */
	/* -------------------------------------------------- */
	.director-section {
		padding: 3.5rem 1.2rem 4rem;
	}
	.director-flower {
		width: 140px;
		opacity: 0.4;
	}
	.director-deco--top {
		width: 200px;
		opacity: 0.3;
	}
	.director-title {
		font-size: 1.2rem;
		margin-bottom: 1.5rem;
	}
	.director-body {
		text-align: left;
	}
	.director-body p {
		font-size: 0.92rem;
		line-height: 1.9;
	}
	.director-name {
		font-size: 0.95rem;
	}

	/* -------------------------------------------------- */
	/* Gallery Section（院内写真）                         */
	/* -------------------------------------------------- */
	.gallery-section {
		padding: 3rem 0 3.5rem;
	}
	.gallery-heading {
		margin-bottom: 1.5rem;
	}
	/* スライダー：SP は80%幅で統一・幅を flex と width 両方で固定 */
	.gallery-slide {
		flex: 0 0 80%;
		width: 80%;
		min-width: 80%;
		max-width: 80%;
		opacity: 1;
		transform: scale(1);
	}
	.gallery-slide--active {
		opacity: 1;
		transform: scale(1);
	}
	.gallery-slide img {
		height: 240px;
	}
	/* 矢印ボタン：背景なし・白矢印＋シャドウで馴染ませる */
	.gallery-btn {
		font-size: 1.4rem;
		background: none;
		border: none;
		color: rgba(255, 255, 255, 0.9);
		text-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
		padding: 0.4rem;
		width: auto;
		height: auto;
	}
	.gallery-btn:hover {
		color: #fff;
		transform: translateY(-50%) scale(1.1);
	}
	.gallery-btn--prev { left: 0.6rem; }
	.gallery-btn--next { right: 0.6rem; }
	.gallery-more {
		margin-top: 1.5rem;
	}

	/* -------------------------------------------------- */
	/* Hours Section（診療受付時間）                       */
	/* -------------------------------------------------- */
	.hours-section {
		padding: 2rem 1rem 1.5rem;
	}
	.hours-heading {
		margin-bottom: 1.8rem;
	}
	.hours-card {
		padding: 1.5rem 1rem;
		border-radius: var(--radius-sm);
	}
	.hours-table {
		font-size: 0.85rem;
	}
	.hours-table th,
	.hours-table td {
		padding: 0.7rem 0.3rem;
	}
	.hours-time {
		font-size: 0.78rem;
		white-space: nowrap;
	}
	.hours-mark {
		font-size: 1rem;
	}
	.hours-note-row {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.4rem;
		font-size: 0.82rem;
		margin-top: 1rem;
	}

	/* -------------------------------------------------- */
	/* Access Section（アクセス）                          */
	/* -------------------------------------------------- */
	.access-section {
		padding: 3rem 0 4rem;
	}
	.access-heading {
		margin-bottom: 2rem;
	}
	.access-inner {
		flex-direction: column;
		gap: 1.8rem;
	}

	/* SP専用ブロック：表示 & スタイル */
	.access-sp-top {
		display: block;
		padding: 0 1.4rem;
	}
	.access-sp-top .access-sp-name,
	.access-sp-top .access-sp-address,
	.access-sp-top .access-sp-tel {
		display: block;
		font-family: 'Zen Kaku Gothic New', sans-serif;
		font-size: 1.05rem;
		font-weight: 500;
		color: #111;
		line-height: 2.1;
		margin: 0;
		text-decoration: none;
	}
	.access-sp-top .access-sp-tel {
		display: flex;
		align-items: center;
		gap: 0.4rem;
	}
	.access-sp-top .access-sp-address {
		line-height: 1.6;
	}

	/* PC用の情報エリアはSPで非表示 */
	.access-clinic-header,
	.access-detail {
		display: none;
	}

	/* 残す部分（アクセス方法・ボタン）のレイアウト */
	.access-info {
		flex: none;
		width: 100%;
		padding: 0 1.4rem;
	}
	.access-directions {
		margin-bottom: 1.2rem;
	}
	.access-directions li {
		font-size: 0.85rem;
	}
	.access-gmaps-btn {
		width: 100%;
		justify-content: center;
	}
	.access-map {
		width: 100%;
		flex: none;
		min-height: 260px;
		border-radius: 0;
	}
	.access-map iframe {
		min-height: 260px;
	}

	/* -------------------------------------------------- */
	/* Banner List                                         */
	/* -------------------------------------------------- */
	.access-banners {
		padding: 5rem 0 0;
	}
	.banner-list {
		flex-direction: column;
		gap: 1rem;
	}

	/* -------------------------------------------------- */
	/* Footer                                              */
	/* -------------------------------------------------- */
	.footer-inner {
		grid-template-columns: 1fr;
		grid-template-areas:
			"nav"
			"medical"
			"social";
		gap: 1.5rem;
		padding-top: 2rem;
		padding-bottom: 2rem;
	}
	.footer-nav-list {
		grid-template-columns: 1fr 1fr;
		gap: 0.5rem 1rem;
		margin-bottom: 0;
	}
	.footer-nav-list li a {
		font-size: 0.88rem;
	}
	.footer-instagram {
		border-left: none;
		border-top: 1px solid var(--border-color);
		padding-left: 0;
		padding-top: 1.25rem;
		align-items: flex-start;
		text-align: left;
		width: 100%;
	}
	.footer-medical-heading {
		margin-bottom: 0.9rem;
		text-align: center;
		width: 100%;
	}
	.footer-medical-list {
		grid-template-columns: 1fr 1fr;
		gap: 0.5rem 1rem;
		/* 親が flex のため width:100% を明示しないと列が縮んで
		   上のナビ（プライバシーポリシー等）と右列が揃わない */
		width: 100%;
	}
	.footer-medical-list li a {
		font-size: 0.88rem;
	}
	.footer-social {
		margin-top: 0;
		display: flex;
		justify-content: center;
	}
	.footer-instagram-btn {
		align-self: center;
		width: fit-content;
	}
}


/* ==========================================================================
   Staff Page（院長・スタッフ紹介ページ）
   ========================================================================== */

/* ---- Page Hero ---- */
.page-hero {
	position: relative;
	width: 100%;
	max-height: 340px;
	overflow: hidden;
}
.page-hero-img {
	width: 100%;
	height: 340px;
	object-fit: cover;
	display: block;
}
.page-hero-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.1) 100%);
	display: flex;
	align-items: center;
}
.page-hero-text {
	padding-left: 8%;
	padding-right: 8%;
}
.page-hero-en {
	font-size: 0.8rem;
	letter-spacing: 0.25em;
	color: rgba(255,255,255,0.8);
	margin: 0 0 0.3rem;
}
.page-hero-title {
	font-size: clamp(1.6rem, 4vw, 2.4rem);
	color: #fff;
	margin: 0;
	font-weight: 500;
	letter-spacing: 0.05em;
}
.page-hero-sub {
	font-size: clamp(0.78rem, 1.6vw, 1rem);
	color: rgba(255,255,255,0.92);
	margin: 0.7rem 0 0;
	line-height: 1.6;
	letter-spacing: 0.04em;
	max-width: 90%;
}

/* ---- Breadcrumb ---- */
.breadcrumb {
	background: var(--color-gray-100);
	padding: 0.75rem 0;
	border-bottom: 1px solid var(--border-color);
}
.breadcrumb-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.82rem;
	color: var(--text-muted);
}
.breadcrumb-item + .breadcrumb-item::before {
	content: '›';
	color: var(--color-gray-300);
}
.breadcrumb-item a {
	color: var(--color-primary);
	text-decoration: none;
}
.breadcrumb-item a:hover {
	text-decoration: underline;
}

/* ---- Section Heading (shared) ---- */
.staff-section-heading {
	text-align: center;
	margin-bottom: 3rem;
}
.staff-heading-en {
	font-size: 0.75rem;
	letter-spacing: 0.3em;
	color: var(--color-primary);
	margin: 0 0 0.4rem;
	text-transform: uppercase;
}
.staff-heading-jp {
	font-size: clamp(1.4rem, 3vw, 1.9rem);
	font-weight: 500;
	color: var(--text-heading);
	margin: 0;
	position: relative;
	display: inline-block;
	padding-bottom: 0.8rem;
}
.staff-heading-jp::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 40px;
	height: 2px;
	background: var(--color-primary);
	border-radius: 2px;
}

/* ---- Director Section ---- */
.staff-director-section {
	padding: var(--space-lg) 0;
	background: var(--bg-surface);
}
.staff-director-inner {
	display: grid;
	grid-template-columns: 1fr 1.4fr;
	gap: 4rem;
	align-items: start;
}
.staff-director-photos {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.8rem;
}
.staff-director-photo-main img,
.staff-director-photo-sub img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-md);
}
.staff-director-photo-sub {
	margin-top: 2rem;
}

.staff-director-name-block {
	margin-bottom: 1.8rem;
	padding-bottom: 1.8rem;
	border-bottom: 1px solid var(--border-color);
}
.staff-director-role {
	font-size: 0.8rem;
	letter-spacing: 0.2em;
	color: var(--color-primary);
	margin: 0 0 0.3rem;
	font-weight: 500;
}
.staff-director-name {
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 700;
	color: var(--text-heading);
	margin: 0 0 0.2rem;
}
.staff-director-name-kana {
	font-size: 0.85rem;
	color: var(--text-muted);
	letter-spacing: 0.1em;
	margin: 0;
}

.staff-director-message p {
	margin: 0 0 1rem;
	line-height: var(--line-height-base);
	color: var(--text-main);
}
.staff-director-message p:last-child {
	margin-bottom: 0;
}

.staff-director-career,
.staff-director-license {
	margin-top: 2rem;
}
.staff-career-title {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--text-heading);
	margin: 0 0 0.6rem;
	letter-spacing: 0.05em;
}
.staff-career-list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.staff-career-list li {
	font-size: 0.9rem;
	color: var(--text-main);
	padding: 0.4rem 0 0.4rem 1.2rem;
	position: relative;
	border-bottom: 1px solid var(--color-gray-100);
}
.staff-career-list li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--color-primary);
}

/* ---- Staff List Section ---- */
.staff-list-section {
	padding: var(--space-lg) 0;
	background: var(--color-gray-50);
}
.staff-list-intro {
	text-align: center;
	color: var(--text-muted);
	margin: -1.5rem 0 2.5rem;
	font-size: 0.95rem;
}
.staff-card-grid {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: 2rem;
}
.staff-card-grid--2col {
	grid-template-columns: repeat(2, 1fr);
}
.staff-card-grid--3col {
	grid-template-columns: repeat(3, 1fr);
}
.staff-card-grid--centered {
	grid-template-columns: repeat(3, 1fr);
}
.staff-card-grid--centered .staff-card:first-child:last-child {
	grid-column: 2;
}

/* Section alternating background */
.staff-group-section {
	padding: var(--space-lg) 0;
	background: var(--bg-surface);
}
.staff-group-section--alt {
	background: var(--color-gray-50);
}

/* Career list inside cards */
.staff-card-career {
	list-style: none;
	padding: 0;
	margin: 0;
}
.staff-card-career li {
	font-size: 0.85rem;
	color: var(--text-main);
	line-height: 1.65;
	padding: 0.35rem 0 0.35rem 1rem;
	position: relative;
	border-bottom: 1px solid var(--color-gray-100);
}
.staff-card-career li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.85rem;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--color-primary);
}
.staff-card {
	background: var(--bg-surface);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}
.staff-card:hover {
	box-shadow: var(--shadow-md);
	transform: translateY(-4px);
}
.staff-card-photo-wrap {
	padding: 1.5rem 1.5rem 0;
	text-align: center;
}
.staff-card-photo {
	width: 100%;
	max-width: 200px;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	display: block;
	margin: 0 auto;
	border-radius: 50%;
}
.staff-card-info {
	padding: 1.5rem;
}
.staff-card-role {
	font-size: 0.75rem;
	letter-spacing: 0.15em;
	color: var(--color-primary);
	font-weight: 600;
	margin: 0 0 0.3rem;
}
.staff-card-name {
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--text-heading);
	margin: 0 0 0.9rem;
}
.staff-card-message {
	font-size: 0.88rem;
	line-height: 1.75;
	color: var(--text-main);
	margin: 0;
}

/* ---- Recruit Banner ---- */
.staff-recruit-section {
	padding: var(--space-md) 0;
	background: var(--color-accent);
}
.staff-recruit-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	flex-wrap: wrap;
}
.staff-recruit-sub {
	font-size: 0.8rem;
	letter-spacing: 0.2em;
	color: var(--color-primary);
	margin: 0 0 0.3rem;
}
.staff-recruit-title {
	font-size: 1.6rem;
	font-weight: 700;
	color: var(--text-heading);
	margin: 0 0 0.7rem;
}
.staff-recruit-desc {
	font-size: 0.9rem;
	color: var(--text-main);
	margin: 0;
	max-width: 520px;
	line-height: 1.7;
}
.staff-recruit-btn {
	display: inline-block;
	padding: 0.9rem 2.2rem;
	background: var(--color-primary);
	color: #fff;
	border-radius: var(--radius-full);
	font-size: 0.9rem;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: background 0.2s ease, transform 0.2s ease;
	letter-spacing: 0.05em;
}
.staff-recruit-btn:hover {
	background: var(--color-primary-hover);
	transform: translateY(-2px);
}

/* ==========================================================================
   Privacy Policy Page（プライバシーポリシーページ）
   ========================================================================== */

.policy-section {
	padding: var(--space-lg) 0 calc(var(--space-lg) * 1.2);
	background: var(--bg-surface);
}

.policy-inner {
	max-width: 800px;
	margin: 0 auto;
}

.policy-main-title {
	font-size: clamp(1.2rem, 2.5vw, 1.45rem);
	font-weight: 700;
	color: var(--text-heading);
	margin: 0 0 1.5rem;
}

.policy-lead {
	font-size: 0.95rem;
	line-height: var(--line-height-base);
	color: var(--text-main);
	margin: 0 0 2.5rem;
}

.policy-item-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--text-heading);
	margin: 2.2rem 0 0.8rem;
}

.policy-inner p {
	font-size: 0.92rem;
	line-height: var(--line-height-base);
	color: var(--text-main);
	margin: 0 0 0.9rem;
}

/* Definition list */
.policy-dl {
	margin: 0 0 0.9rem;
}

.policy-dl dt {
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--text-heading);
	margin: 0.8rem 0 0.3rem;
}

.policy-dl dt:first-child {
	margin-top: 0;
}

.policy-dl dd {
	font-size: 0.9rem;
	line-height: var(--line-height-base);
	color: var(--text-main);
	margin: 0;
	padding-left: 0;
}

@media (max-width: 767px) {
	.policy-item-title {
		font-size: 0.95rem;
		margin-top: 1.8rem;
	}
}

/* ---- Responsive: Staff Page ---- */
@media (max-width: 767px) {
	.page-hero-img {
		height: 220px;
	}
	.page-hero-text {
		padding-left: 6%;
		padding-right: 6%;
	}
	.page-hero-sub {
		font-size: 0.72rem;
		line-height: 1.55;
		margin-top: 0.45rem;
		letter-spacing: 0.02em;
		max-width: 100%;
	}
	.staff-director-inner {
		grid-template-columns: 1fr;
		gap: 2rem;
	}
	.staff-director-photos {
		grid-template-columns: 1fr 1fr;
		gap: 0.6rem;
		max-width: 360px;
		margin: 0 auto;
	}
	.staff-director-photo-sub {
		margin-top: 1rem;
	}
	.staff-card-grid--2col,
	.staff-card-grid--3col,
	.staff-card-grid--centered {
		grid-template-columns: 1fr;
	}
	.staff-card-grid--centered .staff-card:first-child:last-child {
		grid-column: 1;
	}
	/* スマホ：肩書き＋名前を一列に並べ、中央揃え */
	.staff-card-info {
		text-align: center;
	}
	.staff-card-role,
	.staff-card-name {
		display: inline-block;
		vertical-align: baseline;
		margin-bottom: 0.9rem;
	}
	.staff-card-role {
		margin-right: 0.6rem;
		margin-bottom: 0.9rem;
	}
	.staff-card-name {
		margin-bottom: 0.9rem;
	}
	.staff-card-career {
		text-align: left;
	}
	.staff-recruit-inner {
		flex-direction: column;
		text-align: center;
	}
	.staff-recruit-desc {
		max-width: 100%;
	}
}


/* ==========================================================================
   Whitening Page（ホワイトニングページ）
   ========================================================================== */

/* --- 共通見出し --- */
.wh-section-heading {
	text-align: center;
	margin-bottom: 3rem;
}
.wh-section-en {
	font-size: 0.75rem;
	letter-spacing: 0.2em;
	color: var(--color-primary);
	text-transform: uppercase;
	margin-bottom: 0.5rem;
}
.wh-section-title {
	font-size: clamp(1.4rem, 3vw, 1.9rem);
	font-weight: 700;
	color: var(--text-heading);
	letter-spacing: 0.05em;
	line-height: 1.5;
}

/* --- Lead Section --- */
.wh-lead-section {
	padding: var(--space-lg) 0;
}
.wh-lead-text {
	max-width: 720px;
	margin: 0 auto 1em;
	text-align: center;
	line-height: var(--line-height-base);
	color: var(--text-main);
	font-size: 1rem;
}
@media (max-width: 767px) {
	.wh-lead-text {
		text-align: left;
		line-height: 1.9;
	}
}

/* --- Feature Section（選ばれる理由） --- */
.wh-feature-section {
	background-color: #fff;
	padding: var(--space-lg) 0;
}
.wh-feature-list {
	list-style: none;
	padding: 0;
	margin: 0;
	max-width: 860px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	flex-direction: column;
}
.wh-feature-item {
	display: grid;
	grid-template-columns: 13rem 1fr;
	gap: 0 2rem;
	align-items: center;
	padding: 3rem 0 3rem 1rem;
	border-bottom: 1px solid var(--border-color);
	position: relative;
}
.wh-feature-item:first-child {
	border-top: 1px solid var(--border-color);
}
.wh-feature-num {
	position: absolute;
	top: 2rem;
	left: 0;
	z-index: 2;
	font-size: 3.5rem;
	font-weight: 700;
	line-height: 1;
	color: var(--color-primary);
	opacity: 0.28;
	letter-spacing: -0.02em;
	pointer-events: none;
}
.wh-feature-photo {
	width: 13rem;
	height: 13rem;
	flex-shrink: 0;
	/* 境界線をぼかして背景になじませる（円周ぐるり全体を均等にフェード） */
	-webkit-mask-image: radial-gradient(circle closest-side at center, #000 90%, transparent 100%);
	mask-image: radial-gradient(circle closest-side at center, #000 90%, transparent 100%);
}
.wh-feature-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.wh-feature-body {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.wh-feature-title {
	font-size: clamp(1.1rem, 2.5vw, 1.35rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.6;
	margin: 0;
}
.wh-feature-desc {
	font-size: 0.95rem;
	color: var(--text-main);
	line-height: 2;
	margin: 0;
}
.wh-feature-desc strong {
	color: inherit;
	font-weight: 700;
	background: linear-gradient(transparent 55%, rgba(235, 71, 115, 0.2) 55%);
}

/* --- Types Section（種類） --- */
.wh-types-section {
	padding: var(--space-lg) 0;
}
.wh-types-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
	max-width: 820px;
	margin: 0 auto;
}
.wh-type-card {
	border: 1.5px solid var(--border-color);
	border-radius: var(--radius-md);
	padding: 0;
	background: #fff;
	overflow: hidden;
	transition: box-shadow 0.2s ease;
	display: flex;
	flex-direction: column;
}
.wh-type-card:hover {
	box-shadow: var(--shadow-md);
}
.wh-type-card--recommended {
	border-color: var(--color-primary);
	box-shadow: var(--shadow-sm);
}
.wh-type-photo {
	width: 100%;
	aspect-ratio: 16 / 10;
	background: var(--color-gray-100);
	overflow: hidden;
}
.wh-type-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.wh-type-card-body {
	padding: 1.75rem 1.75rem 2rem;
	display: flex;
	flex-direction: column;
	flex: 1;
}
.wh-type-label {
	font-size: 0.7rem;
	letter-spacing: 0.18em;
	color: var(--color-primary);
	font-weight: 700;
	margin-bottom: 0.75rem;
	text-transform: uppercase;
}
.wh-type-title {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 1rem;
	line-height: 1.5;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.5rem;
}
.wh-type-desc {
	font-size: 0.875rem;
	color: var(--text-main);
	line-height: 1.8;
	margin-bottom: 1.25rem;
}
.wh-type-price {
	display: flex;
	align-items: baseline;
	gap: 0.4rem;
	padding: 0.85rem 0;
	margin-bottom: 1.25rem;
	border-top: 1px solid var(--border-color);
	border-bottom: 1px solid var(--border-color);
}
.wh-type-price-amount {
	font-size: 1.7rem;
	font-weight: 700;
	color: var(--color-primary);
	letter-spacing: -0.01em;
	line-height: 1;
}
.wh-type-price-tax {
	font-size: 0.75rem;
	color: var(--text-muted);
}
.wh-type-features {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}
.wh-type-features li {
	font-size: 0.8rem;
	color: var(--text-muted);
	padding-left: 1.1em;
	position: relative;
}
.wh-type-features li::before {
	content: '✓';
	position: absolute;
	left: 0;
	color: var(--color-primary);
	font-weight: 700;
}
.wh-recommend-badge {
	display: inline-block;
	background-color: var(--color-primary);
	color: #fff;
	font-size: 0.7rem;
	font-weight: 700;
	padding: 0.15em 0.7em;
	border-radius: var(--radius-full);
	letter-spacing: 0.05em;
	vertical-align: middle;
}

/* --- Flow Section（施術の流れ） --- */
.wh-flow-section {
	background-color: #fff;
	padding: var(--space-lg) 0;
}
.wh-flow-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
}
.wh-flow-item {
	display: flex;
	align-items: flex-start;
	gap: 2rem;
	padding: 2rem 0;
	border-bottom: 1px solid var(--border-color);
	position: relative;
}
.wh-flow-item:last-child {
	border-bottom: none;
}
.wh-flow-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 3rem;
	height: 3rem;
	border: 1.5px solid var(--color-primary);
	border-radius: 50%;
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--color-primary);
	line-height: 1;
	font-family: 'Noto Serif JP', serif;
}
.wh-flow-content {
	flex: 1;
}
.wh-flow-title {
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 0.6rem;
}
.wh-flow-text {
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.8;
}
.wh-flow-text strong {
	font-weight: 700;
	background: linear-gradient(transparent 55%, rgba(235, 71, 115, 0.2) 55%);
}

/* --- Price Section（料金） --- */
.wh-price-section {
	padding: var(--space-lg) 0;
}
.wh-price-table-wrap {
	max-width: 640px;
	margin: 0 auto 1.5rem;
	overflow-x: auto;
}
.wh-price-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.95rem;
}
.wh-price-table th,
.wh-price-table td {
	padding: 1rem 1.5rem;
	text-align: left;
	border-bottom: 1px solid var(--border-color);
}
.wh-price-table thead th {
	background-color: var(--color-accent);
	color: var(--color-primary);
	font-weight: 700;
	font-size: 0.8rem;
	letter-spacing: 0.05em;
}
.wh-price-table tbody tr:hover {
	background-color: var(--color-gray-100);
}
.wh-price-table-recommended td {
	font-weight: 700;
	color: var(--color-primary);
}
.wh-price-caution {
	max-width: 820px;
	margin: 2rem auto 0;
	padding-left: 1.75rem;
	font-size: 0.8rem;
	color: var(--text-muted);
	line-height: 1.8;
	text-align: left;
}

/* --- FAQ Section --- */
.wh-faq-section {
	background-color: var(--color-gray-100);
	padding: var(--space-lg) 0;
}
.wh-faq-list {
	max-width: 720px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.wh-faq-item {
	background: #fff;
	border-radius: var(--radius-md);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
}
.wh-faq-q {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.25rem 1.5rem;
	font-weight: 700;
	color: var(--text-heading);
	font-size: 0.95rem;
	line-height: 1.6;
	cursor: default;
}
.wh-faq-a {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.25rem 1.5rem;
	background-color: var(--color-gray-100);
	font-size: 0.875rem;
	color: var(--text-main);
	line-height: 1.8;
}
.wh-faq-q-label,
.wh-faq-a-label {
	flex-shrink: 0;
	width: 1.75rem;
	height: 1.75rem;
	border-radius: var(--radius-full);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 0.85rem;
}
.wh-faq-q-label {
	background-color: var(--color-primary);
	color: #fff;
}
.wh-faq-a-label {
	background-color: var(--color-gray-300);
	color: var(--text-heading);
}

/* --- CTA Section --- */
.wh-cta-section {
	padding: var(--space-lg) 0;
	background: linear-gradient(135deg, #fdf0f3 0%, #fff5f7 100%);
	margin-bottom: 4rem;
}
.wh-cta-inner {
	text-align: center;
	max-width: 560px;
	margin: 0 auto;
}
.wh-cta-sub {
	font-size: 0.85rem;
	color: var(--color-primary);
	letter-spacing: 0.1em;
	margin-bottom: 0.75rem;
}
.wh-cta-title {
	font-size: clamp(1.5rem, 3.5vw, 2rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.5;
	margin-bottom: 1rem;
}
.wh-cta-text {
	font-size: 0.9rem;
	color: var(--text-muted);
	line-height: 1.8;
	margin-bottom: 2rem;
}
.wh-cta-tel {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	margin-top: 1.5rem;
	color: var(--color-primary);
	font-size: clamp(2rem, 5vw, 2.8rem);
	font-weight: 700;
	letter-spacing: 0.02em;
	text-decoration: none;
	line-height: 1;
	transition: opacity 0.2s ease;
}
.wh-cta-tel:hover {
	opacity: 0.75;
}
.wh-cta-tel svg {
	width: clamp(1.6rem, 3.2vw, 2rem);
	height: clamp(1.6rem, 3.2vw, 2rem);
	flex-shrink: 0;
}
.wh-cta-tel-num {
	line-height: 1;
}
.wh-cta-hours {
	margin: 1.75rem auto 0;
	padding: 1rem 1.5rem;
	background-color: rgba(255, 255, 255, 0.6);
	border-radius: 0.5rem;
	display: inline-block;
	text-align: left;
}
.wh-cta-hours-row {
	display: flex;
	align-items: baseline;
	gap: 0.75rem;
	font-size: 0.88rem;
	color: var(--text-main);
	line-height: 1.8;
}
.wh-cta-hours-row dt {
	flex-shrink: 0;
	font-weight: 700;
	color: var(--text-heading);
	letter-spacing: 0.1em;
}
.wh-cta-hours-row dd {
	margin: 0;
}
.wh-cta-buttons {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
}
.wh-cta-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 1rem 2.5rem;
	border-radius: var(--radius-full);
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none;
	transition: all 0.2s ease;
	width: 100%;
	max-width: 360px;
}
.wh-cta-btn--primary {
	background-color: var(--color-primary);
	color: #fff;
	box-shadow: 0 4px 14px rgb(235 71 115 / 0.35);
}
.wh-cta-btn--primary:hover {
	background-color: var(--color-primary-hover);
	box-shadow: 0 6px 18px rgb(235 71 115 / 0.45);
	transform: translateY(-1px);
}
.wh-cta-btn--secondary {
	background-color: #fff;
	color: var(--text-heading);
	border: 1.5px solid var(--border-color);
}
.wh-cta-btn--secondary:hover {
	border-color: var(--color-primary);
	color: var(--color-primary);
}

/* --- Whitening Page Responsive --- */
@media (max-width: 768px) {
	.wh-feature-item {
		display: block;
		padding: 2rem 0 2rem 0.5rem;
	}
	.wh-feature-num {
		top: 1.5rem;
		left: calc(50% - 5.5rem);
		font-size: 2.5rem;
	}
	.wh-feature-photo {
		width: 9rem;
		height: 9rem;
		margin: 0 auto 1.25rem;
	}
	.wh-feature-title {
		font-size: 1.05rem;
		text-align: center;
	}
	.wh-types-grid {
		grid-template-columns: 1fr;
	}
	.wh-flow-item {
		gap: 1rem;
	}
	.wh-flow-num {
		font-size: 1rem;
		width: 2.4rem;
		height: 2.4rem;
	}
	.wh-flow-title {
		font-size: 1.15rem;
	}
	.wh-price-table th,
	.wh-price-table td {
		padding: 0.75rem 1rem;
		font-size: 0.85rem;
	}
	.wh-cta-btn {
		max-width: 100%;
	}
	.wh-cta-hours {
		padding: 0.85rem 1rem;
		width: 100%;
		box-sizing: border-box;
	}
	.wh-cta-hours-row {
		flex-direction: column;
		gap: 0.1rem;
		font-size: 0.82rem;
		margin-bottom: 0.5rem;
	}
	.wh-cta-hours-row:last-child {
		margin-bottom: 0;
	}
	.wh-cta-tel {
		gap: 0.5rem;
	}
}
}


/* ==========================================================================
   Clinic Info Section（診療時間・アクセス共通セクション）
   ========================================================================== */

.clinic-info-wrapper {
	padding: 5rem 0;
}

.clinic-info-section {
	background-color: #fff;
	padding: 5rem 0;
	border-top: 1px solid var(--border-color);
	border-bottom: 1px solid var(--border-color);
}

/* ロゴ＋医院名（全幅・2カラム上） */
.clinic-info-brand {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	margin-bottom: 1.6rem;
}

/* 2カラム */
.clinic-info-inner {
	display: flex;
	gap: 4rem;
	align-items: flex-start;
}

/* 左：住所・地図 */
.clinic-info-left {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 0.8rem;
}

.clinic-info-logo {
	width: 56px;
	height: auto;
	object-fit: contain;
}

.clinic-info-brand-name {
	font-size: 1.45rem;
	font-weight: 700;
	color: var(--text-heading);
	margin: 0 0 0.15rem;
	letter-spacing: 0.05em;
}

.clinic-info-brand-en {
	font-size: 0.72rem;
	color: var(--text-muted);
	letter-spacing: 0.1em;
	margin: 0;
}

/* 住所・電話・アクセス */
.clinic-access-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.clinic-access-item {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: 0.98rem;
	color: var(--text-main);
	line-height: 1.45;
}

.clinic-access-icon {
	flex-shrink: 0;
	margin-top: 0.2rem;
	color: var(--color-primary);
}

.clinic-access-tel {
	color: var(--text-main);
	font-weight: 600;
	text-decoration: none;
}

.clinic-access-tel:hover {
	text-decoration: underline;
}

/* Google マップ */
.clinic-map-wrap {
	border-radius: var(--radius-md);
	overflow: hidden;
	border: 1px solid var(--border-color);
}

.clinic-map-wrap iframe {
	display: block;
}

/* ---- 右：診療時間＋CTA ---- */
.clinic-info-right {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 0;
}

/* 診療時間テーブル */
.clinic-hours-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 1rem;
	margin-bottom: 0.9rem;
	border: 1px solid var(--border-color);
	border-radius: var(--radius-sm);
	overflow: hidden;
}

.clinic-hours-table thead th {
	padding: 0.85rem 0.6rem;
	text-align: center;
	font-weight: 500;
	color: var(--text-muted);
	font-size: 0.9rem;
	background-color: var(--color-gray-100);
	border-bottom: 1px solid var(--border-color);
}

.clinic-hours-table thead th:first-child {
	text-align: left;
	padding-left: 1rem;
	color: var(--text-heading);
	font-size: 1rem;
}

.clinic-hours-table tbody td {
	padding: 0.85rem 0.6rem;
	text-align: center;
	border-bottom: 1px solid var(--color-gray-100);
}

.clinic-hours-table tbody tr:last-child td {
	border-bottom: none;
}

.clinic-hours-time {
	text-align: left !important;
	font-size: 0.92rem;
	color: var(--text-main);
	white-space: nowrap;
	padding-left: 1rem !important;
}

.clinic-hours-time-note {
	font-size: 0.78rem;
	color: var(--text-muted);
}

.clinic-hours-mark {
	font-size: 1.05rem;
}

.clinic-hours-mark--open {
	color: var(--color-primary);
}

.clinic-hours-mark--closed {
	color: var(--color-gray-400, #a09296);
}

.clinic-hours-mark-wrap {
	position: relative;
	display: inline-block;
}

.clinic-hours-mark-asterisk {
	position: absolute;
	top: -0.35em;
	right: -0.85em;
	font-size: 0.6rem;
	color: var(--text-muted);
	line-height: 1;
}

.clinic-hours-note {
	font-size: 0.88rem;
	color: var(--text-main);
	line-height: 1.7;
	margin: 0 0 1.6rem;
}

/* ---- 電話番号＋予約ボタン row ---- */
.clinic-cta-row {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex-wrap: wrap;
}

/* ご予約・お問い合わせ ラベル（モバイルのみ表示） */
.clinic-cta-label {
	display: none;
	margin: 0;
}

.clinic-cta-tel {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	font-size: 1.75rem;
	font-weight: 700;
	color: var(--color-primary);
	text-decoration: none;
	letter-spacing: 0.04em;
	line-height: 1;
	transition: opacity 0.2s;
}

.clinic-cta-tel:hover {
	opacity: 0.75;
}

.clinic-cta-tel svg {
	flex-shrink: 0;
	margin-top: 0.1rem;
}

.clinic-cta-reserve {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.75rem 1.5rem;
	background-color: var(--color-primary);
	color: #fff;
	font-size: 0.9rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	border-radius: var(--radius-full);
	text-decoration: none;
	transition: background 0.2s, transform 0.15s;
	white-space: nowrap;
}

.clinic-cta-reserve:hover {
	background-color: var(--color-primary-hover);
	transform: translateY(-1px);
}

/* ---- Responsive: Clinic Info ---- */
@media (max-width: 767px) {
	.clinic-info-wrapper {
		padding: 3rem 0;
	}

	.clinic-info-section {
		padding: 3rem 0;
	}

	.clinic-info-inner {
		flex-direction: column;
		gap: 2rem;
	}

	.clinic-info-left,
	.clinic-info-right {
		width: 100%;
	}

	.clinic-hours-table {
		font-size: 0.8rem;
		table-layout: fixed;
	}

	.clinic-hours-table thead th:first-child,
	.clinic-hours-table tbody td.clinic-hours-time {
		width: 28%;
		padding-left: 0.5rem !important;
	}

	.clinic-hours-table thead th:not(:first-child),
	.clinic-hours-table tbody td:not(.clinic-hours-time) {
		width: 10.28%;
		padding: 0.85rem 0.15rem;
	}

	.clinic-hours-time {
		font-size: 0.7rem;
		white-space: normal;
	}

	.clinic-hours-time-note {
		font-size: 0.66rem;
	}

	.clinic-hours-mark-asterisk {
		font-size: 0.55rem;
	}

	.clinic-hours-note {
		margin-bottom: 2.5rem;
	}

	.clinic-cta-row {
		flex-direction: column;
		align-items: center;
		gap: 0.7rem;
	}

	.clinic-cta-label {
		display: block;
		font-size: 1.1rem;
		color: var(--text-main);
		font-weight: 700;
		letter-spacing: 0.05em;
		text-align: center;
		line-height: 1.4;
	}

	.clinic-cta-tel {
		font-size: 1.3rem;
		background-color: var(--color-primary);
		color: #fff;
		padding: 0.85rem 2.2rem;
		border-radius: 9999px;
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	}

	.clinic-cta-tel:hover {
		opacity: 1;
		background-color: var(--color-primary-hover);
	}

	.clinic-cta-reserve {
		width: 100%;
		justify-content: center;
	}
}


/* ==========================================================================
   Visiting Dental Page（往診・訪問歯科ページ） vd- prefix
   ========================================================================== */

/* --- 共通見出し --- */
.vd-section-heading {
	text-align: center;
	margin-bottom: 3rem;
}
.vd-section-en {
	font-size: 0.75rem;
	letter-spacing: 0.2em;
	color: var(--color-primary);
	text-transform: uppercase;
	margin-bottom: 0.5rem;
}
.vd-section-title {
	font-size: clamp(1.4rem, 3vw, 1.9rem);
	font-weight: 700;
	color: var(--text-heading);
	letter-spacing: 0.05em;
	line-height: 1.5;
}

/* --- Legacy Section（創業以来の継続性メッセージ） --- */
.vd-legacy-section {
	padding: var(--space-lg) 0;
	background: linear-gradient(135deg, #fdf0f3 0%, #fff5f7 100%);
}
.vd-legacy-inner {
	max-width: 760px;
	margin: 0 auto;
	text-align: center;
}
.vd-legacy-sub {
	font-size: 0.85rem;
	letter-spacing: 0.18em;
	color: var(--color-primary);
	font-weight: 700;
	margin-bottom: 1rem;
}
.vd-legacy-title {
	font-size: clamp(1.5rem, 3.5vw, 2rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.6;
	margin-bottom: 2rem;
}
.vd-legacy-text {
	font-size: 1rem;
	line-height: 2;
	color: var(--text-main);
	text-align: left;
	max-width: 640px;
	margin: 0 auto 1.25rem;
}
.vd-legacy-text:last-child {
	margin-bottom: 0;
}
.vd-legacy-text strong {
	font-weight: 700;
	background: linear-gradient(transparent 55%, rgba(235, 71, 115, 0.2) 55%);
}

/* --- Services Section（できる内容） --- */
.vd-services-section {
	background-color: var(--color-gray-100);
	padding: var(--space-lg) 0;
}
.vd-service-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
	max-width: 880px;
	margin-left: auto;
	margin-right: auto;
}
.vd-service-item {
	background: #fff;
	border-radius: var(--radius-md);
	padding: 2rem 1.75rem;
	display: flex;
	gap: 1.25rem;
	align-items: flex-start;
	box-shadow: var(--shadow-sm);
	transition: box-shadow 0.2s ease;
}
.vd-service-item:hover {
	box-shadow: var(--shadow-md);
}
.vd-service-icon {
	flex-shrink: 0;
	color: var(--color-primary);
	margin-top: 0.1rem;
}
.vd-service-body {
	flex: 1;
}
.vd-service-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 0.6rem;
	line-height: 1.5;
}
.vd-service-desc {
	font-size: 0.875rem;
	color: var(--text-main);
	line-height: 1.8;
}
.vd-service-desc strong {
	font-weight: 700;
	background: linear-gradient(transparent 55%, rgba(235, 71, 115, 0.2) 55%);
}

/* --- Worries Section（こんなお悩みはありませんか？） --- */
.vd-worries-section {
	padding: var(--space-lg) 0;
	background-color: var(--color-accent);
}
.vd-worries-list {
	list-style: none;
	padding: 0;
	max-width: 640px;
	margin: 0 auto 2rem;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
}
.vd-worries-item {
	background: #fff;
	border-radius: var(--radius-md);
	padding: 1rem 1.25rem 1rem 3.2rem;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--text-heading);
	line-height: 1.6;
	position: relative;
	box-shadow: var(--shadow-sm);
}
.vd-worries-item::before {
	content: '';
	position: absolute;
	left: 1.1rem;
	top: 50%;
	transform: translateY(-50%);
	width: 1.4rem;
	height: 1.4rem;
	border-radius: 50%;
	background-color: var(--color-primary);
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
	background-size: 0.9rem;
	background-position: center;
	background-repeat: no-repeat;
}
.vd-worries-note {
	text-align: center;
	font-size: 0.95rem;
	color: var(--text-main);
	line-height: 1.8;
}

/* --- Feature Section（選ばれる理由） --- */
.vd-feature-section {
	background-color: #fff;
	padding: var(--space-lg) 0;
}
.vd-feature-list {
	list-style: none;
	padding: 0;
	margin: 0 auto;
	max-width: 800px;
	display: flex;
	flex-direction: column;
}
.vd-feature-item {
	display: grid;
	grid-template-columns: 5rem 1fr;
	gap: 0 2.5rem;
	align-items: start;
	padding: 3rem 0;
	border-bottom: 1px solid var(--border-color);
}
.vd-feature-item:first-child {
	border-top: 1px solid var(--border-color);
}
.vd-feature-num {
	font-size: 3.5rem;
	font-weight: 700;
	line-height: 1;
	color: var(--color-primary);
	opacity: 0.18;
	letter-spacing: -0.02em;
	padding-top: 0.15em;
}
.vd-feature-body {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.vd-feature-title {
	font-size: clamp(1.05rem, 2.5vw, 1.3rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.6;
	margin: 0;
}
.vd-feature-desc {
	font-size: 0.95rem;
	color: var(--text-main);
	line-height: 2;
	margin: 0;
}
.vd-feature-desc strong {
	font-weight: 700;
	background: linear-gradient(transparent 55%, rgba(235, 71, 115, 0.2) 55%);
}

/* --- Reception Section（受診のご案内） --- */
.vd-reception-section {
	background-color: var(--color-gray-100);
	padding: var(--space-lg) 0;
}
.vd-info-table {
	width: 100%;
	max-width: 720px;
	margin: 0 auto;
	border-collapse: collapse;
	background: #fff;
	border-radius: var(--radius-md);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
}
.vd-info-table th,
.vd-info-table td {
	padding: 1.2rem 1.5rem;
	text-align: left;
	border-bottom: 1px solid var(--border-color);
	line-height: 1.7;
	font-size: 0.95rem;
	vertical-align: top;
}
.vd-info-table tr:last-child th,
.vd-info-table tr:last-child td {
	border-bottom: none;
}
.vd-info-table th {
	width: 210px;
	background-color: var(--color-accent);
	color: var(--color-primary);
	font-weight: 700;
	letter-spacing: 0.02em;
}
.vd-info-table td {
	color: var(--text-main);
}
.vd-info-note {
	display: inline-block;
	margin-top: 0.4rem;
	font-size: 0.8rem;
	color: var(--text-muted);
	line-height: 1.6;
}
.vd-info-footnote {
	max-width: 720px;
	margin: 1.25rem auto 0;
	font-size: 0.85rem;
	color: var(--text-muted);
	text-align: center;
	line-height: 1.7;
}

/* --- Flow Section（ご利用の流れ） --- */
.vd-flow-section {
	padding: var(--space-lg) 0;
}
.vd-flow-list {
	list-style: none;
	padding: 0;
	margin: 0;
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	flex-direction: column;
}
.vd-flow-item {
	display: flex;
	align-items: flex-start;
	gap: 2rem;
	padding: 2rem 0;
	border-bottom: 1px solid var(--border-color);
}
.vd-flow-item:last-child {
	border-bottom: none;
}
.vd-flow-num {
	font-size: 2.5rem;
	font-weight: 700;
	color: var(--color-primary);
	opacity: 0.25;
	line-height: 1;
	flex-shrink: 0;
	width: 3.5rem;
	text-align: center;
}
.vd-flow-content {
	flex: 1;
}
.vd-flow-title {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 0.5rem;
}
.vd-flow-text {
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.8;
}

/* --- FAQ Section --- */
.vd-faq-section {
	background-color: var(--color-gray-100);
	padding: var(--space-lg) 0;
}
.vd-faq-list {
	max-width: 720px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.vd-faq-item {
	background: #fff;
	border-radius: var(--radius-md);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
}
.vd-faq-q {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.25rem 1.5rem;
	font-weight: 700;
	color: var(--text-heading);
	font-size: 0.95rem;
	line-height: 1.6;
	cursor: default;
}
.vd-faq-a {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.25rem 1.5rem;
	background-color: var(--color-gray-100);
	font-size: 0.875rem;
	color: var(--text-main);
	line-height: 1.8;
}
.vd-faq-q-label,
.vd-faq-a-label {
	flex-shrink: 0;
	width: 1.75rem;
	height: 1.75rem;
	border-radius: var(--radius-full);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 0.85rem;
}
.vd-faq-q-label {
	background-color: var(--color-primary);
	color: #fff;
}
.vd-faq-a-label {
	background-color: var(--color-gray-300);
	color: var(--text-heading);
}

/* --- CTA Section --- */
.vd-cta-section {
	padding: var(--space-lg) 0;
	background: linear-gradient(135deg, #fdf0f3 0%, #fff5f7 100%);
	margin-bottom: 4rem;
}
.vd-cta-inner {
	text-align: center;
	max-width: 560px;
	margin: 0 auto;
}
.vd-cta-sub {
	font-size: 0.85rem;
	color: var(--color-primary);
	letter-spacing: 0.1em;
	margin-bottom: 0.75rem;
}
.vd-cta-title {
	font-size: clamp(1.5rem, 3.5vw, 2rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.5;
	margin-bottom: 1rem;
}
.vd-cta-text {
	font-size: 0.9rem;
	color: var(--text-muted);
	line-height: 1.8;
	margin-bottom: 2rem;
}
.vd-cta-buttons {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
}
.vd-cta-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 1rem 2.5rem;
	border-radius: var(--radius-full);
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none;
	transition: all 0.2s ease;
	width: 100%;
	max-width: 360px;
}
.vd-cta-btn--primary {
	background-color: var(--color-primary);
	color: #fff;
	box-shadow: 0 4px 14px rgb(235 71 115 / 0.35);
}
.vd-cta-btn--primary:hover {
	background-color: var(--color-primary-hover);
	box-shadow: 0 6px 18px rgb(235 71 115 / 0.45);
	transform: translateY(-1px);
}
.vd-cta-btn--secondary {
	background-color: #fff;
	color: var(--text-heading);
	border: 1.5px solid var(--border-color);
}
.vd-cta-btn--secondary:hover {
	border-color: var(--color-primary);
	color: var(--color-primary);
}

/* --- Visiting Dental Page Responsive --- */
@media (max-width: 768px) {
	/* セクション全体の上下余白をスマホ用に圧縮 */
	.vd-legacy-section,
	.vd-worries-section,
	.vd-feature-section,
	.vd-services-section,
	.vd-reception-section,
	.vd-cta-section {
		padding: 3rem 0;
	}
	.vd-cta-section {
		margin-bottom: 2rem;
	}

	/* 共通見出し */
	.vd-section-heading {
		margin-bottom: 2rem;
	}
	.vd-section-title {
		font-size: clamp(1.2rem, 5.5vw, 1.6rem);
		letter-spacing: 0.04em;
		line-height: 1.5;
	}

	/* Legacy（創業以来〜） */
	.vd-legacy-inner {
		padding: 0 0.25rem;
	}
	.vd-legacy-title {
		font-size: clamp(1.15rem, 5.2vw, 1.5rem);
		letter-spacing: 0.03em;
		line-height: 1.55;
		margin-bottom: 1.5rem;
		word-break: keep-all;
		overflow-wrap: anywhere;
	}
	.vd-legacy-text {
		font-size: 0.92rem;
		line-height: 1.95;
		letter-spacing: 0.02em;
		margin-bottom: 1rem;
	}

	/* Services（できる内容） */
	.vd-service-list {
		grid-template-columns: 1fr;
		gap: 1rem;
	}
	.vd-service-item {
		gap: 0.9rem;
		padding: 1.4rem 1.2rem;
	}
	.vd-service-title {
		font-size: 0.98rem;
	}
	.vd-service-desc {
		font-size: 0.85rem;
		line-height: 1.75;
	}

	/* Worries（こんなお悩み） */
	.vd-worries-list {
		gap: 0.7rem;
		margin-bottom: 1.5rem;
	}
	.vd-worries-item {
		font-size: 0.88rem;
		padding: 0.85rem 1rem 0.85rem 2.6rem;
		letter-spacing: 0.02em;
		line-height: 1.55;
	}
	.vd-worries-item::before {
		left: 0.8rem;
		width: 1.15rem;
		height: 1.15rem;
		background-size: 0.75rem;
	}
	.vd-worries-note {
		font-size: 0.85rem;
		line-height: 1.7;
		text-align: left;
		padding: 0 0.25rem;
	}

	/* Feature（選ばれる理由） */
	.vd-feature-list {
		max-width: 100%;
	}
	.vd-feature-item {
		grid-template-columns: 1fr;
		gap: 0.5rem;
		padding: 1.75rem 0;
	}
	.vd-feature-num {
		font-size: 2.2rem;
		opacity: 0.22;
	}
	.vd-feature-body {
		gap: 0.6rem;
	}
	.vd-feature-title {
		font-size: 1rem;
		letter-spacing: 0.03em;
		line-height: 1.55;
	}
	.vd-feature-desc {
		font-size: 0.88rem;
		line-height: 1.9;
		letter-spacing: 0.02em;
	}

	/* Reception（受診のご案内） */
	.vd-info-table,
	.vd-info-table tbody,
	.vd-info-table tr,
	.vd-info-table th,
	.vd-info-table td {
		display: block;
		width: 100%;
	}
	.vd-info-table th {
		padding: 0.75rem 1.1rem;
		font-size: 0.85rem;
		border-bottom: 1px solid var(--border-color);
	}
	.vd-info-table td {
		padding: 0.9rem 1.1rem;
		font-size: 0.9rem;
		border-bottom: 1px solid var(--border-color);
		line-height: 1.7;
	}
	.vd-info-table tr:last-child td {
		border-bottom: none;
	}
	.vd-info-footnote {
		font-size: 0.8rem;
		line-height: 1.7;
		text-align: left;
		padding: 0 0.25rem;
	}

	/* CTA（お問い合わせ） */
	.vd-cta-inner {
		padding: 0 0.25rem;
	}
	.vd-cta-title {
		font-size: clamp(1.2rem, 5vw, 1.55rem);
		letter-spacing: 0.03em;
		line-height: 1.55;
	}
	.vd-cta-text {
		font-size: 0.85rem;
		line-height: 1.7;
		text-align: left;
	}
	.vd-cta-btn {
		max-width: 100%;
		padding: 0.85rem 1.25rem;
		gap: 0.6rem;
		font-size: 0.9rem;
	}

	/* ページ内で使用する wh-（共通）パーツの調整 */
	.wh-section-heading {
		margin-bottom: 2rem;
	}
	.wh-section-title {
		font-size: clamp(1.2rem, 5.5vw, 1.6rem);
		letter-spacing: 0.03em;
		line-height: 1.5;
	}
	.wh-flow-item {
		gap: 1rem;
		padding: 1.5rem 0;
	}
	.wh-flow-num {
		width: 2.4rem;
		height: 2.4rem;
		font-size: 1rem;
	}
	.wh-flow-title {
		font-size: 1rem;
		line-height: 1.55;
	}
	.wh-flow-text {
		font-size: 0.88rem;
		line-height: 1.85;
	}
	.wh-faq-q {
		padding: 1rem 1.1rem;
		gap: 0.75rem;
		font-size: 0.9rem;
	}
	.wh-faq-a {
		padding: 1rem 1.1rem;
		gap: 0.75rem;
		font-size: 0.85rem;
		line-height: 1.75;
	}
	.wh-faq-q-label,
	.wh-faq-a-label {
		width: 1.6rem;
		height: 1.6rem;
		font-size: 0.8rem;
	}
}



/* ==========================================================================
   Access Page Styles (ac-)
   ========================================================================== */

/* --- コンテナ幅（このページ専用のやや狭いmax-width） --- */
.ac-container {
	max-width: 840px;
	margin: 0 auto;
	padding: 0 1.5rem;
}

/* --- セクション共通 --- */
.ac-section-title {
	font-size: clamp(1.25rem, 2.5vw, 1.6rem);
	font-weight: 700;
	color: var(--text-heading);
	text-align: center;
	margin-bottom: 2.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--border-color);
}

/* --- 診療時間セクション --- */
.ac-hours-section {
	padding: 5rem 0 4rem;
	background-color: var(--bg-surface);
}

/* 基本情報テーブル */
.ac-info-table {
	width: 100%;
	border-top: 1px solid var(--border-color);
	margin-bottom: 2.5rem;
}
.ac-info-row {
	display: flex;
	border-bottom: 1px solid var(--border-color);
}
.ac-info-term {
	flex-shrink: 0;
	width: 9rem;
	padding: 1.1rem 1.25rem;
	font-size: 0.88rem;
	font-weight: 700;
	color: var(--text-heading);
	background-color: var(--color-gray-100);
}
.ac-info-desc {
	padding: 1.1rem 1.5rem;
	font-size: 0.88rem;
	color: var(--text-main);
	line-height: 1.7;
}
.ac-tel {
	color: var(--text-heading);
	text-decoration: none;
	font-weight: 700;
	font-size: 1.05rem;
	letter-spacing: 0.05em;
}
.ac-tel:hover {
	color: var(--color-primary);
}

/* 曜日別診療表（clinic-hours-tableのデザインを流用） */
.ac-schedule-wrap {
	overflow-x: auto;
	margin-bottom: 1.5rem;
}

/* 注釈・予約ボタン */
.ac-schedule-note {
	font-size: 0.82rem;
	color: var(--text-muted);
	line-height: 1.8;
	margin-bottom: 2rem;
	text-align: center;
}
.ac-reserve-btn-wrap {
	text-align: center;
}
.ac-reserve-btn {
	display: inline-block;
	padding: 0.9rem 3.5rem;
	background-color: var(--color-primary);
	color: #fff;
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none;
	border-radius: var(--radius-full);
	box-shadow: 0 4px 14px rgb(235 71 115 / 0.3);
	transition: all 0.2s ease;
}
.ac-reserve-btn:hover {
	background-color: var(--color-primary-hover);
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgb(235 71 115 / 0.4);
}

/* --- アクセスセクション --- */
.ac-access-section {
	padding: 5rem 0 4rem;
	background-color: var(--color-gray-100);
}
.ac-access-inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3.5rem;
	align-items: start;
}
.ac-address {
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.8;
	margin-bottom: 1.5rem;
}
.ac-access-list {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
	border-top: 1px solid var(--border-color);
}
.ac-access-item {
	font-size: 0.88rem;
	color: var(--text-main);
	line-height: 1.7;
	padding: 0.8rem 0;
	border-bottom: 1px solid var(--border-color);
}
.ac-parking-note {
	font-size: 0.85rem;
	color: var(--text-muted);
	line-height: 1.8;
}
.ac-access-photo {
	border-radius: var(--radius-md);
	overflow: hidden;
	box-shadow: var(--shadow-md);
}
.ac-photo-img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: cover;
	aspect-ratio: 4 / 3;
	/* 写真が未設定の場合のプレースホルダー */
	background-color: var(--color-gray-200);
	min-height: 240px;
}

/* --- Googleマップ --- */
.ac-map-wrap {
	line-height: 0;
}
.ac-map-wrap iframe {
	width: 100%;
	height: 400px;
}

/* --- CTAセクション --- */
.ac-cta-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
	text-align: center;
}
.ac-cta-label {
	font-size: 0.75rem;
	letter-spacing: 0.2em;
	color: var(--color-primary);
	margin-bottom: 0.75rem;
}
.ac-cta-title {
	font-size: clamp(1.3rem, 2.5vw, 1.7rem);
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 2.5rem;
}
.ac-cta-buttons {
	display: flex;
	justify-content: center;
	gap: 1rem;
	flex-wrap: wrap;
}
.ac-cta-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.9rem 2.5rem;
	border-radius: var(--radius-full);
	font-weight: 700;
	font-size: 0.9rem;
	text-decoration: none;
	transition: all 0.2s ease;
}
.ac-cta-btn--primary {
	background-color: var(--color-primary);
	color: #fff;
	box-shadow: 0 4px 14px rgb(235 71 115 / 0.3);
}
.ac-cta-btn--primary:hover {
	background-color: var(--color-primary-hover);
	transform: translateY(-1px);
}
.ac-cta-btn--tel {
	background-color: var(--bg-surface);
	color: var(--text-heading);
	border: 1.5px solid var(--border-color);
}
.ac-cta-btn--tel:hover {
	border-color: var(--color-primary);
	color: var(--color-primary);
}

/* --- レスポンシブ --- */
@media (max-width: 768px) {
	.ac-hours-section,
	.ac-access-section,
	.ac-cta-section {
		padding: 3.5rem 0 3rem;
	}
	.ac-info-term {
		width: 7rem;
	}
	.ac-access-inner {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}
	/* スマホでは写真を先に表示 */
	.ac-access-photo {
		order: -1;
	}
	.ac-cta-buttons {
		flex-direction: column;
		align-items: center;
	}
	.ac-cta-btn {
		width: 100%;
		max-width: 320px;
	}
	.ac-map-wrap iframe {
		height: 280px;
	}
}


/* ==========================================================================
   矯正歯科ページ（ot- prefix）
   ========================================================================== */

/* --- 共通セクション見出し --- */
.ot-section-heading {
	text-align: center;
	margin-bottom: 3rem;
}
.ot-section-en {
	font-size: 0.7rem;
	letter-spacing: 0.25em;
	color: var(--color-primary);
	margin-bottom: 0.5rem;
}
.ot-section-title {
	font-size: clamp(1.4rem, 2.8vw, 2rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.4;
}

/* --- リードセクション --- */
.ot-lead-section {
	padding: 5rem 0 4rem;
	background-color: var(--bg-surface);
}
.ot-lead-text {
	max-width: 680px;
	margin: 0 auto;
	text-align: center;
	font-size: 1rem;
	line-height: 2;
	color: var(--text-main);
}

/* --- お悩みセクション --- */
.ot-concern-section {
	padding: 5rem 0;
	background-color: var(--color-gray-100);
}
.ot-concern-list {
	list-style: none;
	max-width: 680px;
	margin: 0 auto 2rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.ot-concern-item {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	background: var(--bg-surface);
	padding: 1rem 1.25rem;
	border-radius: var(--radius-sm);
	font-size: 0.95rem;
	color: var(--text-main);
	line-height: 1.7;
	box-shadow: var(--shadow-sm);
}
.ot-concern-icon {
	flex-shrink: 0;
	color: var(--color-primary);
	margin-top: 0.1rem;
}
.ot-concern-text {
	flex: 1;
	min-width: 0;
}
.ot-concern-note {
	text-align: center;
	font-size: 0.9rem;
	color: var(--text-muted);
	font-style: italic;
}

/* --- 矯正の種類セクション --- */
.ot-types-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.ot-types-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	margin-bottom: 2rem;
}
.ot-type-card {
	background: var(--color-gray-100);
	border-radius: var(--radius-md);
	padding: 2rem 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.ot-type-icon {
	color: var(--color-primary);
	margin-bottom: 0.25rem;
}
.ot-type-title {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.4;
}
.ot-type-desc {
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.8;
}
.ot-type-features {
	list-style: none;
	margin-top: auto;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}
.ot-type-features li {
	font-size: 0.82rem;
	color: var(--color-primary);
	padding-left: 1rem;
	position: relative;
}
.ot-type-features li::before {
	content: '✓';
	position: absolute;
	left: 0;
	font-weight: 700;
}
.ot-type-link {
	display: inline-block;
	margin-top: 1rem;
	color: var(--color-primary);
	font-size: 0.9rem;
	font-weight: 700;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color 0.2s ease;
}
.ot-type-link:hover {
	border-color: var(--color-primary);
}
.ot-types-note {
	text-align: center;
	font-size: 0.9rem;
	color: var(--text-muted);
}

/* --- 担当医師紹介セクション --- */
.ot-doctor-section {
	padding: 5rem 0;
	background-color: var(--color-accent);
}
.ot-doctor-inner {
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: 3.5rem;
	align-items: flex-start;
}
.ot-doctor-photo-wrap {
	position: relative;
}
.ot-doctor-photo {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-md);
	/* 写真未入稿時のフォールバック */
	background-color: var(--color-gray-200);
	display: block;
}
/* 写真がない場合のプレースホルダー表示 */
.ot-doctor-photo[src$="doctor-usui.jpg"]:not([naturalWidth]) {
	min-height: 360px;
}
.ot-doctor-body {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.ot-doctor-label {
	display: inline-block;
	font-size: 0.75rem;
	letter-spacing: 0.15em;
	color: var(--color-primary);
	background: var(--bg-surface);
	border: 1px solid var(--color-primary);
	padding: 0.25rem 0.8rem;
	border-radius: var(--radius-full);
	width: fit-content;
}
.ot-doctor-name {
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.2;
}
.ot-doctor-name {
	margin-bottom: 0.2rem;
}
.ot-doctor-title {
	font-size: 0.88rem;
	color: var(--color-gray-700);
	line-height: 1.6;
	margin-bottom: 0;
}
.ot-doctor-message {
	font-size: 0.95rem;
	color: var(--text-main);
	line-height: 1.9;
}
.ot-doctor-link {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	color: var(--color-primary);
	font-size: 0.9rem;
	font-weight: 700;
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: border-color 0.2s ease;
	width: fit-content;
}
.ot-doctor-link:hover {
	border-color: var(--color-primary);
}

/* --- FAQセクション --- */
.ot-faq-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.ot-faq-list {
	max-width: 720px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 0;
}
.ot-faq-item {
	border-bottom: 1px solid var(--border-color);
}
.ot-faq-item:first-child {
	border-top: 1px solid var(--border-color);
}
.ot-faq-q {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.4rem 0;
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--text-heading);
	cursor: default;
	line-height: 1.6;
}
.ot-faq-q-label,
.ot-faq-a-label {
	flex-shrink: 0;
	width: 1.8rem;
	height: 1.8rem;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.85rem;
	font-weight: 700;
	line-height: 1;
	margin-top: 0.1rem;
}
.ot-faq-q-label {
	background: var(--color-primary);
	color: #fff;
}
.ot-faq-a-label {
	background: var(--color-gray-200);
	color: var(--text-heading);
}
.ot-faq-a {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 0 0 1.4rem;
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.85;
}

/* --- CTAセクション --- */
.ot-cta-section {
	padding: var(--space-lg) 0;
	background: linear-gradient(135deg, #fdf0f3 0%, #fff5f7 100%);
	margin-bottom: 4rem;
	text-align: center;
}
.ot-cta-inner {
	text-align: center;
	max-width: 560px;
	margin: 0 auto;
}
.ot-cta-sub {
	font-size: 0.85rem;
	color: var(--color-primary);
	letter-spacing: 0.1em;
	margin-bottom: 0.75rem;
}
.ot-cta-title {
	font-size: clamp(1.5rem, 3.5vw, 2rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.5;
	margin-bottom: 1rem;
}
.ot-cta-text {
	font-size: 0.9rem;
	color: var(--text-muted);
	line-height: 1.8;
	margin-bottom: 2rem;
}
.ot-cta-buttons {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
}
.ot-cta-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 1rem 2.5rem;
	border-radius: var(--radius-full);
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none;
	transition: all 0.2s ease;
}
.ot-cta-btn--primary {
	background-color: var(--color-primary);
	color: #fff;
	box-shadow: 0 4px 14px rgb(235 71 115 / 0.35);
}
.ot-cta-btn--primary:hover {
	background-color: var(--color-primary-hover);
	box-shadow: 0 6px 18px rgb(235 71 115 / 0.45);
	transform: translateY(-1px);
}
.ot-cta-btn--secondary {
	background-color: #fff;
	color: var(--text-heading);
	border: 1.5px solid var(--border-color);
}
.ot-cta-btn--secondary:hover {
	border-color: var(--color-primary);
	color: var(--color-primary);
}

/* --- レスポンシブ --- */
@media (max-width: 768px) {
	.ot-lead-section,
	.ot-concern-section,
	.ot-types-section,
	.ot-doctor-section,
	.ot-faq-section,
	.ot-cta-section {
		padding: 3.5rem 0 3rem;
	}
	.ot-types-grid {
		grid-template-columns: 1fr;
	}
	.ot-doctor-inner {
		grid-template-columns: 1fr;
		gap: 2rem;
	}
	.ot-doctor-photo-wrap {
		max-width: 240px;
		margin: 0 auto;
	}
	.ot-cta-buttons {
		flex-direction: column;
		align-items: center;
	}
	.ot-cta-btn {
		width: 100%;
		max-width: 320px;
	}
}


/* ============================================================
   LIP ART PAGE ( la- prefix )
   ============================================================ */

/* --- 共通セクション見出し --- */
.la-section-heading {
	text-align: center;
	margin-bottom: 3rem;
}
.la-section-en {
	display: block;
	font-size: 0.72rem;
	letter-spacing: 0.25em;
	color: var(--color-primary);
	margin-bottom: 0.5rem;
}
.la-section-title {
	font-size: clamp(1.4rem, 3vw, 2rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.4;
}

/* --- リップアートとは？ --- */
.la-what-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.la-what-inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: center;
}
.la-what-text {
	font-size: 0.95rem;
	color: var(--text-main);
	line-height: 1.9;
	margin-bottom: 1.2rem;
}
.la-what-text:last-child {
	margin-bottom: 0;
}
.la-what-photo-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.6rem;
}
.la-what-photo {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: var(--radius-md);
}

/* --- なぜ歯科医院でリップアートを？ --- */
.la-merit-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.la-section-lead {
	font-size: 0.95rem;
	color: var(--text-main);
	line-height: 1.85;
	max-width: 640px;
	margin: 1rem auto 0;
}
.la-merit-list {
	max-width: 760px;
	margin: 2.5rem auto 0;
	display: flex;
	flex-direction: column;
	gap: 2rem;
}
.la-merit-item {
	background: #fff;
	border: 1px solid var(--border-color);
	border-radius: var(--radius-lg);
	overflow: hidden;
}
.la-merit-header {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 1.25rem 1.75rem;
	background: linear-gradient(90deg, rgba(235,71,115,0.06) 0%, transparent 100%);
	border-bottom: 1px solid var(--border-color);
}
.la-merit-num {
	flex-shrink: 0;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	color: #fff;
	background: var(--color-primary);
	padding: 0.25rem 0.75rem;
	border-radius: var(--radius-full);
	white-space: nowrap;
}
.la-merit-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.4;
}
.la-merit-body {
	padding: 1.5rem 1.75rem;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.la-merit-desc {
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.85;
}
.la-merit-voice {
	margin: 0.25rem 0 0;
	padding: 1rem 1.25rem;
	background: var(--color-accent);
	border-left: 3px solid var(--color-primary);
	border-radius: 0 var(--radius-md) var(--radius-md) 0;
}
.la-merit-voice p {
	font-size: 0.88rem;
	color: var(--text-main);
	line-height: 1.85;
}

/* --- こんなお悩みありませんか？ --- */
.la-concern-section {
	padding: 5rem 0;
	background-color: var(--color-accent);
}
.la-concern-list {
	max-width: 640px;
	margin: 0 auto 1.75rem;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 0;
}
.la-concern-item {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	font-size: 0.95rem;
	color: var(--text-main);
	line-height: 1.8;
	padding: 0;
	background: transparent;
}
.la-concern-icon {
	flex-shrink: 0;
	color: var(--color-primary);
	margin-top: 0.65rem;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: var(--color-primary);
	display: inline-block;
}
.la-concern-text {
	flex: 1;
	min-width: 0;
}
.la-concern-note {
	text-align: center;
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--color-primary);
}

/* --- 選ばれる理由 --- */
.la-features-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.la-features-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
}
.la-feature-card {
	background: #fff;
	border: 1px solid var(--border-color);
	border-radius: var(--radius-lg);
	padding: 2rem;
	transition: box-shadow 0.2s ease;
}
.la-feature-card:hover {
	box-shadow: 0 4px 20px rgba(235, 71, 115, 0.1);
}
.la-feature-num {
	font-size: 1.6rem;
	font-weight: 900;
	color: var(--color-accent);
	letter-spacing: -0.02em;
	line-height: 1;
	margin-bottom: 0.75rem;
	font-family: serif;
}
.la-feature-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 0.75rem;
	line-height: 1.4;
}
.la-feature-desc {
	font-size: 0.88rem;
	color: var(--text-main);
	line-height: 1.85;
}

/* --- ビフォーアフター --- */
.la-beforeafter-section {
	padding: 5rem 0;
	background-color: var(--color-accent);
}
.la-beforeafter-inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: center;
}
.la-beforeafter-photos {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}
.la-beforeafter-photo-wrap {
	margin: 0;
	display: flex;
	flex-direction: column;
}
.la-beforeafter-photo {
	width: 100%;
	height: auto;
	display: block;
	border-radius: var(--radius-lg);
	overflow: hidden;
}
.la-beforeafter-caption {
	margin-top: 0.6rem;
	text-align: center;
	color: var(--color-primary);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.18em;
}
.la-beforeafter-label {
	font-size: 0.75rem;
	letter-spacing: 0.18em;
	color: var(--color-primary);
	margin-bottom: 1rem;
}
.la-beforeafter-list {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.9rem;
	margin-bottom: 1.5rem;
}
.la-beforeafter-item {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	font-size: 0.95rem;
	color: var(--text-main);
	line-height: 1.7;
}
.la-check-icon {
	flex-shrink: 0;
	color: var(--color-primary);
	font-weight: 700;
	font-size: 1rem;
	margin-top: 0.1rem;
}
.la-beforeafter-note {
	font-size: 0.78rem;
	color: var(--color-gray-500);
	line-height: 1.7;
}

/* --- 施術の流れ --- */
.la-flow-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.la-flow-list {
	max-width: 680px;
	margin: 0 auto;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0;
	counter-reset: none;
}
.la-flow-item {
	display: grid;
	grid-template-columns: 80px 1fr;
	gap: 1.5rem;
	align-items: flex-start;
	padding: 1.75rem 0;
	border-bottom: 1px solid var(--border-color);
}
.la-flow-item:first-child {
	border-top: 1px solid var(--border-color);
}
.la-flow-num {
	display: flex;
	flex-direction: column;
	align-items: center;
	font-size: 0.6rem;
	letter-spacing: 0.1em;
	color: var(--color-primary);
	font-weight: 700;
	line-height: 1;
	padding-top: 0.25rem;
}
.la-flow-num span {
	font-size: 2rem;
	font-weight: 900;
	letter-spacing: -0.02em;
	line-height: 1;
}
.la-flow-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 0.5rem;
}
.la-flow-desc {
	font-size: 0.88rem;
	color: var(--text-main);
	line-height: 1.85;
}

/* --- 料金 --- */
.la-price-section {
	padding: 5rem 0;
	background-color: var(--color-accent);
}
.la-price-table-wrap {
	max-width: 640px;
	margin: 0 auto 1.5rem;
	overflow-x: auto;
}
.la-price-table {
	width: 100%;
	border-collapse: collapse;
	background: #fff;
	border-radius: var(--radius-lg);
	overflow: hidden;
	box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}
.la-price-table thead tr {
	background-color: var(--color-primary);
}
.la-price-table thead th {
	padding: 0.9rem 1.25rem;
	color: #fff;
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-align: left;
}
.la-price-table tbody tr {
	border-bottom: 1px solid var(--border-color);
}
.la-price-table tbody tr:last-child {
	border-bottom: none;
}
.la-price-table tbody td {
	padding: 1rem 1.25rem;
	font-size: 0.9rem;
	color: var(--text-main);
	vertical-align: middle;
}
.la-price-menu-name {
	display: block;
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 0.2rem;
}
.la-price-menu-desc {
	display: block;
	font-size: 0.78rem;
	color: var(--color-gray-500);
}
.la-price-amount {
	font-weight: 700;
	color: var(--color-primary);
	font-size: 1rem;
	white-space: nowrap;
}
.la-price-note {
	max-width: 640px;
	margin: 0 auto;
	font-size: 0.78rem;
	color: var(--color-gray-500);
	line-height: 1.8;
	text-align: left;
}

/* --- FAQセクション --- */
.la-faq-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.la-faq-list {
	max-width: 720px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 0;
}
.la-faq-item {
	border-bottom: 1px solid var(--border-color);
}
.la-faq-item:first-child {
	border-top: 1px solid var(--border-color);
}
.la-faq-q {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1.4rem 0;
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.6;
}
.la-faq-q-label,
.la-faq-a-label {
	flex-shrink: 0;
	width: 1.8rem;
	height: 1.8rem;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.85rem;
	font-weight: 700;
	line-height: 1;
	margin-top: 0.1rem;
}
.la-faq-q-label {
	background: var(--color-primary);
	color: #fff;
}
.la-faq-a-label {
	background: var(--color-gray-200);
	color: var(--text-heading);
}
.la-faq-a {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 0 0 1.4rem;
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.85;
}

/* --- CTAセクション --- */
.la-cta-section {
	padding: 5rem 0;
	background-color: var(--color-accent);
	text-align: center;
}
.la-cta-inner {
	max-width: 560px;
	margin: 0 auto;
}
.la-cta-sub {
	font-size: 0.8rem;
	letter-spacing: 0.2em;
	color: var(--color-primary);
	margin-bottom: 0.75rem;
}
.la-cta-title {
	font-size: clamp(1.4rem, 3vw, 2rem);
	font-weight: 700;
	color: var(--text-main);
	line-height: 1.4;
	margin-bottom: 1.25rem;
}
.la-cta-text {
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.8;
	margin-bottom: 2.5rem;
}
.la-cta-buttons {
	display: flex;
	justify-content: center;
	gap: 1rem;
	flex-wrap: wrap;
}
.la-cta-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.9rem 2.5rem;
	border-radius: var(--radius-full);
	font-weight: 700;
	font-size: 0.9rem;
	text-decoration: none;
	transition: all 0.2s ease;
}
.la-cta-btn--primary {
	background-color: var(--color-primary);
	color: #fff;
	box-shadow: 0 4px 14px rgba(0,0,0,0.12);
}
.la-cta-btn--primary:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 20px rgba(0,0,0,0.18);
}
.la-cta-btn--secondary {
	background-color: transparent;
	color: var(--color-primary);
	border: 1.5px solid var(--color-primary);
}
.la-cta-btn--secondary:hover {
	background-color: rgba(0,0,0,0.04);
}

/* --- レスポンシブ --- */
@media (max-width: 768px) {
	.la-what-section,
	.la-concern-section,
	.la-features-section,
	.la-beforeafter-section,
	.la-flow-section,
	.la-price-section,
	.la-faq-section,
	.la-cta-section {
		padding: 3.5rem 0 3rem;
	}
	.la-what-inner,
	.la-beforeafter-inner {
		grid-template-columns: 1fr;
		gap: 2rem;
	}
	.la-beforeafter-photos {
		gap: 0.6rem;
	}
	.la-beforeafter-caption {
		margin-top: 0.45rem;
		font-size: 0.7rem;
		letter-spacing: 0.15em;
	}
	.la-features-grid {
		grid-template-columns: 1fr;
	}
	.la-merit-header {
		flex-wrap: wrap;
		padding: 1rem 1.25rem;
	}
	.la-merit-body {
		padding: 1.25rem;
	}
	.la-flow-item {
		grid-template-columns: 60px 1fr;
		gap: 1rem;
	}
	.la-cta-buttons {
		flex-direction: column;
		align-items: center;
	}
	.la-cta-btn {
		width: 100%;
		max-width: 320px;
	}
}


/* ============================================================
   GENERAL DENTISTRY PAGE ( gn- prefix )
   ============================================================ */

/* --- 共通セクション見出し --- */
.gn-section-heading {
	text-align: center;
	margin-bottom: 3rem;
}
.gn-section-en {
	display: block;
	font-size: 0.72rem;
	letter-spacing: 0.25em;
	color: var(--color-primary);
	margin-bottom: 0.5rem;
}
.gn-section-title {
	font-size: clamp(1.4rem, 3vw, 2rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.4;
}

/* --- リード文 --- */
.gn-lead-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.gn-lead-text {
	max-width: 720px;
	margin: 0 auto;
	font-size: 0.95rem;
	color: var(--text-main);
	line-height: 1.9;
	text-align: center;
}

/* --- 診療内容リスト --- */
.gn-treatments-section {
	padding: 5rem 0;
	background-color: var(--color-accent);
}
.gn-treatment-list {
	display: flex;
	flex-direction: column;
	gap: 4rem;
}
.gn-treatment-item {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: center;
	background: #fff;
	border-radius: var(--radius-lg);
	overflow: hidden;
	box-shadow: 0 2px 12px rgba(0,0,0,0.05);
}
.gn-treatment-item--reverse {
	direction: rtl;
}
.gn-treatment-item--reverse > * {
	direction: ltr;
}
.gn-treatment-photo-wrap {
	height: 100%;
	min-height: 280px;
}
.gn-treatment-photo {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.gn-treatment-body {
	padding: 2.5rem 2.5rem 2.5rem 0;
}
.gn-treatment-item--reverse .gn-treatment-body {
	padding: 2.5rem 0 2.5rem 2.5rem;
}
.gn-treatment-label {
	font-size: 0.68rem;
	letter-spacing: 0.2em;
	color: var(--color-primary);
	margin-bottom: 0.4rem;
}
.gn-treatment-title {
	font-size: clamp(1.2rem, 2.5vw, 1.6rem);
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 1rem;
	line-height: 1.3;
}
.gn-treatment-desc {
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.9;
	margin-bottom: 1.25rem;
}
.gn-treatment-points {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}
.gn-treatment-points li {
	font-size: 0.85rem;
	color: var(--color-gray-500);
	padding-left: 1.1rem;
	position: relative;
	line-height: 1.6;
}
.gn-treatment-points li::before {
	content: '✓';
	position: absolute;
	left: 0;
	color: var(--color-primary);
	font-weight: 700;
}

/* --- 選ばれる理由 --- */
.gn-feature-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.gn-feature-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}
.gn-feature-card {
	background: #fff;
	border: 1px solid var(--border-color);
	border-radius: var(--radius-lg);
	padding: 2rem;
	text-align: center;
	transition: box-shadow 0.2s ease;
}
.gn-feature-card:hover {
	box-shadow: 0 4px 20px rgba(235, 71, 115, 0.1);
}
.gn-feature-icon {
	color: var(--color-primary);
	margin-bottom: 1rem;
	display: flex;
	justify-content: center;
}
.gn-feature-title {
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 0.75rem;
	line-height: 1.4;
}
.gn-feature-desc {
	font-size: 0.85rem;
	color: var(--text-main);
	line-height: 1.85;
}

/* --- ホワイトニング誘導セクション --- */
.gn-whitening-lead-section {
	padding: 5rem 0;
	background-color: var(--color-accent);
}
.gn-whitening-lead-inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3rem;
	align-items: center;
}
.gn-whitening-lead-label {
	font-size: 0.7rem;
	letter-spacing: 0.2em;
	color: var(--color-primary);
	margin-bottom: 0.75rem;
}
.gn-whitening-lead-title {
	font-size: clamp(1.2rem, 2.5vw, 1.6rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.5;
	margin-bottom: 1rem;
}
.gn-whitening-lead-desc {
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.9;
	margin-bottom: 1.75rem;
}
.gn-whitening-lead-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	background: var(--color-primary);
	color: #fff;
	font-size: 0.9rem;
	font-weight: 700;
	text-decoration: none;
	padding: 0.85rem 2rem;
	border-radius: var(--radius-full);
	transition: opacity 0.2s ease;
}
.gn-whitening-lead-btn:hover {
	opacity: 0.85;
}
.gn-whitening-lead-img-wrap {
	border-radius: var(--radius-lg);
	overflow: hidden;
}
.gn-whitening-lead-img {
	width: 100%;
	height: auto;
	display: block;
}

/* --- CTAセクション（他サブページと統一：淡いピンクのソフトデザイン） --- */
.gn-cta-section {
	padding: var(--space-lg) 0;
	background: linear-gradient(135deg, #fdf0f3 0%, #fff5f7 100%);
	margin-bottom: 4rem;
}
.gn-cta-inner {
	text-align: center;
	max-width: 560px;
	margin: 0 auto;
}
.gn-cta-sub {
	font-size: 0.85rem;
	color: var(--color-primary);
	letter-spacing: 0.1em;
	margin-bottom: 0.75rem;
}
.gn-cta-title {
	font-size: clamp(1.5rem, 3.5vw, 2rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.5;
	margin-bottom: 1rem;
}
.gn-cta-text {
	font-size: 0.9rem;
	color: var(--text-muted);
	line-height: 1.8;
	margin-bottom: 2rem;
}
.gn-cta-buttons {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
}
.gn-cta-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 1rem 2.5rem;
	border-radius: var(--radius-full);
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none;
	transition: all 0.2s ease;
	width: 100%;
	max-width: 360px;
}
.gn-cta-btn--primary {
	background-color: var(--color-primary);
	color: #fff;
	box-shadow: 0 4px 14px rgb(235 71 115 / 0.35);
}
.gn-cta-btn--primary:hover {
	background-color: var(--color-primary-hover);
	box-shadow: 0 6px 18px rgb(235 71 115 / 0.45);
	transform: translateY(-1px);
}
.gn-cta-btn--secondary {
	background-color: #fff;
	color: var(--text-heading);
	border: 1.5px solid var(--border-color);
}
.gn-cta-btn--secondary:hover {
	border-color: var(--color-primary);
	color: var(--color-primary);
}

/* --- レスポンシブ --- */
@media (max-width: 768px) {
	.gn-lead-section,
	.gn-treatments-section,
	.gn-feature-section,
	.gn-whitening-lead-section {
		padding: 3.5rem 0 3rem;
	}
	.gn-treatment-item {
		grid-template-columns: 1fr;
		direction: ltr;
	}
	.gn-treatment-item--reverse {
		direction: ltr;
	}
	.gn-treatment-photo-wrap {
		min-height: 220px;
	}
	.gn-treatment-body,
	.gn-treatment-item--reverse .gn-treatment-body {
		padding: 1.75rem;
	}
	.gn-feature-grid {
		grid-template-columns: 1fr;
	}
	.gn-whitening-lead-inner {
		grid-template-columns: 1fr;
		gap: 2rem;
	}
	.gn-cta-btn {
		max-width: 100%;
	}
}


/* ============================================================
   FACILITY PAGE ( fc- prefix )
   ============================================================ */

/* --- 共通セクション見出し --- */
.fc-section-heading {
	text-align: center;
	margin-bottom: 3rem;
}
.fc-section-en {
	display: block;
	font-size: 0.72rem;
	letter-spacing: 0.25em;
	color: var(--color-primary);
	margin-bottom: 0.5rem;
}
.fc-section-title {
	font-size: clamp(1.4rem, 3vw, 2rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.4;
}

/* --- リード文 --- */
.fc-lead-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.fc-lead-text {
	max-width: 720px;
	margin: 0 auto;
	font-size: 0.95rem;
	color: var(--text-main);
	line-height: 1.9;
	text-align: center;
}

/* --- 施設ギャラリー --- */
.fc-gallery-section {
	padding: 5rem 0;
	background-color: var(--color-accent);
}
.fc-gallery-section .container {
	display: flex;
	flex-direction: column;
	gap: 4rem;
}
.fc-gallery-item {
	display: grid;
	grid-template-columns: 55% 1fr;
	gap: 2.5rem;
	align-items: center;
}
.fc-gallery-item--reverse {
	grid-template-columns: 1fr 55%;
}
.fc-gallery-item--reverse .fc-gallery-photo-wrap {
	order: 2;
}
.fc-gallery-item--reverse .fc-gallery-body {
	order: 1;
}
.fc-gallery-photo-wrap {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.fc-gallery-photo {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	display: block;
	border-radius: var(--radius-lg);
}
.fc-gallery-body {
	padding: 0;
}
.fc-gallery-label {
	font-size: 0.68rem;
	letter-spacing: 0.2em;
	color: var(--color-primary);
	margin-bottom: 0.4rem;
}
.fc-gallery-title {
	font-size: clamp(1.2rem, 2.5vw, 1.6rem);
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 1rem;
	line-height: 1.3;
}
.fc-gallery-desc {
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.9;
}

/* --- 衛生管理のこだわり --- */
.fc-hygiene-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.fc-hygiene-lead {
	max-width: 640px;
	margin: -1.5rem auto 2.5rem;
	font-size: 0.95rem;
	color: var(--text-main);
	line-height: 1.8;
	text-align: center;
}
.fc-hygiene-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}
.fc-hygiene-card {
	background: #fff;
	border: 1px solid var(--border-color);
	border-radius: var(--radius-lg);
	padding: 2rem;
	text-align: center;
	transition: box-shadow 0.2s ease;
}
.fc-hygiene-card:hover {
	box-shadow: 0 4px 20px rgba(235, 71, 115, 0.1);
}
.fc-hygiene-icon {
	color: var(--color-primary);
	margin-bottom: 1rem;
	display: flex;
	justify-content: center;
}
.fc-hygiene-title {
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 0.75rem;
	line-height: 1.4;
}
.fc-hygiene-desc {
	font-size: 0.85rem;
	color: var(--text-main);
	line-height: 1.85;
}

/* --- CTAセクション --- */
.fc-cta-section {
	padding: 5rem 0;
	background: linear-gradient(135deg, var(--color-primary) 0%, #f06292 100%);
	text-align: center;
}
.fc-cta-inner {
	max-width: 560px;
	margin: 0 auto;
}
.fc-cta-sub {
	font-size: 0.8rem;
	letter-spacing: 0.2em;
	color: rgba(255,255,255,0.85);
	margin-bottom: 0.75rem;
}
.fc-cta-title {
	font-size: clamp(1.4rem, 3vw, 2rem);
	font-weight: 700;
	color: #fff;
	line-height: 1.4;
	margin-bottom: 1.25rem;
}
.fc-cta-text {
	font-size: 0.9rem;
	color: rgba(255,255,255,0.9);
	line-height: 1.8;
	margin-bottom: 2.5rem;
}
.fc-cta-buttons {
	display: flex;
	justify-content: center;
	gap: 1rem;
	flex-wrap: wrap;
}
.fc-cta-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.9rem 2.5rem;
	border-radius: var(--radius-full);
	font-weight: 700;
	font-size: 0.9rem;
	text-decoration: none;
	transition: all 0.2s ease;
}
.fc-cta-btn--primary {
	background-color: #fff;
	color: var(--color-primary);
	box-shadow: 0 4px 14px rgba(0,0,0,0.15);
}
.fc-cta-btn--primary:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 20px rgba(0,0,0,0.2);
}
.fc-cta-btn--secondary {
	background-color: transparent;
	color: #fff;
	border: 1.5px solid rgba(255,255,255,0.7);
}
.fc-cta-btn--secondary:hover {
	background-color: rgba(255,255,255,0.15);
}

/* --- レスポンシブ --- */
@media (max-width: 768px) {
	.fc-lead-section,
	.fc-gallery-section,
	.fc-hygiene-section,
	.fc-cta-section {
		padding: 3.5rem 0 3rem;
	}
	.fc-gallery-item,
	.fc-gallery-item--reverse {
		grid-template-columns: 1fr;
	}
	.fc-gallery-item--reverse .fc-gallery-photo-wrap {
		order: 0;
	}
	.fc-gallery-item--reverse .fc-gallery-body {
		order: 0;
	}
	.fc-hygiene-grid {
		grid-template-columns: 1fr;
	}
	.fc-cta-buttons {
		flex-direction: column;
		align-items: center;
	}
	.fc-cta-btn {
		width: 100%;
		max-width: 320px;
	}
}


/* ============================================================
   RECRUIT PAGE ( rc- prefix )
   ============================================================ */

/* --- 共通セクション見出し --- */
.rc-section-heading {
	text-align: center;
	margin-bottom: 2.5rem;
}
.rc-section-en {
	display: block;
	font-size: 0.72rem;
	letter-spacing: 0.25em;
	color: var(--color-primary);
	margin-bottom: 0.5rem;
}
.rc-section-title {
	font-size: clamp(1.2rem, 2.5vw, 1.5rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.4;
}

/* --- 募集なしのお知らせ --- */
.rc-notice-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.rc-notice-box {
	max-width: 640px;
	margin: 0 auto;
	text-align: center;
	padding: 0;
}
.rc-notice-box .rc-section-heading {
	margin-bottom: 2rem;
}
.rc-notice-text {
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.9;
	margin-bottom: 1rem;
}
.rc-notice-text:last-child {
	margin-bottom: 0;
}

/* --- 医院紹介カード --- */
.rc-about-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
}
.rc-about-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}
.rc-about-card {
	background: #fff;
	border: 1px solid var(--border-color);
	border-radius: var(--radius-lg);
	padding: 2rem;
	text-align: center;
	transition: box-shadow 0.2s ease;
}
.rc-about-card:hover {
	box-shadow: 0 4px 20px rgba(235, 71, 115, 0.1);
}
.rc-about-icon {
	color: var(--color-primary);
	margin-bottom: 1rem;
	display: flex;
	justify-content: center;
}
.rc-about-title {
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--text-heading);
	margin-bottom: 0.75rem;
	line-height: 1.4;
}
.rc-about-desc {
	font-size: 0.85rem;
	color: var(--text-main);
	line-height: 1.85;
}

/* --- お問い合わせセクション --- */
.rc-contact-section {
	padding: 5rem 0;
	background-color: var(--bg-surface);
	text-align: center;
}
.rc-contact-inner {
	max-width: 560px;
	margin: 0 auto;
}
.rc-contact-sub {
	font-size: 0.72rem;
	letter-spacing: 0.25em;
	color: var(--color-primary);
	margin-bottom: 0.75rem;
}
.rc-contact-title {
	font-size: clamp(1.4rem, 3vw, 2rem);
	font-weight: 700;
	color: var(--text-heading);
	line-height: 1.4;
	margin-bottom: 1.25rem;
}
.rc-contact-text {
	font-size: 0.9rem;
	color: var(--text-main);
	line-height: 1.8;
	margin-bottom: 2rem;
}
.rc-contact-tel {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--color-primary);
	text-decoration: none;
	letter-spacing: 0.05em;
	transition: opacity 0.2s ease;
}
.rc-contact-tel:hover {
	opacity: 0.75;
}

/* --- レスポンシブ --- */
@media (max-width: 768px) {
	.rc-notice-section,
	.rc-about-section,
	.rc-contact-section {
		padding: 3.5rem 0 3rem;
	}
	.rc-notice-box {
		padding: 0;
	}
	.rc-about-grid {
		grid-template-columns: 1fr;
	}
}

/* ------------------------------------------------------------------ */
/* Hero Highlight Strip（駐車場・資格ポイント）                        */
/* ------------------------------------------------------------------ */
.hero-highlight-strip {
	background-color: #FBEAF0;
	padding: 1rem 0;
}

.hero-highlight-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 1rem 3rem;
}

.hero-highlight-item {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-size: 0.92rem;
	font-weight: 500;
	color: #72243E;
	letter-spacing: 0.04em;
	line-height: 1.5;
}

.hero-highlight-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #72243E;
}

/* レスポンシブ：SPでは縦積み・詰めて表示 */
@media (max-width: 768px) {
	.hero-highlight-strip {
		padding: 0.9rem 1rem;
	}
	.hero-highlight-list {
		flex-direction: column;
		gap: 0.55rem;
		align-items: flex-start;
	}
	.hero-highlight-item {
		font-size: 0.85rem;
	}
}


/* ==========================================================================
   電話CTAボタンの共通テキスト構造（全サブページで共通）
   「お電話でのご予約」を1段目、電話番号を2段目に表示するためのユーティリティ
   ========================================================================== */
.cta-btn-text {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	line-height: 1.25;
	gap: 0.1rem;
	vertical-align: middle;
}
.cta-btn-label {
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.04em;
}
.cta-btn-num {
	font-size: 1.02rem;
	font-weight: 700;
	letter-spacing: 0.05em;
}
/* ac-reserve-btn は inline-block ベースのため、SVG の縦位置を調整 */
.ac-reserve-btn svg {
	vertical-align: middle;
	margin-right: 0.5rem;
}

@media (max-width: 767px) {
	.cta-btn-label {
		font-size: 0.74rem;
	}
	.cta-btn-num {
		font-size: 0.98rem;
	}
}