/* generated by tools/build_css.py — edit *.src.css */
/*
 * 木更津真舟くじら歯科 main.src.css
 * 数値は Figma（PC TOP 5016:636・幅 1440）の px で書き、tools/build_css.py で
 * calc(var(--u) * N) に変換して main.css を生成する。
 * 変換したくない値は大文字の px で書く（例: 1px の罫線）。
 */

:root {
  /* 1 デザイン px = 画面（スクロールバーを除いた body の幅）/ 1440。
     body をコンテナにして cqw で測るので横スクロールが出ない */
  --u: calc(100cqw / 1440);
  --navy: #1e5c85;
  --blue: #4e8eb7;
  --text: #5b5b5b;
  --gray: #747474;
  --line: #d8d8d8;
  --pale: #e2f3fd;
  --grad: linear-gradient(90deg, #4e8eb7 15%, #1e5c85 97%);
  --mincho: "Shippori Mincho", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif;
  --en: "Marcellus", "Shippori Mincho", serif;
  --serif: "Noto Serif JP", "Shippori Mincho", serif;
  --sans: "Noto Sans JP", sans-serif;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  container-type: inline-size;
  margin: 0;
  background: #fff;
  color: var(--text);
  font-family: var(--mincho);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.6;
  letter-spacing: 0.1em;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
  line-break: strict; /* 行頭に「っ」「ー」「ゃ」などの小さい仮名・長音を置かない */
}

h1, h2, h3, h4, p, ul, ol, dl, dd, figure, table { margin: 0; }
ul, ol { padding: 0; list-style: none; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
b, strong { font-weight: inherit; }
em { font-style: normal; }
small { font-size: inherit; }
table { border-collapse: collapse; border-spacing: 0; }
th { font-weight: inherit; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }

/* Figma のテキスト枠は上下トリム（キャップハイト〜ベースライン）なので揃える */
h1, h2, h3, p, li, a, span, dt, dd, th, td, time, small, b, em {
  text-box: trim-both cap alphabetic;
}
.p-reason__label, .p-reason__label * { text-box: normal; }

/* グラデーション文字。トリムで切れる字面の上下にも背景が届くよう、上下に余白を足して打ち消す */
.u-grad {
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  padding-block: 0.25em;
  margin-block: -0.25em;
}

.c-icon { display: block; flex: none; overflow: visible; }

/* picture は中の img をそのまま並べる（クラスは img に付けている） */
picture { display: contents; }
source { display: none; } /* picture を contents にすると source が並びの要素として数えられ、gap が増えるため */

/* SP だけの部品・改行（sp.src.css で表示する） */
br.sp, .l-header__burger, .l-drawer, .c-fixed-cta, .p-hero__news-more { display: none; }
.p-hero__news-list li:nth-child(n+2) { display: none; } /* PC の NEWS は最新 1 件 */
.c-name__txt, .p-clinic__icons { display: contents; }

/* ---------- 共通パーツ ---------- */

/* ロゴ（マークは未支給のため Figma どおりの丸） */
.c-logo {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 9);
}
.c-logo__mark {
  width: calc(var(--u) * 70);
  height: calc(var(--u) * 70);
  border-radius: 50%;
  background: #d9d9d9;
  flex: none;
}
.c-logo__text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(var(--u) * 16);
  width: calc(var(--u) * 280);
}
.c-logo__name {
  color: var(--navy);
  font-weight: 400;
  font-size: calc(var(--u) * 28);
  line-height: 1;
  letter-spacing: 0;
  white-space: nowrap;
}
.c-logo__en {
  color: var(--blue);
  font-family: var(--en);
  font-size: calc(var(--u) * 11);
  line-height: 1;
  letter-spacing: 0.1em;
  white-space: nowrap;
}

/* 見出し（日本語 60 + 英語 24。下揃え） */
.c-head {
  display: flex;
  align-items: flex-end;
  gap: calc(var(--u) * 30);
  font-weight: 500;
}
.c-head--center { justify-content: center; }
.c-head__ja {
  font-size: calc(var(--u) * 60);
  line-height: 1.45;
  letter-spacing: 0.1em;
  white-space: nowrap;
}
.c-head__en {
  font-family: var(--en);
  font-weight: 400;
  font-size: calc(var(--u) * 24);
  line-height: 1.5;
  letter-spacing: 0.1em;
  white-space: nowrap;
}

/* ボタン（260x60・紺・右に白丸の矢印） */
.c-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--u) * 10);
  width: calc(var(--u) * 260);
  height: calc(var(--u) * 60);
  border-radius: calc(var(--u) * 100);
  background: var(--navy);
  color: #fff;
  font-weight: 700;
  font-size: calc(var(--u) * 16);
  line-height: 1.8;
  letter-spacing: 0.1em;
  transition: opacity 0.2s;
}
.c-btn:hover { opacity: 0.8; }
.c-btn__en { font-family: var(--en); font-weight: 400; }
.c-btn__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--u) * 20);
  height: calc(var(--u) * 20);
  border-radius: 50%;
  background: #fff;
  color: var(--navy);
  flex: none;
}
.c-btn__arrow svg { width: calc(var(--u) * 4); height: calc(var(--u) * 8); overflow: visible; }
.c-btn--price { width: calc(var(--u) * 240); flex: none; }
.c-btn.p-hero__news-more { display: none; } /* PC の NEWS にボタンは無い（Figma 5016:930）。.c-btn の display より後に書く */

/* 院長の名前 */
.c-name {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 20);
  color: var(--blue);
}
.c-name__role {
  display: flex;
  align-items: center;
  height: calc(var(--u) * 32);
  padding: calc(var(--u) * 10) calc(calc(var(--u) * 10) - 0.1em) calc(var(--u) * 10) calc(var(--u) * 10);
  background: var(--blue);
  color: #fff;
  font-size: calc(var(--u) * 16);
  line-height: 1.6;
}
.c-name__ja { font-size: calc(var(--u) * 36); line-height: 1.6; }
.c-name__kana { font-size: calc(var(--u) * 16); line-height: 1.6; }

/* 枠付きの小見出し（経歴・所属学会） */
.c-tag {
  display: flex;
  align-items: center;
  width: fit-content;
  height: calc(var(--u) * 34);
  padding: calc(var(--u) * 10) calc(calc(var(--u) * 10) - 0.1em) calc(var(--u) * 10) calc(var(--u) * 10);
  border: 1px solid var(--blue);
  background: #fff;
  color: var(--blue);
  font-weight: 500;
  font-size: calc(var(--u) * 16);
  line-height: 1.6;
}

/* 駐車場・最寄り駅 */
.c-access {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 10);
  color: var(--navy);
}
.c-access__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--u) * 48);
  height: calc(var(--u) * 48);
  border: calc(var(--u) * 2) solid var(--blue);
  border-radius: calc(var(--u) * 4);
  color: var(--blue);
  flex: none;
}
.c-access__icon--p {
  font-family: var(--sans);
  font-weight: 900;
  font-size: calc(var(--u) * 34);
  line-height: 1;
  letter-spacing: 0;
}
.c-access__icon .c-icon--bus { width: calc(var(--u) * 24); height: calc(var(--u) * 28.5); }
.c-access__text {
  font-size: calc(var(--u) * 16);
  line-height: 1.6;
  letter-spacing: 0;
  white-space: nowrap;
}

/* ---------- ヘッダー（5016:658〜947） ---------- */
.l-header {
  position: relative;
  z-index: 10;
  height: calc(var(--u) * 130);
  background: #fff;
}
.l-header__logo-wrap { position: absolute; left: calc(var(--u) * 30); top: calc(var(--u) * 34); font-size: inherit; font-weight: inherit; }
.l-header__cta {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  gap: calc(var(--u) * 4);
}
.l-header__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--u) * 10);
  width: calc(var(--u) * 200);
  height: calc(var(--u) * 52);
  border-radius: 0 0 calc(var(--u) * 20) calc(var(--u) * 20);
  color: #fff;
  font-size: calc(var(--u) * 16);
  line-height: 1;
  transition: opacity 0.2s;
}
.l-header__btn[href]:hover { opacity: 0.85; }
.l-header__btn--tel {
  background: var(--navy);
  font-family: var(--en);
  letter-spacing: 0.1em;
}
.l-header__btn--tel .c-icon { width: calc(var(--u) * 15.17); height: calc(var(--u) * 15.86); color: #fff; }
.l-header__btn--web {
  background: var(--blue);
  letter-spacing: 0.2em;
}
.l-header__btn--web .c-icon { width: calc(var(--u) * 15.64); height: calc(var(--u) * 12.29); }
.l-header__nav {
  position: absolute;
  top: calc(var(--u) * 80);
  left: calc(var(--u) * 670);
}
.l-header__nav ul {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 30);
  height: calc(var(--u) * 24);
}
.l-header__nav a {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 10);
  font-size: calc(var(--u) * 16);
  line-height: 1;
  letter-spacing: 0.1em;
  white-space: nowrap;
  transition: color 0.2s;
}
.l-header__nav a[href]:hover { color: var(--blue); }
.l-header__nav .c-icon--down { width: calc(var(--u) * 16); height: calc(var(--u) * 8); color: var(--blue); }
.l-header__insta img { width: calc(var(--u) * 24); height: calc(var(--u) * 24); }
.l-header__nav .has-child .c-icon--down { transition: transform 0.2s; }
.l-header__nav .has-child[aria-expanded="true"] { color: var(--blue); }
.l-header__nav .has-child[aria-expanded="true"] .c-icon--down { transform: rotate(180deg); }

/* ---------- 診療案内のホバーメニュー（Figma KV2 5016:3224） ---------- */
.l-mega {
  position: absolute;
  top: calc(var(--u) * 130);
  left: calc(var(--u) * 80);
  width: calc(var(--u) * 1280);
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 40);
  padding: 0 calc(var(--u) * 80) calc(var(--u) * 60);
  background: rgba(30, 92, 133, 0.9);
  border-radius: 0 0 0 calc(var(--u) * 200);
  color: #fff;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s, visibility 0.25s;
}
.l-mega.is-open { opacity: 1; visibility: visible; }
.l-mega__title {
  display: flex;
  align-items: flex-end;
  gap: calc(var(--u) * 10);
  width: calc(var(--u) * 215);
  height: calc(var(--u) * 55);
  padding: calc(var(--u) * 20);
  background: #fff;
  font-size: calc(var(--u) * 20);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.1em;
}
.l-mega__title span { flex: none; }
.l-mega__en { font-family: var(--en); font-size: calc(var(--u) * 16); font-weight: 400; }
.l-mega__cols { display: flex; }
.l-mega__col {
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 30);
  width: calc(var(--u) * 280);
}
.l-mega__link {
  display: flex;
  align-items: flex-start;
  font-size: calc(var(--u) * 20);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.1em;
  transition: opacity 0.2s;
}
.l-mega__link:hover { opacity: 0.7; }
.l-mega__dot { flex: none; width: calc(var(--u) * 20); letter-spacing: 0; }
.l-mega__link--child { align-items: flex-end; padding-left: calc(var(--u) * 10); }
.l-mega__link--child .l-mega__dot { width: calc(var(--u) * 16); }
.l-mega__link--child span:last-child { font-size: calc(var(--u) * 16); font-weight: 500; }

/* ---------- ヒーロー（5016:637〜652・NEWS 5016:930） ---------- */
/* 写真の高さは画面の高さに合わせる（ヘッダー込みで画面に収まる・440〜900） */
.p-hero {
  --kv-h: clamp(calc(var(--u) * 440), calc(100svh - calc(var(--u) * 130)), calc(var(--u) * 900)); /* 下限 440 は横長・低い画面（2560x1080 など）でも収まる値 */
  position: relative;
  height: calc(var(--kv-h) + calc(var(--u) * 283));
}
.p-hero__band {
  position: absolute;
  left: 0;
  top: calc(var(--kv-h) - calc(var(--u) * 288));
  width: 100%;
  height: calc(var(--u) * 571);
  background: var(--pale);
  border-radius: 0 0 calc(var(--u) * 320) 0;
}
.p-hero__visual {
  position: absolute;
  top: 0;
  left: calc(var(--u) * 100);
  width: calc(var(--u) * 1340);
  height: var(--kv-h);
  border-radius: calc(var(--u) * 320) 0 0 0;
  overflow: hidden;
}
.p-hero__slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1.6s ease;
}
.p-hero__slide.is-active { opacity: 1; }
.p-hero__over {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: var(--kv-h);
  pointer-events: none;
}
.p-hero__catch {
  position: absolute;
  left: calc(var(--u) * 80);
  bottom: calc(var(--u) * 72);
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 10);
}
.p-hero__catch > span {
  display: block;
  width: fit-content;
  padding: calc(var(--u) * 10) calc(calc(var(--u) * 10) - 0.1em) calc(var(--u) * 10) calc(var(--u) * 10);
  background: var(--navy);
  color: #fff;
  font-size: calc(var(--u) * 60);
  line-height: 1;
  letter-spacing: 0.1em;
  white-space: nowrap;
}
.p-hero__catch .is-split > span { display: inline; }
.p-hero__bubble { position: absolute; }
.p-hero__bubble img { width: 100%; height: auto; }
.p-hero__bubble--01 { left: calc(var(--u) * 829); bottom: calc(var(--u) * 92); width: calc(var(--u) * 262); }
.p-hero__bubble--02 { left: calc(var(--u) * 1081); bottom: calc(var(--u) * 161); width: calc(var(--u) * 268); }
.p-hero__bubble--03 { left: calc(var(--u) * 993); bottom: calc(var(--u) * -27); width: calc(var(--u) * 258); }

.p-hero__news {
  position: absolute;
  left: calc(var(--u) * 226);
  top: calc(var(--kv-h) + calc(var(--u) * 66));
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 60);
  width: calc(var(--u) * 989);
  height: calc(var(--u) * 127);
}
.p-hero__news-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(var(--u) * 30);
  width: calc(var(--u) * 265);
  font-weight: 500;
}
.p-hero__news-en {
  font-family: var(--en);
  font-weight: 400;
  font-size: calc(var(--u) * 60);
  line-height: 1.2;
  letter-spacing: 0.1em;
}
.p-hero__news-ja {
  font-size: calc(var(--u) * 20);
  line-height: 1.45;
  letter-spacing: 0.1em;
}
.p-hero__news-item {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 20);
  width: calc(var(--u) * 664);
  padding: calc(var(--u) * 20) 0;
}
.p-hero__news-thumb {
  width: calc(var(--u) * 120);
  height: calc(var(--u) * 70);
  background: rgba(182, 182, 182, 0.2);
  flex: none;
  overflow: hidden;
}
.p-hero__news-thumb img { width: 100%; height: 100%; object-fit: cover; }
.p-hero__news-text {
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 16);
  width: calc(var(--u) * 500);
  margin-right: calc(var(--u) * 16);
}
.p-hero__news-text time {
  color: #aeaeae;
  font-family: var(--en);
  font-size: calc(var(--u) * 14);
  line-height: 1.7;
  letter-spacing: 0.1em;
}
.p-hero__news-title {
  overflow: hidden;
  padding-block: 0.3em; /* 上下トリムした枠を overflow: hidden で切ると字の上下が欠けるので、余白を足して打ち消す */
  margin-block: -0.3em;
  font-size: calc(var(--u) * 16);
  line-height: 1.7;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.p-hero__news-item .c-icon--arrow { width: calc(var(--u) * 8); height: calc(var(--u) * 15); color: var(--blue); }
a.p-hero__news-item:hover .p-hero__news-title { color: var(--blue); }

/* ---------- 当院について（5016:859） ---------- */
.p-about {
  display: flex;
  gap: calc(var(--u) * 60);
  padding: calc(var(--u) * 140) 0;
}
.p-about__img {
  width: calc(var(--u) * 511);
  height: calc(var(--u) * 636);
  object-fit: cover;
  border-radius: 0 calc(var(--u) * 60) calc(var(--u) * 60) 0;
  flex: none;
}
.p-about__body { width: calc(var(--u) * 761); }
.p-about__list { margin-top: calc(var(--u) * 60); }
.p-about__list li {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 18);
  height: calc(var(--u) * 76);
  padding: 0 calc(var(--u) * 10);
  color: var(--gray);
  font-size: calc(var(--u) * 24);
  line-height: 1.5;
  white-space: nowrap;
}
.p-about__list li::before {
  content: "";
  width: calc(var(--u) * 24);
  height: calc(var(--u) * 24);
  background: url(../img/bullet.png) center / contain no-repeat;
  flex: none;
}
.p-about__list b { color: var(--blue); font-weight: 800; }
.p-about__list em { font-weight: 600; }

/* ---------- 予約（5016:841 / 1406） ---------- */
.p-reserve {
  height: calc(var(--u) * 442);
  padding-top: calc(var(--u) * 80);
  background: var(--navy) url(../img/reserve-bg.webp) center / cover no-repeat;
  text-align: center;
}
.p-reserve__title {
  color: #fff;
  font-family: var(--en);
  font-size: calc(var(--u) * 60);
  line-height: 1.2;
  letter-spacing: 0.1em;
}
.p-reserve__cards {
  display: flex;
  justify-content: center;
  gap: calc(var(--u) * 15);
  margin-top: calc(var(--u) * 40);
}
.p-reserve__card {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  width: calc(var(--u) * 530);
  height: calc(var(--u) * 200);
  border-radius: calc(var(--u) * 60) calc(var(--u) * 60) 0 0;
  background: #fff;
  color: var(--navy);
  transition: opacity 0.2s;
}
.p-reserve__card[href]:hover { opacity: 0.9; }
.p-reserve__inner {
  display: flex;
  align-items: center;
}
.p-reserve__card--tel .p-reserve__inner { width: calc(var(--u) * 429); height: calc(var(--u) * 172); }
.p-reserve__card--web .p-reserve__inner { width: calc(var(--u) * 393); height: calc(var(--u) * 171); justify-content: space-between; }
.p-reserve__illust { align-self: flex-end; flex: none; }
.p-reserve__card--tel .p-reserve__illust { width: calc(var(--u) * 160); height: calc(var(--u) * 172); }
.p-reserve__card--web .p-reserve__illust { width: calc(var(--u) * 123); height: calc(var(--u) * 171); }
.p-reserve__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(var(--u) * 20);
  padding-bottom: calc(var(--u) * 30);
}
.p-reserve__card--tel .p-reserve__body { width: calc(var(--u) * 269); }
.p-reserve__card--web .p-reserve__body { width: calc(var(--u) * 231); }
.p-reserve__circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--u) * 60);
  height: calc(var(--u) * 60);
  border-radius: 50%;
  background: #92b9d2;
  color: #fff;
}
.p-reserve__circle .c-icon--tel-lg { width: calc(var(--u) * 23); height: calc(var(--u) * 24); }
.p-reserve__circle .c-icon--mail-lg { width: calc(var(--u) * 23.27); height: calc(var(--u) * 18.29); }
.p-reserve__tel {
  font-family: var(--en);
  font-size: calc(var(--u) * 32);
  line-height: 1.5;
  letter-spacing: 0.1em;
  white-space: nowrap;
}
.p-reserve__label {
  font-weight: 700;
  font-size: calc(var(--u) * 16);
  line-height: 1.5;
}
.p-reserve__web {
  font-weight: 600;
  font-size: calc(var(--u) * 28);
  line-height: 1.5;
  white-space: nowrap;
}

/* ---------- お悩み（5016:887・写真 5016:656・メッセージ 5016:948） ---------- */
.p-concerns {
  position: relative;
  height: calc(var(--u) * 1114);
  padding-top: calc(var(--u) * 140);
}
.p-concerns::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(var(--u) * 307);
  background: linear-gradient(180deg, #e4f5ff, #fff);
}
.p-concerns__title {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(var(--u) * 10);
  font-weight: 500;
}
.p-concerns__title > span {
  display: block;
  padding: calc(var(--u) * 10) calc(calc(var(--u) * 10) - 0.1em) calc(var(--u) * 10) calc(var(--u) * 10);
  background: var(--blue);
  color: #fff;
  font-size: calc(var(--u) * 48);
  line-height: 1;
  letter-spacing: 0.1em;
  white-space: nowrap;
}
.p-concerns__title .is-split > span { display: inline; }
.p-concerns__list {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, calc(var(--u) * 410));
  gap: calc(var(--u) * 23) calc(var(--u) * 25);
  width: calc(var(--u) * 1280);
  margin: calc(var(--u) * 60) auto 0;
}
.p-concerns__list li {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 14);
  height: calc(var(--u) * 90);
  padding: 0 calc(var(--u) * 20);
  border-radius: calc(var(--u) * 10);
  background: #e6eff4;
  font-size: calc(var(--u) * 20);
  line-height: 1.6;
}
.p-concerns__check {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--u) * 28);
  height: calc(var(--u) * 28);
  border-radius: calc(var(--u) * 4);
  background: #fff;
  color: #aeaeae;
  flex: none;
}
.p-concerns__check .c-icon { width: calc(var(--u) * 16); height: calc(var(--u) * 11); }
.p-concerns__photo {
  position: absolute;
  top: calc(var(--u) * 558);
  left: 0;
  width: calc(var(--u) * 1440);
  height: calc(var(--u) * 556);
  max-width: none;
}
.p-concerns__msg {
  position: absolute;
  top: calc(var(--u) * 852);
  left: 0;
  width: 100%;
  color: #fff;
  font-weight: 700;
  font-size: calc(var(--u) * 30);
  line-height: 1.8;
  letter-spacing: 0.1em;
  text-align: center;
}

/* ---------- 医院案内（5016:949 / 1121） ---------- */
.p-clinic { padding: calc(var(--u) * 140) calc(var(--u) * 110); }
.p-clinic__inner {
  display: flex;
  align-items: flex-end;
  gap: calc(var(--u) * 101);
}
.p-clinic__main { width: calc(var(--u) * 539); flex: none; }
.p-clinic__table { margin-top: calc(var(--u) * 60); }
.p-clinic__row { display: flex; gap: calc(var(--u) * 6); }
.p-clinic__row dt,
.p-clinic__row dd {
  display: flex;
  align-items: center;
  padding: calc(var(--u) * 18) calc(var(--u) * 10) calc(calc(var(--u) * 18) - 1px); /* Figma は罫線を枠の内側に含む */
  border-bottom: 1px solid var(--line);
  font-size: calc(var(--u) * 18);
  line-height: 1.6;
}
.p-clinic__row dt { width: calc(var(--u) * 110); flex: none; }
.p-clinic__row dd { width: calc(var(--u) * 420); display: block; }
.p-clinic__row--tel dd { color: var(--navy); font-size: calc(var(--u) * 29); white-space: nowrap; }
.p-clinic__hours { margin-top: calc(var(--u) * 30); }
.p-clinic__time { width: calc(var(--u) * 539); }
.p-clinic__time tr {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 17.02);
  height: calc(var(--u) * 60);
  padding: 0 calc(var(--u) * 20) 0 calc(var(--u) * 10);
  border-bottom: 1px solid var(--line);
  background: #fff;
}
.p-clinic__time thead tr {
  height: calc(var(--u) * 61);
  border-bottom: 0;
  background: #80a3ba;
  color: #fff;
}
.p-clinic__time th:first-child {
  width: calc(var(--u) * 120);
  text-align: center;
  font-size: calc(var(--u) * 16);
  line-height: 1.3;
}
.p-clinic__time thead th:first-child { font-size: calc(var(--u) * 18); }
.p-clinic__time th:not(:first-child),
.p-clinic__time td {
  width: calc(var(--u) * 32);
  margin-left: calc(var(--u) * 6.98); /* 曜日どうしの間隔 24（行の gap 17.02 との差） */
  text-align: center;
  font-size: calc(var(--u) * 16);
  line-height: 1.8;
  letter-spacing: 0.08em;
}
.p-clinic__time th:nth-child(2),
.p-clinic__time td:nth-child(2) { margin-left: 0; }
.p-clinic__time td { color: var(--blue); font-family: var(--sans); font-weight: 400; }
.p-clinic__note {
  margin-top: calc(var(--u) * 20);
  color: var(--blue);
  font-size: calc(var(--u) * 18);
  line-height: 1.6;
}
.p-clinic__cal {
  display: flex;
  gap: calc(var(--u) * 28);
  margin-top: calc(var(--u) * 30);
}

/* カレンダー */
.c-cal { width: calc(var(--u) * 308); flex: none; }
.c-cal__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: calc(var(--u) * 280);
  height: calc(var(--u) * 16);
}
.c-cal__title { font-size: calc(var(--u) * 18); line-height: 1.6; }
.c-cal__nav { display: flex; gap: calc(var(--u) * 23); }
.c-cal__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--u) * 16);
  height: calc(var(--u) * 16);
  margin: 0 calc(var(--u) * -4);
  color: var(--blue);
}
.c-cal__btn:disabled { opacity: 0.3; cursor: default; }
.c-cal__btn .c-icon { width: calc(var(--u) * 8); height: calc(var(--u) * 16); }
.c-cal__grid {
  width: calc(var(--u) * 308);
  margin-top: calc(calc(var(--u) * 10) - 1px);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
  table-layout: fixed;
}
.c-cal__grid th,
.c-cal__grid td {
  width: calc(var(--u) * 44);
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  text-align: center;
  vertical-align: top;
  font-size: calc(var(--u) * 16);
  line-height: 1.1;
  letter-spacing: 0.1em;
}
.c-cal__grid th {
  height: calc(var(--u) * 30);
  padding-top: calc(var(--u) * 9);
  background: #d8efff;
  font-weight: 800;
}
.c-cal__grid th.is-sun { color: #ca0000; }
.c-cal__grid th.is-sat { color: var(--navy); }
.c-cal__grid td { height: calc(var(--u) * 48); padding-top: calc(var(--u) * 7); }
.c-cal__grid td.is-empty { background: #f1f9ff; }
.c-cal__grid td.is-closed { background: #ebebeb; color: #a9a9a9; }
.c-cal__grid td span { display: block; }

.p-clinic__legend { width: calc(var(--u) * 211); padding-top: calc(var(--u) * 20); flex: none; } /* Figma も親の幅 539 を calc(var(--u) * 8) はみ出している */
.p-clinic__legend ul { display: flex; flex-direction: column; gap: calc(var(--u) * 19); }
.p-clinic__legend li {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 9);
  font-size: calc(var(--u) * 16);
  line-height: 1.6;
  letter-spacing: 0;
  white-space: nowrap;
}
.p-clinic__legend .is-dot {
  width: calc(var(--u) * 16);
  color: var(--blue);
  font-family: var(--sans);
  font-weight: 400;
  text-align: center;
  line-height: 1.8;
}
.p-clinic__legend .is-box {
  width: calc(var(--u) * 16);
  height: calc(var(--u) * 16);
  border: 1px solid var(--line);
  background: #ebebeb;
}
.p-clinic__legend p {
  margin-top: calc(var(--u) * 30);
  color: var(--navy);
  font-size: calc(var(--u) * 16);
  line-height: 1.6;
  letter-spacing: 0;
}

.p-clinic__side { width: calc(var(--u) * 600); flex: none; }
.p-clinic__map { width: calc(var(--u) * 600); height: calc(var(--u) * 678); object-fit: cover; background: #d9d9d9; }
.p-clinic__access {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 30);
  height: calc(var(--u) * 60);
  margin-top: calc(var(--u) * 20);
}

/* ---------- ごあいさつ（5016:686） ---------- */
.p-greeting {
  padding-top: calc(var(--u) * 140);
  background: linear-gradient(180deg, #ecf8ff 2%, rgba(255, 255, 255, 0) 100%);
}
.p-greeting__inner { display: flex; gap: calc(var(--u) * 80); }
.p-greeting__img {
  width: calc(var(--u) * 600);
  height: calc(var(--u) * 832);
  object-fit: cover;
  border-radius: 0 calc(var(--u) * 200) 0 0;
  flex: none;
}
.p-greeting__body { width: calc(var(--u) * 600); }
.p-greeting__catch {
  margin-top: calc(var(--u) * 100);
  color: var(--blue);
  font-size: calc(var(--u) * 36);
  line-height: 1.6;
}
.p-greeting__text {
  margin-top: calc(var(--u) * 60);
  font-size: calc(var(--u) * 18);
  line-height: 2;
}
.p-greeting .c-name { margin-top: calc(var(--u) * 60); }

/* ---------- 選ばれる理由（5016:654・5016:1293〜1343） ---------- */
.p-reason {
  position: relative;
  padding: calc(var(--u) * 140) 0 calc(var(--u) * 171);
  background: url(../img/reason-bg.webp) center top / cover no-repeat;
}
/* 縦の見出し。Figma は 1 文字ずつ折り返した横書きなので同じ組み方にする */
.p-reason__label {
  position: absolute;
  top: 0;
  left: calc(var(--u) * 1138);
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-start;
  gap: calc(var(--u) * 10);
  color: var(--navy);
  font-family: var(--serif);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.2;
  text-align: center;
}
.p-reason__label-sub {
  width: calc(var(--u) * 50);
  padding: calc(var(--u) * 10);
  background: #fff;
  font-size: calc(var(--u) * 30);
}
.p-reason__label-main {
  display: flex;
  flex-direction: column;
  width: calc(var(--u) * 90);
  padding: 0 calc(var(--u) * 10);
  background: #fff;
}
.p-reason__label-main .is-md { font-size: calc(var(--u) * 46); }
.p-reason__label-main .is-lg { margin: 0 calc(var(--u) * -5); font-size: calc(var(--u) * 80); } /* 枠 70 より字が大きいので左右にはみ出させて中央に置く */
.p-reason__label-sub,
.p-reason__label-main span { word-break: break-all; }
.p-reason__en {
  width: calc(var(--u) * 953);
  margin-left: calc(var(--u) * 100);
  color: #fff;
  font-family: var(--en);
  font-size: calc(var(--u) * 200);
  line-height: 1.2;
  letter-spacing: 0.2em;
  text-align: center;
}
.p-reason__item {
  display: flex;
  width: calc(var(--u) * 1250);
  margin-top: calc(var(--u) * 60);
}
.p-reason__item--001 { margin-top: calc(var(--u) * 100); }
.p-reason__item--001,
.p-reason__item--003 { margin-left: calc(var(--u) * 190); }
.p-reason__item--002,
.p-reason__item--004 { flex-direction: row-reverse; }
.p-reason__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(var(--u) * 40);
  width: calc(var(--u) * 600);
  padding: calc(var(--u) * 60);
  background: #fff;
  border-radius: calc(var(--u) * 100) 0 0 0;
  flex: none;
}
.p-reason__item--002 .p-reason__card,
.p-reason__item--004 .p-reason__card { border-radius: 0 calc(var(--u) * 100) 0 0; }
.p-reason__img { width: calc(var(--u) * 650); height: auto; object-fit: cover; flex: none; }
.p-reason__num {
  color: var(--navy);
  font-family: var(--en);
  font-size: calc(var(--u) * 20);
  line-height: 1.2;
  letter-spacing: 0.2em;
}
.p-reason__title {
  width: 100%;
  padding-bottom: calc(var(--u) * 20);
  border-bottom: 1px solid var(--blue);
  color: var(--blue);
  font-weight: 500;
  font-size: calc(var(--u) * 30);
  line-height: 1.6;
}
.p-reason__title span { display: block; }
.p-reason__text { font-size: calc(var(--u) * 18); line-height: 2; }

/* ---------- 院長紹介（5016:701） ---------- */
.p-doctor {
  padding-top: calc(var(--u) * 140);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0), #ecf8ff 99%);
}
.p-doctor__inner {
  display: flex;
  align-items: flex-end;
  gap: calc(var(--u) * 80);
  margin-left: calc(var(--u) * 160);
}
.p-doctor__body { width: calc(var(--u) * 600); padding-bottom: calc(var(--u) * 140); flex: none; }
.p-doctor__body .c-name { margin-top: calc(var(--u) * 100); }
.p-doctor__text { margin-top: calc(var(--u) * 60); font-size: calc(var(--u) * 18); line-height: 2; }
.p-doctor__body .c-tag { margin-top: calc(var(--u) * 60); }
.p-doctor__career { width: calc(var(--u) * 600); margin-top: calc(var(--u) * 20); }
.p-doctor__career tr { display: flex; gap: calc(var(--u) * 6); }
.p-doctor__career th,
.p-doctor__career td {
  display: flex;
  align-items: center;
  height: calc(var(--u) * 40);
  padding: 0 calc(var(--u) * 10);
  border-bottom: 1px solid var(--line);
  text-align: left;
  font-size: calc(var(--u) * 16);
  line-height: 1.6;
  white-space: nowrap;
}
.p-doctor__career th { width: calc(var(--u) * 150); }
.p-doctor__career td { width: calc(var(--u) * 444); }
.p-doctor__society {
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--u) * 20);
  margin-top: calc(var(--u) * 20);
  font-size: calc(var(--u) * 16);
  line-height: 2;
}
.p-doctor__society li::before { content: "・"; }
.p-doctor__img {
  width: calc(var(--u) * 600);
  height: calc(var(--u) * 919);
  object-fit: cover;
  border-radius: calc(var(--u) * 200) 0 0 0;
  flex: none;
}

/* ---------- 診療案内（5016:762） ---------- */
.p-medical { padding: calc(var(--u) * 140) calc(var(--u) * 80); }
.p-medical__list {
  display: grid;
  grid-template-columns: repeat(4, calc(var(--u) * 304.3));
  gap: calc(var(--u) * 20) calc(var(--u) * 21);
  margin-top: calc(var(--u) * 60);
}
.p-medical__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(var(--u) * 40);
  height: calc(var(--u) * 261);
  padding: calc(var(--u) * 60) 0 calc(var(--u) * 40);
  border: 1px solid var(--blue);
  border-radius: calc(var(--u) * 30);
  background: var(--blue);
  color: #fff;
  text-align: center;
  transition: background-color 0.2s, color 0.2s;
}
.p-medical__card.is-2line { gap: calc(var(--u) * 30); }
.p-medical__card:hover { background: #3f7aa1; }
.p-medical__name { display: flex; flex-direction: column; align-items: center; gap: calc(var(--u) * 20); }
.p-medical__ja { font-size: calc(var(--u) * 26); line-height: 1.45; letter-spacing: 0.1em; }
.p-medical__en {
  font-family: var(--en);
  font-size: calc(var(--u) * 14);
  line-height: 1.5;
  letter-spacing: 0.1em;
  white-space: nowrap;
}
.p-medical__pill {
  display: flex;
  align-items: center;
  height: calc(var(--u) * 32);
  padding: 0 calc(calc(var(--u) * 10) - 0.1em) 0 calc(var(--u) * 10);
  border-radius: calc(var(--u) * 100);
  background: #fff;
  color: var(--blue);
  font-size: calc(var(--u) * 16);
  line-height: 1;
  white-space: nowrap;
}
.p-medical__price {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 20);
  width: calc(var(--u) * 880);
  margin: calc(var(--u) * 60) auto 0;
  padding: calc(var(--u) * 60);
  background: #f3f3f3;
}
.p-medical__price p {
  width: calc(var(--u) * 500);
  color: var(--navy);
  font-weight: 700;
  font-size: calc(var(--u) * 24);
  line-height: 1.8;
}

/* ---------- 当院が得意とする治療（5016:653・1344〜1404） ---------- */
.p-treat {
  position: relative;
  padding: calc(var(--u) * 140) 0 calc(var(--u) * 134);
  background: var(--pale);
}
/* 縦の「TREATMENT」（Figma は -90° 回転・描画範囲 1248〜1393 / 11280〜） */
.p-treat__en {
  position: absolute;
  top: calc(var(--u) * -11);
  left: calc(var(--u) * 1393);
  color: #fff;
  font-family: var(--en);
  font-size: calc(var(--u) * 200);
  line-height: 1;
  letter-spacing: 0.1em;
  white-space: nowrap;
  transform: rotate(90deg);
  transform-origin: 0 0;
  pointer-events: none;
}
.p-treat__title {
  width: fit-content;
  margin-left: calc(var(--u) * 100);
  font-weight: 500;
  font-size: calc(var(--u) * 60);
  line-height: 1.45;
  letter-spacing: 0.1em;
}
.p-treat__item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: calc(var(--u) * 60);
  margin-top: calc(var(--u) * 99);
}
.p-treat__item--01 { margin-top: calc(var(--u) * 100); }
.p-treat__item--04 { margin-top: calc(var(--u) * 100); }
.p-treat__item--02 { flex-direction: row-reverse; justify-content: flex-end; margin-left: calc(var(--u) * 80); }
.p-treat__item--04 { flex-direction: row-reverse; justify-content: flex-end; margin-left: calc(var(--u) * 250); }
.p-treat__img {
  width: calc(var(--u) * 650);
  height: calc(var(--u) * 457);
  object-fit: cover;
  border-radius: 0 calc(var(--u) * 100) 0 0;
  flex: none;
}
.p-treat__item--02 .p-treat__img { width: calc(var(--u) * 570); height: calc(var(--u) * 495); border-radius: calc(var(--u) * 100) 0 0 0; }
.p-treat__item--04 .p-treat__img { height: calc(var(--u) * 421); border-radius: calc(var(--u) * 100) 0 0 0; }
.p-treat__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(var(--u) * 40);
  width: calc(var(--u) * 480);
  flex: none;
}
.p-treat__num {
  color: #a8cbe2;
  font-family: var(--en);
  font-size: calc(var(--u) * 100);
  line-height: 1.2;
  letter-spacing: 0.2em;
}
.p-treat__head {
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 20);
  width: 100%;
  padding-bottom: calc(var(--u) * 20);
  border-bottom: 1px solid var(--blue);
  font-weight: 500;
}
.p-treat__sub { font-size: calc(var(--u) * 24); line-height: 1.6; }
.p-treat__main { color: var(--blue); font-weight: 800; font-size: calc(var(--u) * 36); line-height: 1.6; }
.p-treat__text { font-size: calc(var(--u) * 18); line-height: 2; }

/* ---------- フッター（5016:1424〜1534） ---------- */
.l-footer { padding-top: calc(var(--u) * 60); }
.l-footer__inner {
  display: flex;
  align-items: flex-start;
  gap: calc(var(--u) * 60);
  margin: 0 calc(var(--u) * 80);
}
.l-footer__info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(var(--u) * 25);
  width: calc(var(--u) * 522);
  padding: calc(var(--u) * 40) calc(var(--u) * 60);
  border: 1px solid var(--blue);
  flex: none;
}
.l-footer__logo { width: calc(var(--u) * 400); height: calc(var(--u) * 70); padding: 0 calc(var(--u) * 20); }
.l-footer__address {
  width: calc(var(--u) * 400);
  padding: 0 calc(var(--u) * 20);
  font-size: calc(var(--u) * 14);
  line-height: 1.6;
  white-space: nowrap;
}
.l-footer__access {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--u) * 30);
  width: calc(var(--u) * 400);
  height: calc(var(--u) * 90);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.l-footer__tel {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 10);
  color: var(--navy);
}
.l-footer__tel-label {
  display: flex;
  align-items: center;
  height: calc(var(--u) * 33);
  padding: 0 calc(calc(var(--u) * 10) - 0.1em) 0 calc(var(--u) * 10);
  background: var(--navy);
  color: #fff;
  font-size: calc(var(--u) * 18);
  line-height: 1;
}
.l-footer__tel-num { font-size: calc(var(--u) * 29); line-height: 1.6; white-space: nowrap; }
.l-footer__hours {
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 18);
  width: calc(var(--u) * 400);
  padding: calc(var(--u) * 20);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  font-size: calc(var(--u) * 16);
  line-height: 1.6;
  white-space: nowrap;
}
.l-footer__hours .is-sm { font-size: calc(var(--u) * 14); }
.l-footer__sns { display: flex; gap: calc(var(--u) * 30); }
.l-footer__sns a { display: flex; align-items: center; gap: calc(var(--u) * 7); }
.l-footer__sns img { width: calc(var(--u) * 40); height: calc(var(--u) * 40); }
.l-footer__sns a > span { display: flex; flex-direction: column; gap: calc(var(--u) * 9); }
.l-footer__sns .is-name { font-size: calc(var(--u) * 16); line-height: 1.6; }
.l-footer__sns .is-sub { font-size: calc(var(--u) * 11); line-height: 1.6; }
.l-footer__nav { display: flex; flex-direction: column; gap: calc(var(--u) * 40); width: calc(var(--u) * 642); }
.l-footer__group--clinic { width: calc(var(--u) * 537); }
.l-footer__head {
  display: flex;
  align-items: center;
  height: calc(var(--u) * 36);
  padding: 0 calc(var(--u) * 10);
  border-bottom: 1px solid var(--blue);
  color: var(--blue);
  font-size: calc(var(--u) * 20);
  line-height: 1.6;
}
.l-footer__links {
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--u) * 40);
  margin-top: calc(var(--u) * 40);
  font-weight: 700;
  font-size: calc(var(--u) * 16);
  line-height: 1.6;
  white-space: nowrap;
}
.l-footer__menu { display: flex; gap: calc(var(--u) * 60); margin-top: calc(var(--u) * 40); }
.l-footer__col {
  display: flex;
  flex-direction: column;
  gap: calc(var(--u) * 40);
  font-weight: 700;
  font-size: calc(var(--u) * 16);
  line-height: 1.6;
  white-space: nowrap;
}
.l-footer__col .is-child a {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 6);
  font-weight: 500;
  font-size: calc(var(--u) * 14);
}
.l-footer__col .is-dash { width: calc(var(--u) * 10); height: calc(var(--u) * 1); background: var(--text); flex: none; align-self: flex-start; margin-top: calc(0.5cap - 0.5px); } /* 2 行になっても 1 行目の高さに置く */
.l-footer a[href]:hover { color: var(--blue); }
.l-footer__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: calc(var(--u) * 50);
  margin-top: calc(var(--u) * 60);
  padding: 0 calc(var(--u) * 80);
  background: var(--navy);
  color: #fff;
  font-size: calc(var(--u) * 14);
  line-height: 1.6;
}
.l-footer__bar ul { display: flex; gap: calc(var(--u) * 20); }
.l-footer__bar a[href]:hover { color: #fff; opacity: 0.8; }

/* ---------- 仮の下層（デザインが届くまで） ---------- */
.l-simple { min-height: calc(var(--u) * 600); padding: calc(var(--u) * 120) calc(var(--u) * 160); }
.l-simple__title { color: var(--navy); font-weight: 500; font-size: calc(var(--u) * 40); line-height: 1.5; }
.l-simple__content { margin-top: calc(var(--u) * 60); font-size: calc(var(--u) * 18); line-height: 2; }
.l-simple__list { margin-top: calc(var(--u) * 60); }
.l-simple__list a { display: flex; gap: calc(var(--u) * 30); padding: calc(var(--u) * 24) 0; border-bottom: 1px solid var(--line); font-size: calc(var(--u) * 18); }

/* ---------- 共通の補助（SEO・改行・予約導線） ---------- */
/* 見た目には出さず、読み上げ・検索エンジンには伝える */
.u-vh {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.u-nw { white-space: nowrap; }
/* 見出し・ボタン・電話番号は途中で折り返さない／見出しは文節で改行 */
h1, h2, h3, .c-toc__list a, .c-cta__lead { word-break: auto-phrase; }
.c-btn, .c-btn span, .l-header__btn, .c-fixed-cta__btn, .c-cta__btn, .p-reserve__tel, .l-footer__tel-num { white-space: nowrap; }

/* PC: 予約ボタン（ヘッダー右上）はスクロールしても画面の右上に残す */
.l-header__cta { position: fixed; z-index: 40; }
.admin-bar .l-header__cta { top: 32px; }

/* 本文の途中の予約導線（下層） */
.c-cta {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "lead btns" "note btns";
  align-items: center;
  gap: calc(var(--u) * 16) calc(var(--u) * 40);
  margin-top: calc(var(--u) * 100);
  padding: calc(var(--u) * 40) calc(var(--u) * 60);
  border-radius: calc(var(--u) * 30);
  background: #e9f7ff;
}
.c-cta__lead { grid-area: lead; color: var(--navy); font-size: calc(var(--u) * 24); line-height: 1.6; }
.c-cta__note { grid-area: note; font-size: calc(var(--u) * 16); line-height: 1.6; }
.c-cta__btns { grid-area: btns; display: flex; gap: calc(var(--u) * 15); }
.c-cta__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--u) * 10);
  width: calc(var(--u) * 230);
  height: calc(var(--u) * 60);
  border-radius: calc(var(--u) * 100);
  color: #fff;
  font-size: calc(var(--u) * 18);
  line-height: 1;
  transition: opacity 0.2s;
}
.c-cta__btn[href]:hover { opacity: 0.85; }
.c-cta__btn--tel { background: var(--navy); font-family: var(--en); letter-spacing: 0.1em; }
.c-cta__btn--web { background: var(--blue); letter-spacing: 0.2em; }
.c-cta__btn .c-icon--tel { width: calc(var(--u) * 17); height: calc(var(--u) * 18); }
.c-cta__btn .c-icon--mail { width: calc(var(--u) * 18); height: calc(var(--u) * 14); }

/* サイトマップ・404 の縦並びリスト */
.c-list--col { flex-direction: column; gap: calc(var(--u) * 20); }
.c-list--sub { display: flex; flex-wrap: wrap; gap: calc(var(--u) * 12) calc(var(--u) * 30); margin-top: calc(var(--u) * 14); font-size: calc(var(--u) * 15); }
.l-simple__links { margin-top: calc(var(--u) * 40); }

/*
 * 下層（診療ページ）PC。Figma 下層デザイン「page」5016:2430（幅 1440）の px で書く。
 * SP は lower-sp.src.css（Figma「SPpage」5016:2721）。
 */

/* ---------- 下層ヒーロー（5016:2431・2465） ---------- */
.p-lower__hero {
  position: relative;
  height: calc(var(--u) * 400);
}
.p-lower__hero-img {
  position: absolute;
  top: 0;
  left: calc(var(--u) * 100);
  width: calc(var(--u) * 1340);
  height: calc(var(--u) * 400);
  object-fit: cover;
  border-radius: calc(var(--u) * 320) 0 0 0;
}
.p-lower__title {
  position: absolute;
  top: calc(var(--u) * 168);
  left: calc(var(--u) * 80);
  font-weight: 500;
}
.p-lower__title span {
  display: block;
  padding: calc(var(--u) * 10) calc(calc(var(--u) * 10) - 0.1em) calc(var(--u) * 10) calc(var(--u) * 10);
  background: var(--navy);
  color: #fff;
  font-size: calc(var(--u) * 60);
  line-height: 1;
  letter-spacing: 0.1em;
  white-space: nowrap;
}

.p-lower__body {
  width: calc(var(--u) * 1280);
  margin: 0 auto;
  padding-bottom: calc(var(--u) * 140);
}

/* パンくず（5016:2469。Figma の文字枠はトリムなしの高さ 19） */
.c-breadcrumb ol {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: calc(var(--u) * 10.7);
  min-height: calc(var(--u) * 53.2);
  padding: calc(var(--u) * 17.075) 0;
}
.c-breadcrumb li {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 10.7);
  font-size: calc(var(--u) * 12.8);
  line-height: 1.5;
  letter-spacing: 0;
  text-box: normal;
}
.c-breadcrumb li + li::before { content: "/"; }
.c-breadcrumb li[aria-current] { font-weight: 700; }
.c-breadcrumb a[href]:hover { color: var(--blue); }

.p-lower__lead { margin-top: calc(var(--u) * 50); }
.p-lower__lead p,
.p-lower__text p {
  font-size: calc(var(--u) * 16);
  line-height: 2;
}
.p-lower__lead p + p,
.p-lower__text p + p { margin-top: calc(var(--u) * 52); } /* 段落の間は空行 1 行（行送り 32 ＋ 上下トリムの分 20） */

/* 目次（5016:2476） */
.c-toc {
  width: calc(var(--u) * 628);
  margin: calc(var(--u) * 100) auto 0;
  padding-bottom: calc(var(--u) * 40);
  border: 1px solid #c4ced4;
  background: #fff;
}
.c-toc__title {
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(var(--u) * 82);
  background: #c4ced4;
  color: #fff;
  font-size: calc(var(--u) * 30);
  line-height: 1;
}
.c-toc__list { margin: calc(var(--u) * 30) calc(var(--u) * 24) 0; }
.c-toc__list a {
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 10);
  min-height: calc(var(--u) * 60);
  padding: calc(var(--u) * 12) calc(var(--u) * 5);
  border-bottom: 1px solid #c4ced4;
  color: #555;
  font-size: calc(var(--u) * 20);
  line-height: 1.45;
  transition: color 0.2s;
}
.c-toc__list a:hover { color: var(--blue); }
/* 「・」は字の中で上寄りに描かれるので、1 行目の字の高さ（1cap）の中央に丸を置く（Figma は文字の中央） */
.c-toc__row { display: flex; gap: calc(var(--u) * 10); } /* 点と見出しを 1 つにして a の中で上下中央。点は 1 行目に付く */
.c-toc__dot { display: flex; align-items: center; justify-content: center; width: calc(var(--u) * 20); height: 1cap; flex: none; align-self: flex-start; }
.c-toc__dot::before { content: ""; width: calc(var(--u) * 4); height: calc(var(--u) * 4); border-radius: 50%; background: currentColor; }
.u-nw { white-space: nowrap; }
.c-table { word-break: auto-phrase; overflow-wrap: break-word; } /* 文節で改行。収まらない語だけ折る */
.c-table table { table-layout: fixed; } /* 長い製品名でも枠からはみ出さない */

/* セクション（5016:2501〜） */
.p-lower__sec { margin-top: calc(var(--u) * 100); scroll-margin-top: calc(var(--u) * 20); }
.p-lower__h2 {
  color: var(--blue);
  font-weight: 500;
  font-size: calc(var(--u) * 36);
  line-height: 1.45;
  letter-spacing: 0.1em;
}
.p-lower__fig {
  display: flex;
  justify-content: center;
  height: calc(var(--u) * 419);
  margin-top: calc(var(--u) * 50);
  border-radius: calc(var(--u) * 100) calc(var(--u) * 100) 0 0;
  background: #e9f7ff;
}
.p-lower__fig { align-items: center; }
/* 原稿の画像は比率がまちまちなので 800x419 に切り抜く。小さい画像は原寸まで（引き伸ばさない） */
.p-lower__fig-img {
  width: min(calc(var(--u) * 800), calc(var(--w, 800) * 1px));
  height: min(calc(var(--u) * 419), calc(var(--h, 419) * 1px));
  object-fit: cover;
}
.p-lower__h2 + .p-lower__text,
.p-lower__fig + .p-lower__text { margin-top: calc(var(--u) * 50); }
.p-lower__item { margin-top: calc(var(--u) * 50); }
/* 小見出し（5016:2506。下線 calc(var(--u) * 3) は枠の内側） */
.p-lower__h3 {
  padding: calc(var(--u) * 10) calc(var(--u) * 10) calc(var(--u) * 7);
  border-bottom: calc(var(--u) * 3) solid var(--blue);
  font-weight: 700;
  font-size: calc(var(--u) * 24);
  line-height: 1.45;
  letter-spacing: 0.1em;
}
.p-lower__h3 span { display: block; }

.p-lower__more { margin-top: calc(var(--u) * 30); }
/* 写真が人物の縦長画像のヒーロー（ドクター紹介）は上寄りで切り抜く */
.p-lower__hero-img[src*="kv-03"] { object-position: center 15%; }

/* ---------- 原稿から入る部品（表・箇条書き・ボタン・小見出しの画像） ---------- */
.p-lower__text > * + * { margin-top: calc(var(--u) * 40); }
.p-lower__text > p + p { margin-top: calc(var(--u) * 52); }
.p-lower__text > .p-lower__links { margin-top: calc(var(--u) * 30); }
.p-lower__text > p:empty { display: none; }

/* 「→詳しくはこちら」。複数並ぶときはページ名のボタン */
.p-lower__links { display: flex; flex-wrap: wrap; gap: calc(var(--u) * 20); }
.p-lower__links .p-lower__more { margin-top: 0; }
.p-lower__more--name { width: auto; min-width: calc(var(--u) * 260); padding: 0 calc(var(--u) * 30); }

/* 箇条書き（ページ名はそのページへのリンク） */
.c-list {
  display: flex;
  flex-wrap: wrap;
  gap: calc(var(--u) * 16) calc(var(--u) * 40);
  font-size: calc(var(--u) * 16);
  line-height: 1.6;
}
.c-list li {
  position: relative;
  padding-left: calc(var(--u) * 22);
  text-box: normal; /* リンクの下線が次の行に重ならないよう行の高さを残す */
}
.c-list li::before {
  content: "";
  position: absolute;
  top: calc(0.8em - calc(var(--u) * 4)); /* 1 行目の中心（行の高さ 1.6 の半分）に丸の中心を合わせる */
  left: calc(var(--u) * 4);
  width: calc(var(--u) * 8);
  height: calc(var(--u) * 8);
  border-radius: 50%;
  background: var(--blue);
}
.c-list a {
  color: var(--navy);
  text-decoration: underline;
  text-decoration-color: rgba(78, 142, 183, 0.5);
  text-underline-offset: 0.35em;
}
.c-list a:hover { color: var(--blue); }

/* 表（院内設備・医院概要・お支払い方法など） */
.c-table table {
  width: 100%;
  border-top: 1px solid var(--line);
  font-size: calc(var(--u) * 16);
  line-height: 1.6;
}
.c-table th,
.c-table td {
  padding: calc(var(--u) * 18) calc(var(--u) * 20);
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: middle;
}
.c-table thead th {
  background: #80a3ba;
  color: #fff;
  font-weight: 500;
}
.c-table tbody th {
  width: 32%;
  background: #f1f9ff;
  color: var(--navy);
  font-weight: 500;
}

/* 小見出しに画像がある時（PC は文章の右に画像） */
.p-lower__item.has-image .p-lower__item-body {
  display: grid;
  grid-template-columns: 1fr calc(var(--u) * 440);
  gap: calc(var(--u) * 50);
  align-items: start;
  margin-top: calc(var(--u) * 30);
}
.p-lower__item.has-image .p-lower__text { margin-top: 0; grid-row: 1; grid-column: 1; }
.p-lower__item-fig { grid-row: 1; grid-column: 2; }
.p-lower__item-img {
  width: min(100%, calc(var(--w, 440) * 1px));
  height: auto;
  border-radius: calc(var(--u) * 30);
}
.p-lower__h3 + .p-lower__item-body > .p-lower__text { margin-top: calc(var(--u) * 30); }

@media (max-width: 899.98px) {
  /*
   * SP（calc(var(--u) * 900) 未満）。Figma SP TOP「SPtop」5016:1538（幅 375）の px で書く。
   * calc(var(--u) * 600) で頭打ちにして中央に置く（タブレットで拡大しすぎないため）。
   * PC と訴求が違うところは PC を正とし、文言・項目数は PC のまま SP の組み方にしている。
   */

  :root { --u: calc(100cqw / 375); }

  body {
    max-width: 600px;
    margin: 0 auto;
    padding-bottom: calc(var(--u) * 52); /* 画面下の固定ボタンの分 */
  }

  br.pc { display: none; }
  br.sp { display: inline; }

  /* 改行は文節で（不自然な位置で折り返さない。対応ブラウザのみ） */
  h2, h3, .p-reason__title, .p-treat__head, .p-doctor__career td, .p-greeting__catch,
  .p-concerns__list li, .p-about__list li, .p-clinic__legend p, .p-hero__news-title {
    word-break: auto-phrase;
  }

  /* ---------- 共通パーツ ---------- */
  .c-logo { gap: calc(var(--u) * 6.4); }
  .c-logo__mark { width: calc(var(--u) * 50); height: calc(var(--u) * 50); }
  .c-logo__text { width: calc(var(--u) * 200); gap: calc(var(--u) * 11.4); }
  .c-logo__name { font-size: calc(var(--u) * 20); }
  .c-logo__en { font-size: calc(var(--u) * 7.857); }

  .c-head {
    flex-direction: column;
    align-items: center;
    gap: calc(var(--u) * 20);
  }
  .c-head__ja { font-size: calc(var(--u) * 30); }
  .c-head__en { font-size: calc(var(--u) * 16); }

  .c-name { gap: calc(var(--u) * 20); align-items: flex-start; }
  .c-name__txt { display: flex; flex-direction: column; gap: calc(var(--u) * 20); }
  .c-name__ja { font-size: calc(var(--u) * 30); }
  .c-name__kana { font-size: calc(var(--u) * 14); }

  .c-access__text { font-size: calc(var(--u) * 14); }

  /* ---------- ヘッダー（5016:1542〜1550） ---------- */
  /* ページの途中でもメニューを開けるよう、SP のヘッダーは上に固定する */
  .l-header { position: sticky; top: 0; height: calc(var(--u) * 80); }
  .l-header__logo-wrap { left: calc(var(--u) * 12); top: calc(var(--u) * 16); }
  .l-header__nav, .l-header__cta, .l-mega { display: none; }
  .l-header__burger {
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: calc(var(--u) * 60);
    height: calc(var(--u) * 80);
    background: var(--navy);
  }
  .l-header__burger span {
    position: absolute;
    left: calc(var(--u) * 10);
    width: calc(var(--u) * 40);
    height: calc(var(--u) * 1);
    border-radius: calc(var(--u) * 400);
    background: #fff;
    transition: transform 0.25s, opacity 0.25s, top 0.25s;
  }
  .l-header__burger span:nth-child(1) { top: calc(var(--u) * 28.5); }
  .l-header__burger span:nth-child(2) { top: calc(var(--u) * 39.5); }
  .l-header__burger span:nth-child(3) { top: calc(var(--u) * 50.5); }
  /* 開いたら × （Figma 5016:2991。長さ 43.9・±24°） */
  .l-header__burger[aria-expanded="true"] span { left: calc(var(--u) * 8.05); width: calc(var(--u) * 43.9); }
  .l-header__burger[aria-expanded="true"] span:nth-child(1) { top: calc(var(--u) * 39.5); transform: rotate(24deg); }
  .l-header__burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .l-header__burger[aria-expanded="true"] span:nth-child(3) { top: calc(var(--u) * 39.5); transform: rotate(-24deg); }

  /* メニューを開いている間は後ろをスクロールさせない（ヘッダーはメニューより前） */
  html.is-menu-open { overflow: hidden; }
  html.is-menu-open .l-header { z-index: 30; background: #e8f1f7; }

  /* ---------- SP メニュー（5016:2989 / 3046） ---------- */
  .l-drawer {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 25;
    display: block;
    max-width: 600px;
    margin: 0 auto;
    padding-top: calc(var(--u) * 80);
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #e8f1f7;
  }
  .l-drawer[hidden] { display: none; }
  .l-drawer__nav {
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 10);
    width: calc(var(--u) * 310);
    margin: calc(var(--u) * 20) auto calc(var(--u) * 40);
  }
  .l-drawer__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: calc(var(--u) * 40);
    padding: 0 calc(var(--u) * 10) calc(calc(var(--u) * 10) - 1px);
    border-bottom: 1px solid var(--line);
    font-size: calc(var(--u) * 16);
    line-height: 1;
    letter-spacing: 0.1em;
    text-align: left;
  }
  .l-drawer__plus {
    position: relative;
    width: calc(var(--u) * 20);
    height: calc(var(--u) * 20);
    border-radius: 50%;
    background: var(--blue);
    flex: none;
  }
  .l-drawer__plus::before,
  .l-drawer__plus::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: calc(var(--u) * 11);
    height: calc(var(--u) * 1.5);
    background: #fff;
    transform: translate(-50%, -50%);
  }
  .l-drawer__plus::after { transform: translate(-50%, -50%) rotate(90deg); transition: opacity 0.2s; }
  .l-drawer__toggle[aria-expanded="true"] .l-drawer__plus::after { opacity: 0; }
  .l-drawer__sub {
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 5);
    margin-top: calc(var(--u) * 10);
  }
  .l-drawer__sub[hidden] { display: none; }
  .l-drawer__sub a {
    display: flex;
    align-items: center;
    gap: calc(var(--u) * 10);
    height: calc(var(--u) * 30);
    padding: 0 calc(var(--u) * 10);
    font-size: calc(var(--u) * 14);
    line-height: 1;
  }
  .l-drawer__sub .is-dash {
    width: calc(var(--u) * 15);
    height: calc(var(--u) * 2);
    margin: 0 calc(var(--u) * 1);
    overflow: hidden;
    background: var(--blue);
    color: transparent;
    flex: none;
  }

  /* ---------- 画面下の固定ボタン（5016:3165） ---------- */
  .c-fixed-cta {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 20;
    display: flex;
    max-width: 600px;
    height: calc(var(--u) * 52);
    margin: 0 auto;
  }
  .c-fixed-cta__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(var(--u) * 10);
    width: 50%;
    border-radius: calc(var(--u) * 20) calc(var(--u) * 20) 0 0;
    color: #fff;
    font-size: calc(var(--u) * 16);
    line-height: 1;
  }
  .c-fixed-cta__btn--tel { background: #003152; font-family: var(--en); letter-spacing: 0.1em; }
  .c-fixed-cta__btn--tel .c-icon { width: calc(var(--u) * 15.17); height: calc(var(--u) * 15.86); }
  .c-fixed-cta__btn--web { background: var(--blue); letter-spacing: 0.2em; }
  .c-fixed-cta__btn--web .c-icon { width: calc(var(--u) * 15.64); height: calc(var(--u) * 12.29); }

  /* ---------- ヒーロー（5016:1539〜1597） ---------- */
  .p-hero {
    --kv-h: calc(var(--u) * 600);
    height: calc(var(--u) * 1255);
  }
  .p-hero__band { top: calc(var(--u) * 600); height: calc(var(--u) * 655); border-radius: 0 0 calc(var(--u) * 100) 0; }
  .p-hero__visual { left: 0; width: calc(var(--u) * 375); height: calc(var(--u) * 600); border-radius: calc(var(--u) * 200) 0 0 0; }
  .p-hero__over { height: calc(var(--u) * 600); }
  .p-hero__catch { left: calc(var(--u) * 31); top: calc(var(--u) * 504); bottom: auto; gap: calc(var(--u) * 10); }
  .p-hero__catch > span { font-size: calc(var(--u) * 30); }
  .p-hero__catch > .is-split {
    display: flex;
    flex-direction: column;
    gap: calc(var(--u) * 10);
    padding: 0;
    background: none;
  }
  .p-hero__catch .is-split > span {
    display: block;
    width: fit-content;
    padding: calc(var(--u) * 10) calc(calc(var(--u) * 10) - 0.1em) calc(var(--u) * 10) calc(var(--u) * 10);
    background: var(--navy);
  }
  .p-hero__bubble--01 { left: calc(var(--u) * 129); top: calc(var(--u) * 64); bottom: auto; width: calc(var(--u) * 133.5); }
  .p-hero__bubble--02 { left: calc(var(--u) * 223.7); top: calc(var(--u) * 25.9); bottom: auto; width: calc(var(--u) * 136.6); }
  .p-hero__bubble--03 { left: calc(var(--u) * 228.7); top: calc(var(--u) * 128.9); bottom: auto; width: calc(var(--u) * 131.5); }

  .p-hero__news {
    left: calc(var(--u) * 12.5);
    top: calc(var(--u) * 710);
    flex-direction: column;
    gap: calc(var(--u) * 40);
    width: calc(var(--u) * 350);
    height: auto;
  }
  .p-hero__news-head { width: auto; gap: calc(var(--u) * 20); }
  .p-hero__news-en { font-size: calc(var(--u) * 40); }
  .p-hero__news-ja { font-size: calc(var(--u) * 16); }
  .p-hero__news-list { width: calc(var(--u) * 350); }
  .p-hero__news-list li:nth-child(n+2) { display: block; }
  .p-hero__news-item {
    width: calc(var(--u) * 350);
    gap: calc(var(--u) * 20);
    padding: calc(var(--u) * 20) 0 calc(calc(var(--u) * 20) - 1px);
    border-bottom: 1px solid #d9d9d9;
  }
  .p-hero__news-thumb { width: calc(var(--u) * 90); height: calc(var(--u) * 53); background: #d9d9d9; }
  .p-hero__news-text { width: calc(var(--u) * 210); margin-right: 0; }
  .p-hero__news-text time { font-size: calc(var(--u) * 12); }
  .p-hero__news-title {
    display: -webkit-box;
    font-size: calc(var(--u) * 13);
    line-height: 1.7;
    white-space: normal;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
  .p-hero__news-item .c-icon--arrow { margin-left: calc(var(--u) * -4); }
  .c-btn.p-hero__news-more { display: inline-flex; margin-top: 0; }

  /* ---------- 当院について（5016:1598〜1624） ---------- */
  .p-about { flex-direction: column; gap: calc(var(--u) * 60); padding: calc(var(--u) * 60) 0; }
  .p-about__img { width: calc(var(--u) * 375); height: calc(var(--u) * 300); border-radius: 0 calc(var(--u) * 100) 0 0; }
  .p-about__body { width: calc(var(--u) * 350); margin: 0 auto; }
  .p-about .c-head { gap: calc(var(--u) * 30); }
  .p-about__list { margin-top: calc(var(--u) * 40); }
  .p-about__list li {
    gap: calc(var(--u) * 10);
    height: auto;
    min-height: calc(var(--u) * 52);
    padding: calc(var(--u) * 16) calc(var(--u) * 10);
    font-size: calc(var(--u) * 16);
    white-space: normal;
  }
  .p-about__list li::before { width: calc(var(--u) * 20); height: calc(var(--u) * 20); }

  /* ---------- 予約（5016:1625〜1642） ---------- */
  .p-reserve { height: calc(var(--u) * 437); padding-top: calc(var(--u) * 60); }
  .p-reserve__title { font-size: calc(var(--u) * 40); }
  .p-reserve__cards { flex-direction: column; align-items: center; gap: calc(var(--u) * 15); margin-top: calc(var(--u) * 40); }
  .p-reserve__card { width: calc(var(--u) * 310); height: calc(var(--u) * 117); border-radius: calc(var(--u) * 35.09) calc(var(--u) * 35.09) 0 0; }
  .p-reserve__card--tel .p-reserve__inner { width: calc(var(--u) * 251.6); height: calc(var(--u) * 100.2); }
  .p-reserve__card--web .p-reserve__inner { width: calc(var(--u) * 229.9); height: calc(var(--u) * 100); }
  .p-reserve__card--tel .p-reserve__illust { width: calc(var(--u) * 93.6); height: calc(var(--u) * 100.2); }
  .p-reserve__card--web .p-reserve__illust { width: calc(var(--u) * 71.9); height: calc(var(--u) * 100); }
  .p-reserve__body { gap: calc(var(--u) * 11.7); padding-bottom: calc(var(--u) * 17.55); }
  .p-reserve__card--tel .p-reserve__body { width: calc(var(--u) * 158); }
  .p-reserve__card--web .p-reserve__body { width: calc(var(--u) * 136); }
  .p-reserve__circle { width: calc(var(--u) * 35.1); height: calc(var(--u) * 35.1); }
  .p-reserve__circle .c-icon--tel-lg { width: calc(var(--u) * 13.5); height: calc(var(--u) * 14.1); }
  .p-reserve__circle .c-icon--mail-lg { width: calc(var(--u) * 13.6); height: calc(var(--u) * 10.7); }
  .p-reserve__tel { font-size: calc(var(--u) * 18.72); }
  .p-reserve__label { font-size: calc(var(--u) * 9.36); }
  .p-reserve__web { font-size: calc(var(--u) * 16.38); }

  /* ---------- お悩み（5016:1643〜1691） ---------- */
  .p-concerns { height: calc(var(--u) * 1110); padding-top: calc(var(--u) * 60); }
  .p-concerns__title { gap: calc(var(--u) * 6); }
  .p-concerns__title > span { font-size: calc(var(--u) * 24); }
  .p-concerns__title > .is-split {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(var(--u) * 6);
    padding: 0;
    background: none;
  }
  .p-concerns__title .is-split > span {
    display: block;
    padding: calc(var(--u) * 10) calc(calc(var(--u) * 10) - 0.1em) calc(var(--u) * 10) calc(var(--u) * 10);
    background: var(--blue);
  }
  .p-concerns__list {
    grid-template-columns: repeat(2, calc(var(--u) * 170));
    gap: calc(var(--u) * 10);
    width: calc(var(--u) * 350);
    margin-top: calc(var(--u) * 40);
  }
  .p-concerns__list li {
    gap: calc(var(--u) * 6);
    padding: 0 calc(var(--u) * 10);
    font-size: calc(var(--u) * 14);
  }
  .p-concerns__check { width: calc(var(--u) * 14); height: calc(var(--u) * 14); border-radius: calc(var(--u) * 2); }
  .p-concerns__check .c-icon { width: calc(var(--u) * 8); height: calc(var(--u) * 5.5); }
  .p-concerns__photo { top: calc(var(--u) * 651); width: calc(var(--u) * 375); height: calc(var(--u) * 459); }
  .p-concerns__msg { top: calc(var(--u) * 776); left: calc(var(--u) * 12.5); width: calc(var(--u) * 350); font-size: calc(var(--u) * 20); }

  /* ---------- 医院案内（5016:1692〜1861 / 2126〜2295） ---------- */
  .p-clinic { padding: calc(var(--u) * 60) calc(var(--u) * 12.5); }
  .p-clinic__inner { flex-direction: column; align-items: stretch; gap: calc(var(--u) * 30); }
  .p-clinic__main { width: calc(var(--u) * 350); }
  .p-clinic__table { margin-top: calc(var(--u) * 40); }
  .p-clinic__row dt,
  .p-clinic__row dd { font-size: calc(var(--u) * 14); }
  .p-clinic__row dt { width: calc(var(--u) * 81); white-space: nowrap; }
  .p-clinic__row dd { width: calc(var(--u) * 263); }
  .p-clinic__row--tel dd { font-size: calc(var(--u) * 24); }
  .p-clinic__row--tel .is-note { font-size: calc(var(--u) * 14); }
  .p-clinic__time { width: calc(var(--u) * 350); }
  .p-clinic__time tr { gap: calc(var(--u) * 10); padding: 0 calc(var(--u) * 20) 0 calc(var(--u) * 10); }
  .p-clinic__time thead tr { height: calc(var(--u) * 58); }
  .p-clinic__time th:first-child,
  .p-clinic__time thead th:first-child { width: calc(var(--u) * 87); font-size: calc(var(--u) * 14); white-space: nowrap; }
  .p-clinic__time th:not(:first-child),
  .p-clinic__time td { margin-left: calc(var(--u) * -10); font-size: calc(var(--u) * 14); } /* 曜日どうしは間隔 0 */
  .p-clinic__time th:nth-child(2),
  .p-clinic__time td:nth-child(2) { margin-left: 0; }
  .p-clinic__note { font-size: calc(var(--u) * 14); }
  /* 凡例 → カレンダー → 注記 の順に並べ替える */
  .p-clinic__cal { flex-direction: column; gap: calc(var(--u) * 28); }
  .p-clinic__legend { display: contents; }
  .p-clinic__legend ul { order: 1; }
  .c-cal { order: 2; align-self: center; }
  .p-clinic__legend p { order: 3; width: calc(var(--u) * 350); margin-top: 0; font-size: calc(var(--u) * 14); }
  .c-cal__head { margin: 0 auto; }
  .p-clinic__side { width: calc(var(--u) * 350); }
  .p-clinic__map { width: calc(var(--u) * 350); height: calc(var(--u) * 396); }
  .p-clinic__access {
    flex-direction: column;
    gap: calc(var(--u) * 30);
    height: auto;
    margin-top: calc(var(--u) * 30);
  }
  .p-clinic__icons { display: flex; gap: calc(var(--u) * 30); }

  /* ---------- ごあいさつ（5016:1862〜1875） ---------- */
  .p-greeting {
    padding: 0 0 calc(var(--u) * 60);
    background: linear-gradient(180deg, #ecf8ff 2%, rgba(255, 255, 255, 0) 100%) 0 calc(var(--u) * 350) / 100% calc(var(--u) * 523) no-repeat;
  }
  .p-greeting__inner { flex-direction: column; gap: calc(var(--u) * 60); }
  .p-greeting__img { width: calc(var(--u) * 375); height: calc(var(--u) * 350); border-radius: 0 calc(var(--u) * 100) 0 0; }
  .p-greeting__body { width: calc(var(--u) * 350); margin: 0 auto; }
  .p-greeting .c-head { align-items: flex-start; }
  .p-greeting__catch { margin-top: calc(var(--u) * 60); font-size: calc(var(--u) * 24); }
  .p-greeting__text { margin-top: calc(var(--u) * 40); font-size: calc(var(--u) * 16); }
  .p-greeting .c-name { justify-content: flex-end; margin-top: calc(var(--u) * 40); }

  /* ---------- 選ばれる理由（5016:1876〜1928） ---------- */
  .p-reason {
    padding: calc(var(--u) * 43) 0 calc(var(--u) * 102);
    border-radius: calc(var(--u) * 100) 0 0 0;
    background-image: url(../img/reason-bg-sp.webp);
    background-size: 100% auto;
  }
  .p-reason__label { top: calc(var(--u) * 43); left: calc(var(--u) * 246.5); }
  .p-reason__label-sub { width: calc(var(--u) * 33); padding: calc(var(--u) * 10); font-size: calc(var(--u) * 20); }
  .p-reason__label-main { width: calc(var(--u) * 60); padding: calc(var(--u) * 10); }
  .p-reason__label-main .is-md { font-size: calc(var(--u) * 30); }
  .p-reason__label-main .is-lg { margin: 0; font-size: calc(var(--u) * 40); }
  .p-reason__en {
    width: calc(var(--u) * 191);
    margin: calc(var(--u) * 116) 0 0 calc(var(--u) * 25.5);
    font-size: calc(var(--u) * 40);
  }
  .p-reason__item {
    flex-direction: column;
    width: calc(var(--u) * 350);
    margin-top: calc(var(--u) * 30);
  }
  .p-reason__item--001 { margin-top: calc(var(--u) * 146); }
  .p-reason__item--001,
  .p-reason__item--003 { margin-left: calc(var(--u) * 25); }
  .p-reason__item--002,
  .p-reason__item--004 { flex-direction: column; margin-left: 0; }
  .p-reason__card { gap: calc(var(--u) * 30); width: calc(var(--u) * 350); padding: calc(var(--u) * 40) 0 calc(var(--u) * 40) calc(var(--u) * 50); }
  .p-reason__num { font-size: calc(var(--u) * 12); }
  .p-reason__title { width: calc(var(--u) * 260); font-size: calc(var(--u) * 20); letter-spacing: 0; } /* 字間 10% だと 13 字の行が収まらず不自然に折り返すため 0 */
  .p-reason__text { width: calc(var(--u) * 260); font-size: calc(var(--u) * 14); }
  .p-reason__img { width: calc(var(--u) * 350); height: calc(var(--u) * 283); }

  /* ---------- 院長紹介（5016:1929〜1988） ---------- */
  .p-doctor { padding: calc(var(--u) * 60) 0; }
  .p-doctor__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    margin: 0;
    padding: 0 calc(var(--u) * 12.5);
  }
  .p-doctor__body { display: contents; }
  .p-doctor .c-head { order: -2; align-self: center; }
  .p-doctor__img {
    order: -1;
    width: calc(var(--u) * 375);
    height: calc(var(--u) * 574);
    margin: calc(var(--u) * 40) calc(var(--u) * -12.5) 0;
    border-radius: calc(var(--u) * 200) 0 0 0;
  }
  .p-doctor__body .c-name { margin-top: calc(var(--u) * 40); }
  .p-doctor__text { width: calc(var(--u) * 350); margin-top: calc(var(--u) * 40); font-size: calc(var(--u) * 14); }
  .p-doctor__body .c-tag { margin-top: calc(var(--u) * 40); }
  .p-doctor__career { width: calc(var(--u) * 350); }
  .p-doctor__career th,
  .p-doctor__career td {
    height: auto;
    min-height: calc(var(--u) * 37);
    padding: calc(var(--u) * 14) calc(var(--u) * 10) calc(calc(var(--u) * 14) - 1px);
    white-space: normal;
  }
  .p-doctor__career th { width: calc(var(--u) * 121); font-size: calc(var(--u) * 12); white-space: nowrap; flex: none; }
  .p-doctor__career td { width: calc(var(--u) * 223); font-size: calc(var(--u) * 13); }
  .p-doctor__society { width: calc(var(--u) * 350); font-size: calc(var(--u) * 14); }

  /* ---------- 診療案内（5016:1989〜2065） ---------- */
  .p-medical { padding: calc(var(--u) * 60) calc(var(--u) * 12.5); }
  .p-medical__list {
    grid-template-columns: repeat(2, calc(var(--u) * 170));
    gap: calc(var(--u) * 10);
    margin-top: calc(var(--u) * 40);
  }
  .p-medical__card {
    gap: calc(var(--u) * 30);
    height: calc(var(--u) * 169);
    padding: calc(var(--u) * 40) 0 calc(var(--u) * 30);
  }
  .p-medical__list li:nth-child(-n+4) .p-medical__card { height: calc(var(--u) * 192); }
  .p-medical__list li:nth-child(-n+3) .p-medical__card { gap: calc(var(--u) * 40); }
  .p-medical__name { gap: calc(var(--u) * 20); }
  .p-medical__ja { font-size: calc(var(--u) * 16); }
  .p-medical__en { font-size: calc(var(--u) * 10); }
  .p-medical__pill { height: calc(var(--u) * 28); font-size: calc(var(--u) * 11); }
  .p-medical__price {
    flex-direction: column;
    gap: calc(var(--u) * 20);
    width: calc(var(--u) * 350);
    margin-top: calc(var(--u) * 40);
    padding: calc(var(--u) * 60) 0;
  }
  .p-medical__price p { width: calc(var(--u) * 292); font-size: calc(var(--u) * 14); white-space: nowrap; }

  /* ---------- 当院が得意とする治療（5016:2066〜2124） ---------- */
  .p-treat { padding: calc(var(--u) * 60) 0; }
  .p-treat__en {
    position: static;
    margin-left: calc(var(--u) * 24);
    font-size: calc(var(--u) * 48);
    line-height: 1.5;
    transform: none;
  }
  .p-treat__title { margin-top: calc(calc(var(--u) * 20) - 0.25em); margin-left: calc(var(--u) * 24); font-size: calc(var(--u) * 30); } /* -0.25em は .u-grad の余白の打ち消し */
  .p-treat__item,
  .p-treat__item--02,
  .p-treat__item--04 {
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: calc(var(--u) * 30);
    margin: calc(var(--u) * 40) 0 0;
  }
  .p-treat__body { display: contents; }
  .p-treat__num { order: -1; font-size: calc(var(--u) * 60); }
  .p-treat__img,
  .p-treat__item--02 .p-treat__img,
  .p-treat__item--04 .p-treat__img { width: calc(var(--u) * 375); height: calc(var(--u) * 264); border-radius: 0 calc(var(--u) * 100) 0 0; }
  .p-treat__head { width: calc(var(--u) * 350); align-items: center; text-align: center; }
  .p-treat__sub { font-size: calc(var(--u) * 16); }
  .p-treat__main { font-size: calc(var(--u) * 24); }
  .p-treat__text { width: calc(var(--u) * 350); font-size: calc(var(--u) * 14); }

  /* ---------- フッター（5016:2314〜2424） ---------- */
  .l-footer__inner { flex-direction: column; gap: calc(var(--u) * 60); margin: 0 calc(var(--u) * 12.5); }
  .l-footer__info { gap: calc(var(--u) * 20); width: calc(var(--u) * 350); padding: calc(var(--u) * 40) calc(var(--u) * 20); }
  .l-footer__logo { gap: calc(var(--u) * 7); width: calc(var(--u) * 310.5); height: calc(var(--u) * 54.4); padding: 0 calc(var(--u) * 15.54); }
  .l-footer__logo .c-logo__mark { width: calc(var(--u) * 54.4); height: calc(var(--u) * 54.4); }
  .l-footer__logo .c-logo__text { width: calc(var(--u) * 218); gap: calc(var(--u) * 12.4); }
  .l-footer__logo .c-logo__name { font-size: calc(var(--u) * 21.754); }
  .l-footer__logo .c-logo__en { font-size: calc(var(--u) * 8.546); }
  .l-footer__address { width: calc(var(--u) * 310); padding: 0; font-size: calc(var(--u) * 12); }
  .l-footer__access { width: calc(var(--u) * 308); }
  .l-footer__tel-label { height: calc(var(--u) * 30); font-size: calc(var(--u) * 14); }
  .l-footer__tel-num { font-size: calc(var(--u) * 24); }
  .l-footer__hours { width: calc(var(--u) * 310); padding: calc(var(--u) * 20) 0; font-size: calc(var(--u) * 13); }
  .l-footer__hours .is-sm { font-size: calc(var(--u) * 11); }
  .l-footer__nav { width: calc(var(--u) * 350); }
  .l-footer__group--clinic { width: calc(var(--u) * 350); }
  .l-footer__menu { flex-wrap: wrap; gap: calc(var(--u) * 40) calc(var(--u) * 10); }
  .l-footer__col { width: calc(var(--u) * 170); }
  .l-footer__bar {
    flex-direction: column;
    justify-content: center;
    gap: calc(var(--u) * 20);
    height: calc(var(--u) * 77);
    padding: 0;
  }
  .l-footer__bar small { font-size: calc(var(--u) * 10); }

  /* ---------- 仮の下層 ---------- */
  .l-simple { padding: calc(var(--u) * 60) calc(var(--u) * 12.5); }
  .l-simple__title { font-size: calc(var(--u) * 24); }
  .l-simple__content { margin-top: calc(var(--u) * 30); font-size: calc(var(--u) * 14); }

  /* ---------- 予約導線（下層の本文の途中） ---------- */
  .c-cta {
    grid-template-columns: 1fr;
    grid-template-areas: "lead" "note" "btns";
    gap: calc(var(--u) * 12);
    margin-top: calc(var(--u) * 60);
    padding: calc(var(--u) * 30) calc(var(--u) * 20);
    border-radius: calc(var(--u) * 20);
    text-align: center;
  }
  .c-cta__lead { font-size: calc(var(--u) * 18); }
  .c-cta__note { font-size: calc(var(--u) * 13); }
  .c-cta__btns { flex-direction: column; gap: calc(var(--u) * 10); margin-top: calc(var(--u) * 8); }
  .c-cta__btn { width: 100%; height: calc(var(--u) * 52); font-size: calc(var(--u) * 16); }
  .c-list--sub { font-size: calc(var(--u) * 13); gap: calc(var(--u) * 8) calc(var(--u) * 20); }

  /*
   * 下層（診療ページ）SP。Figma 下層デザイン「SPpage」5016:2721（幅 375）の px で書く。
   */

  .p-lower__hero { height: calc(var(--u) * 300); }
  .p-lower__hero-img { left: 0; width: calc(var(--u) * 375); height: calc(var(--u) * 300); border-radius: calc(var(--u) * 100) 0 0 0; }
  .p-lower__title { top: calc(var(--u) * 129); left: calc(var(--u) * 20); }
  .p-lower__title { right: calc(var(--u) * 20); }
  .p-lower__title span {
    width: fit-content;
    font-size: calc(var(--u) * 24);
    line-height: 1.5;
    white-space: normal;
    word-break: auto-phrase;
  }

  .p-lower__body { width: calc(var(--u) * 350); padding-bottom: calc(var(--u) * 60); }

  .p-lower__lead { margin-top: calc(var(--u) * 40); }
  .p-lower__lead p,
  .p-lower__text p { font-size: calc(var(--u) * 14); }
  .p-lower__lead p + p,
  .p-lower__text p + p { margin-top: calc(var(--u) * 46); } /* 空行 1 行（28 ＋ トリムの分 18） */

  .c-toc { width: calc(var(--u) * 350); margin-top: calc(var(--u) * 40); padding-bottom: calc(var(--u) * 20); }
  .c-toc__title { height: calc(var(--u) * 53); font-size: calc(var(--u) * 18); }
  .c-toc__list { margin: calc(var(--u) * 20) calc(var(--u) * 20) 0; }
  .c-toc__list a { min-height: calc(var(--u) * 50); padding: calc(var(--u) * 10) calc(var(--u) * 5); font-size: calc(var(--u) * 16); line-height: 1.6; color: var(--text); word-break: auto-phrase; }
  .c-toc__list li:first-child a { min-height: calc(var(--u) * 32); padding-top: 0; } /* Figma どおり 1 行目だけ上の余白が小さい */
  .c-toc__dot { width: calc(var(--u) * 16); color: var(--blue); }

  .p-lower__sec { margin-top: calc(var(--u) * 60); scroll-margin-top: calc(var(--u) * 100); } /* 固定ヘッダー（80）の分 */
  .p-lower__h2 { font-size: calc(var(--u) * 24); }
  .p-lower__fig { height: calc(var(--u) * 233); margin-top: calc(var(--u) * 40); border-radius: 0; background: none; }
  .p-lower__fig { height: auto; }
  .p-lower__fig-img { width: min(calc(var(--u) * 350), calc(var(--w, 350) * 1px)); height: auto; aspect-ratio: 350 / 233; border-radius: calc(var(--u) * 60) calc(var(--u) * 60) 0 0; }
  .p-lower__h2 + .p-lower__text,
  .p-lower__fig + .p-lower__text { margin-top: calc(var(--u) * 40); }
  .p-lower__item { margin-top: calc(var(--u) * 40); }
  .p-lower__h3 { padding: calc(var(--u) * 10) 0 calc(var(--u) * 7); font-size: calc(var(--u) * 18); }
  .p-lower__sec--faq .p-lower__text p { font-size: calc(var(--u) * 16); } /* Figma の SP はよくある質問の回答だけ 16 */

  .p-lower__text > * + * { margin-top: calc(var(--u) * 30); }
  .p-lower__text > p + p { margin-top: calc(var(--u) * 46); }
  .p-lower__links { gap: calc(var(--u) * 15); }
  .p-lower__more--name { min-width: 0; width: 100%; }
  .c-list { gap: calc(var(--u) * 6) calc(var(--u) * 24); font-size: calc(var(--u) * 14); }
  .c-list li { padding-left: calc(var(--u) * 18); }
  .c-table table { font-size: calc(var(--u) * 14); letter-spacing: 0.05em; } /* 字間を少し詰めて、語が途中で切れないように */
  .c-table th,
  .c-table td { padding: calc(var(--u) * 14) calc(var(--u) * 10); }
  .c-table tbody th { width: 38%; }
  .p-lower__item.has-image .p-lower__item-body { display: block; margin-top: calc(var(--u) * 20); }
  .p-lower__item.has-image .p-lower__text { margin-top: calc(var(--u) * 20); }
  .p-lower__item-img { width: 100%; border-radius: calc(var(--u) * 20); }
}

/* 準備中（WEB予約・Instagram の URL が未定のあいだ表示。functions.php の kk_soon()。URL を設定すると消える） */
.c-soon {
	display: inline-block;
	margin-left: .5em;
	padding: 0 .6em;
	border: 1px solid currentColor;
	border-radius: 999px;
	font-size: max(.72em, 10px);
	line-height: 1.6;
	letter-spacing: .05em;
	vertical-align: .12em;
	white-space: nowrap;
}
/* リンク先が未定のボタンは押せる見た目にしない */
.l-header__cta a:not([href]),
.c-cta__btn:not([href]),
.c-fixed-cta__btn:not([href]),
.p-reserve__card:not([href]),
.l-footer__tel-num:not([href]),
.l-footer__sns a:not([href]),
.l-header__insta a:not([href]),
.p-clinic__row--tel a:not([href]) {
	cursor: default;
	pointer-events: none;
}
.l-header__insta a {
	position: relative;
}
.l-header__insta .c-soon {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	margin: 2px 0 0;
	padding: 0 .4em;
	font-size: 9px;
	color: var(--navy);
}
.p-reserve__web .c-soon {
	display: block;
	width: fit-content;
	margin: .6em auto 0;
	font-size: 12px;
}

/* ---------- 広い画面（1441px 以上）：デザイン幅 1440 で拡大を止めて中央に置く ----------
   --u は画面幅に比例するので、上限が無いと 1920px で 1.33 倍・2560px で 1.78 倍になり圧迫感が出る。
   body を 1440px で止めると --u が 1px（＝デザイン等倍）で止まる。
   帯の背景と画面端に接する写真は、--bleed（左右の余白）ぶん画面の端まで伸ばす。 */
@media (min-width: 1441px) {
  html { overflow-x: clip; }
  body {
    max-width: 1440px;
    margin-inline: auto;
    overflow-x: visible;
  }
  body * { --bleed: calc((100vw - 100cqw) / 2); }

  /* 右上に固定した予約ボタンは 1440 の枠の右端に合わせる */
  .l-header__cta { right: max(0px, calc((100% - 1440px) / 2)); }

  /* 帯の背景：疑似要素で画面の端まで伸ばす */
  .p-reserve,
  .p-reason,
  .p-greeting,
  .p-doctor,
  .p-treat,
  .l-footer__bar { position: relative; isolation: isolate; }
  .p-reserve::before,
  .p-reason::before,
  .p-greeting::before,
  .p-doctor::before,
  .p-treat::before,
  .l-footer__bar::before {
    content: "";
    position: absolute;
    inset: 0 calc(-1 * var(--bleed));
    z-index: -1;
    background: inherit;
  }
  /* 質感の画像は、伸ばした範囲で 1 枚に敷き直す（元の背景と継ぎ目が出ないように） */
  .p-reserve { background: var(--navy); }
  .p-reserve::before { background: var(--navy) url(../img/reserve-bg.webp) center / cover no-repeat; }
  .p-reason { background: none; }
  .p-reason::before { background: url(../img/reason-bg.webp) center top / cover no-repeat; }
  .p-hero__band { width: calc(100% + var(--bleed)); box-shadow: 0 0 0 100vmax var(--pale); clip-path: inset(0 0 0 -100vmax); }
  .p-concerns::before { left: calc(-1 * var(--bleed)); width: calc(100% + var(--bleed) * 2); }
  .p-concerns__photo { left: calc(-1 * var(--bleed)); width: calc(var(--u) * 1440 + var(--bleed) * 2); object-fit: cover; }

  /* 右端に接する写真（KV・下層の大きい写真） */
  .p-hero__visual,
  .p-lower__hero-img { width: calc(var(--u) * 1340 + var(--bleed)); }

  /* 左端に接する写真 */
  .p-about__img { margin-left: calc(-1 * var(--bleed)); width: calc(var(--u) * 511 + var(--bleed)); }
  .p-greeting__img { margin-left: calc(-1 * var(--bleed)); width: calc(var(--u) * 600 + var(--bleed)); }
  .p-reason__item--002 .p-reason__img { margin-left: calc(-1 * var(--bleed)); width: calc(var(--u) * 650 + var(--bleed)); height: calc(var(--u) * 526); }
  .p-reason__item--004 .p-reason__img { margin-left: calc(-1 * var(--bleed)); width: calc(var(--u) * 650 + var(--bleed)); height: calc(var(--u) * 490); }
  .p-treat__item--01 .p-treat__img,
  .p-treat__item--03 .p-treat__img,
  .p-treat__item--05 .p-treat__img { margin-left: calc(-1 * var(--bleed)); width: calc(var(--u) * 650 + var(--bleed)); }

  /* 右端に接する写真 */
  .p-doctor__img { margin-right: calc(-1 * var(--bleed)); width: calc(var(--u) * 600 + var(--bleed)); }
  .p-reason__item--001 .p-reason__img,
  .p-reason__item--003 .p-reason__img { margin-right: calc(-1 * var(--bleed)); width: calc(var(--u) * 650 + var(--bleed)); height: calc(var(--u) * 526); }
  .p-treat__item--04 .p-treat__img { margin-right: calc(-1 * var(--bleed)); width: calc(var(--u) * 650 + var(--bleed)); }
}

/* ---------- アニメーション（クリニックらしく控えめに）----------
   ・スクロール：見出し・本文・カードは下からふわっと、写真は画面の端側から現れる（main.js が is-inview を付ける）
   ・読み込み時：KV・キャッチコピー・吹き出し、下層の大きい写真とページ名
   ・フローティング：KV の吹き出し、予約カードの丸アイコン
   隠すのは header.php が html に is-anim を付けたときだけ（JS が動かない環境では最初から全部表示）。
   「視差効果を減らす」設定の端末では動かさない。 */
@media (prefers-reduced-motion: no-preference) {
  /* スクロールで表示：最初の状態 */
  .is-anim main :is(.p-hero__news, .c-head, .p-about__list > li, .p-reserve__title, .p-reserve__card, .p-concerns__title, .p-concerns__list > li, .p-concerns__msg, .p-clinic__table, .p-clinic__hours, .p-clinic__cal, .p-clinic__side, .p-greeting__catch, .p-greeting__text, .c-name, .p-reason__card, .p-doctor__text, .c-tag, .p-doctor__career, .p-doctor__society, .p-medical__list > li, .p-medical__price, .p-treat__title, .p-treat__body, .c-breadcrumb, .p-lower__lead, .c-toc, .p-lower__h2, .p-lower__text, .p-lower__item, .c-cta) {
    opacity: 0;
    transform: translateY(calc(var(--u) * 28));
  }
  /* 写真：端から切り抜く動きは大きい写真だと急に見えるので、ふわっと浮かび上がりながらゆっくり現れる動きにする */
  .is-anim main :is(.p-about__img, .p-greeting__img, .p-reason__img, .p-doctor__img, .p-treat__img, .p-lower__fig) {
    opacity: 0;
    transform: translateY(calc(var(--u) * 40));
  }
  /* 画面に入ったら（「li」を含む上のセレクタより強くするため、クラスを重ねて詳細度を上げている） */
  .is-anim main .is-inview.is-inview {
    opacity: 1;
    transform: none;
    transition:
      opacity 1s cubic-bezier(.22, .61, .36, 1) var(--kk-delay, 0s),
      transform 1s cubic-bezier(.22, .61, .36, 1) var(--kk-delay, 0s),
      clip-path 1.3s cubic-bezier(.77, 0, .18, 1) var(--kk-delay, 0s);
  }
  /* 写真だけ端から現れる。文字に clip-path を掛けると、上下トリムした字面の頭が切れるので掛けない */
  .is-anim main :is(.p-about__img, .p-greeting__img, .p-reason__img, .p-doctor__img, .p-treat__img, .p-lower__fig).is-inview {
    transition:
      opacity 1.6s cubic-bezier(.25, .46, .45, .94) var(--kk-delay, 0s),
      transform 1.8s cubic-bezier(.22, .61, .36, 1) var(--kk-delay, 0s);
  }
  /* 現れ終わったら clip-path を外す（重なり順を元のデザインに戻す） */
  .is-anim main .kk-done.kk-done { clip-path: none; }

  /* 読み込み時のアニメーションは終わったら効果を残さない（backwards）。clip-path などが残ると字面や重なり順に影響するため */
  /* 読み込み時：トップの KV */
  .is-anim .p-hero__visual { animation: kk-fade 1.6s cubic-bezier(.22, .61, .36, 1) backwards; }
  .is-anim .p-hero__catch > span { animation: kk-reveal 1.1s cubic-bezier(.77, 0, .18, 1) .5s backwards; }
  .is-anim .p-hero__catch > span + span { animation-delay: .75s; }
  .is-anim .p-hero__bubble { animation: kk-pop .9s cubic-bezier(.34, 1.56, .64, 1) 1.1s backwards; }
  .is-anim .p-hero__bubble--02 { animation-delay: 1.25s; }
  .is-anim .p-hero__bubble--03 { animation-delay: 1.4s; }
  /* 読み込み時：下層の大きい写真とページ名 */
  .is-anim .p-lower__hero-img { animation: kk-zoom 1.8s cubic-bezier(.22, .61, .36, 1) backwards; }
  .is-anim .p-lower__title > span { animation: kk-reveal 1s cubic-bezier(.77, 0, .18, 1) .4s backwards; }

  /* フローティング（ゆっくり上下に揺れる） */
  .p-hero__bubble img { animation: kk-float 6s ease-in-out infinite; }
  .p-hero__bubble--02 img { animation-duration: 7s; animation-delay: -2.3s; }
  .p-hero__bubble--03 img { animation-duration: 6.5s; animation-delay: -4.1s; }
  .p-reserve__circle { animation: kk-float-sm 3.6s ease-in-out infinite; }
  .p-reserve__card--web .p-reserve__circle { animation-delay: -1.8s; }
}
/* 縦の見出し「選ばれる理由」は、REASON の写真より手前に出す */
.p-reason__label { z-index: 1; }
@keyframes kk-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes kk-reveal { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0); } }
@keyframes kk-pop { from { opacity: 0; transform: scale(.8); } to { opacity: 1; transform: none; } }
@keyframes kk-zoom { from { opacity: 0; transform: scale(1.05); } to { opacity: 1; transform: none; } }
@keyframes kk-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(calc(var(--u) * -12)); } }
@keyframes kk-float-sm { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(calc(var(--u) * -5)); } }
@media print {
  .is-anim main * { opacity: 1 !important; transform: none !important; clip-path: none !important; }
}

/* 細い線は画面幅で拡大縮小させず、整数の px で描く（0.99px などの端数だと、位置によって 1px と 2px のにじみが混ざる） */
.l-footer__col .is-dash { height: 0; border-top: 1px solid var(--text); background: none; margin-top: calc(0.5cap - 0.5px); } /* 枠線は画素に揃えて描かれるので、位置が端数でもにじまない */
@media (max-width: 899.98px) {
  .l-header__burger span { height: 1px; }
  .l-drawer__sub .is-dash { height: 2px; }
}

/* ---------- 2026-10-07 調整 ---------- */
/* お知らせ：アイキャッチ画像は使わない。空いたぶん本文を広げる */
.p-hero__news-text { width: calc(var(--u) * 620); }

/* 背景の質感：Figma と同じく、元の質感画像（3024px）に色を重ねてブラウザで合成する
   CTA = 紺 #1E5C85 に乗算、選ばれる理由 = 質感の上に #4E8EB7 を 30% */
.p-reserve { background: var(--navy) url(../img/texture.webp) center / cover no-repeat; background-blend-mode: multiply; }
.p-reason { background: linear-gradient(rgba(78, 142, 183, 0.3), rgba(78, 142, 183, 0.3)), url(../img/texture.webp) center top / cover no-repeat; }
@media (min-width: 1441px) {
  .p-reserve { background: var(--navy); }
  .p-reserve::before { background: var(--navy) url(../img/texture.webp) center / cover no-repeat; background-blend-mode: multiply; }
  .p-reason { background: none; }
  .p-reason::before { background: linear-gradient(rgba(78, 142, 183, 0.3), rgba(78, 142, 183, 0.3)), url(../img/texture.webp) center top / cover no-repeat; }
}

/* 準備中：枠線の小さな文字だと潰れるので、塗りの丸ラベルにしてゴシックで読みやすく */
.c-soon {
  display: inline-block;
  margin-left: 0.6em;
  padding: 0.4em 0.75em;
  border: 0;
  border-radius: 999px;
  background: var(--navy);
  color: #fff;
  font-family: var(--sans);
  font-weight: 700;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.08em;
  vertical-align: middle;
  white-space: nowrap;
  text-box: normal;
}
.l-header__btn--web .c-soon,
.c-cta__btn--web .c-soon,
.c-fixed-cta__btn--web .c-soon { background: #fff; color: var(--blue); }
.p-reserve__web .c-soon { display: block; width: fit-content; margin: 0.8em auto 0; font-size: 12px; }
.l-footer__sns .c-soon { margin: 0.4em 0 0; font-size: 10px; }
.l-header__insta .c-soon { margin: 3px 0 0; padding: 0.35em 0.55em; font-size: 9px; letter-spacing: 0.04em; color: #fff; }
@media (max-width: 899.98px) {
  .c-fixed-cta__btn--web .c-soon { font-size: 10px; padding: 0.35em 0.6em; }
}

/* PC：スクロールしてもヘッダー（ロゴ・グローバルナビ）を KV 表示時と同じ形のまま上部に固定する */
@media (min-width: 900px) {
  .l-header { position: sticky; top: 0; z-index: 35; }
  .admin-bar .l-header { top: 32px; }
  /* 目次から飛んだ見出しが固定ヘッダー（130）の下に隠れないように */
  .p-lower__sec { scroll-margin-top: calc(var(--u) * 160); }
}

/* 見出し内の数字のまとまり（kk_title_html の .u-nw）は改行させない。外側の span だけを block にする */
.p-lower__h3 span span { display: inline; }

/* 広い画面（1441px 以上）：固定したヘッダーの白い背景を画面の端から端まで伸ばす（本文が左右の余白に透けないように） */
@media (min-width: 1441px) {
  .l-header::before {
    content: "";
    position: absolute;
    inset: 0 calc(-1 * var(--bleed));
    z-index: -1;
    background: #fff;
  }
}