@charset "UTF-8";
/* =========================================================
   大井歯科医院 — PC TOP
   Figma: PC TOP / Frame 10 (1440 x 20292)
   1rem = 10px（1440px 表示時）。ビューポート幅に比例して縮尺。
   ========================================================= */

/* ---------- tokens ---------- */
:root {
	--navy: #022447;         /* body / メインカラー */
	--navy-deep: #022347;    /* ベタ面 */
	--blue: #3a6690;         /* 電話予約（落ち着いた青。#2081e9 から変更 2026-09-18） */
	--gold: #c39949;         /* WEB予約 */
	--teal: #4d757e;         /* CLINIC 背景 */
	--cream: #faf8f2;        /* FAQ 背景 */
	--mint: #f3f8f8;         /* アイコン円 背景 */
	--slate: #818da0;        /* フッターナビ 背景 */
	--line: rgba(2, 36, 71, .2);
	--ff-min: "Zen Old Mincho", "Yu Mincho", "游明朝", serif;
	--ff-en: "Cormorant", "Times New Roman", serif;

	/* --u : 1440デザインの1px。画面幅に比例し、キービジュアルを常に全幅にする。
	         2560px で頭打ち（それ以上は中央寄せ）。
	   --hu: ヘッダーUI用。1920pxまではKVと完全に同率、以降は文字が大きくなりすぎないよう頭打ち。 */
	--u:  min(0.069444vw, 1.7778px);
	--hu: min(0.069444vw, 1.45px);
}

/* ---------- reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html {
	font-size: 0.69444vw;              /* 1440px で 10px */
	scroll-behavior: smooth;
}
@media (min-width: 1440px) { html { font-size: 10px; } }

body {
	margin: 0;
	font-family: var(--ff-min);
	font-size: 1.6rem;
	line-height: 2;
	letter-spacing: .05em;
	color: var(--navy);
	background: #fff;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
img, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul, ol, dl, dd { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4, p, figure { margin: 0; }
table { border-collapse: collapse; }

.u-visually-hidden {
	position: absolute !important; width: 1px; height: 1px;
	margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
	position: absolute; left: -9999px; top: 0; z-index: 999;
	background: #fff; color: var(--navy); padding: 1rem 2rem;
}
.skip-link:focus { left: 0; }

.l-inner { width: 114rem; margin-inline: auto; }
.l-inner--1080 { width: 108rem; }

/* =========================================================
   ヘッダー
   ========================================================= */
.l-header {
	position: absolute; inset: 0 0 auto 0; z-index: 100;
	height: calc(108 * var(--hu));
}
.l-header.is-fixed {
	position: fixed;
	background: rgba(255, 255, 255, .94);
	box-shadow: 0 .2rem 1.2rem rgba(2, 36, 71, .08);
	animation: hdr-in .3s ease both;
}
@keyframes hdr-in { from { transform: translateY(-100%); } to { transform: translateY(0); } }

.l-header__inner {
	width: 100%;
	display: flex; align-items: center; height: 100%;
	padding: 0 calc(31.5 * var(--hu)) 0 calc(120 * var(--hu));
}
/* 高さは指定せず、元画像 548x100 の比率をそのまま使う（潰れ・伸びの防止） */
.l-header__logo img { width: calc(274 * var(--hu)); height: auto; }

.l-header__nav { margin-left: calc(48 * var(--hu)); }
.gnav { display: flex; align-items: center; gap: calc(32 * var(--hu)); }
.gnav__item > a {
	position: relative; display: block;
	font-size: calc(14 * var(--hu)); font-weight: 500; line-height: 1; letter-spacing: .05em;
	white-space: nowrap; transition: opacity .2s;
}
.gnav__item > a:hover { opacity: .6; }
.gnav__item--mega > a::after {
	content: ""; position: absolute; left: 50%; bottom: calc(-16 * var(--hu));
	width: calc(7 * var(--hu)); height: calc(7 * var(--hu)); margin-left: calc(-3.5 * var(--hu)); border-radius: 50%;
	background: var(--navy); opacity: 0; transition: opacity .25s;
}
.gnav__item--mega.is-open > a::after { opacity: 1; }

.l-header__cta { margin-left: auto; display: flex; gap: calc(8.5 * var(--hu)); }
.btn-round {
	display: flex; align-items: center; justify-content: center; gap: calc(8 * var(--hu));
	width: calc(150 * var(--hu)); height: calc(40 * var(--hu)); border-radius: calc(20 * var(--hu));
	color: #fff; font-size: calc(14 * var(--hu)); font-weight: 500; letter-spacing: .05em; line-height: 1;
	transition: filter .2s;
}
.btn-round:hover { filter: brightness(1.08); }
.btn-round svg { width: calc(17 * var(--hu)); height: calc(17 * var(--hu)); flex: none; }
.btn-round--tel { background: var(--blue); }
.btn-round--web { background: var(--gold); }

/* ---- メガメニュー ---- */
.mega {
	position: absolute; left: calc(222 * var(--hu)); top: calc(99 * var(--hu)); width: calc(1000 * var(--hu));
	background: rgba(255, 255, 255, .95);
	padding: calc(32 * var(--hu)) calc(27 * var(--hu));
	opacity: 0; visibility: hidden; transform: translateY(-.8rem);
	transition: opacity .25s, transform .25s, visibility .25s;
}
.mega.is-open { opacity: 1; visibility: visible; transform: none; }
.mega__list { display: grid; grid-template-columns: repeat(4, 1fr); row-gap: calc(30 * var(--hu)); column-gap: calc(26 * var(--hu)); }
.mega__item > a { display: flex; align-items: center; gap: calc(14 * var(--hu)); min-height: calc(52 * var(--hu)); transition: opacity .2s; }
.mega__item > a:hover { opacity: .6; }
.mega__icon { width: calc(34 * var(--hu)); flex: none; display: flex; justify-content: center; }
.mega__icon img { max-width: calc(34 * var(--hu)); max-height: calc(36 * var(--hu)); width: auto; height: auto; }
.mega__label { font-size: calc(14 * var(--hu)); line-height: 1.5; letter-spacing: .04em; }

/* =========================================================
   FV
   ========================================================= */
/* キービジュアルは画面幅に比例させて常に全幅表示（縦横比 1440:1262 を保持） */
.fv { position: relative; height: calc(1262 * var(--u)); overflow: hidden; }
.fv__inner { position: relative; width: calc(1440 * var(--u)); height: calc(1262 * var(--u)); margin-inline: auto; }

.fv__main {
	position: absolute; left: calc(579 * var(--u)); top: 0;
	width: calc(861 * var(--u)); height: calc(906 * var(--u));
}
.fv__main img, .fv__sub img { width: 100%; height: 100%; object-fit: cover; }
.fv__main picture, .fv__sub picture { display: block; width: 100%; height: 100%; }
.fv__sub {
	position: absolute; left: calc(106 * var(--u)); top: calc(788 * var(--u));
	width: calc(427 * var(--u)); height: calc(474 * var(--u));
}

.fv__catch {
	position: absolute; left: calc(245 * var(--u)); top: calc(204 * var(--u));
	writing-mode: vertical-rl; font-feature-settings: "vert" 1;
	display: flex; flex-direction: column; align-items: flex-start; gap: calc(20 * var(--u));
	height: calc(550 * var(--u)); margin: 0;
	font-size: calc(45 * var(--u)); font-weight: 500; line-height: 1.222; letter-spacing: .102em;
}
.fv__catch-line { display: block; }

.fv__laurel {
	position: absolute; left: calc(600 * var(--u)); top: calc(100 * var(--u));
	width: calc(262 * var(--u)); height: calc(286 * var(--u));
}
/* 写真の上でも文字が読めるよう、デザインどおり背後に淡い光を敷く */
.fv__laurel::before {
	content: ""; position: absolute; inset: -6%; border-radius: 50%; z-index: 0;
	background: radial-gradient(closest-side, rgba(255,255,255,.92) 0%, rgba(255,255,255,.62) 58%, rgba(255,255,255,0) 100%);
}
.fv__laurel img { position: relative; z-index: 1; width: 100%; height: 100%; }
.fv__laurel-text {
	position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column;
	align-items: center; justify-content: center; gap: calc(24 * var(--u));
	font-size: calc(28 * var(--u)); font-weight: 500; line-height: 1; letter-spacing: .06em;
}

.fv__badges {
	position: absolute; left: calc(729.8 * var(--u)); top: calc(863 * var(--u));
	display: flex; gap: calc(10 * var(--u));
}
.fv__badges li {
	width: calc(170 * var(--u)); height: calc(170 * var(--u));
	display: flex; align-items: center; justify-content: center;
	background: url("../img/fv-badge.png") center/100% 100% no-repeat;
	color: #fff; font-size: calc(18 * var(--u)); font-weight: 500; line-height: 1.75; letter-spacing: .04em; text-align: center;
}

.fv__lead {
	position: absolute; left: calc(580 * var(--u)); top: calc(1078 * var(--u));
	font-size: calc(20 * var(--u)); font-weight: 600; line-height: 1.8; letter-spacing: 0;
}

/* =========================================================
   セクション見出し（共通）
   ========================================================= */
.sec-head { text-align: center; }
/* 見出しは h2 の中に「英字＋日本語」を入れている（英字だけの見出しにしないため） */
.sec-head__title, .sec-price__title, .news-col__title { margin: 0; font-weight: 400; }
.sec-head__en, .sec-head__ja, .sec-price__en, .news-col__en, .news-col__ja { display: block; }
.sec-head__en {
	font-family: var(--ff-en); font-weight: 300; font-size: 12rem; line-height: 1;
	letter-spacing: .02em; margin: 0;
}
.sec-head__ja { margin-top: 1.2rem; font-size: 3.2rem; font-weight: 500; line-height: 1.8; letter-spacing: .05em; }
.sec-head__lead { margin-top: 3.2rem; font-size: 1.6rem; font-weight: 500; line-height: 2; }
.sec-head--light { color: #fff; }

/* View More */
.more a {
	position: relative; display: inline-block; padding: 0 5.4rem .6rem 0;
	font-family: var(--ff-en); font-size: 2rem; font-weight: 400; letter-spacing: .06em;
	border-bottom: 1px solid currentColor;
}
.more a::after {
	content: ""; position: absolute; right: .4rem; top: 50%; width: .7rem; height: .7rem;
	margin-top: -.6rem; border-top: 1px solid currentColor; border-right: 1px solid currentColor;
	transform: rotate(45deg);
}
.more a:hover { opacity: .6; }
.more--center { text-align: center; }
.more--light { color: #fff; }

/* =========================================================
   INFORMATION
   ========================================================= */
.sec-info { position: relative; padding-top: 11rem; }
.sec-info > .sec-head { position: relative; z-index: 2; }

/* --- 三代ストーリー --- */
/* veil-1: 不透明の淡いグラデ地／info-photo: アルファ付き写真をその上に重ねる */
.story { position: relative; height: 112.7rem; margin-top: -11.5rem; z-index: 1; }
.story__veil {
	position: absolute; inset: 0; z-index: 0;
	background: url("../img/veil-1.webp") center top / 100% 100% no-repeat;
}
.story__bg { position: absolute; left: 0; top: 19.9rem; width: 100%; height: 69.3rem; z-index: 1; }
.story__bg img { width: 100%; height: 100%; object-fit: cover; }
/* 背景（veil / 写真）は全幅、テキストは1440グリッドの中央寄せ。
   これを分けないと1440より広い画面で縦組みコピーと項目リストが重なる */
.story__inner {
	position: absolute; top: 0; bottom: 0; left: 0; right: 0;
	width: 144rem; max-width: 100%; margin-inline: auto; z-index: 2;
}

.story__copy {
	position: absolute; right: 96.1rem; top: 26rem; margin: 0;
	writing-mode: vertical-rl; font-feature-settings: "vert" 1;
	display: flex; flex-direction: column; align-items: flex-start; gap: 3.3rem;
	font-weight: 500;
}
.story__copy-s { font-size: 3.8rem; line-height: 1.05; letter-spacing: .155em; }
.story__copy-l { font-size: 5.8rem; line-height: 1.05; letter-spacing: .126em; }
.story__copy > :nth-child(1) { margin-top: 9.2rem; }
.story__copy > :nth-child(3) { margin-top: 12.8rem; }

.story__list {
	position: absolute; left: 57.6rem; top: 25.5rem; width: 73.7rem;
	background: rgba(255, 255, 255, .8); padding: 1.4rem 4.2rem;
}
.story__list li {
	display: flex; align-items: center; gap: 1.7rem;
	padding: 2rem 0; border-bottom: 1px solid var(--line);
}
.story__list li:last-child { border-bottom: 0; }
.story__num {
	flex: none; width: 3.4rem;
	font-family: var(--ff-en); font-size: 2.6rem; font-weight: 400; letter-spacing: .06em; line-height: 1;
}
.story__txt { font-size: 3rem; font-weight: 500; line-height: 1.93; letter-spacing: .05em; }

/* --- DENTAL CONCERNS --- */
.concerns { padding-top: 8.4rem; }
.concerns__box {
	width: 118.9rem; margin-inline: auto; padding: 6.8rem 0 4.2rem;
	background: linear-gradient(118deg, #f6f7f8 0%, #fdfdfd 38%, #f7f8f8 62%, #f1f2f3 100%);
	border: 1px solid rgba(2, 36, 71, .45);
	outline: 1.3rem solid #f1f2f3;
	text-align: center;
}
.concerns__en {
	font-family: var(--ff-en); font-size: 3rem; font-weight: 400; line-height: 1; letter-spacing: .1em;
}
.concerns__title { margin-top: 2.9rem; font-size: 4.8rem; font-weight: 500; line-height: 1.73; letter-spacing: .05em; }
.concerns__list {
	width: 96.6rem; margin: 4.3rem 0 0 13.5rem;
	display: grid; grid-template-columns: 47.6rem 47.6rem; column-gap: 1.4rem;
	text-align: left;
}
.concerns__list li {
	position: relative; height: 7.5rem; display: flex; align-items: center;
	padding-left: 3.6rem; border-bottom: 1px solid var(--line);
	font-size: 2.2rem; font-weight: 500; letter-spacing: .05em;
}
.concerns__list li::before {
	content: ""; position: absolute; left: 0; top: 50%; width: 1.8rem; height: 1.8rem;
	margin-top: -1rem; border: 1px solid var(--navy);
}
.concerns__list li::after {
	content: ""; position: absolute; left: .4rem; top: 50%; width: 1.1rem; height: .6rem;
	margin-top: -1rem; border-left: 1px solid var(--navy); border-bottom: 1px solid var(--navy);
	transform: rotate(-45deg);
}
.sec-info > .l-inner { margin-top: 16.5rem; }

/* =========================================================
   医院情報ブロック（共通）
   ========================================================= */
.clinic-info { display: flex; justify-content: space-between; }
.clinic-info__body { width: 52.2rem; }
.clinic-info__logo { display: flex; justify-content: center; }
.clinic-info__logo img { width: 26.6rem; height: auto; }
.clinic-info__address { margin-top: 2.3rem; font-size: 1.7rem; font-weight: 500; line-height: 1.9; letter-spacing: .02em; }
.clinic-info__notes li {
	position: relative; padding-left: 1.7rem;
	font-size: 1.6rem; font-weight: 500; line-height: 2; letter-spacing: .02em;
}
.clinic-info__notes li::before { content: "・"; position: absolute; left: -.2rem; top: 0; }
.clinic-info__tel { margin-top: 2rem; line-height: 1; }
.clinic-info__tel a { font-family: var(--ff-en); font-size: 3.6rem; font-weight: 400; letter-spacing: .01em; }

.hours { width: 52.2rem; margin-top: 3.5rem; table-layout: fixed; }
.hours th, .hours td {
	border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
	height: 7.2rem; text-align: center; font-weight: 500;
}
.hours th { width: 13.7rem; font-size: 1.6rem; letter-spacing: .02em; }
.hours td { font-size: 1.6rem; }
/* 曜日の見出し行は本文行より低くして、表が重くならないようにする */
.hours thead th { height: 4.4rem; border-top: 0; }
.hours thead th:first-child { width: 13.7rem; }
.hours thead th.hours__day { width: auto; font-size: 1.6rem; letter-spacing: .04em; }
.hours__t { color: var(--gold); }
.hours__legend {
	display: flex; flex-wrap: wrap; gap: .4rem 2rem;
	margin-top: 1.2rem; font-size: 1.4rem; font-weight: 500; line-height: 1.8; letter-spacing: .02em;
}
.hours__legend .hours__o, .hours__legend .hours__t, .hours__legend .hours__x { margin-right: .2rem; }
.clinic-info__closed { margin-top: 1.7rem; font-size: 1.6rem; font-weight: 500; line-height: 1.9; }

.clinic-info__map {
	width: 50.6rem; height: 53.8rem; background: var(--mint);
	display: flex; flex-direction: column; overflow: hidden;
}
.clinic-info__map iframe { flex: 1 1 auto; width: 100%; height: 100%; border: 0; display: block; }
.clinic-info__review {
	flex: none; height: 5.4rem;
	display: flex; align-items: center; justify-content: center; gap: 1rem;
	background: var(--navy-deep); color: #fff;
	font-size: 1.5rem; font-weight: 500; letter-spacing: .04em;
	transition: filter .2s;
}
.clinic-info__review:hover { filter: brightness(1.25); }
.clinic-info__stars { color: #f5b301; letter-spacing: .12em; font-size: 1.6rem; }

/* 濃色（フッター） */
.clinic-info--dark { color: #fff; }
/* PCフッターはFigmaデザインどおりTEL行なし（SPフッターには表示する） */
.clinic-info--dark .clinic-info__tel { display: none; }
.clinic-info--dark .clinic-info__logo img { filter: brightness(0) invert(1); }
.clinic-info--dark .hours th, .clinic-info--dark .hours td { border-color: rgba(255, 255, 255, .35); }
.clinic-info--dark .hours__t { color: #e2c489; }
.clinic-info--dark .hours { margin-top: 5.6rem; }
.clinic-info--dark .clinic-info__map { background: rgba(243, 248, 248, .92); color: var(--navy); }
.clinic-info--dark .clinic-info__review { background: #0a2f56; color: #fff; }

/* =========================================================
   予約CTA
   ========================================================= */
.reserve { position: relative; width: 144rem; max-width: 100%; margin-inline: auto; padding-top: 3.7rem; text-align: center; }
.reserve__lead { font-size: 2.6rem; font-weight: 500; letter-spacing: .06em; line-height: 1; }
.reserve__btns { margin-top: 3.2rem; display: flex; justify-content: center; gap: 1.9rem; }
.btn-pill {
	display: flex; align-items: center; justify-content: center; gap: 1.4rem;
	width: 26.6rem; height: 6.8rem; border-radius: 3.4rem;
	color: #fff; font-size: 2.2rem; font-weight: 500; letter-spacing: .06em; line-height: 1;
	transition: filter .2s;
}
.btn-pill:hover { filter: brightness(1.08); }
.btn-pill svg { width: 2.6rem; height: 2.6rem; flex: none; }
.btn-pill--tel { background: var(--blue); }
.btn-pill--web { background: var(--gold); }
.reserve__doctor { position: absolute; right: 4.3rem; bottom: -20.5rem; width: 38.2rem; height: auto; display: block; }
.reserve__doctor img { width: 100%; height: auto; display: block; }
.reserve--dark { color: #fff; }

/* =========================================================
   8 FEATURES
   ========================================================= */
.sec-features { position: relative; padding: 15rem 0 10rem; overflow: hidden; }
.sec-features__veil {
	position: absolute; inset: 0; z-index: 0;
	background: url("../img/veil-2.webp") center top / 100% auto no-repeat;
	opacity: .9;
}
.sec-features > *:not(.sec-features__veil) { position: relative; z-index: 1; }

.feature-grid {
	margin-top: 5.7rem;
	display: grid; grid-template-columns: repeat(3, 35rem); column-gap: 1.5rem; row-gap: 4.6rem;
}
.feature__num, .case__num, .equip__num {
	display: flex; align-items: center; gap: 1.6rem; line-height: 1;
	font-family: var(--ff-en); font-size: 2.4rem; font-weight: 400; letter-spacing: .1em;
}
.feature__num::before, .feature__num::after,
.case__num::before, .case__num::after {
	content: ""; flex: 1 1 auto; height: 1px; background: var(--line);
}
.feature__img { margin: 3.2rem 0 0; }
.feature__img img { width: 35rem; height: 21rem; object-fit: cover; }
.feature__text { margin-top: 2rem; font-size: 1.8rem; font-weight: 500; line-height: 1.78; letter-spacing: .03em; }

/* =========================================================
   PICK UP
   ========================================================= */
.sec-pickup { position: relative; padding: 0.9rem 0 0; background: #fff; }
.sec-pickup__veil {
	position: absolute; left: 0; top: 7.9rem; width: 100%; height: 112.7rem; z-index: 0;
	background: url("../img/veil-3.webp") center top / 100% 100% no-repeat;
}
.sec-pickup > *:not(.sec-pickup__veil) { position: relative; z-index: 1; }
.sec-pickup .sec-head { margin-bottom: 8.1rem; }
.pickup { position: relative; width: 144rem; max-width: 100%; margin: 0 auto 9.6rem; height: 50rem; }
.pickup:last-child { margin-bottom: 0; }
.pickup__img { position: absolute; top: 0; width: 133.2rem; height: 50rem; }
.pickup--left .pickup__img { right: 0; }
.pickup--right .pickup__img { left: 0; }
.pickup__img img { width: 100%; height: 100%; object-fit: cover; }
.pickup__panel {
	/* 高さは固定値どおり。文言が増えたときだけ伸びるよう min-height にしている */
	position: absolute; top: 7rem; width: 64rem; min-height: 52.5rem;
	padding: 3.2rem 4.6rem;
	background: rgba(255, 255, 255, .84);
}
.pickup--left .pickup__panel { left: 18.6rem; }
.pickup--right .pickup__panel { right: 16.6rem; }
/* カード全体がリンク。position:static のままにして、中の絶対配置は .pickup を基準にする */
.pickup__link { display: block; position: static; color: inherit; }
.pickup__title { font-size: 4.8rem; font-weight: 500; letter-spacing: .04em; line-height: 1.3; }
.pickup__num { font-family: var(--ff-en); font-size: 4.8rem; font-weight: 400; letter-spacing: .06em; margin-right: 1.6rem; }
.pickup__lead { margin-top: 3.2rem; font-size: 3rem; font-weight: 500; line-height: 1.65; letter-spacing: .05em; }
.pickup__text { margin-top: 2.6rem; font-size: 1.6rem; font-weight: 500; line-height: 1.9; letter-spacing: .03em; }
.pickup__tags { margin-top: 4.4rem; display: flex; flex-wrap: wrap; gap: 1rem; }
.pickup__tags li {
	padding: .7rem 1.4rem; background: var(--navy); color: #fff;
	font-size: 1.4rem; font-weight: 500; line-height: 1.35; letter-spacing: .04em;
}
.pickup__more {
	position: relative; display: inline-block; margin-top: 2rem;
	padding: 0 4.4rem .6rem 0;
	font-family: var(--ff-min); font-size: 1.7rem; font-weight: 500; letter-spacing: .08em;
	border-bottom: 1px solid rgba(2, 36, 71, .4);
	transition: color .3s var(--ease-out), border-color .3s var(--ease-out);
}
.pickup__more::after {
	content: ""; position: absolute; right: .6rem; top: 50%; width: .7rem; height: .7rem;
	margin-top: -.7rem; border-top: 1px solid currentColor; border-right: 1px solid currentColor;
	transform: rotate(45deg); transition: right .35s var(--ease-out);
}

/* =========================================================
   TREATMENT
   ========================================================= */
.sec-treatment { padding: 16.8rem 0 9rem; }
.sec-treatment .sec-head { margin-bottom: 5rem; }
.treat-grid {
	width: 114rem; margin-inline: auto;
	display: grid; grid-template-columns: repeat(5, 1fr);
	grid-auto-rows: 30.2rem; row-gap: 0;
}
.treat-grid__item > a { display: block; text-align: center; transition: opacity .2s; }
.treat-grid__item > a:hover { opacity: .65; }
.treat-grid__circle {
	width: 22rem; height: 22rem; margin-inline: auto; border-radius: 50%;
	background: var(--mint); display: flex; align-items: center; justify-content: center;
}
.treat-grid__circle img { max-width: none; max-height: none; }
.treat-grid__label {
	display: block; margin-top: 1.25rem;
	font-size: 1.8rem; font-weight: 500; line-height: 1.55; letter-spacing: .04em;
}

/* =========================================================
   PRICE
   ========================================================= */
.sec-price { position: relative; width: 144rem; max-width: 100%; margin-inline: auto; height: 44.2rem; overflow: hidden; }
.sec-price__img { position: absolute; left: 0; top: 0; width: 75rem; height: 44.2rem; }
.sec-price__img img { width: 100%; height: 100%; object-fit: cover; }
.sec-price__panel {
	position: absolute; left: 52.2rem; top: 0; width: 91.8rem; height: 44.2rem;
	background: rgba(255, 255, 255, .86);
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	padding-left: 4.4rem;
}
.sec-price__en { font-family: var(--ff-en); font-weight: 300; font-size: 8rem; line-height: 1; letter-spacing: .04em; }
.sec-price__lead { margin-top: 2.6rem; font-size: 2.3rem; font-weight: 500; letter-spacing: .06em; }
.sec-price__note { margin-top: 1.8rem; font-size: 1.5rem; font-weight: 500; letter-spacing: .05em; }
.sec-price__cards { margin-top: 1.6rem; }
.sec-price__cards img { width: 38.9rem; height: 4.7rem; }
.sec-price .more { margin-top: 2rem; }

/* =========================================================
   CASE
   ========================================================= */
.sec-case { padding: 10.7rem 0 4.8rem; }
.sec-case .sec-head { margin-bottom: 8rem; }
.case-grid { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 1.8rem; }
.case__num { font-size: 2.2rem; }
.case__imgs { margin-top: 4.8rem; display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.case__imgs span { display: block; aspect-ratio: 172 / 205; background: #d9d9d9; }
.case__text { margin-top: 1.8rem; font-size: 1.6rem; font-weight: 500; letter-spacing: .04em; }
.sec-case .more--center { margin-top: 5.2rem; }

/* =========================================================
   GREETING
   PC: Figma側で1枚画像に統合されていたため画像を表示。
       本文はHTML(.greeting)として保持し、読み上げ・検索向けに残す。
   SP: .greeting をそのままレイアウトする（SPデザインは要素分解されているため）
   ========================================================= */
.sec-greeting__pc { width: 100%; height: auto; }
.greeting {
	position: absolute; width: 1px; height: 1px;
	margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* SP専用要素（PCでは非表示） */
.fv__cta { display: none; }

/* =========================================================
   CLINIC（設備）
   ========================================================= */
.sec-clinic { background: var(--teal); color: #fff; padding: 9.6rem 0 10.7rem; }
.sec-clinic .sec-head { margin-bottom: 7rem; }
.sec-clinic .sec-head__ja { font-size: 2.8rem; }
.equip { display: grid; grid-template-columns: repeat(2, 53rem); justify-content: space-between; row-gap: 6rem; }
.equip__num {
	display: flex; align-items: center; gap: 1.6rem;
	font-family: var(--ff-en); font-size: 2.2rem; letter-spacing: .1em;
}
.equip__num::before, .equip__num::after { content: ""; flex: 1 1 auto; height: 1px; background: rgba(255,255,255,.5); }
.equip__img { margin-top: 4.8rem; }
.equip__img img { width: 53rem; height: 28.7rem; object-fit: cover; }
.equip__title { margin-top: 2.2rem; text-align: center; font-size: 2rem; font-weight: 500; letter-spacing: .06em; }
.equip__text { margin-top: 1.6rem; font-size: 1.6rem; font-weight: 500; line-height: 1.95; letter-spacing: .03em; }

/* =========================================================
   FAQ
   ========================================================= */
.sec-faq { background: var(--cream); padding: 10rem 0 8.5rem; }
.sec-faq .sec-head { margin-bottom: 4.2rem; }
.faq__item { border-bottom: 1px solid var(--line); padding: 3rem 0 3.2rem; }
.faq__q {
	display: flex; align-items: baseline; gap: 1.8rem;
	font-size: 3.1rem; font-weight: 500; line-height: 1.5; letter-spacing: .06em;
}
.faq__mark { font-family: var(--ff-en); font-size: 3.6rem; font-weight: 400; line-height: 1; }
.faq__a { margin-top: 2.4rem; padding-left: .2rem; font-size: 1.6rem; font-weight: 500; line-height: 1.95; letter-spacing: .03em; }

/* =========================================================
   INSTAGRAM
   ========================================================= */
.sec-instagram { background: var(--navy-deep); color: #fff; padding: 9.6rem 0 8.7rem; }
.sec-instagram .sec-head__en { font-size: 8rem; }
.sec-instagram .more--center { margin-top: 1.6rem; }
.insta { margin-top: 5.4rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.insta li { aspect-ratio: 1 / 1; background: #fff; overflow: hidden; }
.insta li a, .insta li img { display: block; width: 100%; height: 100%; }
.insta li img { object-fit: cover; transition: transform .4s, opacity .2s; }
.insta li a:hover img { transform: scale(1.04); opacity: .9; }

/* =========================================================
   NEWS / BLOG
   ========================================================= */
.sec-news { padding: 11rem 0 9.6rem; }
.news-cols { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 12rem; }
.news-col__head { text-align: center; }
.news-col__en { font-family: var(--ff-en); font-weight: 300; font-size: 6.4rem; line-height: 1; letter-spacing: .04em; }
.news-col__ja { margin-top: .8rem; font-size: 1.8rem; font-weight: 500; letter-spacing: .18em; }
.news-col__head .more { margin-top: 1.6rem; }
.news-col__head .more a { font-size: 1.8rem; padding-right: 5rem; }
.news-list { margin-top: 4.6rem; }
.news-list__item { border-bottom: 1px solid var(--line); }
.news-list__item > a { display: flex; align-items: center; gap: 2.4rem; padding: 1.1rem 0; transition: opacity .2s; }
.news-list__item > a:hover { opacity: .65; }
.news-list__thumb { flex: none; width: 14.5rem; }
.news-list__thumb img { width: 14.5rem; height: 9.4rem; object-fit: cover; }
.news-list__body { flex: 1 1 auto; }
.news-list__date { display: block; font-family: var(--ff-en); font-size: 1.6rem; letter-spacing: .06em; }
.news-list__title {
	display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
	margin-top: .4rem; font-size: 1.6rem; font-weight: 500; line-height: 1.55; letter-spacing: .04em;
}
.news-list__arrow { flex: none; width: 4.6rem; height: 1px; background: var(--line); }
.news-list__item--empty { padding: 2rem 0; font-size: 1.6rem; font-weight: 500; opacity: .7; }

/* =========================================================
   フッター
   ========================================================= */
.l-footer__info { background: var(--navy-deep); color: #fff; padding: 8.6rem 0 1.8rem; }
.l-footer__info .reserve { padding-top: 7.6rem; }

.l-footer__banners { background: var(--navy-deep); padding: 0 0 6.4rem; }
.fbanner { display: flex; justify-content: center; gap: 2.4rem; }
.fbanner a { display: block; transition: opacity .2s; }
.fbanner a:hover { opacity: .8; }
.fbanner img { width: 42rem; height: 12rem; object-fit: contain; }

.l-footer__nav { background: var(--slate); color: #fff; padding: 3rem 0 6.6rem; }
.fnav { width: 108rem; margin-inline: auto; padding-left: 1.6rem; display: flex; }
.fnav a { transition: opacity .2s; }
.fnav a:hover { opacity: .7; }
.fnav__main { display: contents; }
.fnav__primary { order: 1; width: 20rem; flex: none; }
.fnav__primary li { border-bottom: 1px solid rgba(255, 255, 255, .55); }
.fnav__primary li a { display: block; padding: 1.2rem 0; font-size: 1.5rem; font-weight: 500; line-height: 1.5; letter-spacing: .05em; }
.fnav__treat { order: 2; width: 65.2rem; flex: none; margin-left: 1.1rem; }
.fnav__heading {
	padding: 1.2rem 0; border-bottom: 1px solid rgba(255, 255, 255, .55);
	font-size: 1.5rem; font-weight: 500; line-height: 1.5; letter-spacing: .05em;
}
.fnav__treat-list { margin-top: 1.9rem; display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 2rem; }
/* 22項目を3列に収めるため1行固定。最長「インプラントオーバーデンチャー」で約189px（列204px） */
.fnav__treat-list li a { display: block; padding: .45rem 0; font-size: 1.3rem; font-weight: 500; line-height: 1.5; letter-spacing: .04em; white-space: nowrap; }
.u-sp-br { display: none; }
.fnav__sub { order: 3; width: 17rem; flex: none; margin-left: 1.4rem; padding-left: 1.7rem; border-left: 1px solid rgba(255, 255, 255, .5); }
.fnav__sub li a { display: block; padding: .9rem 0; font-size: 1.4rem; font-weight: 500; line-height: 1.5; letter-spacing: .04em; }

/* =========================================================
   ハンバーガー / ドロワー（SP専用・PCでは非表示）
   ========================================================= */
.hamburger, .drawer { display: none; }

/* =========================================================
   SP （Figma: SP TOP / 375px 基準）
   ========================================================= */
@media (max-width: 767px) {

html { font-size: 2.66667vw; }            /* 375px で 1rem = 10px */
body { font-size: 1.6rem; }

.l-inner, .l-inner--1080 { width: 33.5rem; }

/* ---------- ヘッダー ---------- */
.l-header { position: fixed; height: 6.4rem; background: #fff; }
.l-header.is-fixed { box-shadow: 0 .2rem .8rem rgba(2, 36, 71, .1); animation: none; }
.l-header__inner { width: 100%; padding: 0 2.5rem; }
.l-header__logo img { width: 22rem; height: auto; }
.l-header__nav, .l-header__cta, .mega { display: none; }

.hamburger {
	display: flex; flex-direction: column; justify-content: space-between;
	width: 4.5rem; height: 2.5rem; margin-left: auto; padding: 0;
	background: none; border: 0; cursor: pointer;
	/* 見た目は変えずに、指で押せる範囲だけ44px以上にする */
	position: relative;
}
.hamburger::after {
	content: ""; position: absolute; left: 50%; top: 50%;
	width: 4.8rem; height: 4.8rem; transform: translate(-50%, -50%);
}
.hamburger span { display: block; height: .3rem; background: var(--navy); border-radius: .2rem; transition: opacity .2s; }

/* ---------- ドロワー ---------- */
.drawer {
	display: block; position: fixed; inset: 0; z-index: 200;
	background: var(--slate); overflow-y: auto; -webkit-overflow-scrolling: touch;
	opacity: 0; visibility: hidden; transform: translateY(-1.5rem);
	transition: opacity .3s, transform .3s, visibility .3s;
}
.drawer.is-open { opacity: 1; visibility: visible; transform: none; }
body.is-drawer-open { overflow: hidden; }
.drawer { display: flex; flex-direction: column; }
.drawer__body { flex: 1 1 auto; }
.drawer__foot { margin-top: auto; }
.drawer__bar {
	height: 9rem; background: var(--navy-deep);
	display: flex; align-items: center; justify-content: flex-end; padding: 0 2rem;
}
.drawer__close { position: relative; width: 4.4rem; height: 4.4rem; padding: 0; background: none; border: 0; cursor: pointer; }
.drawer__close span {
	position: absolute; left: .5rem; top: 50%; width: 3.4rem; height: .3rem;
	background: #cfd6de; border-radius: .2rem;
}
.drawer__close span:nth-child(1) { transform: rotate(45deg); }
.drawer__close span:nth-child(2) { transform: rotate(-45deg); }
.drawer__body { padding: 2rem 0 1rem; }
/* 診療メニューが長いので、予約CTAはドロワー下部に貼り付けて常に押せるようにする */
.drawer__foot {
	position: sticky; bottom: 0; z-index: 2;
	background: var(--navy-deep); padding-bottom: 2.2rem;
	box-shadow: 0 -.6rem 1.6rem rgba(2, 35, 71, .28);
}
.drawer__foot .reserve { padding-top: 2.2rem; }
.drawer__foot .reserve__lead { font-size: 1.6rem; }
.drawer__foot .reserve__btns { margin-top: 1.4rem; }

/* ---------- FV ---------- */
.fv { height: auto; padding-top: 6.4rem; overflow: visible; }
.fv__inner { width: 100%; height: auto; }

.fv__main { position: static; width: 100%; height: 36.6rem; }
.fv__main picture { display: block; width: 100%; height: 100%; }
.fv__main img { width: 100%; height: 100%; object-fit: cover; object-position: center bottom; }

/* SPはキャッチを画面左端に寄せる。縦組みなので justify-content: flex-end で
   最終行が左端にそろう（PCの右寄せをそのまま鏡写しにした状態） */
.fv__catch {
	left: 0; right: auto; top: 1.4rem; width: 16.8rem; height: auto;
	justify-content: flex-end; gap: 1rem;
	padding: 1.2rem 0 .4rem .1rem;
	background: rgba(255, 255, 255, .58);
	font-size: 2.6rem; line-height: 1.3; letter-spacing: .15em;
}

/* 左下のサブ写真はSPでは出さない（キャッチの居場所と重なるため）。
   写真を36.6remに伸ばしてキャッチ・開業バッジを1枚の中に収め、
   その分「特徴」の丸バッジ以下を上に詰めている */
.fv__sub { display: none; }

.fv__laurel { left: auto; right: 1.3rem; top: 16.6rem; width: 16.6rem; height: 17.9rem; }
.fv__laurel-text { gap: 1.4rem; font-size: 1.7rem; transform: translateY(-1rem); }

.fv__badges { position: static; justify-content: center; gap: .75rem; margin-top: 2.5rem; }
.fv__badges li { width: 11rem; height: 11rem; font-size: 1.3rem; line-height: 1.7; }

.fv__lead { position: static; width: 30.6rem; margin: 1.3rem auto 0; text-align: center; font-size: 1.6rem; line-height: 1.98; }

.fv__cta { display: flex; width: 33.5rem; margin: 2.7rem auto 0; border-top: 1px solid var(--line); }
.fv__cta li { flex: 1 1 50%; }
.fv__cta li + li { border-left: 1px solid var(--line); }
.fv__cta a {
	display: flex; align-items: center; justify-content: center; gap: 1rem;
	height: 5.9rem; font-size: 1.6rem; font-weight: 500; letter-spacing: .05em;
}
.fv__cta svg { width: 2rem; height: 2rem; flex: none; }

/* ---------- 見出し共通 ---------- */
.sec-head__en { font-size: 3.5rem; }
.sec-head__ja { margin-top: .7rem; font-size: 2.2rem; line-height: 1.5; }
.sec-head__lead { width: 28rem; margin: 1.8rem auto 0; font-size: 1.4rem; line-height: 1.85; }
.more a { padding: 0 4rem .5rem 0; font-size: 1.6rem; }
.more a::after { right: .3rem; width: .6rem; height: .6rem; }

/* ---------- INFORMATION ---------- */
.sec-info { padding-top: 1.8rem; }
.sec-info > .sec-head { z-index: 2; }
/* SPは 三代コピー → 写真 → 7項目リスト の順 */
.story {
	height: auto; margin-top: 0; padding-bottom: 0; z-index: auto;
	display: flex; flex-direction: column;
}
.story__veil { background-size: 100% 100%; }
.story__bg { position: static; order: 2; width: 100%; height: 17.8rem; margin-top: 2.6rem; }
.story__inner { display: contents; }
.story__copy { order: 1; position: relative; z-index: 2; }
.story__list { order: 3; position: relative; z-index: 2; }
.story__copy {
	position: static; writing-mode: horizontal-tb; display: block;
	margin: 2.4rem 0 0; padding: 0 2rem; text-align: center;
}
.story__copy > span { display: block; }
.story__copy > :nth-child(1), .story__copy > :nth-child(3) { margin-top: 0; }
.story__copy-s { font-size: 1.8rem; line-height: 1.5; letter-spacing: .06em; }
.story__copy-l { font-size: 2.2rem; line-height: 1.5; letter-spacing: .06em; margin: .9rem 0; }

.story__list { position: static; width: 28.7rem; margin: 2.4rem 0 0 2.9rem; padding: 0; background: none; }
.story__list li { align-items: flex-start; gap: 1.3rem; padding: 1rem 0; }
.story__num { width: 3.2rem; font-size: 1.8rem; }
.story__txt { font-size: 2rem; line-height: 2.15; letter-spacing: .04em; }
.story__txt br { display: none; }

/* ---------- DENTAL CONCERNS ---------- */
.concerns { padding-top: 4.4rem; }
.concerns__box { width: 34.5rem; padding: 3.4rem 0 2.6rem; outline-width: .6rem; }
.concerns__en { font-size: 2.1rem; letter-spacing: .08em; }
.concerns__title { margin-top: 1.4rem; font-size: 1.9rem; line-height: 1.7; }
.concerns__list { width: 30.5rem; margin: 2rem auto 0; grid-template-columns: 1fr; column-gap: 0; }
.concerns__list li { height: 5.6rem; padding-left: 3rem; font-size: 1.6rem; }
.concerns__list li::before { width: 1.6rem; height: 1.6rem; margin-top: -.9rem; }
.concerns__list li::after { left: .35rem; width: 1rem; height: .55rem; margin-top: -.9rem; }
.sec-info > .l-inner { margin-top: 5.6rem; }

/* ---------- 医院情報 ---------- */
.clinic-info { display: block; }
.clinic-info__body { width: 100%; }
.clinic-info__logo img { width: 19.6rem; height: auto; }
.clinic-info__address { margin-top: 1.6rem; font-size: 1.5rem; }
.clinic-info__notes li { font-size: 1.4rem; }
.clinic-info__notes--access li { font-size: 1.4rem; }
.clinic-info__tel { margin-top: 1.2rem; text-align: center; }
.clinic-info__tel a { font-size: 2.6rem; }
.hours { width: 100%; margin-top: 1.8rem; }
.hours th, .hours td { height: 4.4rem; font-size: 1.3rem; }
.hours th { width: 9.6rem; }
.hours thead th { height: 3.2rem; }
.hours thead th:first-child { width: 9.6rem; }
.hours thead th.hours__day { width: auto; font-size: 1.3rem; }
.hours__legend { gap: .2rem 1.4rem; margin-top: .9rem; font-size: 1.2rem; line-height: 1.7; }
.clinic-info__closed { margin-top: 1.2rem; font-size: 1.4rem; }
.clinic-info__map { width: 100%; height: 26rem; margin-top: 2.6rem; }
.clinic-info__review { height: 4.6rem; font-size: 1.3rem; }
.clinic-info--dark .clinic-info__map { height: 26rem; }
.clinic-info--dark .hours { margin-top: 1.8rem; }
.clinic-info--dark .clinic-info__tel { display: block; }

/* ---------- 予約CTA ---------- */
.reserve { width: 100%; padding-top: 3.4rem; }
.reserve__lead { font-size: 1.8rem; }
.reserve__btns { margin-top: 1.6rem; gap: 1.1rem; }
.btn-pill { width: 15.8rem; height: 4.4rem; border-radius: 2.2rem; font-size: 1.5rem; gap: .8rem; }
.btn-pill svg { width: 1.8rem; height: 1.8rem; }
.reserve__doctor { display: none; }

/* ---------- 8 FEATURES ---------- */
.sec-features { padding: 2.1rem 0 6.7rem; }
.sec-features__veil { background-size: 100% auto; }
.feature-grid { display: block; margin-top: 2.6rem; }
.feature + .feature { margin-top: 5.5rem; }
.feature__num, .case__num, .equip__num { font-size: 1.8rem; gap: 1.2rem; }
.feature__img { margin-top: 1.8rem; }
.feature__img img { width: 33.5rem; height: 20.1rem; }
.feature__text { margin-top: 1.4rem; font-size: 1.4rem; line-height: 1.85; }
.feature__text br { display: none; }

/* ---------- PICK UP ---------- */
.sec-pickup { padding-top: 4.4rem; }
.sec-pickup__veil { display: none; }
.sec-pickup .sec-head { margin-bottom: 2.6rem; }
.pickup { width: 100%; height: auto; margin: 0 auto .3rem; }
.pickup__img { position: static; width: 100%; height: 14.1rem; }
.pickup__panel { position: static; width: 100%; height: auto; padding: 1.8rem 2rem 0; background: none; }
.pickup__title { font-size: 2.8rem; line-height: 1.35; }
.pickup__num { font-size: 2.8rem; margin-right: 1rem; }
.pickup__lead { margin-top: 1.4rem; font-size: 2.2rem; line-height: 1.65; }
.pickup__text { margin-top: 1.6rem; font-size: 1.5rem; line-height: 1.95; }
.pickup__tags { margin-top: 1.6rem; gap: .6rem; }
.pickup__tags li { padding: .6rem 1.1rem; font-size: 1.4rem; }
.pickup__more { margin-top: 1.8rem; padding: 0 3.4rem .5rem 0; font-size: 1.5rem; }
.pickup__more::after { right: .4rem; width: .6rem; height: .6rem; margin-top: -.6rem; }

/* ---------- TREATMENT ---------- */
.sec-treatment { padding: 4rem 0 5.2rem; }
.sec-treatment .sec-head { margin-bottom: 3.4rem; }
.treat-grid { width: 33.5rem; grid-template-columns: repeat(2, 1fr); grid-auto-rows: auto; row-gap: 1.7rem; }
.treat-grid__circle { width: 15.4rem; height: 15.4rem; }
.treat-grid__circle img { transform: scale(.7); }
.treat-grid__label { margin-top: .9rem; font-size: 1.7rem; line-height: 1.5; }

/* ---------- PRICE ---------- */
.sec-price { width: 100%; height: auto; }
.sec-price__img { position: static; width: 100%; height: 19.3rem; }
.sec-price__panel { position: static; width: 100%; height: auto; padding: 2.4rem 2rem 1rem; background: none; }
.sec-price__en { font-size: 3rem; }
.sec-price__lead { margin-top: 1.4rem; font-size: 1.6rem; }
.sec-price__note { margin-top: 1rem; font-size: 1.2rem; }
.sec-price__cards img { width: 31.1rem; height: auto; }
.sec-price .more { margin-top: 1.4rem; }

/* ---------- CASE ---------- */
.sec-case { padding: 1rem 0 4rem; }
.sec-case .sec-head { margin-bottom: 2.8rem; }
.case-grid { display: block; }
.case + .case { margin-top: 2.6rem; }
.case__imgs { margin-top: 1.6rem; gap: .8rem; }
.case__text { margin-top: 1.2rem; font-size: 1.4rem; }
.sec-case .more--center { margin-top: 3rem; }

/* ---------- GREETING ---------- */
.sec-greeting__pc { display: none; }
.greeting {
	position: static; width: auto; height: auto; clip: auto; margin: 0; padding: 4.4rem 0 4rem;
	overflow: visible; white-space: normal; background: #fbfbfa;
}
.greeting { padding-bottom: 1rem; }
.greeting .sec-head { margin-bottom: 1.7rem; }
.greeting__block { width: 33.5rem; margin: 0 auto; }
.greeting__block + .greeting__block { padding-top: 1rem; }
.greeting__label { text-align: center; font-size: 2.2rem; font-weight: 500; line-height: 1.5; letter-spacing: .08em; }
.greeting__photo { margin: 2.9rem 0 0; }
.greeting__photo img { width: 100%; height: auto; }
.greeting__photo--sub { width: 25rem; margin: 3rem auto 0; }
.greeting__name { margin-top: 1.75rem; text-align: center; font-size: 1.8rem; font-weight: 500; line-height: 1.5; letter-spacing: .08em; }
.greeting__title { margin-top: 1.45rem; font-size: 1.8rem; font-weight: 600; line-height: 2; letter-spacing: .04em; }
.greeting__text { margin-top: .85rem; font-size: 1.4rem; font-weight: 500; line-height: 2.07; letter-spacing: .02em; }

/* ---------- CLINIC ---------- */
.sec-clinic { padding: 4.4rem 0 4.4rem; }
.sec-clinic .sec-head { margin-bottom: 2.4rem; }
.sec-clinic .sec-head__ja { font-size: 1.9rem; }
.equip { grid-template-columns: 1fr; row-gap: 6.1rem; }
.equip__num { font-size: 1.8rem; gap: 1.2rem; }
.equip__img { margin-top: 1.4rem; }
.equip__img img { width: 100%; height: 18.1rem; }
.equip__title { margin-top: 1.4rem; font-size: 1.7rem; }
.equip__text { margin-top: 1rem; font-size: 1.4rem; line-height: 2.07; }

/* ---------- FAQ ---------- */
.sec-faq { padding: 4.4rem 0 1.4rem; }
.sec-faq .sec-head { margin-bottom: 2.4rem; }
.faq__item { padding: 2.4rem 0 2.6rem; }
.faq__q { gap: 1.2rem; font-size: 1.7rem; line-height: 1.5; }
.faq__mark { font-size: 2.2rem; }
.faq__a { margin-top: 1.2rem; font-size: 1.3rem; line-height: 1.85; }

/* ---------- INSTAGRAM ---------- */
.sec-instagram { padding: 2.6rem 0 1.5rem; overflow-x: hidden; }
.sec-instagram .sec-head__en { font-size: 2.8rem; }
.sec-instagram .more--center { margin-top: .8rem; }
.sec-instagram .more a { font-size: 1.4rem; padding-right: 3.4rem; }
.sec-instagram .l-inner { width: 100%; }
.insta {
	margin-top: 2.4rem; display: flex; gap: 1.6rem; grid-template-columns: none;
	overflow-x: auto; padding: 0 2rem; scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}
.insta li { flex: 0 0 24.8rem; aspect-ratio: auto; height: 25rem; scroll-snap-align: center; }

/* ---------- NEWS / BLOG ---------- */
.sec-news { padding: 4rem 0 0; }
.news-cols { grid-template-columns: 1fr; row-gap: 1.2rem; }
.news-col + .news-col { border-top: 1px solid var(--line); padding-top: .6rem; }
.news-col__en { font-size: 2.8rem; }
.news-col__ja { margin-top: 1rem; font-size: 1.5rem; }
.news-col__head .more { margin-top: 1.8rem; }
.news-col__head .more a { font-size: 1.5rem; padding-right: 4rem; }
.news-list { margin-top: 3.2rem; }
.news-list__item > a { gap: 1.4rem; padding: 1.5rem 0; }
.news-list__thumb { width: 14.5rem; }
.news-list__thumb img { width: 14.5rem; height: 9.4rem; }
.news-list__date { font-size: 1.3rem; }
.news-list__title { font-size: 1.4rem; line-height: 1.5; }
.news-list__arrow { width: 3rem; }

/* ---------- フッター ---------- */
.l-footer__info { padding: 3.4rem 0 0; }
.l-footer__info .reserve { padding-top: 3rem; padding-bottom: 3rem; }
.l-footer__banners { padding: 0 0 3.4rem; }
.fbanner { flex-direction: column; align-items: center; gap: 1.4rem; }
.fbanner img { width: 30rem; height: 8.6rem; }
.l-footer__nav { padding: 2.6rem 0 8.6rem; }

.fnav { width: 33.5rem; display: block; padding-left: 0; }
.fnav__main { display: grid; grid-template-columns: 1fr 1fr; column-gap: 1.6rem; }
.fnav__primary, .fnav__sub { display: contents; }
.fnav__primary li, .fnav__sub li { border-bottom: 1px solid rgba(255, 255, 255, .55); }
.fnav__primary li a, .fnav__sub li a { padding: 1.1rem 0; font-size: 1.6rem; }
.fnav__treat { width: auto; margin: 1.1rem 0 0; }
.fnav__heading { padding: 1.1rem 0; font-size: 1.6rem; }
.fnav__treat-list { margin-top: 1.4rem; grid-template-columns: 1fr 1fr; column-gap: 1.6rem; }
.fnav__treat-list li { border-bottom: 1px solid rgba(255, 255, 255, .45); }
.fnav__treat-list li a { padding: 1.35rem 0; font-size: 1.5rem; line-height: 1.5; white-space: normal; }
.u-sp-br { display: inline; }

}

/* =========================================================
   一覧 / 記事詳細（お知らせ・ブログ・症例）
   ※専用デザイン未支給のため TOP のトーンに合わせた暫定レイアウト
   ========================================================= */
.sec-archive { padding: 18rem 0 12rem; }
.sec-archive .sec-head { margin-bottom: 6rem; }
.sec-archive .sec-head__en { font-size: 9rem; }
.news-list--archive { margin-top: 0; border-top: 1px solid var(--line); }
.archive-empty { text-align: center; font-size: 1.8rem; font-weight: 500; }
.pager { margin-top: 6rem; display: flex; justify-content: center; gap: 1.2rem; font-family: var(--ff-en); font-size: 1.8rem; }
.pager .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 4rem; height: 4rem; padding: 0 1rem; border: 1px solid var(--line); }
.pager .page-numbers.current { background: var(--navy); color: #fff; border-color: var(--navy); }

.entry { border-top: 1px solid var(--line); padding-top: 4rem; }
.entry__date { font-family: var(--ff-en); font-size: 1.8rem; letter-spacing: .06em; }
.entry__title { margin-top: 1.2rem; font-size: 3.2rem; font-weight: 500; line-height: 1.6; letter-spacing: .04em; }
.entry__body { margin-top: 3.2rem; font-size: 1.7rem; font-weight: 500; line-height: 2; }
.entry__body p { margin-bottom: 2.4rem; }
.entry__body img { height: auto; margin: 1rem 0; }
.entry__body a { text-decoration: underline; }
.sec-archive .more--center { margin-top: 6rem; }

@media (max-width: 767px) {
	.sec-archive { padding: 11rem 0 6rem; }
	.sec-archive .sec-head { margin-bottom: 3rem; }
	.sec-archive .sec-head__en { font-size: 4.4rem; }
	.entry { padding-top: 2.4rem; }
	.entry__date { font-size: 1.5rem; }
	.entry__title { margin-top: .8rem; font-size: 2.2rem; }
	.entry__body { margin-top: 2rem; font-size: 1.5rem; line-height: 1.95; }
	.pager { margin-top: 3.6rem; font-size: 1.5rem; }
	.sec-archive .more--center { margin-top: 3.6rem; }
}

/* =========================================================
   下層ページ共通（KV / パンくず）
   TOPのトンマナ（Zen Old Mincho ＋ Cormorant ／ navy #022447）を踏襲。
   ヘッダーは透過・紺文字なので、KVは白ベールで明るく保ちナビの可読性を確保する。
   ========================================================= */
.page-hero {
	position: relative; width: 100%;
	padding: calc(108 * var(--hu)) 0 0;
	height: calc(108 * var(--hu) + 30rem);
	display: flex; align-items: center;
	overflow: hidden; background: var(--mint);
}
.page-hero__bg { position: absolute; inset: 0; z-index: 0; }
.page-hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 38%; }
.page-hero::after {
	content: ""; position: absolute; inset: 0; z-index: 1;
	background: linear-gradient(100deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.9) 34%, rgba(255,255,255,.6) 60%, rgba(255,255,255,.18) 100%);
}
/* 白背景のイラスト・図版は切り抜かず、右寄せで全体を見せる */
.page-hero--plain { background: #fff; }
.page-hero--plain .page-hero__bg img {
	width: 100%; height: 100%; object-fit: contain; object-position: 84% center;
}
.page-hero--plain::after {
	background: linear-gradient(100deg, rgba(255,255,255,1) 0%, rgba(255,255,255,.98) 30%, rgba(255,255,255,.45) 56%, rgba(255,255,255,0) 76%);
}
.page-hero__inner {
	position: relative; z-index: 2;
	width: 108rem; max-width: calc(100% - 8rem); margin-inline: auto;
}
.page-hero__en {
	font-family: var(--ff-en); font-weight: 300; font-size: 7.2rem; line-height: 1;
	letter-spacing: .04em; color: var(--navy);
}
.page-hero__title {
	position: relative; margin-top: 1.8rem; padding-left: 4.4rem;
	font-size: 3.4rem; font-weight: 500; line-height: 1.4; letter-spacing: .08em;
}
.page-hero__title::before {
	content: ""; position: absolute; left: 0; top: 50%; width: 3.2rem; height: 1px;
	background: var(--gold);
}

.breadcrumb { padding: 2rem 0 0; }
.breadcrumb ol { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; }
.breadcrumb li { font-size: 1.3rem; font-weight: 500; letter-spacing: .03em; opacity: .8; }
.breadcrumb li + li::before { content: "／"; margin-right: .8rem; opacity: .5; }
.breadcrumb a { text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }
.breadcrumb li[aria-current] { opacity: 1; font-weight: 600; }

/* =========================================================
   下層：診療案内ページ
   ========================================================= */
.tp { display: block; }
.tp-text { font-size: 1.7rem; font-weight: 500; line-height: 2.1; letter-spacing: .03em; }
.tp-text + .tp-text { margin-top: 1.8rem; }
.tp-text--center { text-align: center; }
/* 図版の下の本文。行長が伸びすぎないよう中央に寄せる */
.tp-body { width: 88rem; max-width: 100%; margin-inline: auto; }
.tp-figure + .tp-body, .tp-body + .tp-stage, .tp-body + .tp-note { margin-top: 3.4rem; }

.tp-lead {
	width: 88rem; max-width: 100%; margin: 6rem auto 0;
	font-size: 1.8rem; font-weight: 500; line-height: 2.2; letter-spacing: .04em;
}

/* ---- 目次 ---- */
.tp-toc {
	margin: 6rem 0 0; padding: 4rem 5rem 4.4rem;
	background: var(--mint); border: 1px solid rgba(2, 36, 71, .12);
}
.tp-toc__title { text-align: center; font-size: 2rem; font-weight: 500; letter-spacing: .1em; }
.tp-toc__title span {
	display: block; margin-bottom: .4rem;
	font-family: var(--ff-en); font-size: 1.5rem; letter-spacing: .18em; color: var(--gold);
}
.tp-toc__list {
	margin-top: 2.6rem; display: grid; grid-template-columns: 1fr 1fr; column-gap: 5rem;
}
.tp-toc__list li { border-bottom: 1px solid rgba(2, 36, 71, .14); }
.tp-toc__list a {
	position: relative; display: flex; align-items: baseline; gap: 1.4rem;
	padding: 1.5rem 3rem 1.5rem 0;
	font-size: 1.6rem; font-weight: 500; letter-spacing: .04em; transition: color .2s, opacity .2s;
}
.tp-toc__list a::after {
	content: ""; position: absolute; right: .6rem; top: 50%; width: .7rem; height: .7rem;
	margin-top: -.6rem; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor;
	transform: rotate(45deg);
}
.tp-toc__list a:hover { opacity: .6; }
.tp-toc__num { font-family: var(--ff-en); font-size: 1.7rem; color: var(--gold); letter-spacing: .06em; }

/* ---- セクション ---- */
.tp-sec { padding: 11rem 0; }
.tp-sec--tint { background: linear-gradient(180deg, #fbfdfd 0%, var(--mint) 100%); }
.tp-sec--faq { background: var(--cream); }
.tp-sec__head { text-align: center; margin-bottom: 5.4rem; }
.tp-sec__en {
	font-family: var(--ff-en); font-weight: 300; font-size: 5.6rem; line-height: 1;
	letter-spacing: .04em; color: rgba(2, 36, 71, .32);
}
.tp-sec__title { margin-top: 1rem; font-size: 3.2rem; font-weight: 500; line-height: 1.5; letter-spacing: .06em; }

.tp-sec[id], .tp-card[id] { scroll-margin-top: calc(108 * var(--hu) + 3rem); }

/* ---- 図版 ---- */
.tp-figure { margin: 0; }
.tp-figure--wide img { width: 100%; height: 42rem; object-fit: cover; }
.tp-figure--chart { margin-top: 4rem; background: #fff; padding: 3.2rem; border: 1px solid rgba(2, 36, 71, .1); }
.tp-figure--chart img { width: 100%; height: auto; max-height: 46rem; object-fit: contain; }
.tp-figure__scroll { outline: none; text-align: center; }
.tp-figure__hint { display: none; }
.tp-figure figcaption {
	margin-top: 1.4rem; text-align: center; font-size: 1.4rem; font-weight: 500; opacity: .7;
}

/* ---- 特徴ブロック ---- */
.tp-feature {
	margin-top: 6rem; display: grid; grid-template-columns: 46rem 1fr; gap: 5rem; align-items: center;
}
.tp-feature--rev { grid-template-columns: 1fr 46rem; }
.tp-feature--rev .tp-feature__img { order: 2; }
.tp-feature--plain { display: block; padding-left: 3rem; border-left: 3px solid var(--gold); }
.tp-feature__img { margin: 0; }
.tp-feature__img img { width: 100%; height: 30rem; object-fit: cover; }
.tp-feature__img--plain { background: #fff; border: 1px solid rgba(2, 36, 71, .08); }
.tp-feature__img--plain img { object-fit: contain; padding: 1.6rem; }
.tp-feature__num {
	font-family: var(--ff-en); font-size: 2.2rem; line-height: 1; letter-spacing: .1em; color: var(--gold);
}
.tp-feature__title {
	margin: 1.2rem 0 2rem; padding-bottom: 1.6rem;
	font-size: 2.4rem; font-weight: 600; line-height: 1.5; letter-spacing: .05em;
	border-bottom: 1px solid rgba(2, 36, 71, .14);
}

/* ---- 進行段階 ---- */
.tp-stage { margin-top: 4.4rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.4rem; }
.tp-stage__item { background: var(--mint); padding: 3rem 2.8rem 3.4rem; }
.tp-stage__label {
	display: inline-block; margin-bottom: 1.6rem; padding: .5rem 1.8rem;
	background: var(--navy); color: #fff;
	font-size: 1.5rem; font-weight: 500; letter-spacing: .12em;
}
.tp-stage .tp-text { font-size: 1.6rem; line-height: 2; }
.tp-note {
	margin-top: 3.4rem; padding: 2.4rem 3rem; background: rgba(2, 36, 71, .04);
	border-left: 3px solid var(--navy);
	font-size: 1.7rem; font-weight: 500; line-height: 2; letter-spacing: .03em;
}

/* ---- 治療の流れ ---- */
.tp-flow { margin-top: 5rem; }
.tp-flow__item {
	position: relative; display: grid; grid-template-columns: 13rem 1fr; gap: 3.4rem;
	padding: 0 0 4.4rem 0;
}
.tp-flow__item:last-child { padding-bottom: 0; }
.tp-flow__item::before {
	content: ""; position: absolute; left: 6.4rem; top: 7rem; bottom: 0; width: 1px;
	background: rgba(2, 36, 71, .2);
}
.tp-flow__item:last-child::before { display: none; }
.tp-flow__step {
	position: relative; z-index: 1;
	width: 13rem; height: 13rem; border-radius: 50%; background: var(--navy); color: #fff;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	font-family: var(--ff-en); font-size: 3.4rem; line-height: 1; letter-spacing: .04em;
}
.tp-flow__step span { font-size: 1.3rem; letter-spacing: .2em; margin-bottom: .6rem; opacity: .75; }
.tp-flow__body { padding-top: 1.4rem; }
.tp-flow__title { font-size: 2.2rem; font-weight: 600; line-height: 1.5; letter-spacing: .05em; margin-bottom: 1.4rem; }

/* ---- 2カラムカード（期間・費用） ---- */
.tp-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; }
.tp-card { padding: 4rem 4rem 4.4rem; border: 1px solid rgba(2, 36, 71, .16); background: #fff; }
.tp-card__en {
	font-family: var(--ff-en); font-size: 1.6rem; letter-spacing: .18em; color: var(--gold);
}
.tp-card__title {
	margin: .8rem 0 2rem; padding-bottom: 1.6rem;
	font-size: 2.2rem; font-weight: 600; letter-spacing: .05em;
	border-bottom: 1px solid rgba(2, 36, 71, .14);
}
.tp-card .tp-text { font-size: 1.6rem; line-height: 2.05; }

/* ---- 関連ページボタン ---- */
.tp-links { margin-top: 6rem; }
.tp-links--flush { margin-top: 0; }
.tp-links__title {
	text-align: center; font-size: 2rem; font-weight: 500; letter-spacing: .08em; margin-bottom: 2.6rem;
}
.tp-links__list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.4rem; }
.tp-links__list a {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.2rem;
	min-height: 17rem; padding: 2.6rem 2rem; background: #fff;
	border: 1px solid rgba(2, 36, 71, .18);
	transition: background .25s, color .25s, transform .25s;
}
.tp-links__list a:hover { background: var(--navy); color: #fff; transform: translateY(-.3rem); }
.tp-links__icon { display: flex; align-items: center; justify-content: center; height: 5rem; }
.tp-links__icon img { max-width: 6.4rem; max-height: 5rem; width: auto; height: auto; transition: filter .25s; }
.tp-links__list a:hover .tp-links__icon img { filter: brightness(0) invert(1); }
.tp-links__name { font-size: 1.9rem; font-weight: 600; line-height: 1.45; letter-spacing: .04em; text-align: center; }
.tp-links__more {
	position: relative; padding-right: 2.4rem;
	font-family: var(--ff-en); font-size: 1.4rem; letter-spacing: .06em; opacity: .8;
}
.tp-links__more::after {
	content: ""; position: absolute; right: .4rem; top: 50%; width: .6rem; height: .6rem;
	margin-top: -.5rem; border-top: 1px solid currentColor; border-right: 1px solid currentColor;
	transform: rotate(45deg);
}

/* ---- FAQ（アコーディオン） ---- */
.tp-faq__item { background: #fff; border: 1px solid rgba(2, 36, 71, .14); }
.tp-faq__item + .tp-faq__item { margin-top: 1.6rem; }
.tp-faq__q {
	position: relative; display: flex; align-items: flex-start; gap: 1.8rem;
	padding: 2.6rem 7rem 2.6rem 3rem; cursor: pointer; list-style: none;
	font-size: 2rem; font-weight: 600; line-height: 1.6; letter-spacing: .04em;
	transition: background .2s;
}
.tp-faq__q::-webkit-details-marker { display: none; }
.tp-faq__q:hover { background: rgba(2, 36, 71, .03); }
.tp-faq__mark {
	flex: none; font-family: var(--ff-en); font-size: 2.6rem; line-height: 1.2; color: var(--gold);
}
.tp-faq__mark--a { color: var(--blue); }
.tp-faq__icon { position: absolute; right: 3rem; top: 50%; width: 1.6rem; height: 1.6rem; margin-top: -.8rem; }
.tp-faq__icon::before, .tp-faq__icon::after {
	content: ""; position: absolute; left: 0; top: 50%; width: 100%; height: 1px; background: var(--navy);
	transition: transform .25s;
}
.tp-faq__icon::after { transform: rotate(90deg); }
.tp-faq__item[open] .tp-faq__icon::after { transform: rotate(0); }
.tp-faq__a {
	display: flex; align-items: flex-start; gap: 1.8rem;
	padding: 0 3rem 3rem; margin-top: -.4rem;
}
.tp-faq__a p { font-size: 1.7rem; font-weight: 500; line-height: 2.05; letter-spacing: .03em; }

/* ---- 下層：表・小見出し・地図 ---- */
.tp-subhead {
	margin: 4.4rem 0 1.8rem; padding-bottom: 1.2rem;
	font-size: 2.1rem; font-weight: 600; letter-spacing: .05em;
	border-bottom: 1px solid rgba(2, 36, 71, .14);
}
.tp-body > :first-child.tp-subhead { margin-top: 0; }
.tp-list { margin: 2rem 0 0; padding-left: 1.6em; }
.tp-list li { font-size: 1.7rem; font-weight: 500; line-height: 2.1; list-style: disc; }

.tp-tbl { margin: 2.8rem 0 0; }
.tp-tbl__scroll { overflow-x: auto; }
.tp-tbl table { width: 100%; border-collapse: collapse; background: #fff; }
.tp-tbl th, .tp-tbl td {
	padding: 1.8rem 2.2rem; border: 1px solid rgba(2, 36, 71, .14);
	font-size: 1.6rem; font-weight: 500; line-height: 1.9; letter-spacing: .03em;
	text-align: left; vertical-align: top;
}
.tp-tbl thead th { background: var(--navy); color: #fff; font-weight: 500; letter-spacing: .08em; }
.tp-tbl tbody th { background: var(--mint); width: 24rem; font-weight: 600; }
.tp-tbl--kv tbody th { width: 20rem; }
.tp-tbl--hours { text-align: center; }
.tp-tbl--hours th, .tp-tbl--hours td { text-align: center; padding: 1.4rem .8rem; white-space: nowrap; }
.tp-tbl--hours tbody th { width: auto; background: var(--mint); }
.tp-tbl--symptom tbody th { width: 46%; background: #fff; font-weight: 500; }
.tp-tbl__links { display: flex; flex-wrap: wrap; gap: .8rem 1rem; }
.tp-tbl__links a {
	display: inline-block; padding: .5rem 1.6rem .6rem;
	background: var(--mint); border: 1px solid rgba(2, 36, 71, .16);
	font-size: 1.5rem; letter-spacing: .03em; transition: background .2s, color .2s;
}
.tp-tbl__links a:hover { background: var(--navy); color: #fff; border-color: var(--navy); }
.tp-tbl__note { margin-top: 1rem; font-size: 1.3rem; color: var(--gold); }
.tp-tbl + .tp-text, .tp-tbl + .tp-subhead, .tp-list + .tp-text { margin-top: 2.6rem; }
.tp-tbl__note--sp { display: none; }
.tp-tbl--list { margin-top: 2.8rem; background: #fff; border: 1px solid rgba(2, 36, 71, .14); padding: 3rem 3.4rem; }
.tp-tbl__cap { margin-bottom: 1.6rem; font-size: 1.7rem; font-weight: 600; letter-spacing: .06em; }
.tp-tbl--list ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem 3rem; }
.tp-tbl--list li {
	position: relative; padding-left: 1.8rem;
	font-size: 1.6rem; font-weight: 500; line-height: 1.9;
}
.tp-tbl--list li::before {
	content: ""; position: absolute; left: 0; top: 1.1rem;
	width: .8rem; height: .8rem; border: 1px solid var(--gold);
}
.tp-map { margin-top: 3.4rem; }
.tp-map iframe { width: 100%; height: 42rem; border: 0; display: block; }
.tp-map__link {
	display: inline-block; margin-top: 1.4rem; padding-right: 2rem; position: relative;
	font-size: 1.5rem; letter-spacing: .04em; text-decoration: underline;
}

.tp-pagelinks { display: flex; justify-content: center; flex-wrap: wrap; gap: 2rem; }
.tp-pagelinks a {
	display: flex; align-items: center; justify-content: center; gap: 1rem;
	min-width: 30rem; padding: 2.2rem 3rem; position: relative;
	background: #fff; border: 1px solid rgba(2, 36, 71, .18);
	font-size: 1.7rem; font-weight: 500; letter-spacing: .06em;
	transition: background .25s, color .25s, transform .25s;
}
.tp-pagelinks a::after {
	content: ""; position: absolute; right: 2.2rem; top: 50%; width: .7rem; height: .7rem;
	margin-top: -.5rem; border-top: 1px solid currentColor; border-right: 1px solid currentColor;
	transform: rotate(45deg);
}
.tp-pagelinks a:hover { background: var(--navy); color: #fff; border-color: var(--navy); transform: translateY(-.3rem); }

/* ---- 予約CTA ---- */
.tp-cta { background: var(--navy-deep); color: #fff; padding: 0 0 7rem; }
.tp-cta .reserve { padding-top: 6.4rem; }

/* =========================================================
   採用情報（/recruit/）— 募集要項
   ========================================================= */
.rq-joblabel {
	margin-top: 8rem; text-align: center;
	font-size: 1.6rem; font-weight: 500; letter-spacing: .18em; color: var(--gold);
}
.rq-catch {
	margin: 1.6rem 0 0; text-align: center;
	font-size: 3.4rem; font-weight: 600; line-height: 1.55; letter-spacing: .06em;
}

/* 一目で分かる6つのポイント */
.rq-points {
	display: grid; grid-template-columns: repeat(6, 1fr); gap: 2rem 1.2rem;
	margin: 5.4rem 0 0; padding: 0; list-style: none;
}
.rq-points li { text-align: center; }
.rq-points__icon {
	display: flex; align-items: center; justify-content: center;
	width: 8.6rem; height: 8.6rem; margin: 0 auto; border-radius: 50%;
	background: var(--mint); color: var(--navy);
	transition: background .35s var(--ease-out), color .35s var(--ease-out);
}
.rq-points__icon svg { width: 4rem; height: 4rem; }
.rq-points__label {
	display: block; margin-top: 1.4rem;
	font-size: 1.55rem; font-weight: 600; line-height: 1.6; letter-spacing: .02em;
}
.rq-points li:hover .rq-points__icon { background: var(--navy); color: #fff; }

.rq-intro { margin-top: 6rem; }
.rq-jump { margin-top: 4.4rem; text-align: center; }
.rq-jump a {
	display: inline-flex; align-items: center; gap: 1rem;
	padding: 1.5rem 4.6rem 1.5rem 4rem; border: 1px solid var(--navy);
	font-size: 1.7rem; font-weight: 500; letter-spacing: .08em;
	transition: background .25s var(--ease-out), color .25s var(--ease-out), transform .25s var(--ease-out);
}
.rq-jump a::after {
	content: ""; width: .7rem; height: .7rem;
	border-right: 1px solid currentColor; border-bottom: 1px solid currentColor;
	transform: rotate(45deg) translateY(-.15rem);
}
.rq-jump a:hover { background: var(--navy); color: #fff; transform: translateY(-.3rem); }

/* 募集要項の表（セル内に小見出し・箇条書きが入る） */
.rq-tbl tbody th { vertical-align: top; }
.rq-tbl td { vertical-align: top; }
.rq-p { margin: 0; font-size: 1.6rem; font-weight: 500; line-height: 1.95; }
.rq-p + .rq-p { margin-top: .9rem; }
.rq-sub {
	margin: 0; font-size: 1.6rem; font-weight: 600; letter-spacing: .04em;
	padding-left: 1.2rem; border-left: 3px solid var(--gold);
}
.rq-p + .rq-sub, .rq-list + .rq-sub, .rq-note + .rq-sub { margin-top: 2.2rem; }
.rq-sub + .rq-p, .rq-sub + .rq-list { margin-top: .9rem; }
.rq-note { margin: .7rem 0 0; font-size: 1.4rem; font-weight: 500; line-height: 1.8; color: rgba(2, 36, 71, .68); }
.rq-list { margin: .9rem 0 0; padding-left: 1.5em; }
.rq-list li { font-size: 1.6rem; font-weight: 500; line-height: 1.9; list-style: disc; }
.rq-list li + li { margin-top: .3rem; }
.rq-list + .rq-p, .rq-note + .rq-p { margin-top: 1.2rem; }

/* 「こんな方と…」の希望リスト */
.rq-wish {
	width: 88rem; max-width: 100%; margin: 3.4rem auto 4rem; padding: 0; list-style: none;
	display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.4rem 2rem;
}
.rq-wish li {
	display: flex; align-items: flex-start; gap: 1.2rem;
	padding: 1.8rem 2.4rem; background: #fff; border: 1px solid rgba(2, 36, 71, .14);
	font-size: 1.6rem; font-weight: 500; line-height: 1.7; letter-spacing: .02em;
}
.rq-wish li::before {
	content: ""; flex: none; width: .8rem; height: .8rem; margin-top: .85em;
	border-radius: 50%; background: var(--gold);
}

/* 「応募フォームへ」で飛んだとき、固定ヘッダーに見出しが隠れないようにする */
#entry { scroll-margin-top: calc(108 * var(--hu) + 3rem); }

.rq-entry-head { margin-top: 0; }

/* =========================================================
   採用フォーム（/recruit/）
   ========================================================= */
.rf > .l-inner { padding-top: 8rem; padding-bottom: 9rem; }
.rf-intro p { font-size: 1.7rem; font-weight: 500; line-height: 2.1; letter-spacing: .03em; }
.rf-intro p + p { margin-top: 1.6rem; }
.rf-intro__mark { text-decoration: underline; text-underline-offset: .4rem; }
.rf-tel {
	display: flex; align-items: baseline; gap: 1.6rem;
	margin-top: 3rem; padding: 2.2rem 3rem; background: var(--mint);
}
.rf-tel__label { font-size: 1.6rem; font-weight: 500; letter-spacing: .04em; }
.rf-tel a { font-family: var(--ff-en); font-size: 3.6rem; letter-spacing: .01em; }

/* 入力 → 確認 → 完了 */
.rf-steps {
	display: flex; justify-content: center; gap: 1rem;
	margin: 6rem 0 0; padding: 0; list-style: none;
}
.rf-steps li {
	display: flex; align-items: center; gap: .8rem;
	padding: .9rem 2.4rem; border: 1px solid var(--line); border-radius: 100px;
	font-size: 1.5rem; font-weight: 500; letter-spacing: .04em; color: rgba(2, 36, 71, .5);
}
.rf-steps li span {
	width: 2.2rem; height: 2.2rem; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: rgba(2, 36, 71, .12); font-family: var(--ff-en); font-size: 1.5rem; color: var(--navy);
}
.rf-steps li.is-current { border-color: var(--navy); color: var(--navy); }
.rf-steps li.is-current span { background: var(--navy); color: #fff; }

.rf-alert {
	margin-top: 4rem; padding: 1.8rem 2.4rem;
	border: 1px solid #c0392b; background: rgba(192, 57, 43, .06);
	color: #a5301f; font-size: 1.6rem; font-weight: 500; line-height: 1.8;
}

.rf-form { margin-top: 4rem; }
/* 自動投稿よけ。人には見せない */
.rf-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.rf-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.rf-item {
	display: flex; gap: 4rem; align-items: flex-start;
	padding: 3.2rem 0; border-bottom: 1px solid var(--line);
}
.rf-item__head { flex: none; width: 24rem; display: flex; align-items: center; gap: 1.2rem; padding-top: .9rem; }
.rf-item__label { font-size: 1.7rem; font-weight: 600; letter-spacing: .04em; }
.rf-req {
	padding: .25rem 1rem; background: var(--gold); color: #fff;
	font-size: 1.2rem; font-weight: 500; letter-spacing: .06em;
}
.rf-item__body { flex: 1 1 auto; min-width: 0; }
.rf-inputs { display: flex; gap: 1.6rem; }
.rf-inputs--pair > * { flex: 1 1 50%; }
.rf-sub { display: flex; align-items: center; gap: 1rem; flex: 1 1 auto; min-width: 0; }
.rf-sub__label { flex: none; width: 3.4rem; font-size: 1.5rem; font-weight: 500; letter-spacing: .04em; }

.rf-form input[type="text"], .rf-form input[type="email"], .rf-form input[type="tel"], .rf-form textarea {
	width: 100%; padding: 1.3rem 1.6rem;
	border: 1px solid var(--line); border-radius: 0; background: #fff;
	font-family: inherit; font-size: 1.6rem; font-weight: 500; line-height: 1.7; color: var(--navy);
	transition: border-color .2s, box-shadow .2s;
	-webkit-appearance: none; appearance: none;
}
.rf-form textarea { resize: vertical; min-height: 16rem; }
.rf-form input::placeholder, .rf-form textarea::placeholder { color: rgba(2, 36, 71, .35); }
.rf-form input:hover, .rf-form textarea:hover { border-color: rgba(2, 36, 71, .45); }
.rf-form input:focus, .rf-form textarea:focus {
	outline: none; border-color: var(--navy); box-shadow: 0 0 0 .3rem rgba(2, 36, 71, .12);
}
.rf-item.is-error input, .rf-item.is-error textarea { border-color: #c0392b; background: rgba(192, 57, 43, .04); }
.rf-note { margin: 0 0 1.2rem; font-size: 1.4rem; font-weight: 500; line-height: 1.8; letter-spacing: .02em; color: rgba(2, 36, 71, .72); }
.rf-inputs + .rf-note { margin: 1.2rem 0 0; }
.rf-error { margin: 1rem 0 0; font-size: 1.4rem; font-weight: 500; color: #a5301f; }
.rf-privacy { margin-top: 3rem; font-size: 1.4rem; font-weight: 500; line-height: 1.9; color: rgba(2, 36, 71, .72); }

/* 確認画面 */
.rf-confirm { margin: 0; border-top: 1px solid var(--line); }
.rf-confirm__row { display: flex; gap: 4rem; padding: 2.8rem 0; border-bottom: 1px solid var(--line); }
.rf-confirm dt { flex: none; width: 24rem; font-size: 1.7rem; font-weight: 600; letter-spacing: .04em; }
.rf-confirm dd { flex: 1 1 auto; min-width: 0; margin: 0; font-size: 1.7rem; font-weight: 500; line-height: 1.9; word-break: break-word; }
.rf-confirm__empty { color: rgba(2, 36, 71, .45); }

.rf-send { display: flex; justify-content: center; gap: 2rem; margin-top: 5rem; }
.rf-btn {
	min-width: 32rem; height: 6.6rem; padding: 0 3rem;
	display: inline-flex; align-items: center; justify-content: center;
	border: 1px solid var(--navy); background: var(--navy); color: #fff; cursor: pointer;
	font-family: inherit; font-size: 1.7rem; font-weight: 500; letter-spacing: .08em;
	transition: background .25s var(--ease-out), color .25s var(--ease-out), transform .25s var(--ease-out);
}
.rf-btn:hover { background: var(--gold); border-color: var(--gold); transform: translateY(-.3rem); }
.rf-btn--ghost { background: transparent; color: var(--navy); min-width: 22rem; }
.rf-btn--ghost:hover { background: var(--navy); border-color: var(--navy); color: #fff; }

/* 完了画面 */
.rf-done { text-align: center; padding: 3rem 0 2rem; }
.rf-done__en { font-family: var(--ff-en); font-size: 3.6rem; letter-spacing: .08em; color: var(--gold); }
.rf-done__title { margin: 1.4rem 0 0; font-size: 3rem; font-weight: 600; letter-spacing: .06em; }
.rf-done__text { margin-top: 3rem; font-size: 1.7rem; font-weight: 500; line-height: 2.1; }
.rf-done__note { margin-top: 2rem; font-size: 1.4rem; font-weight: 500; line-height: 1.9; color: rgba(2, 36, 71, .72); }
.rf-tel--done { display: inline-flex; margin-top: 3.4rem; }
.rf-done__back { margin-top: 3.6rem; }
.rf-done__back a { font-size: 1.6rem; font-weight: 500; letter-spacing: .04em; border-bottom: 1px solid currentColor; padding-bottom: .3rem; }

/* =========================================================
   下層ページ SP
   ========================================================= */
@media (max-width: 767px) {

/* ---- 採用情報：募集要項 ---- */
.rq-joblabel { margin-top: 4.5rem; font-size: 1.35rem; letter-spacing: .14em; }
.rq-catch { margin-top: 1.1rem; font-size: 2.2rem; line-height: 1.55; }
.rq-points { grid-template-columns: repeat(2, 1fr); gap: 2.2rem 1.2rem; margin-top: 3.2rem; }
.rq-points__icon { width: 7rem; height: 7rem; }
.rq-points__icon svg { width: 3.3rem; height: 3.3rem; }
.rq-points__label { margin-top: 1rem; font-size: 1.4rem; line-height: 1.55; }
.rq-intro { margin-top: 3.6rem; }
.rq-jump { margin-top: 3rem; }
.rq-jump a { width: 100%; justify-content: center; padding: 1.4rem 2rem; font-size: 1.5rem; }
/* SPは項目名と内容を縦に積む（項目名が長く、横並びだと読みにくいため） */
.rq-tbl table, .rq-tbl tbody, .rq-tbl tr, .rq-tbl th, .rq-tbl td { display: block; width: auto; }
.rq-tbl tr + tr { margin-top: 1.4rem; }
/* .tp-tbl--kv tbody th の幅指定に勝たせるため、クラスを重ねて詳細度を上げる */
.rq-tbl.tp-tbl--kv tbody th {
	width: auto; text-align: left; padding: 1rem 1.4rem; font-size: 1.45rem;
}
.rq-tbl td { padding: 1.4rem 1.4rem 1.6rem; border-top: 0; }
.rq-p, .rq-list li { font-size: 1.45rem; line-height: 1.9; }
.rq-sub { font-size: 1.45rem; padding-left: 1rem; border-left-width: 2px; }
.rq-note { font-size: 1.25rem; }
.rq-wish { grid-template-columns: 1fr; gap: 1rem; margin: 2.4rem 0 2.8rem; }
.rq-wish li { padding: 1.3rem 1.6rem; font-size: 1.45rem; }
.rq-entry-head { margin-top: 0; margin-bottom: 3.4rem; }

/* ---- 採用フォーム ---- */
.rf > .l-inner { padding-top: 4.5rem; padding-bottom: 5.5rem; }
.rf-intro p { font-size: 1.5rem; line-height: 2; }
.rf-tel { flex-direction: column; align-items: center; gap: .6rem; margin-top: 2.4rem; padding: 1.8rem 1.6rem; text-align: center; }
.rf-tel__label { font-size: 1.4rem; }
.rf-tel a { font-size: 3rem; }
.rf-steps { gap: .6rem; margin-top: 3.6rem; }
.rf-steps li { gap: .5rem; padding: .6rem 1.2rem; font-size: 1.3rem; }
.rf-steps li span { width: 1.9rem; height: 1.9rem; font-size: 1.3rem; }
.rf-alert { margin-top: 2.6rem; padding: 1.4rem 1.6rem; font-size: 1.4rem; }
.rf-form { margin-top: 2.6rem; }
.rf-item { display: block; padding: 2.2rem 0; }
.rf-item__head { width: auto; padding-top: 0; margin-bottom: 1.2rem; }
.rf-item__label { font-size: 1.5rem; }
.rf-req { font-size: 1.1rem; padding: .2rem .8rem; }
.rf-inputs { gap: 1rem; }
.rf-inputs--pair { display: block; }
.rf-inputs--pair > * + * { margin-top: 1rem; }
.rf-sub__label { width: 3rem; font-size: 1.4rem; }
/* iOSは16px未満の入力欄で自動ズームするので、ここだけは16pxを下回らせない */
.rf-form input[type="text"], .rf-form input[type="email"], .rf-form input[type="tel"], .rf-form textarea {
	padding: 1.2rem 1.3rem; font-size: 1.6rem;
}
.rf-form textarea { min-height: 13rem; }
.rf-note { font-size: 1.25rem; margin-bottom: 1rem; }
.rf-error { font-size: 1.3rem; }
.rf-privacy { margin-top: 2.2rem; font-size: 1.3rem; }
.rf-confirm__row { display: block; padding: 1.8rem 0; }
.rf-confirm dt { width: auto; font-size: 1.4rem; color: rgba(2, 36, 71, .72); }
.rf-confirm dd { margin-top: .7rem; font-size: 1.6rem; }
.rf-send { display: block; margin-top: 3.4rem; }
.rf-send--confirm { display: flex; flex-direction: column-reverse; gap: 1.2rem; }
.rf-btn { width: 100%; min-width: 0; height: 5.8rem; font-size: 1.6rem; }
.rf-btn--ghost { min-width: 0; }
.rf-done { padding: 1rem 0; }
.rf-done__en { font-size: 3rem; }
.rf-done__title { font-size: 2.2rem; }
.rf-done__text { margin-top: 2.2rem; font-size: 1.5rem; line-height: 2; }
.rf-done__note { font-size: 1.3rem; }
.rf-tel--done { display: flex; }

.page-hero {
	padding-top: 6.4rem; height: auto; min-height: 28rem; display: block;
}
.page-hero__inner { max-width: none; width: 33.5rem; padding: 5.4rem 0 5rem; }
.page-hero__en { font-size: 3.8rem; }
.page-hero__title { margin-top: 1rem; padding-left: 3rem; font-size: 2.2rem; }
.page-hero__title::before { width: 2.2rem; }
.page-hero::after {
	background: linear-gradient(170deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.86) 46%, rgba(255,255,255,.42) 100%);
}
.page-hero--plain .page-hero__bg { left: 40%; }
.page-hero--plain .page-hero__bg img { object-position: center 42%; }
.page-hero--plain::after {
	background: linear-gradient(175deg, #fff 0%, rgba(255,255,255,.96) 40%, rgba(255,255,255,.35) 72%, rgba(255,255,255,0) 100%);
}
.breadcrumb { padding-top: 1.4rem; }
.breadcrumb li { font-size: 1.1rem; }

.tp-text { font-size: 1.5rem; line-height: 1.95; }
.tp-text + .tp-text { margin-top: 1.4rem; }
.tp-body { width: 100%; }
.tp-figure + .tp-body, .tp-body + .tp-stage, .tp-body + .tp-note { margin-top: 2.2rem; }
.tp-lead { width: 100%; margin-top: 3rem; font-size: 1.5rem; line-height: 2; }

.tp-toc { margin-top: 3.4rem; padding: 2.6rem 2rem 3rem; }
.tp-toc__title { font-size: 1.8rem; }
.tp-toc__title span { font-size: 1.3rem; }
.tp-toc__list { margin-top: 1.6rem; grid-template-columns: 1fr; }
.tp-toc__list a { padding: 1.2rem 2.4rem 1.2rem 0; font-size: 1.5rem; gap: 1rem; }
.tp-toc__num { font-size: 1.5rem; }

.tp-sec[id], .tp-card[id], #entry { scroll-margin-top: 8rem; }
.tp-sec { padding: 5.4rem 0; }
.tp-sec__head { margin-bottom: 2.8rem; }
.tp-sec__en { font-size: 3.2rem; }
.tp-sec__title { margin-top: .6rem; font-size: 2.1rem; }

.tp-figure--wide img { height: 20rem; }
.tp-figure--chart { margin-top: 2.4rem; padding: 1.4rem; position: relative; }
.tp-figure--chart img { max-height: 34rem; }
.tp-figure--chart.is-scroll img { width: 62rem; max-width: none; max-height: none; }
.tp-figure--chart.is-scroll .tp-figure__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tp-feature__img--plain img { height: 22rem; padding: 1.2rem; }
.tp-figure figcaption { margin-top: 1rem; font-size: 1.2rem; }
.tp-figure--chart.is-scroll .tp-figure__hint {
	display: block; margin-top: .5rem; font-size: 1.1rem; letter-spacing: .04em; color: var(--gold); opacity: 1;
}
.tp-figure__hint::before { content: "\2194\FE0E"; margin-right: .4em; }

.tp-feature { margin-top: 3.4rem; display: block; }
.tp-feature--plain { padding-left: 1.6rem; border-left-width: 2px; }
.tp-feature__img img { height: 20rem; }
.tp-feature__body { margin-top: 1.8rem; }
.tp-feature--rev .tp-feature__img { order: 0; }
.tp-feature__num { font-size: 1.8rem; }
.tp-feature__title { margin: .8rem 0 1.4rem; padding-bottom: 1.1rem; font-size: 1.9rem; }

.tp-stage { margin-top: 2.6rem; grid-template-columns: 1fr; gap: 1.4rem; }
.tp-stage__item { padding: 2rem 2rem 2.4rem; }
.tp-stage__label { margin-bottom: 1rem; padding: .4rem 1.4rem; font-size: 1.3rem; }
.tp-stage .tp-text { font-size: 1.5rem; line-height: 1.95; }
.tp-note { margin-top: 2.4rem; padding: 1.6rem 1.8rem; font-size: 1.5rem; line-height: 1.95; }

.tp-flow { margin-top: 2.8rem; }
.tp-flow__item { grid-template-columns: 7.6rem 1fr; gap: 1.8rem; padding-bottom: 2.8rem; }
.tp-flow__item::before { left: 3.8rem; top: 4.2rem; }
.tp-flow__step { width: 7.6rem; height: 7.6rem; font-size: 2.2rem; }
.tp-flow__step span { font-size: 1rem; margin-bottom: .3rem; }
.tp-flow__body { padding-top: .6rem; }
.tp-flow__title { font-size: 1.8rem; margin-bottom: .9rem; }

.tp-cards { grid-template-columns: 1fr; gap: 1.6rem; }
.tp-card { padding: 2.4rem 2rem 2.8rem; }
.tp-card__en { font-size: 1.3rem; }
.tp-card__title { margin: .6rem 0 1.4rem; padding-bottom: 1.1rem; font-size: 1.8rem; }
.tp-card .tp-text { font-size: 1.5rem; line-height: 1.95; }

.tp-links { margin-top: 3.4rem; }
.tp-links__title { font-size: 1.7rem; margin-bottom: 1.6rem; }
.tp-links__list { grid-template-columns: 1fr; gap: 1.2rem; }
.tp-links__list a {
	display: grid; grid-template-columns: 4.4rem 1fr; align-items: center;
	column-gap: 1.6rem; row-gap: 1rem;
	min-height: 0; padding: 1.8rem 2rem;
}
.tp-links__icon { height: 3.6rem; width: 4.4rem; }
.tp-links__icon img { max-width: 4.4rem; max-height: 3.6rem; }
.tp-links__name { text-align: left; font-size: 1.7rem; }
.tp-links__more {
	grid-column: 1 / -1; justify-self: end;
	font-size: 1.2rem; padding-right: 1.8rem; white-space: nowrap;
}

.tp-faq__q { padding: 1.8rem 4.4rem 1.8rem 1.8rem; gap: 1.2rem; font-size: 1.6rem; }
.tp-faq__mark { font-size: 2rem; }
.tp-faq__icon { right: 1.8rem; width: 1.3rem; height: 1.3rem; }
.tp-faq__a { padding: 0 1.8rem 2rem; gap: 1.2rem; }
.tp-faq__a p { font-size: 1.5rem; line-height: 1.95; }

.tp-subhead { margin: 3rem 0 1.4rem; padding-bottom: 1rem; font-size: 1.8rem; }
.tp-list { margin-top: 1.6rem; }
.tp-list li { font-size: 1.5rem; line-height: 1.95; }
.tp-tbl { margin-top: 2rem; }
.tp-tbl th, .tp-tbl td { padding: 1.2rem 1.4rem; font-size: 1.4rem; line-height: 1.8; }
.tp-tbl tbody th, .tp-tbl--kv tbody th { width: 9.5rem; }
.tp-tbl--kv table, .tp-tbl--grid table { table-layout: fixed; }
.tp-tbl--hours table { min-width: 52rem; }
.tp-tbl--hours th, .tp-tbl--hours td { padding: 1rem .4rem; font-size: 1.3rem; }
.tp-tbl__note--sp { display: block; font-size: 1.1rem; }
.tp-tbl--symptom tbody th { width: 50%; }
.tp-tbl__links a { padding: .4rem 1.1rem .5rem; font-size: 1.3rem; }
.tp-tbl--list { margin-top: 2rem; padding: 2rem 1.8rem 2.2rem; }
.tp-tbl__cap { margin-bottom: 1.2rem; font-size: 1.6rem; }
.tp-tbl--list ul { grid-template-columns: 1fr; gap: .8rem; }
.tp-tbl--list li { font-size: 1.45rem; }
.tp-tbl + .tp-text, .tp-tbl + .tp-subhead, .tp-list + .tp-text { margin-top: 1.8rem; }
.tp-map { margin-top: 2.2rem; }
.tp-map iframe { height: 26rem; }
.tp-map__link { font-size: 1.3rem; }

.tp-pagelinks { flex-direction: column; gap: 1.2rem; }
.tp-pagelinks a { min-width: 0; width: 100%; padding: 1.7rem 2rem; font-size: 1.6rem; }
.tp-pagelinks a::after { right: 1.8rem; }
.tp-cta { padding-bottom: 3.4rem; }
.tp-cta .reserve { padding-top: 3.4rem; }

}

/* =========================================================
   モーション
   - スクロール表示演出は data-r（要素）/ data-rs（子を順に遅らせる親）で指定
   - 初期状態は html.has-js のときだけ当てるので、JSが無い環境では常に表示される
   - 演出が終わった要素には is-done が付き、clip-path を外して字切れを防ぐ
   - prefers-reduced-motion: reduce では演出を止めて即表示
   ========================================================= */
:root {
	--ease-out: cubic-bezier(.22, .61, .24, 1);
	--ease-soft: cubic-bezier(.33, 1, .68, 1);
	--rt: .95s;
}

html.has-js [data-r] {
	transition:
		opacity var(--rt) var(--ease-out) var(--rd, 0ms),
		transform var(--rt) var(--ease-out) var(--rd, 0ms),
		clip-path 1.15s var(--ease-out) var(--rd, 0ms);
}
html.has-js [data-r]:not(.is-in) { will-change: opacity, transform; }

html.has-js [data-r="up"]      { opacity: 0; transform: translateY(3.6rem); }
html.has-js [data-r="up-s"]    { opacity: 0; transform: translateY(1.8rem); }
html.has-js [data-r="left"]    { opacity: 0; transform: translateX(-4rem); }
html.has-js [data-r="right"]   { opacity: 0; transform: translateX(4rem); }
html.has-js [data-r="fade"]    { opacity: 0; }
html.has-js [data-r="pop"]     { opacity: 0; transform: translateY(1.4rem) scale(.9); }
html.has-js [data-r="zoom"]    { opacity: 0; transform: scale(1.06); }
html.has-js [data-r="mask"]    { clip-path: inset(0 0 105% 0); }
html.has-js [data-r="clip"]    { clip-path: inset(0 0 100% 0); }
html.has-js [data-r="clip-l"]  { clip-path: inset(0 100% 0 0); }
html.has-js [data-r="clip-r"]  { clip-path: inset(0 0 0 100%); }

html.has-js [data-r].is-in { opacity: 1; transform: none; will-change: auto; }
html.has-js [data-r="mask"].is-in,
html.has-js [data-r^="clip"].is-in { clip-path: inset(0 0 0 0); }
html.has-js [data-r].is-done { clip-path: none; }

/* 写真は幕が開きながら、わずかな寄りから元の位置に落ち着く */
html.has-js [data-r^="clip"] > img,
html.has-js [data-r^="clip"] > picture > img {
	transform: scale(1.08); transition: transform 1.6s var(--ease-soft) var(--rd, 0ms);
}
html.has-js [data-r^="clip"].is-in > img,
html.has-js [data-r^="clip"].is-in > picture > img { transform: none; }

/* 画像が動く箱ははみ出させない（レイアウトは変わらない） */
.fv__main, .fv__sub, .story__bg, .pickup__img, .sec-price__img,
.feature__img, .equip__img, .news-list__thumb, .tp-figure--wide,
.tp-feature__img, .page-hero__bg { overflow: hidden; }

/* ---------- FV の初回演出 ---------- */
html.has-js .fv__main, html.has-js .fv__sub {
	clip-path: inset(0 0 100% 0);
	transition: clip-path 1.25s var(--ease-out) var(--fvd, 0ms);
}
html.has-js .fv__main > picture > img, html.has-js .fv__sub > picture > img {
	transform: scale(1.09); transition: transform 1.9s var(--ease-soft) var(--fvd, 0ms);
}
html.has-js .fv__catch-line {
	clip-path: inset(0 0 104% 0);
	transition: clip-path 1s var(--ease-out) var(--fvd, 0ms);
}
html.has-js .fv__laurel {
	opacity: 0; transform: scale(.82) rotate(-10deg);
	transition: opacity .8s var(--ease-out) var(--fvd, 0ms), transform .9s var(--ease-out) var(--fvd, 0ms);
}
html.has-js .fv__badges li {
	opacity: 0; transform: translateY(1.6rem) scale(.92);
	transition: opacity .7s var(--ease-out) var(--fvd, 0ms), transform .7s var(--ease-out) var(--fvd, 0ms);
}
html.has-js .fv__lead, html.has-js .fv__cta {
	opacity: 0; transform: translateY(1.6rem);
	transition: opacity .8s var(--ease-out) var(--fvd, 0ms), transform .8s var(--ease-out) var(--fvd, 0ms);
}

html.has-js .fv__catch-line:nth-child(1) { --fvd: 340ms; }
html.has-js .fv__catch-line:nth-child(2) { --fvd: 460ms; }
html.has-js .fv__catch-line:nth-child(3) { --fvd: 580ms; }
html.has-js .fv__sub { --fvd: 300ms; }
html.has-js .fv__laurel { --fvd: 820ms; }
html.has-js .fv__badges li:nth-child(1) { --fvd: 940ms; }
html.has-js .fv__badges li:nth-child(2) { --fvd: 1030ms; }
html.has-js .fv__badges li:nth-child(3) { --fvd: 1120ms; }
html.has-js .fv__lead { --fvd: 1180ms; }
html.has-js .fv__cta { --fvd: 1260ms; }

html.has-js .fv.is-loaded .fv__main,
html.has-js .fv.is-loaded .fv__sub,
html.has-js .fv.is-loaded .fv__catch-line { clip-path: inset(0 0 0 0); }
html.has-js .fv.is-loaded .fv__main > picture > img,
html.has-js .fv.is-loaded .fv__sub > picture > img { transform: none; }
html.has-js .fv.is-loaded .fv__laurel,
html.has-js .fv.is-loaded .fv__badges li,
html.has-js .fv.is-loaded .fv__lead,
html.has-js .fv.is-loaded .fv__cta { opacity: 1; transform: none; }
html.has-js .fv.is-done .fv__main,
html.has-js .fv.is-done .fv__sub,
html.has-js .fv.is-done .fv__catch-line { clip-path: none; }

/* 開業年バッジはゆっくり漂わせる */
@keyframes fv-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-.9rem); } }
html.has-js .fv.is-done .fv__laurel { animation: fv-float 6.5s var(--ease-soft) infinite; }

/* =========================================================
   ホバー・フォーカスの挙動
   ========================================================= */
/* --- グローバルナビ：下線が左から伸びる --- */
.gnav__item > a { position: relative; transition: color .25s; }
/* ::after はメガメニューのドット表示に使われているので ::before を使う */
.gnav__item > a::before {
	content: ""; position: absolute; left: 0; right: 0; bottom: -.6rem; height: 1px;
	background: var(--gold); transform: scaleX(0); transform-origin: right;
	transition: transform .4s var(--ease-out);
}
.gnav__item > a:hover, .gnav__item > a:focus-visible { opacity: 1; color: var(--gold); }
.gnav__item > a:hover::before, .gnav__item > a:focus-visible::before,
.gnav__item.is-open > a::before { transform: scaleX(1); transform-origin: left; }

/* --- 丸ボタン／ピルボタン：わずかに浮かせて光を通す --- */
.btn-round, .btn-pill {
	position: relative; overflow: hidden;
	transition: transform .3s var(--ease-out), box-shadow .3s var(--ease-out), filter .2s;
}
.btn-round::after, .btn-pill::after {
	content: ""; position: absolute; top: 0; left: -60%; width: 45%; height: 100%;
	background: linear-gradient(100deg, rgba(255,255,255,0), rgba(255,255,255,.45), rgba(255,255,255,0));
	transform: skewX(-18deg); pointer-events: none;
}
.btn-round:hover, .btn-pill:hover { transform: translateY(-.3rem); box-shadow: 0 .8rem 2rem rgba(2, 36, 71, .22); }
.btn-round:hover::after, .btn-pill:hover::after { animation: btn-shine .75s var(--ease-out); }
@keyframes btn-shine { from { left: -60%; } to { left: 120%; } }

/* --- View More：矢印が少し先へ進む --- */
.more a { transition: color .25s var(--ease-out); }
.more a::after { transition: transform .35s var(--ease-out), right .35s var(--ease-out); }
.more a:hover { opacity: 1; color: var(--gold); }
.more a:hover::after { right: -.4rem; }
.more--light a:hover { color: #fff; opacity: .8; }

/* --- 診療案内アイコン：円が塗りつぶされアイコンが白抜きになる --- */
.treat-grid__item > a { transition: transform .35s var(--ease-out); }
.treat-grid__item > a:hover { opacity: 1; transform: translateY(-.8rem); }
.treat-grid__circle {
	transition: background-color .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.treat-grid__circle img { transition: filter .35s var(--ease-out), transform .45s var(--ease-out); }
.treat-grid__item > a:hover .treat-grid__circle {
	background: var(--navy); box-shadow: 0 1.2rem 2.6rem rgba(2, 36, 71, .22);
}
.treat-grid__item > a:hover .treat-grid__circle img { filter: brightness(0) invert(1); }
.treat-grid__label { transition: color .3s var(--ease-out); }
.treat-grid__item > a:hover .treat-grid__label { color: var(--gold); }

/* --- 8FEATURES / CASE / CLINIC カード --- */
.feature, .case, .equip__item { transition: transform .45s var(--ease-out); }
.feature__img img, .equip__img img { transition: transform .7s var(--ease-out); }
.feature:hover, .case:hover, .equip__item:hover { transform: translateY(-.7rem); }
.feature:hover .feature__img img, .equip__item:hover .equip__img img { transform: scale(1.05); }
.feature__num span, .equip__num span, .case__num span { transition: color .35s var(--ease-out); }
.feature:hover .feature__num span, .case:hover .case__num span { color: var(--gold); }
.feature__num::before, .feature__num::after,
.case__num::before, .case__num::after { transition: background-color .35s var(--ease-out); }
.feature:hover .feature__num::before, .feature:hover .feature__num::after,
.case:hover .case__num::before, .case:hover .case__num::after { background: var(--gold); }

/* --- PICK UP：写真がゆっくり寄る --- */
.pickup__img img { transition: transform .9s var(--ease-out); }
.pickup__link:hover .pickup__img img,
.pickup__link:focus-visible .pickup__img img { transform: scale(1.04); }
.pickup__panel { transition: background-color .4s var(--ease-out), box-shadow .4s var(--ease-out); }
.pickup__link:hover .pickup__panel,
.pickup__link:focus-visible .pickup__panel {
	background: rgba(255, 255, 255, .95); box-shadow: 0 1.4rem 3.6rem rgba(2, 36, 71, .14);
}
.pickup__link:hover .pickup__more,
.pickup__link:focus-visible .pickup__more { color: var(--gold); border-color: var(--gold); }
.pickup__link:hover .pickup__more::after,
.pickup__link:focus-visible .pickup__more::after { right: 0; }
.pickup__title { transition: color .3s var(--ease-out); }
.pickup__link:hover .pickup__title { color: var(--gold); }
.pickup__num { transition: color .3s var(--ease-out); }
.pickup__link:focus-visible { outline: 2px solid var(--gold); outline-offset: .4rem; }

/* --- FAQ --- */
.faq__item { transition: background-color .3s var(--ease-out); }
.faq__item:hover { background: rgba(255, 255, 255, .5); }
.faq__mark { transition: color .3s var(--ease-out); }
.faq__item:hover .faq__mark { color: var(--gold); }

/* --- Instagram --- */
.insta li a { position: relative; display: block; }
.insta li a::after {
	content: ""; position: absolute; inset: 0; background: rgba(2, 35, 71, .26);
	opacity: 0; transition: opacity .35s var(--ease-out);
}
.insta li img { transition: transform .7s var(--ease-out), opacity .3s; }
.insta li a:hover img { transform: scale(1.07); opacity: 1; }
.insta li a:hover::after { opacity: 1; }

/* --- NEWS / BLOG 一覧 --- */
.news-list__item > a { transition: color .3s var(--ease-out); }
.news-list__item > a:hover { opacity: 1; color: var(--gold); }
.news-list__thumb img { transition: transform .6s var(--ease-out); }
.news-list__item > a:hover .news-list__thumb img { transform: scale(1.07); }
.news-list__arrow { transition: transform .35s var(--ease-out), background-color .35s var(--ease-out); }
.news-list__item > a:hover .news-list__arrow { transform: translateX(.6rem); background: var(--gold); }

/* --- ホバーメニュー内の項目 --- */
.mega__item > a { transition: opacity .2s, transform .3s var(--ease-out), color .25s; }
.mega__item > a:hover { opacity: 1; transform: translateX(.4rem); color: var(--gold); }

/* --- フッターナビ・バナー --- */
.fnav a { transition: color .25s, opacity .25s; }
.fnav a:hover { opacity: 1; color: #fff; }
.fbanner a { transition: transform .35s var(--ease-out), opacity .25s, box-shadow .35s var(--ease-out); }
.fbanner a:hover { opacity: 1; transform: translateY(-.4rem); box-shadow: 0 1rem 2.4rem rgba(0, 0, 0, .3); }

/* --- 下層ページの共通パーツ --- */
.tp-figure--wide img, .tp-feature__img img { transition: transform .8s var(--ease-out); }
.tp-feature:hover .tp-feature__img img { transform: scale(1.04); }
.tp-toc__list a { transition: color .25s var(--ease-out); }
.tp-toc__list a:hover { opacity: 1; color: var(--gold); }
.tp-links__list a, .tp-pagelinks a {
	transition: background .3s var(--ease-out), color .3s var(--ease-out),
		transform .3s var(--ease-out), box-shadow .3s var(--ease-out);
}
.tp-links__list a:hover, .tp-pagelinks a:hover { box-shadow: 0 1rem 2.4rem rgba(2, 36, 71, .18); }
.tp-tbl__links a { transition: background .25s var(--ease-out), color .25s var(--ease-out), transform .25s var(--ease-out); }
.tp-tbl__links a:hover { transform: translateY(-.2rem); }

/* =========================================================
   医院紹介ドロップダウン（ヘッダー）
   ========================================================= */
.gnav__item--sub { position: relative; }
/* ホバーメニュー下の「症例一覧をみる」 */
.mega__more { margin-top: calc(18 * var(--hu)); text-align: center; }
.mega__more a {
	position: relative; display: inline-block; padding: 0 calc(26 * var(--hu)) calc(4 * var(--hu)) 0;
	font-size: calc(14 * var(--hu)); font-weight: 500; letter-spacing: .06em;
	border-bottom: 1px solid currentColor; transition: color .25s var(--ease-out);
}
.mega__more a::after {
	content: ""; position: absolute; right: calc(4 * var(--hu)); top: 50%;
	width: calc(6 * var(--hu)); height: calc(6 * var(--hu)); margin-top: calc(-5 * var(--hu));
	border-top: 1px solid currentColor; border-right: 1px solid currentColor;
	transform: rotate(45deg); transition: right .3s var(--ease-out);
}
.mega__more a:hover { color: var(--gold); }
.mega__more a:hover::after { right: 0; }
.subnav {
	position: absolute; left: 50%; top: 100%; z-index: 120;
	transform: translate(-50%, -.6rem); opacity: 0; visibility: hidden;
	margin-top: calc(18 * var(--hu));
	min-width: calc(180 * var(--hu)); padding: calc(8 * var(--hu)) 0;
	background: rgba(255, 255, 255, .97);
	box-shadow: 0 calc(8 * var(--hu)) calc(24 * var(--hu)) rgba(2, 36, 71, .16);
	transition: opacity .25s var(--ease-out), transform .25s var(--ease-out), visibility .25s;
}
.gnav__item--sub.is-open .subnav { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.subnav::before {
	content: ""; position: absolute; left: 0; right: 0; top: calc(-18 * var(--hu));
	height: calc(18 * var(--hu));
}
.subnav li + li { border-top: 1px solid rgba(2, 36, 71, .1); }
.subnav a {
	display: block; padding: calc(12 * var(--hu)) calc(20 * var(--hu));
	font-size: calc(13.5 * var(--hu)); font-weight: 500; line-height: 1.5; letter-spacing: .04em;
	white-space: nowrap; text-align: center; transition: background-color .25s, color .25s;
}
.subnav a:hover { background: var(--navy); color: #fff; }

/* =========================================================
   ヘッダーのスクロール量インジケーター
   ========================================================= */
.l-header__progress {
	position: absolute; left: 0; bottom: 0; height: 2px; width: 100%; z-index: 2;
	transform: scaleX(var(--p, 0)); transform-origin: left;
	background: linear-gradient(90deg, var(--gold), var(--blue));
	opacity: 0; transition: opacity .3s; pointer-events: none;
}
.l-header.is-fixed .l-header__progress { opacity: 1; }

/* =========================================================
   SP 追従予約バー（PCでは非表示）
   ========================================================= */
.spbar { display: none; }

/* =========================================================
   ページ上部へ戻るボタン
   ========================================================= */
.pagetop {
	position: fixed; right: 2.4rem; bottom: 2.4rem; z-index: 90;
	width: 5.4rem; height: 5.4rem; border: 0; border-radius: 50%; padding: 0;
	background: var(--navy); color: #fff; cursor: pointer;
	display: flex; align-items: center; justify-content: center;
	opacity: 0; visibility: hidden; transform: translateY(1.2rem);
	transition: opacity .35s var(--ease-out), transform .35s var(--ease-out),
		visibility .35s, background-color .3s;
	box-shadow: 0 .6rem 1.8rem rgba(2, 36, 71, .28);
}
.pagetop.is-shown { opacity: 1; visibility: visible; transform: none; }
.pagetop:hover { background: var(--gold); transform: translateY(-.4rem); }
.pagetop span {
	display: block; width: 1rem; height: 1rem; margin-top: .4rem;
	border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor;
	transform: rotate(-45deg);
}
@media (max-width: 767px) {
/* 電話番号は指で押しやすいよう、当たり判定を縦に広げる（SPのみ） */
.clinic-info__tel a { display: inline-block; padding: .7rem 0; }

/* ---------- SP 追従予約バー ---------- */
.spbar {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 95;
	display: grid; grid-template-columns: 1fr 1fr .8fr;
	background: var(--navy-deep);
	box-shadow: 0 -.4rem 1.6rem rgba(2, 35, 71, .28);
	padding-bottom: env(safe-area-inset-bottom);
	transform: translateY(101%);
	transition: transform .35s var(--ease-out);
}
.spbar.is-shown { transform: none; }
.spbar__item {
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	gap: .3rem; height: 6rem; color: #fff;
	font-size: 1.25rem; font-weight: 500; letter-spacing: .04em; line-height: 1;
}
.spbar__item + .spbar__item { border-left: 1px solid rgba(255, 255, 255, .18); }
.spbar__item svg { width: 2rem; height: 2rem; }
.spbar__item--tel { background: var(--blue); }
.spbar__item--web { background: var(--gold); }
.spbar__item--map { background: var(--navy-deep); }
.spbar__item:active { filter: brightness(.92); }
/* バーの分だけ足元に余白を作る（フッターが隠れないように） */
body { padding-bottom: 6rem; }
.pagetop { bottom: 7.4rem; }

	.subnav { display: none; }
	.pagetop { right: 1.4rem; bottom: 1.4rem; width: 4.4rem; height: 4.4rem; }
	.pagetop span { width: .8rem; height: .8rem; }
}

/* =========================================================
   動きを減らす設定のときは演出しない
   ========================================================= */
@media (prefers-reduced-motion: reduce) {
	html.has-js [data-r],
	html.has-js [data-r^="clip"] > img,
	html.has-js [data-r^="clip"] > picture > img,
	html.has-js .fv__catch-line,
	html.has-js .fv__main, html.has-js .fv__sub,
	html.has-js .fv__main > picture > img, html.has-js .fv__sub > picture > img,
	html.has-js .fv__laurel, html.has-js .fv__badges li,
	html.has-js .fv__lead, html.has-js .fv__cta {
		opacity: 1 !important; transform: none !important;
		clip-path: none !important; transition: none !important; animation: none !important;
	}
	html { scroll-behavior: auto; }
}