@charset "UTF-8";
/* 慈恵医大リハビリテーション科 連携プログラム LP（/jikei-rehabilitation/。10/2 に /rehabilitation/ から変更）
   デザイン案A「ホテルライク（漆黒と金）」… ヒーロー案2「シネマ」の作業用コピー（_variants/hero_2）。本番には上げない
   ・release からの変更はファーストビュー（.p-rh-top の中：写真・題字・本文・連携ロゴ）の節だけ。#about 以下の規則は release と同じ
   ・土台は release/rehabilitation/rehabilitation.css（最終案）。文言・リンク・計測・写真は変えず、見た目だけを変える
   ・既存の /assets/css/style.css の後に読み込む。クラスはすべて p-rh- で始め、既存と衝突させない
   ・画像の url() は、確認用サーバーで release の画像をそのまま使うため /jikei-rehabilitation/img/… の絶対パスにしてある
     （本番に採用するときは、release の CSS と同じ相対パス img/… に戻す）
   考え方：墨（夜の色）の面は「扉」だけ。ファーストビューの写真・各章の扉・見学のお誘いの帯に使い、
           暗い面には大きな見出しと短い文だけを置く。長い本文はすべて生成り・白の面で読む。
   色の使い分け：
     --rh-sumi       #1d1a18 … 墨の面（ファーストビュー・章の扉・見学のお誘い・STEP の丸）
     --rh-ivory      #faf7f2 / --rh-ivory2 #f4efe7 … 読む面（生成り）
     --rh-gold       #C39B62 … 明るい面の罫線・飾り（文字には使わない）
     --rh-gold-line  … 暗い面の罫線（金を半分透かす）
     --rh-gold-light #d8bf8f … 暗い面の上の金の文字（墨地 9.7:1）
     --rh-gold-num   #8a6a3a … 明るい面の大きな数字・英字（白 5.0:1／生成り 4.7:1。生成り2 には使わない）
     --rh-gold-dark  #7d5f33 … 明るい面の金系の小さな文字・細い枠（白 5.9:1／生成り 5.5:1／生成り2 5.2:1）
     --rh-on-dark    #f3ede3 … 暗い面の文字（墨地 14.9:1）。補足は --rh-on-dark-sub #cfc5b7（10.1:1）
   書体：見出しは Shippori Mincho（500 の1種類）。英字の小見出しと数字は Cormorant Garamond（細字300・中字500）。
         本文は既存の Noto Sans JP のまま（本文の読みやすさは変えない）。
         Shippori が届くまでの代わりは OS の明朝（ヒラギノ・游明朝）にし、Noto Serif JP を二重に読み込まないようにする */

.p-rh {
  --rh-sumi: #1d1a18;
  --rh-sumi-2: #2a2622;
  --rh-gold: #C39B62;
  --rh-gold-soft: rgba(195, 155, 98, .55);
  --rh-gold-line: rgba(216, 191, 143, .5);
  --rh-gold-light: #d8bf8f;
  --rh-gold-num: #8a6a3a;
  --rh-gold-text: #8a6a3a;
  --rh-gold-dark: #7d5f33;
  --rh-ink: #3F3B39;
  --rh-ink-deep: #2b2725;
  --rh-sub: #5e5751;
  --rh-on-dark: #f3ede3;
  --rh-on-dark-sub: #cfc5b7;
  --rh-ivory: #faf7f2;
  --rh-ivory2: #f4efe7;
  --rh-beige: var(--rh-ivory);
  --rh-line: #e8e0d3;
  --rh-hair: #dcd0bd;
  --rh-welina: #A8C43C;
  --rh-care: #EDB100;
  --rh-serif: "Shippori Mincho", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "YuMincho", serif;
  --rh-latin: "Cormorant Garamond", "Times New Roman", serif;
  --rh-sans: Roboto, "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  --fs-body: 1.6rem;
  --fs-lead: 1.7rem;
  --fs-meta: 1.5rem;
  --fs-legal: 1.4rem;
  color: var(--rh-ink);
  font-size: var(--fs-body);
  line-height: 1.95;
  letter-spacing: .03em;
  text-align: left;
  line-break: strict;
}
/* p・ul・ol・li の余白と list-style は style.css のリセットで0。
   見出しと画像のリセットは :where() で詳細度0にして、各部品の margin などが必ず効くようにする */
:where(.p-rh) :is(h1, h2, h3, h4) { margin: 0; font-weight: 500; }
:where(.p-rh) img { max-width: 100%; height: auto; }
.p-rh a:hover { text-decoration: none; }

/* 本文中の【要確認】。公開前にすべて消す（黄色い下地のまま、どの面でも目立たせる） */
.p-rh-todo {
  background: #fff3b0;
  color: #7a5a00;
  font-size: .85em;
  padding: 0 .3em;
  border-radius: 2px;
  font-family: var(--rh-sans);
  letter-spacing: 0;
}

/* 文節のまとまり（.p-rh-nw）の中では折り返さず、まとまりの境目でだけ折り返す（release と同じ。HTML は触らない）
   ・境目には HTML 側で <wbr> を置いてある
   ・inline のまま使う（inline-block にすると、iPhone の読み上げが文節ごとに途切れる）
   ・中にさらにまとまりを持つ長い句だけは .p-rh-nw--box：収まる行があれば丸ごと次の行へ送る */
.p-rh-nw { white-space: nowrap; }
.p-rh-nw--box { display: inline-block; max-width: 100%; white-space: normal; text-indent: 0; }

/* ---------- サイト共通ヘッダーのメニュー（このページだけの調整） ----------
   10/1 に「コラム」「東急ウェリナケア」（どちらも東急ウェリナケアのサイトへ）を足して6項目になったため、
   サイトの設定（15px・字間 .12em・項目の間 1.6em）のままでは 1200px 未満で入りきらず、項目の中で2行に折れる。
   どの幅でも1項目を1行に保ち、狭い PC とタブレットでは文字と間隔を詰める（スマホのメニューは縦並びなので変えない） */
@media screen and (min-width: 769px) {
  .p-header__logo { flex-shrink: 0; }
  .p-header__gnav-menu-link { white-space: nowrap; }
}
@media screen and (min-width: 1001px) and (max-width: 1199px) {
  .p-header__gnav-menu-item { margin-left: 1em; }
  .p-header__gnav-menu-link { font-size: 1.4rem; letter-spacing: .04em; }
}
/* タブレット（769〜1000px）：ロゴを少し小さく、左右の余白を詰め、メニューのホームのアイコンは出さない（ロゴがトップへのリンクを兼ねる） */
@media screen and (min-width: 769px) and (max-width: 1000px) {
  .l-header__inner { padding-left: 20px; padding-right: 20px; }
  .p-header__logo { max-width: 180px; }
  .p-header__gnav-menu-item--home { display: none; }
  .p-header__gnav-menu-item { margin-left: .9em; }
  .p-header__gnav-menu-link { font-size: clamp(1.2rem, 1.6vw, 1.4rem); letter-spacing: 0; }
}

/* ---------- 共通 ---------- */
.p-rh-inner { max-width: 1000px; margin: 0 auto; padding: 0 20px; box-sizing: content-box; }
.p-rh-section { --rh-pad: 120px; padding: var(--rh-pad) 0; }
.p-rh-section--sub { --rh-pad: 108px; }
.p-rh-section--detail { --rh-pad: 108px; }
.p-rh-section--beige { background: var(--rh-ivory); }

/* 見出しの共通：上から 番号 → 英字の小見出し → 和文の見出し（HTML の順と同じ） */
.p-rh-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.p-rh-head__title {
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: 3.8rem;
  line-height: 1.7;
  letter-spacing: .14em;
  font-feature-settings: "palt";
  text-wrap: balance;
  word-break: auto-phrase;
}
/* 英字の小見出し：Cormorant の大文字を広い字間で。左右に短い金の線 */
.p-rh-head__en {
  display: flex;
  align-items: center;
  gap: 18px;
  font-family: var(--rh-latin);
  font-weight: 500;
  font-size: 1.6rem;
  line-height: 1.3;
  letter-spacing: .42em;
  text-transform: uppercase;
  color: var(--rh-gold-text);
}
.p-rh-head__en::before,
.p-rh-head__en::after {
  content: "";
  width: 32px;
  height: 1px;
  background: currentColor;
  opacity: .75;
}
/* 字間の余り（最後の字の後ろ）を打ち消して、線を左右対称にする */
.p-rh-head__en::after { margin-left: -.42em; }

/* 章の扉：画面の端まで墨の帯。上から金の細い線が降りてきて、大きな番号 → 英字 → 見出し。
   帯は border-image の外側への広がりで描く（レイアウトの幅は変わらず、横スクロールも出ない） */
.p-rh-head--chapter {
  position: relative;
  margin: calc(-1 * var(--rh-pad)) 0 88px;
  padding: 100px 0 92px;
  color: var(--rh-on-dark);
  border-image: linear-gradient(180deg, #24201d, var(--rh-sumi) 60%) fill 0 / / 0 100vw;
}
.p-rh-head--chapter::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 64px;
  background: linear-gradient(rgba(216, 191, 143, 0), var(--rh-gold-light));
}
/* 帯の下端の小さな菱形（墨と生成りの継ぎ目の留め金） */
.p-rh-head--chapter::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -6px;
  width: 11px;
  height: 11px;
  margin-left: -6px;
  border: 1px solid var(--rh-gold);
  background: var(--rh-sumi);
  transform: rotate(45deg);
}
.p-rh-head__no {
  display: block;
  font-family: var(--rh-latin);
  font-weight: 300;
  font-size: 9.6rem;
  line-height: .9;
  letter-spacing: .02em;
  font-variant-numeric: lining-nums;
  color: var(--rh-gold-light);
}
.p-rh-head--chapter .p-rh-head__en { margin-top: 26px; color: var(--rh-gold-light); }
.p-rh-head--chapter .p-rh-head__title { margin-top: 24px; color: #f7f2e9; }

/* 節の見出し（明るい面）：英字の小見出しの下に、左右へ金の細い罫線を引いた和文の見出し */
.p-rh-head--sub { margin-bottom: 60px; }
.p-rh-head--sub .p-rh-head__en::before,
.p-rh-head--sub .p-rh-head__en::after { display: none; }
.p-rh-head--sub .p-rh-head__en { margin-right: -.42em; }
.p-rh-head--sub .p-rh-head__title {
  display: flex;
  align-items: center;
  gap: 36px;
  width: 100%;
  margin-top: 18px;
  font-size: 3.2rem;
  color: var(--rh-ink-deep);
}
.p-rh-head--sub .p-rh-head__title::before,
.p-rh-head--sub .p-rh-head__title::after {
  content: "";
  flex: 1 1 0;
  min-width: 24px;
  height: 1px;
  background: linear-gradient(90deg, rgba(195, 155, 98, 0), var(--rh-gold));
}
.p-rh-head--sub .p-rh-head__title::after { background: linear-gradient(90deg, var(--rh-gold), rgba(195, 155, 98, 0)); }
.p-rh-head__text { flex: 0 1 auto; }

.p-rh-lead {
  max-width: 40em;
  margin: 0 auto;
  font-size: var(--fs-lead);
  line-height: 2.1;
  text-wrap: pretty;
}
.p-rh-lead + .p-rh-lead { margin-top: 1em; }
.p-rh-lead--center { text-align: center; margin-bottom: 80px; }
.p-rh-lead--after { margin-top: 72px; }

/* 「Program 01」の番号（飾り）：英字は Cormorant の大文字、数字は細字 */
.p-rh-no {
  display: flex;
  align-items: baseline;
  gap: 16px;
  font-family: var(--rh-latin);
  font-weight: 300;
  font-size: 6.4rem;
  line-height: .9;
  letter-spacing: .02em;
  font-variant-numeric: lining-nums;
  color: var(--rh-gold-num);
}
.p-rh-no span {
  font-weight: 500;
  font-size: 1.5rem;
  letter-spacing: .36em;
  text-transform: uppercase;
  color: var(--rh-gold-text);
}
.p-rh-no--lg {
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  font-size: 12rem;
  line-height: .78;
}

/* ---------- ファーストビュー：ヒーロー案2「シネマ」（横長の写真＋墨の題字帯） ---------- */
/* 映画の一場面のように、画面の端から端まで横長の写真を見せ、その下の墨の帯に題字を置く（映画の題字・字幕の帯のイメージ）。
   ・写真には文字・墨のぼかし・飾りを一切重ねない。写真は v2（1280×800 で約717×347）より大きく、画面の幅いっぱいに見せる
   ・白い札（本文・ブランド・連携ロゴ）は、墨の帯の下端から少し立ち上がる（写真には掛けない）
   構成（HTML の順番は元のまま。バッジと題字だけ .p-rh-hero__panel で包んである）
   .p-rh-top（包み）…生成り2 の地。写真 → 墨の題字帯 → 白い札 → ページ内ナビ の縦積み
   .p-rh-hero は1列のグリッド。.p-rh-hero__body は display: contents にして、題字帯・本文・ブランドを直接並べる
     1行目＝写真（::before）／2行目＝墨の題字帯（.p-rh-hero__panel）／3行目＝本文／4行目＝ブランド
     ::after … 白い札の上半分（白地と、金の細い内枠の上辺・左右。下半分は .p-rh-sign が続ける）
   写真の高さ（1行目）は画面の高さから決め、1画面目に札の連携ロゴと「監修・実地指導」まで入れる */
.p-rh-top {
  --rh-plate-w: min(960px, calc(100% - 80px));
  --rh-rise: 32px; /* 白い札が墨の帯に重なる高さ */
  padding-top: 101px;
  background: var(--rh-ivory2);
}
/* 写真の高さ ＝ 画面の高さ − 468px − 題字の行の高さ（題字の大きさ × 1.35）。
   468px の内訳：ヘッダー 101・題字帯の題字以外 約71（上下の余白 21＋21・バッジ 23・すき間 6）・
   札の上端から「監修・実地指導」の下端まで 約284（本文の行間 1.95、ロゴと、講座名・「監修・実地指導」の2段。段の間 18px）・画面の下の余白 約12。
   題字は画面の幅で大きさが変わるので、その分だけ写真を低くして、ロゴと「監修・実地指導」を必ず1画面目に入れる。
   1280×800 で 1280×282、1366×768 で 1366×247、1440×900 で 1440×376。上限 640px・下限 240px。
   本文・ブランドの行数や行間、札の段数・段の間が変わったら、この 468px を見直す */
.p-rh-hero {
  --rh-vh: 100vh;
  --rh-title-fs: clamp(2.4rem, 2.55vw, 4rem); /* 27字を字間 .2em で1行に収める（1001px でも入る大きさまで小さくなる） */
  --rh-photo-h: clamp(240px, var(--rh-vh) - 468px - var(--rh-title-fs) * 1.35, 640px);
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: var(--rh-photo-h) auto auto auto;
}
/* 画面の高さは、アドレスバーが出ているときの高さ（svh）で測る。svh を知らない古いブラウザは vh のまま
   （変数を2回書く方法だと古いブラウザで写真の行ごと無効になるため、@supports で切り替える） */
@supports (height: 100svh) {
  .p-rh-hero { --rh-vh: 100svh; }
}
.p-rh-hero__body { display: contents; }
/* 写真：スライド（10/1）。幅いっぱいに敷き（横は切らない）、縦だけを切る。写真の上には何も重ねない
   （右下の一時停止ボタン・下の印・左下の場所の説明だけ）。
   1枚目は健康体操、2枚目は機能訓練指導員（ウェリナインタビュー vol.03 のKVの上部。枠が縦に高い画面ではおひとりずつ2枚）、次に機能訓練のようす（広告写真2枚の組み合わせ。PC用とスマホ用の2種類）、続いて東急ウェリナ大岡山（ラウンジ・庭園。ダイニング・居室は 10/1 のご指示で外した）。
   切り取る上下の位置は写真ごとに HTML の --pos（PC）・--pos-sp（スマホ）で決める。
   健康体操は 16%（先生の指先の少し上から、腕を上げる入居者の皆さままで）。
   5秒ごとに 1.4秒かけて重ねて切り替え（10/1 に 6.5秒から短縮）、表示中の写真はゆっくり少しだけ寄る（動きを減らす設定では動かさない） */
.p-rh-slides {
  grid-area: 1 / 1;
  position: relative;
  overflow: hidden;
  background: #3a332d;
}
.p-rh-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.4s ease;
}
.p-rh-slide.is-active { opacity: 1; }
.p-rh-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--pos, 50% 50%);
}
.p-rh-slide.is-active img { animation: rh-slide-zoom 7s ease-out both; }
@keyframes rh-slide-zoom {
  from { transform: scale(1.05); }
  to { transform: scale(1); }
}
/* 写真の場所の説明（左下・小さく）。写真の明るい所でも読めるよう、文字のまわりに薄い影 */
.p-rh-slide__cap {
  position: absolute;
  left: 20px;
  bottom: 14px;
  font-size: 1.3rem;
  line-height: 1.5;
  letter-spacing: .12em;
  color: #fff;
  text-shadow: 0 0 8px rgba(0, 0, 0, .6), 0 1px 3px rgba(0, 0, 0, .6);
}
/* 何枚目かの印（右下・一時停止ボタンのすぐ左。10/1 のご指示で下の中央から移した）：細い線。表示中の1本だけ金色。
   ボタン（右 16px・下 8px・44px角）の左に 16px 空け、線の高さをボタンの中心にそろえる */
.p-rh-slides__dots {
  grid-area: 1 / 1;
  align-self: end;
  justify-self: end;
  z-index: 1;
  display: flex;
  gap: 8px;
  margin: 0 76px 29px 0;
}
.p-rh-slides__dots i {
  display: block;
  width: 22px;
  height: 2px;
  background: rgba(255, 255, 255, .6);
  transition: background-color .6s;
}
.p-rh-slides__dots i.is-active { background: var(--rh-gold-light); }
/* 画面による出し分け（10/1）：写真の枠が縦に高いとき（スクリプトが .p-rh-hero に is-rh-narrow を付ける）は、
   機能訓練指導員をおひとりずつ2枚に分け、機能訓練のようすをスマホ用に替える（--narrow を出し、--wide を出さない）。印も同じく出し分ける */
.p-rh-slide--narrow,
.p-rh-slides__dots .p-rh-dot--narrow,
.is-rh-narrow .p-rh-slide--wide,
.is-rh-narrow .p-rh-slides__dots .p-rh-dot--wide { display: none; }
.is-rh-narrow .p-rh-slide--narrow,
.is-rh-narrow .p-rh-slides__dots .p-rh-dot--narrow { display: block; }
/* 一時停止・再開のボタン（右下）。押せる大きさは 44px。止めている間は再生の印（三角）になる */
.p-rh-slides__toggle {
  grid-area: 1 / 1;
  align-self: end;
  justify-self: end;
  z-index: 1;
  position: relative;
  width: 44px;
  height: 44px;
  margin: 0 16px 8px 0;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .75);
  border-radius: 50%;
  background: rgba(29, 26, 24, .5);
  cursor: pointer;
}
.p-rh-slides__toggle span {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 12px;
  margin: -6px 0 0 -5px;
  border-left: 3px solid #fff;
  border-right: 3px solid #fff;
  box-sizing: border-box;
}
.p-rh-slides__toggle.is-paused span {
  width: 0;
  height: 0;
  margin: -6px 0 0 -3px;
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #fff;
}
.p-rh-slides__toggle:focus-visible { outline: 2px solid var(--rh-gold-light); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  .p-rh-slide { transition: none; }
  .p-rh-slide.is-active img { animation: none; }
}
/* 墨の題字帯：画面の端から端まで。中央にバッジと題字。下端の --rh-rise の分は、白い札の下に入る。
   地は章の扉と同じ墨のグラデーション。写真との継ぎ目（帯の上端）に金の細い線を1本（帯の内側に描き、写真には掛けない） */
.p-rh-hero__panel {
  grid-area: 2 / 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: calc(-1 * var(--rh-rise));
  padding: 21px 40px calc(21px + var(--rh-rise));
  background: linear-gradient(180deg, #24201d, var(--rh-sumi) 60%);
  box-shadow: inset 0 1px var(--rh-gold-line);
  color: var(--rh-on-dark);
  text-align: center;
}
/* バッジ：左右に金の細い線、金の文字（墨地 9.7:1） */
.p-rh-hero__badge {
  display: flex;
  align-items: center;
  gap: 16px;
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: 1.5rem;
  line-height: 1.5;
  letter-spacing: .3em;
  color: var(--rh-gold-light);
}
.p-rh-hero__badge::before,
.p-rh-hero__badge::after {
  content: "";
  flex: none;
  width: 48px;
  height: 1px;
  background: var(--rh-gold-light);
}
/* 字間の余り（最後の字の後ろ）を打ち消して、左右の線を対称にする */
.p-rh-hero__badge::after { margin-left: -.3em; }
/* 題字：白い明朝を広い字間（.2em）で。PC は1行（慈恵医大リハビリテーション科の知見を、毎日の暮らしに。）。
   字間が狭いと文字どうしが詰まって見えるため、文字を少し小さくして字間を広げた（行の長さはほぼ同じ）。
   字間の余り（最後の字の後ろ）と同じだけ左にも足して、帯の中央にそろえる */
.p-rh-hero__title {
  margin-top: 6px;
  padding-left: .2em;
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: var(--rh-title-fs);
  line-height: 1.35;
  letter-spacing: .2em;
  color: #fff;
  font-feature-settings: "palt";
}
/* 白い札の上半分（本文とブランドの地）。墨の帯に --rh-rise だけ重なり、帯から立ち上がって見える */
.p-rh-hero::after {
  content: "";
  grid-area: 3 / 1 / 5 / 2;
  justify-self: center;
  z-index: 0;
  width: var(--rh-plate-w);
  background:
    linear-gradient(var(--rh-gold), var(--rh-gold)) 10px 10px / calc(100% - 20px) 1px no-repeat,
    linear-gradient(var(--rh-gold), var(--rh-gold)) 10px 10px / 1px 100% no-repeat,
    linear-gradient(var(--rh-gold), var(--rh-gold)) calc(100% - 10px) 10px / 1px 100% no-repeat,
    #fff;
}
/* 白い札の中は、行間と段の間をゆったり取る（本文の行間 1.95・本文とブランドの間 10px）。詰めると窮屈に見える */
.p-rh-hero__sub {
  grid-area: 3 / 1;
  justify-self: center;
  z-index: 1;
  width: var(--rh-plate-w);
  padding: 28px 56px 0;
  font-size: 1.6rem;
  line-height: 1.95;
  letter-spacing: .04em;
  text-align: center;
}
.p-rh-hero__brands {
  grid-area: 4 / 1;
  justify-self: center;
  z-index: 1;
  width: var(--rh-plate-w);
  padding: 10px 56px 0;
  font-size: 1.5rem;
  line-height: 1.8;
  letter-spacing: .06em;
  text-align: center;
  color: var(--rh-sub);
}

/* 連携ロゴ：白い札の下半分。左右と下に金の細い内枠（上半分の枠とつながる）、菱形の飾り罫の下にロゴ */
.p-rh-logo-jikei { display: block; height: auto; overflow: hidden; }
.p-rh-sign {
  width: var(--rh-plate-w);
  margin: 0 auto;
  padding: 16px 56px 26px;
  background:
    linear-gradient(var(--rh-gold), var(--rh-gold)) 10px 0 / 1px calc(100% - 10px) no-repeat,
    linear-gradient(var(--rh-gold), var(--rh-gold)) calc(100% - 10px) 0 / 1px calc(100% - 10px) no-repeat,
    linear-gradient(var(--rh-gold), var(--rh-gold)) 10px calc(100% - 10px) / calc(100% - 20px) 1px no-repeat,
    #fff;
  box-shadow: 0 36px 48px -44px rgba(40, 32, 24, .45);
  text-align: center;
}
/* 飾り罫の上の余白は札の padding で取る（margin にすると札の外へ抜けて、上半分との間にすき間ができる） */
.p-rh-sign::before {
  content: "";
  display: block;
  width: 220px;
  height: 11px;
  margin: 0 auto 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 11'%3E%3Cpath d='M0 5.5h96M124 5.5h96' stroke='%23C39B62' stroke-width='1'/%3E%3Cpath d='M110 .9l4.6 4.6-4.6 4.6-4.6-4.6z' fill='none' stroke='%23C39B62'/%3E%3C/svg%3E") center / 220px 11px no-repeat;
}
.p-rh-sign__logos {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
}
.p-rh-sign__tw { display: block; width: 186px; height: auto; }
.p-rh-sign__jikei { width: 246px; }
/* 「×」は飾り（読み上げない）だが、文字なので数字と同じ濃い金（白地 5.0:1）にする */
.p-rh-sign__x {
  font-family: var(--rh-latin);
  font-weight: 300;
  font-size: 3rem;
  line-height: 1;
  color: var(--rh-gold-num);
}
.p-rh-sign__caption {
  margin-top: 16px;
  font-size: 1.5rem;
  line-height: 1.8;
  letter-spacing: .06em;
}
/* 「監修・実地指導」は墨の地に金の文字（9.7:1）。この札の主役 */
.p-rh-sign__role {
  display: inline-block;
  padding: 0 16px;
  background: var(--rh-sumi);
  color: var(--rh-gold-light);
  font-size: var(--fs-meta);
  line-height: 1.8;
  letter-spacing: .16em;
  vertical-align: 1px;
}

/* PC（1001px〜）：題字は1行（PC用の改行 <br class="u-pc_display"> を外す。.u-pc_display が display:block !important のため !important で上書き）。
   札の下半分は2段：1段目にロゴ2つ、2段目に講座名と「監修・実地指導」（1列に並べるとごちゃつくため）。
   段が増える分は余白とロゴの大きさを詰めて、写真を低くしすぎないようにする */
@media screen and (min-width: 1001px) {
  .p-rh-hero__title br.u-pc_display { display: none !important; }
  .p-rh-sign { padding: 18px 40px 22px; }
  .p-rh-sign::before { margin-bottom: 16px; }
  .p-rh-sign__logos { gap: 18px; }
  .p-rh-sign__tw { width: 172px; }
  .p-rh-sign__jikei { width: 226px; }
  .p-rh-sign__x { font-size: 2.6rem; }
  /* ロゴと講座名の行の間はゆったり空ける（詰めると札の中が窮屈に見える） */
  .p-rh-sign__caption { margin-top: 18px; line-height: 1.6; }
  .p-rh-sign__role { line-height: 1.6; }
}

/* タブレット・スマホ（〜1000px）：写真 → 墨の帯 → 白い札 の縦積みは同じ。題字は2行（PC用の改行を使う）、
   札の下半分は ロゴ（横並び）→ 説明と「監修・実地指導」 の2段 */
@media screen and (max-width: 1000px) {
  .p-rh-top { --rh-plate-w: calc(100% - 96px); }
  .p-rh-hero { --rh-photo-h: clamp(260px, min(50vw, var(--rh-vh) - 440px), 480px); }
  .p-rh-hero__title { margin-top: 10px; font-size: clamp(2.8rem, 3.6vw, 3.6rem); line-height: 1.5; }
  .p-rh-hero__sub { padding-left: 44px; padding-right: 44px; text-wrap: balance; }
  .p-rh-hero__brands { padding-left: 44px; padding-right: 44px; }
  .p-rh-sign { padding-left: 40px; padding-right: 40px; }
}
/* 769〜899px：PC の改行位置のままだと本文の1行目が入りきらないので、PC用の <br> を外して語のまとまりで折り返す */
@media screen and (min-width: 769px) and (max-width: 899px) {
  .p-rh-hero__sub br.u-pc_display { display: none !important; }
}
/* スマホ（〜768px）：写真は 3:2 で全体を見せる（何も重ねない）→ 墨の帯（バッジと題字3行）→ 白い札（本文・ブランド・ロゴ）。
   札は墨の帯にだけ 28px 重ねる。題字は4行（「慈恵医大／リハビリテーション科の／知見を、／毎日の暮らしに。」）。「リハビリテーション科の」が 320px でも1行に入る大きさにする。PC用の改行もここで使う */
@media screen and (max-width: 768px) {
  .p-rh-top { --rh-plate-w: calc(100% - 24px); --rh-rise: 28px; padding-top: 53px; }
  .p-rh-hero { --rh-photo-h: 66.667vw; }
  /* スライド：スマホ用の切り取り位置（--pos-sp）。印は狭い画面では場所の説明と重なるので出さない */
  .p-rh-slide img { object-position: var(--pos-sp, var(--pos, 50% 50%)); }
  .p-rh-slide__cap { left: 12px; bottom: 10px; letter-spacing: .06em; }
  .p-rh-slides__dots { display: none; }
  .p-rh-slides__toggle { margin: 0 10px 6px 0; }
  .p-rh-hero__panel { padding: 30px 16px calc(34px + var(--rh-rise)); }
  .p-rh-hero__badge { gap: 14px; letter-spacing: .24em; }
  .p-rh-hero__badge::after { margin-left: -.24em; }
  .p-rh-hero__badge::before,
  .p-rh-hero__badge::after { width: 30px; }
  /* 題字は帯の幅いっぱいに取る（文字の幅ぴったりに縮めると、端数の差で「リハビリテーション科の」の「の」が次の行に落ちる）。
     字間は .1em。「リハビリテーション科の」が 320px でも1行に入るよう、文字は画面幅の 7.2% まで */
  .p-rh-hero__title {
    align-self: stretch;
    margin-top: 14px;
    padding-left: .1em;
    font-size: min(2.7rem, 7.2vw);
    line-height: 1.55;
    letter-spacing: .1em;
    text-align: center;
  }
  .p-rh-hero__title br.u-pc_display { display: inline !important; }
  .p-rh-hero__sub {
    padding: 32px 18px 0;
    font-size: 1.6rem;
    line-height: 1.95;
    letter-spacing: .02em;
    text-wrap: balance;
  }
  .p-rh-hero__brands { padding: 12px 18px 0; font-size: 1.5rem; letter-spacing: 0; line-height: 1.75; font-feature-settings: "palt"; }
  .p-rh-sign { padding: 22px 16px 32px; }
  .p-rh-sign::before { width: 180px; margin: 0 auto 20px; }
  .p-rh-sign__logos { flex-direction: column; gap: 12px; }
  .p-rh-sign__tw { width: 184px; }
  .p-rh-sign__jikei { width: min(270px, 100%); }
  .p-rh-sign__x { font-size: 2.6rem; }
  .p-rh-sign__caption { margin-top: 16px; letter-spacing: .02em; line-height: 1.7; }
  .p-rh-sign__role { margin-top: 10px; }
}
/* 大きいスマホ横向き・iPad mini 縦（600〜768px）：札を少し狭め、ロゴを横に並べる */
@media screen and (min-width: 600px) and (max-width: 768px) {
  .p-rh-top { --rh-plate-w: calc(100% - 96px); }
  .p-rh-hero__title { font-size: clamp(3rem, 4.6vw, 3.4rem); }
  .p-rh-hero__sub,
  .p-rh-hero__brands { padding-left: 40px; padding-right: 40px; }
  .p-rh-sign { padding-left: 40px; padding-right: 40px; }
  .p-rh-sign__logos { flex-direction: row; gap: 24px; }
  .p-rh-sign__tw { width: 170px; }
  .p-rh-sign__jikei { width: 230px; }
}
/* 小さいスマホ（360px 以下）：文字の大きさは保ち、札の左右の余白を詰める */
@media screen and (max-width: 360px) {
  .p-rh-top { --rh-plate-w: calc(100% - 16px); }
  .p-rh-hero__sub { padding: 30px 10px 0; letter-spacing: 0; }
  .p-rh-hero__brands { padding-left: 10px; padding-right: 10px; }
  .p-rh-sign { padding: 22px 10px 32px; }
}

/* ページ内ナビ：01〜04 の番号（Cormorant）で、下の章の扉の番号と対応させる */
.p-rh-anchor {
  margin-top: 56px;
  border-top: 1px solid var(--rh-gold-soft);
  border-bottom: 1px solid var(--rh-gold-soft);
}
.p-rh-anchor__list {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: content-box;
  display: flex;
  counter-reset: rh-nav;
}
.p-rh-anchor__item { flex: 1; position: relative; }
.p-rh-anchor__item + .p-rh-anchor__item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 1px;
  height: 28px;
  margin-top: -14px;
  background: var(--rh-gold-soft);
}
.p-rh-anchor__item a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 72px;
  padding: 12px 8px;
  font-size: 1.5rem;
  line-height: 1.5;
  letter-spacing: .12em;
  color: var(--rh-ink-deep);
  text-decoration: none;
  background: linear-gradient(var(--rh-gold), var(--rh-gold)) no-repeat 50% 100% / 0 2px;
  transition: background-size .3s ease-out;
}
.p-rh-anchor__item a:hover { background-size: 56px 2px; }
.p-rh-anchor__item a::before {
  counter-increment: rh-nav;
  content: counter(rh-nav, decimal-leading-zero);
  flex: none;
  font-family: var(--rh-latin);
  font-size: 1.9rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: .04em;
  font-variant-numeric: lining-nums;
  color: var(--rh-gold-dark);
}
.p-rh-anchor__item a::after {
  content: "";
  flex: none;
  width: 7px;
  height: 7px;
  margin-top: -4px;
  border-right: 1px solid var(--rh-gold-dark);
  border-bottom: 1px solid var(--rh-gold-dark);
  transform: rotate(45deg);
}

/* ---------- 背景（課題） ---------- */
.p-rh-issue {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  margin-top: 88px;
}
/* 01・02 も上を 40px あけ、白いカード（03）の中の番号と高さをそろえる */
.p-rh-issue__item { padding: 40px 34px 12px; }
.p-rh-issue__item + .p-rh-issue__item { border-left: 1px solid var(--rh-hair); }
/* 03＝答え。白い面と金の内枠で「問題 → 解決」を見せる */
.p-rh-issue__item:last-child {
  position: relative;
  border-left: 0;
  margin-left: 28px;
  padding: 40px 30px 40px;
  background: #fff;
  outline: 1px solid var(--rh-gold);
  outline-offset: -10px;
  box-shadow: 0 30px 50px -40px rgba(40, 32, 24, .35);
}
/* 01・02（課題）から 03（答え）へ：すき間に小さな金の山形 */
.p-rh-issue__item:last-child::before {
  content: "";
  position: absolute;
  left: -19px;
  top: 50%;
  width: 9px;
  height: 9px;
  margin-top: -5px;
  border-top: 1px solid var(--rh-gold-dark);
  border-right: 1px solid var(--rh-gold-dark);
  transform: rotate(45deg);
}
.p-rh-issue__num {
  font-family: var(--rh-latin);
  font-weight: 300;
  font-size: 6.4rem;
  line-height: .9;
  letter-spacing: .02em;
  font-variant-numeric: lining-nums;
  color: var(--rh-gold-num);
}
.p-rh-issue__title {
  margin: 22px 0 16px;
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: clamp(1.8rem, 1.55vw, 2rem);
  line-height: 1.7;
  letter-spacing: .05em;
  color: var(--rh-ink-deep);
  font-feature-settings: "palt";
  /* 段が狭いとき「知見／を」のように1字だけ送らない（Chrome・Edge は語の切れ目で折る） */
  word-break: auto-phrase;
}
.p-rh-issue__text { font-size: var(--fs-body); line-height: 1.95; text-wrap: pretty; }
/* 本文の段落は、文節ごとに .p-rh-nw で包んである（文節の切れ目でだけ折り返す）。
   word-break: auto-phrase は Chrome だけの機能なので、本文には使わない */

/* ---------- 連携体制 ---------- */
.p-rh-partner {
  display: flex;
  align-items: stretch;
  justify-content: center;
  margin-top: 28px;
}
/* 角は立てる（ホテルの案内状のように）。慈恵医大（監修）の枠だけ金の二重線 */
.p-rh-partner__box {
  position: relative;
  flex: 1;
  min-width: 0;
  max-width: 300px;
  border: 1px solid var(--rh-hair);
  background: #fff;
  padding: 48px 20px 36px;
  text-align: center;
}
.p-rh-partner__box--main { border-color: var(--rh-gold); }
.p-rh-partner__box--main::after {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1px solid var(--rh-gold);
  pointer-events: none;
}
.p-rh-partner__logo {
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}
.p-rh-partner__logo .p-rh-logo-jikei { width: 250px; max-width: 100%; }
.p-rh-partner__logo-tw { display: block; width: 196px; height: auto; }
.p-rh-partner__logo-tokyu { display: block; width: 92px; height: auto; }
.p-rh-partner__name {
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: 1.7rem;
  line-height: 1.6;
  letter-spacing: .08em;
}
/* 役割は枠の上辺に切り欠きで載せる */
.p-rh-partner__role {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 0 14px;
  background: #fff;
  color: var(--rh-gold-dark);
  font-size: var(--fs-meta);
  line-height: 1.6;
  letter-spacing: .1em;
  white-space: nowrap;
}
/* 慈恵医大の役割（監修・実地指導）は墨の地に金の文字（9.7:1）。この枠の主役 */
.p-rh-partner__box--main .p-rh-partner__role {
  padding: 3px 16px;
  background: var(--rh-sumi);
  color: var(--rh-gold-light);
  letter-spacing: .12em;
}
.p-rh-partner__x {
  display: flex;
  align-items: center;
  padding: 0 18px;
  font-family: var(--rh-latin);
  font-weight: 300;
  font-size: 3.2rem;
  color: var(--rh-gold-num);
}
/* 東急100年パートナーのロゴと、東急グループの一文を横に並べる（一文の「人生100年時代のパートナーとして」と対になる）。
   ロゴを押すと東急100年パートナーのページ（tokyu-laviere.co.jp/100partner）が新しいタブで開く。スマホではロゴを一文の上に */
.p-rh-partner-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 40px;
  margin-top: 72px;
}
.p-rh-partner-note .p-rh-lead--after { margin: 0; }
.p-rh-partner-note__badge {
  flex: none;
  display: block;
  width: 120px;
  border-radius: 50%;
  transition: opacity .2s, transform .2s;
}
.p-rh-partner-note__badge img { display: block; width: 100%; height: auto; }
.p-rh-partner-note__badge:hover { opacity: .85; transform: translateY(-2px); }
.p-rh-partner-note__badge:focus-visible { outline: 2px solid var(--rh-gold); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
  .p-rh-partner-note__badge { transition: none; }
  .p-rh-partner-note__badge:hover { transform: none; }
}
@media screen and (max-width: 768px) {
  .p-rh-partner-note { flex-direction: column; gap: 24px; margin-top: 48px; }
  .p-rh-partner-note__badge { width: 104px; }
}

/* ---------- 監修 ---------- */
.p-rh-doctor {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 80px;
  align-items: start;
  max-width: 920px;
  margin: 0 auto;
}
.p-rh-doctor__photo {
  position: relative;
  isolation: isolate;
  margin: 0 18px 18px 0;
}
.p-rh-doctor__photo::before {
  content: "";
  position: absolute;
  inset: 18px -18px -18px 18px;
  border: 1px solid var(--rh-gold);
  z-index: -1;
}
.p-rh-doctor__photo img { display: block; width: 100%; }
.p-rh-doctor__body { padding-top: 12px; }
.p-rh-doctor__org {
  font-size: 1.5rem;
  line-height: 1.85;
  letter-spacing: .08em;
  color: var(--rh-sub);
}
.p-rh-doctor__name {
  margin-top: 12px;
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: 4rem;
  line-height: 1.4;
  letter-spacing: .26em;
  color: var(--rh-ink-deep);
}
.p-rh-doctor__name::after {
  content: "";
  display: block;
  width: 48px;
  height: 1px;
  margin: 26px 0 30px;
  background: var(--rh-gold);
}
/* 略歴：年月（左）と経歴（右）の2列。行の間に細い線。年月は数字の幅をそろえる */
.p-rh-career__title {
  font-family: var(--rh-serif);
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .3em;
  color: var(--rh-gold-dark);
}
.p-rh-career {
  margin: 12px 0 0;
  border-top: 1px solid var(--rh-gold-soft);
}
.p-rh-career > div {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 0 24px;
  padding: 10px 0;
  border-bottom: 1px solid var(--rh-line);
  font-size: 1.5rem;
  line-height: 1.75;
}
.p-rh-career dt {
  color: var(--rh-gold-dark);
  font-variant-numeric: tabular-nums;
  letter-spacing: .02em;
  white-space: nowrap;
}
.p-rh-career dd { margin: 0; }
.p-rh-career__now {
  margin-top: 10px;
  font-size: 1.4rem;
  line-height: 1.6;
  color: var(--rh-sub);
  text-align: right;
}
/* 360px 以下は年月を上、経歴を下に（2列のままだと経歴の段が狭くなりすぎる） */
@media screen and (max-width: 360px) {
  .p-rh-career > div { grid-template-columns: minmax(0, 1fr); }
}
.p-rh-doctor__msg {
  position: relative;
  margin-top: 44px;
  padding: 36px 0 6px 32px;
  border-left: 1px solid var(--rh-gold);
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: 1.7rem;
  line-height: 2.1;
}
.p-rh-doctor__msg::before {
  content: "\201C";
  position: absolute;
  left: 24px;
  top: -14px;
  font-family: var(--rh-latin);
  font-weight: 300;
  font-size: 7.2rem;
  line-height: 1;
  color: var(--rh-gold);
}

/* ---------- 2つのプログラム（概要）：箱をやめ、金の縦線をはさんだ2つの段に ---------- */
.p-rh-programs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto auto;
  gap: 0 112px;
  background: linear-gradient(var(--rh-gold-soft), var(--rh-gold-soft)) 50% 0 / 1px 100% no-repeat;
}
.p-rh-program-card {
  display: grid;
  grid-row: span 2;
  grid-template-rows: subgrid;
}
.p-rh-program-card__head { padding: 0; }
.p-rh-program-card__type {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 30px;
  font-size: var(--fs-meta);
  line-height: 1.6;
  letter-spacing: .14em;
  color: var(--rh-gold-dark);
}
/* ブランドのクローバー（東急ウェリナ＝ライム、東急ウェリナケア＝アンバー）を小さな印として */
.p-rh-program-card__type::before,
.p-rh-detail__label::before,
.p-rh-homes__brand::before {
  content: "";
  flex: none;
  width: 14px;
  height: 14px;
  --c: var(--rh-welina);
  background:
    radial-gradient(circle at 4px 4px, var(--c) 3.3px, transparent 3.8px),
    radial-gradient(circle at 10px 4px, var(--c) 3.3px, transparent 3.8px),
    radial-gradient(circle at 4px 10px, var(--c) 3.3px, transparent 3.8px),
    radial-gradient(circle at 10px 10px, var(--c) 3.3px, transparent 3.8px);
}
.p-rh-program-card--care .p-rh-program-card__type::before,
.p-rh-detail__label--care::before,
.p-rh-homes--care .p-rh-homes__brand::before { --c: var(--rh-care); }
.p-rh-program-card__title {
  margin-top: 10px;
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: clamp(2.4rem, 2.2vw, 2.8rem);
  line-height: 1.55;
  letter-spacing: .1em;
  color: var(--rh-ink-deep);
  text-wrap: balance;
  font-feature-settings: "palt";
}
.p-rh-program-card__body {
  display: flex;
  flex-direction: column;
  padding: 28px 0 0;
}
.p-rh-program-card__target {
  padding: 18px 0;
  border-top: 1px solid var(--rh-gold-soft);
  border-bottom: 1px solid var(--rh-line);
  font-size: 1.5rem;
  line-height: 1.8;
  color: var(--rh-sub);
}
.p-rh-program-card__target b { color: var(--rh-ink-deep); font-weight: 500; }
.p-rh-program-card__text {
  flex: 1;
  margin-top: 26px;
  font-size: var(--fs-body);
  line-height: 1.95;
  text-wrap: pretty;
}
/* 本文の最初の一文（どんな方向けか）を、明朝の一行として先に見せる */
.p-rh-program-card__for {
  display: block;
  margin-bottom: 12px;
  font-family: var(--rh-serif);
  font-size: 2.1rem;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .06em;
  color: var(--rh-ink-deep);
  text-wrap: balance;
  word-break: auto-phrase;
}

/* ボタン：細い墨の枠。触れると下辺に金の帯が伸びる（本体サイトの .c-arrow-button01 と同じ作法）＋矢印 */
.p-rh-program-card__link,
.p-rh-home__links a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 58px;
  padding: 12px 48px;
  border: 1px solid var(--rh-sumi);
  background: transparent linear-gradient(var(--rh-gold), var(--rh-gold)) no-repeat 0 100% / 0 4px;
  color: var(--rh-ink-deep);
  font-size: 1.5rem;
  line-height: 1.4;
  letter-spacing: .12em;
  text-align: center;
  text-decoration: none;
  transition: background-size .35s ease-out, background-color .35s ease-out;
}
.p-rh-program-card__link:hover,
.p-rh-home__links a:hover { background-size: 100% 4px; text-decoration: none; }
.p-rh-program-card__link::after,
.p-rh-home__links a::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 16px;
  width: 16px;
  height: 16px;
  margin: auto;
  background: url(img/arrow_ink.svg) no-repeat 0 0 / contain;
}
.p-rh-program-card__link { margin-top: 36px; }
.p-rh-program-card__link::after { transform: rotate(90deg); }

/* ---------- プログラム詳細 ---------- */
.p-rh-section--cont { padding-top: 0; }
.p-rh-section--cont > .p-rh-inner::before {
  content: "";
  display: block;
  height: 11px;
  margin-bottom: var(--rh-pad);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 11'%3E%3Cpath d='M11 .9l4.6 4.6-4.6 4.6-4.6-4.6z' fill='%23faf7f2' stroke='%23C39B62'/%3E%3C/svg%3E") center / 22px 11px no-repeat,
    linear-gradient(var(--rh-gold), var(--rh-gold)) 0 50% / 100% 1px no-repeat;
}
.p-rh-detail__head {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  align-items: stretch;
}
.p-rh-detail__heading {
  padding: 6px 0 8px 52px;
  border-left: 1px solid var(--rh-gold);
}
.p-rh-detail__label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: var(--fs-meta);
  line-height: 1.6;
  letter-spacing: .14em;
  color: var(--rh-gold-dark);
}
.p-rh-detail__title {
  margin-top: 12px;
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: 3.6rem;
  line-height: 1.55;
  letter-spacing: .1em;
  color: var(--rh-ink-deep);
  font-feature-settings: "palt";
  text-wrap: balance;
}
.p-rh-detail__target {
  position: relative;
  margin-top: 14px;
  padding-left: 22px;
  font-size: 1.5rem;
  line-height: 1.8;
  color: var(--rh-sub);
}
.p-rh-detail__target::before {
  content: "";
  position: absolute;
  left: 1px;
  top: .45em;
  width: 12px;
  height: 15px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 30'%3E%3Cpath fill='%237d5f33' d='M12 0C5.4 0 0 5.2 0 11.6 0 20.3 12 30 12 30s12-9.7 12-18.4C24 5.2 18.6 0 12 0zm0 16a4.4 4.4 0 1 1 0-8.8 4.4 4.4 0 0 1 0 8.8z'/%3E%3C/svg%3E") no-repeat center / contain;
}
.p-rh-detail__lead {
  max-width: 40em;
  margin: 44px 0 0 253px;
  font-size: var(--fs-lead);
  line-height: 2.1;
  text-wrap: pretty;
}

/* 3つの柱（循環図）：中央の円を墨にして、金の輪で囲む。番号の丸も墨に金の数字 */
.p-rh-cycle {
  display: grid;
  grid-template-columns: 420px minmax(0, 1fr);
  gap: 72px;
  align-items: start;
  margin-top: 72px;
}
.p-rh-cycle__fig { position: sticky; top: 136px; }
.p-rh-cycle__fig svg { display: block; width: 100%; height: auto; overflow: visible; }
.p-rh-cycle__fig text {
  font-family: var(--rh-serif);
  font-weight: 500;
  fill: var(--rh-ink-deep);
  letter-spacing: .04em;
}
.p-rh-cycle__fig rect { fill: #fff; }
.p-rh-cycle__fig circle[r="63"] { fill: var(--rh-sumi); stroke: var(--rh-gold); }
.p-rh-cycle__fig circle[r="70"] { stroke: var(--rh-gold); opacity: .8; }
.p-rh-cycle__fig circle[r="15"] { fill: var(--rh-sumi); stroke: var(--rh-sumi); }
/* 中央の円（墨）の中の文字は生成り（14.9:1） */
.p-rh-cycle__fig text[font-size="19"] { fill: var(--rh-on-dark); }
.p-rh-cycle__fig .p-rh-cycle__no {
  font-family: var(--rh-latin);
  font-weight: 500;
  fill: var(--rh-gold-light);
  letter-spacing: .02em;
  /* Cormorant の数字は初期値が「小文字の高さの数字」なので、大文字の高さにそろえる */
  font-variant-numeric: lining-nums;
}
/* 下の罫線は付けない（すぐ下の Program 02 の金の区切り線と二重になるため） */
.p-rh-cycle__list { display: flex; flex-direction: column; }
.p-rh-pillar {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 0 20px;
  padding: 34px 0 36px;
  border-top: 1px solid var(--rh-gold);
}
.p-rh-pillar + .p-rh-pillar { border-top-color: var(--rh-hair); }
.p-rh-pillar__num {
  font-family: var(--rh-latin);
  font-weight: 300;
  font-size: 5.2rem;
  line-height: .9;
  letter-spacing: .02em;
  font-variant-numeric: lining-nums;
  color: var(--rh-gold-num);
}
.p-rh-pillar__tag {
  font-size: var(--fs-meta);
  line-height: 1.6;
  letter-spacing: .12em;
  color: var(--rh-gold-dark);
}
.p-rh-pillar__title {
  margin: 4px 0 12px;
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: 2.2rem;
  line-height: 1.55;
  letter-spacing: .06em;
  color: var(--rh-ink-deep);
  font-feature-settings: "palt";
}
.p-rh-pillar__text { font-size: var(--fs-body); line-height: 1.95; text-wrap: pretty; }
.p-rh-pillar__text a {
  display: flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  min-height: 44px;
  margin-top: 6px;
  color: var(--rh-gold-dark);
  text-decoration: underline;
  text-decoration-color: var(--rh-gold);
  text-underline-offset: 5px;
}
.p-rh-pillar__text a::after {
  content: "";
  width: 16px;
  height: 16px;
  transform: rotate(90deg);
  background: url(img/arrow_ink.svg) no-repeat 0 0 / contain;
}
.p-rh-pillar__fee {
  display: inline-block;
  margin-left: 10px;
  padding: 0 10px;
  border: 1px solid var(--rh-gold-dark);
  font-family: var(--rh-sans);
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: .08em;
  color: var(--rh-gold-dark);
  vertical-align: 3px;
}

/* STEP：墨の丸（内側に金の細い輪）を、金の細い線でつなぐ */
.p-rh-steps { margin: 64px 0 0 0; display: flex; flex-direction: column; }
.p-rh-step {
  position: relative;
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 0 44px;
}
.p-rh-step + .p-rh-step { margin-top: 64px; }
.p-rh-step:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 56px;
  top: 124px;
  bottom: -52px;
  width: 1px;
  background: var(--rh-gold);
}
.p-rh-step__num {
  width: 112px;
  height: 112px;
  border-radius: 50%;
  background: var(--rh-sumi);
  box-shadow: inset 0 0 0 5px var(--rh-sumi), inset 0 0 0 6px var(--rh-gold-line);
  color: var(--rh-gold-light);
  font-family: var(--rh-latin);
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  line-height: 1;
}
.p-rh-step__num span {
  font-weight: 500;
  font-size: 1.5rem;
  letter-spacing: .3em;
  margin-right: -.3em;
  text-transform: uppercase;
}
.p-rh-step__num b { font-size: 4.8rem; font-weight: 300; margin-top: 4px; font-variant-numeric: lining-nums; }
.p-rh-step > div { padding-top: 10px; }
.p-rh-step__title {
  display: flex;
  flex-direction: column-reverse;
  align-items: flex-start;
  gap: 12px;
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: 2.2rem;
  line-height: 1.6;
  letter-spacing: .06em;
  color: var(--rh-ink-deep);
  font-feature-settings: "palt";
}
.p-rh-step__status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 2px 12px;
  border: 1px dashed var(--rh-gold-dark);
  background: #fff;
  color: var(--rh-gold-dark);
  font-family: var(--rh-sans);
  font-size: var(--fs-meta);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: .08em;
}
.p-rh-step__status--now {
  border: 1px solid var(--rh-sumi);
  background: var(--rh-sumi);
  color: var(--rh-on-dark);
}
.p-rh-step__status--now::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--rh-gold-light);
}
.p-rh-step__text {
  max-width: 44em;
  margin-top: 16px;
  font-size: var(--fs-body);
  line-height: 1.95;
  text-wrap: pretty;
}

/* ---------- 健康体操 ---------- */
.p-rh-exercise {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: 88px;
  align-items: start;
}
/* 写真は“額装”：金の細い枠を右下にずらして重ねる。上端は本文1行目にそろえる */
.p-rh-exercise__photo {
  position: relative;
  isolation: isolate;
  margin: 8px 22px 22px 0;
}
.p-rh-exercise__photo::before {
  content: "";
  position: absolute;
  inset: 22px -22px -22px 22px;
  border: 1px solid var(--rh-gold);
  z-index: -1;
}
/* ファーストビューと同じ写真なので、手前の方が腕を上げる場面に寄せた正方形のトリミングにする */
.p-rh-exercise__crop {
  display: block;
  overflow: hidden;
  aspect-ratio: 1 / 1;
}
.p-rh-exercise__crop img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 100% 100%;
  transform: scale(1.32);
  transform-origin: 100% 100%;
}
.p-rh-exercise__lead { font-size: var(--fs-lead); line-height: 2.1; text-wrap: pretty; }
.p-rh-exercise__nums {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 44px 0;
  border-top: 1px solid var(--rh-gold-soft);
  border-bottom: 1px solid var(--rh-gold-soft);
}
.p-rh-exercise__num { padding: 30px 16px 28px; text-align: center; }
.p-rh-exercise__num + .p-rh-exercise__num { border-left: 1px solid var(--rh-hair); }
.p-rh-exercise__num b {
  display: block;
  font-family: var(--rh-latin);
  font-weight: 300;
  font-size: 8.8rem;
  line-height: .9;
  letter-spacing: .01em;
  font-variant-numeric: lining-nums;
  color: var(--rh-gold-num);
}
.p-rh-exercise__num b small {
  margin-left: 6px;
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: 1.9rem;
  letter-spacing: .08em;
  color: var(--rh-ink-deep);
}
.p-rh-exercise__num span {
  display: block;
  margin-top: 16px;
  font-size: 1.5rem;
  line-height: 1.7;
}

/* ---------- 対象ホーム ---------- */
.p-rh-homes + .p-rh-homes { margin-top: 96px; }
.p-rh-homes__title {
  display: grid;
  grid-template-columns: minmax(24px, 1fr) auto minmax(24px, 1fr);
  align-items: center;
  column-gap: 32px;
  margin-bottom: 44px;
  text-align: center;
}
.p-rh-homes__title::before,
.p-rh-homes__title::after {
  content: "";
  grid-row: 1;
  height: 1px;
  background: linear-gradient(90deg, rgba(195, 155, 98, 0), var(--rh-gold));
}
.p-rh-homes__title::before { grid-column: 1; }
.p-rh-homes__title::after { grid-column: 3; background: linear-gradient(90deg, var(--rh-gold), rgba(195, 155, 98, 0)); }
.p-rh-homes__brand {
  grid-column: 2;
  grid-row: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: 3rem;
  line-height: 1.5;
  letter-spacing: .16em;
  color: var(--rh-ink-deep);
}
.p-rh-homes__sub {
  grid-column: 1 / -1;
  grid-row: 2;
  margin-top: 8px;
  font-size: 1.5rem;
  line-height: 1.7;
  letter-spacing: .08em;
  color: var(--rh-sub);
}
.p-rh-homes__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
}
/* 東急ウェリナは大岡山の1ホームだけ（旗の台は提供対象外）。2列だったときと同じ幅のカードを中央に置く */
.p-rh-homes--welina .p-rh-homes__list { grid-template-columns: minmax(0, calc((100% - 40px) / 2)); justify-content: center; gap: 40px; }
.p-rh-home {
  display: flex;
  flex-direction: column;
  background: #fff;
  box-shadow: 0 30px 50px -44px rgba(40, 32, 24, .4);
}
/* 写真の内側に白い細い線（額縁のマット） */
.p-rh-home__photo { position: relative; overflow: hidden; }
.p-rh-home__photo::after {
  content: "";
  position: absolute;
  inset: 10px;
  border: 1px solid rgba(255, 255, 255, .75);
  pointer-events: none;
}
.p-rh-home__photo img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  object-position: center 38%;
}
.p-rh-homes--welina .p-rh-home__photo img { aspect-ratio: 16 / 9; object-position: center 60%; }
.p-rh-home__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 30px 30px 34px;
}
.p-rh-home__type {
  font-size: var(--fs-meta);
  line-height: 1.6;
  letter-spacing: .06em;
  color: var(--rh-sub);
}
.p-rh-home__name { margin-top: 12px; font-family: var(--rh-serif); font-weight: 500; }
.p-rh-home__brand {
  display: block;
  font-size: 1.5rem;
  line-height: 1.6;
  letter-spacing: .2em;
  color: var(--rh-gold-dark);
}
.p-rh-home__loc {
  display: block;
  font-size: 3.2rem;
  line-height: 1.4;
  letter-spacing: .18em;
  color: var(--rh-ink-deep);
}
.p-rh-home__area {
  position: relative;
  margin-top: 8px;
  padding-left: 20px;
  font-size: 1.5rem;
  line-height: 1.7;
}
.p-rh-home__area::before {
  content: "";
  position: absolute;
  left: 1px;
  top: .42em;
  width: 11px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 30'%3E%3Cpath fill='%237d5f33' d='M12 0C5.4 0 0 5.2 0 11.6 0 20.3 12 30 12 30s12-9.7 12-18.4C24 5.2 18.6 0 12 0zm0 16a4.4 4.4 0 1 1 0-8.8 4.4 4.4 0 0 1 0 8.8z'/%3E%3C/svg%3E") no-repeat center / contain;
}
.p-rh-home__program {
  flex: 1;
  margin: 20px 0 22px;
  padding-top: 18px;
  border-top: 1px solid var(--rh-line);
  font-size: 1.5rem;
  line-height: 1.8;
  letter-spacing: .04em;
}
/* 電話：墨の丸に金の受話器（押せる印）＋番号（Cormorant の中字・字の高さをそろえる数字）＋説明 */
.p-rh-home__tel {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  min-height: 72px;
  padding: 10px 8px;
  border-top: 1px solid var(--rh-gold-soft);
  border-bottom: 1px solid var(--rh-gold-soft);
  font-family: var(--rh-latin);
  font-size: 3.2rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: .05em;
  font-variant-numeric: lining-nums;
  color: var(--rh-ink-deep);
  text-decoration: none;
}
.p-rh-home__tel::before {
  content: "";
  flex: none;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--rh-sumi) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23d8bf8f' d='M6.62 10.79a15.05 15.05 0 0 0 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1C10.61 21 3 13.39 3 4c0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E") no-repeat center / 20px 20px;
}
.p-rh-home__tel small {
  flex-basis: 100%;
  margin-top: 4px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: .04em;
  color: var(--rh-sub);
  text-align: center;
}
.p-rh-home__links {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 20px;
  /* 主ボタンを order で先頭に見せているので、キーボードの移動順も見た目の順にそろえる（対応ブラウザのみ） */
  reading-flow: flex-visual;
}
/* 東急ウェリナの2ボタン横並び（1001px〜）：折り返し自体を禁止する */
.p-rh-homes--welina .p-rh-home__links { flex-direction: row; }
.p-rh-homes--welina .p-rh-home__links a { flex: 1; white-space: nowrap; }
@media screen and (min-width: 1001px) {
  .p-rh-homes--welina .p-rh-home__links a { padding-left: 18px; padding-right: 36px; letter-spacing: .08em; }
  /* 介護型の3列（1枚 約250px の段）でも、受話器の丸と番号を1行に並べる */
  .p-rh-homes--care .p-rh-home__tel { column-gap: 10px; font-size: 2.8rem; letter-spacing: .03em; }
}
/* 主ボタン（資料請求・見学）：墨の地に生成りの文字、内側に金の細い線。先頭に並べる */
.p-rh-home__links a.is-primary {
  order: -1;
  background-color: var(--rh-sumi);
  border-color: var(--rh-sumi);
  color: var(--rh-on-dark);
  font-weight: 500;
  box-shadow: inset 0 0 0 4px var(--rh-sumi), inset 0 0 0 5px var(--rh-gold-line);
}
.p-rh-home__links a.is-primary:hover { background-color: #000; }
.p-rh-home__links a.is-primary::after { background-image: url(img/arrow_w.svg); }

/* ---------- FAQ ---------- */
.p-rh-faq {
  max-width: 860px;
  margin: 0 auto;
  border-top: 1px solid var(--rh-gold-soft);
}
.p-rh-faq__item { border-bottom: 1px solid var(--rh-hair); transition: background-color .2s; }
.p-rh-faq__item[open] { background: var(--rh-ivory); }
.p-rh-faq__q {
  position: relative;
  padding: 28px 80px 28px 76px;
  cursor: pointer;
  list-style: none;
  font-size: 1.8rem;
  line-height: 1.7;
  letter-spacing: .04em;
  color: var(--rh-ink-deep);
}
.p-rh-faq__q::-webkit-details-marker { display: none; }
.p-rh-faq__q:hover { background: rgba(250, 247, 242, .8); }
.p-rh-faq__q::before,
.p-rh-faq__a::before {
  position: absolute;
  left: 22px;
  font-family: var(--rh-latin);
  font-weight: 300;
  font-size: 3.4rem;
  line-height: 1;
}
.p-rh-faq__q::before { content: "Q"; top: 24px; color: var(--rh-gold-num); }
.p-rh-faq__q::after {
  content: "";
  position: absolute;
  right: 20px;
  top: 50%;
  width: 34px;
  height: 34px;
  margin-top: -17px;
  border: 1px solid var(--rh-gold-dark);
  border-radius: 50%;
  background:
    linear-gradient(var(--rh-gold-dark), var(--rh-gold-dark)) center / 12px 1px no-repeat,
    linear-gradient(var(--rh-gold-dark), var(--rh-gold-dark)) center / 1px 12px no-repeat;
}
.p-rh-faq__item[open] .p-rh-faq__q::after {
  border-color: var(--rh-sumi);
  background: var(--rh-sumi) linear-gradient(var(--rh-gold-light), var(--rh-gold-light)) center / 12px 1px no-repeat;
}
.p-rh-faq__a {
  position: relative;
  padding: 0 80px 32px 76px;
  font-size: var(--fs-body);
  line-height: 1.95;
  text-wrap: pretty;
}
.p-rh-faq__a::before { content: "A"; top: -2px; color: var(--rh-sub); }

/* ---------- CTA：墨の帯に、生成りの招待状 ---------- */
.p-rh-cta {
  position: relative;
  padding: 120px 20px;
  background: radial-gradient(60% 80% at 50% 0, #2b2622, rgba(43, 38, 34, 0)), var(--rh-sumi);
  color: var(--rh-on-dark);
}
/* 上端から降りてくる金の細い線（章の扉と同じ作法） */
.p-rh-cta::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 64px;
  background: linear-gradient(rgba(216, 191, 143, 0), var(--rh-gold-light));
}
.p-rh-cta__card {
  position: relative;
  max-width: 800px;
  margin: 0 auto;
  padding: 80px 48px 72px;
  background: var(--rh-ivory);
  color: var(--rh-ink);
  outline: 1px solid var(--rh-gold);
  outline-offset: -12px;
  text-align: center;
}
.p-rh-cta__card::before,
.p-rh-cta__card::after {
  content: "";
  position: absolute;
  top: 22px;
  width: 60px;
  height: 60px;
  background: url(img/orn_g_tl.svg) no-repeat 0 0 / contain;
}
.p-rh-cta__card::before { left: 22px; }
.p-rh-cta__card::after { right: 22px; background-image: url(img/orn_g_tr.svg); }
.p-rh-cta__en {
  display: block;
  font-family: var(--rh-latin);
  font-weight: 500;
  font-size: 1.6rem;
  letter-spacing: .42em;
  margin-right: -.42em;
  text-transform: uppercase;
  color: var(--rh-gold-text);
}
.p-rh-cta__title {
  margin-top: 16px;
  font-family: var(--rh-serif);
  font-weight: 500;
  font-size: 3.2rem;
  line-height: 1.6;
  letter-spacing: .14em;
  color: var(--rh-ink-deep);
  font-feature-settings: "palt";
}
.p-rh-cta__text { margin-top: 20px; font-size: var(--fs-body); line-height: 1.95; }
.p-rh-cta__btns { margin-top: 40px; display: flex; justify-content: center; }
.p-rh-cta__btn {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 420px;
  min-height: 84px;
  padding: 14px 64px 16px;
  background: var(--rh-sumi);
  color: var(--rh-on-dark);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .12em;
  text-decoration: none;
  box-shadow: inset 0 0 0 5px var(--rh-sumi), inset 0 0 0 6px var(--rh-gold-line);
  transition: background-color .3s ease-out;
}
.p-rh-cta__btn:hover { background: #000; text-decoration: none; }
.p-rh-cta__btn small {
  display: block;
  margin-top: 2px;
  font-size: 1.5rem;
  font-weight: 400;
  letter-spacing: .06em;
  color: var(--rh-on-dark-sub);
}
/* ページ上部のホーム一覧へ戻るので上向き */
.p-rh-cta__btn::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 24px;
  width: 18px;
  height: 18px;
  margin: auto;
  transform: rotate(-90deg);
  background: url(img/arrow_w.svg) no-repeat 0 0 / contain;
}

.p-rh-notes { padding-top: 48px; padding-bottom: 72px; }
.p-rh-notes ul { max-width: 60em; }
.p-rh-notes li {
  padding-left: 1em;
  text-indent: -1em;
  font-size: var(--fs-legal);
  line-height: 1.9;
  color: var(--rh-sub);
}

/* スマホの下固定ボタン（JS で作る。768px 以下だけ表示） */
.p-rh-sticky { display: none; }

/* ---------- フォーカス・アンカー位置・動き ---------- */
/* 基本のフォーカス枠は詳細度0。下の部品ごとの outline-offset が必ず効くようにする */
:where(.p-rh) :is(a, summary):focus-visible { outline: 3px solid var(--rh-gold-dark); outline-offset: 3px; }
.p-rh-anchor__item a:focus-visible,
.p-rh-faq__q:focus-visible { outline-offset: -4px; }
.p-rh-cta__btn:focus-visible,
.p-rh-home__links a.is-primary:focus-visible { outline-offset: 4px; }
.p-rh [id] { scroll-margin-top: 101px; }
/* 動きを減らす設定の方には、動き（ボタンの帯・下固定ボタンの出入り・浮かび上がりなど）をすべて止める */
@media (prefers-reduced-motion: reduce) {
  .p-rh *, .p-rh *::before, .p-rh *::after { transition: none !important; animation: none !important; }
}
/* スクロールで、章の扉の文字・写真・カードが静かに浮かび上がる（約180px スクロールする間に、24px 下から不透明へ）
   ・CSS のスクロール連動アニメーションだけで動かす。JavaScript は使わない（JS が止まっていても内容は必ず見える）
   ・対応していないブラウザ（Firefox など）では @supports で丸ごと外れ、最初から表示されたまま
   ・「動きを減らす」設定の方には動かさない。ファーストビュー（写真・銘板・ページ内ナビ）と本文の段落は動かさない */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .p-rh-head--chapter > *,
    .p-rh-head--sub,
    .p-rh-photo--frame,
    .p-rh-exercise__photo,
    .p-rh-doctor__photo,
    .p-rh-issue__item,
    .p-rh-partner__box,
    .p-rh-program-card,
    .p-rh-pillar,
    .p-rh-step,
    .p-rh-home,
    .p-rh-cta__card {
      animation: p-rh-rise linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 180px;
    }
  }
}
@keyframes p-rh-rise {
  from { opacity: 0; translate: 0 24px; }
  to { opacity: 1; translate: 0 0; }
}

/* PC の狭い側（1001〜1100px）：課題の段が狭くなるので、段の左右の余白を少し詰める */
@media screen and (min-width: 1001px) and (max-width: 1100px) {
  .p-rh-issue__item { padding-left: 24px; padding-right: 24px; }
  .p-rh-issue__item:last-child { padding-left: 24px; padding-right: 24px; }
}

/* ---------- タブレット（769〜1000px） ---------- */
@media screen and (min-width: 769px) and (max-width: 1000px) {
  .p-rh-head__title { font-size: 3.2rem; letter-spacing: .1em; }
  .p-rh-head--sub .p-rh-head__title { font-size: 2.8rem; }
  .p-rh-program-card__title { letter-spacing: .04em; }

  .p-rh-issue { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-rh-issue__item { padding-left: 24px; padding-right: 24px; }
  .p-rh-issue__item:last-child { grid-column: 1 / -1; margin: 48px 0 0; padding: 40px 40px 42px; }
  .p-rh-issue__item:last-child::before { left: 50%; top: -30px; margin: 0 0 0 -5px; transform: rotate(135deg); }

  /* 連携体制：3枠を縦に積んで金の細い縦線でつなぐ（枠の幅は 520px まで） */
  .p-rh-partner { flex-direction: column; align-items: center; margin-top: 24px; }
  .p-rh-partner__box { flex: none; width: 100%; max-width: 520px; padding: 40px 20px 28px; }
  .p-rh-partner__x {
    width: 1px;
    height: 40px;
    padding: 0;
    font-size: 0;
    background: var(--rh-gold);
  }

  .p-rh-doctor { grid-template-columns: 240px minmax(0, 1fr); gap: 56px; }
  .p-rh-programs { gap: 0 64px; }

  .p-rh-detail__head { grid-template-columns: 148px minmax(0, 1fr); }
  .p-rh-no--lg { font-size: 9.6rem; }
  .p-rh-detail__heading { padding-left: 36px; }
  .p-rh-detail__title { font-size: 3.2rem; }
  .p-rh-detail__lead { margin-left: 185px; }
  .p-rh-cycle { grid-template-columns: minmax(0, 1fr); gap: 48px; }
  .p-rh-cycle__fig { position: static; width: 100%; max-width: 440px; margin: 0 auto; }

  .p-rh-exercise { gap: 56px; }
  .p-rh-exercise__nums { grid-template-columns: minmax(0, 1fr); }
  .p-rh-exercise__num { display: grid; grid-template-columns: 132px minmax(0, 1fr); align-items: center; gap: 0 16px; padding: 22px 0; text-align: left; }
  .p-rh-exercise__num + .p-rh-exercise__num { border-left: 0; border-top: 1px solid var(--rh-hair); }
  .p-rh-exercise__num b { font-size: 6.4rem; text-align: center; }
  .p-rh-exercise__num span { margin-top: 0; }

  /* 介護型の3ホームは 2列＋3枚目を同じ幅で中央に */
  .p-rh-homes__list { gap: 24px; }
  .p-rh-homes--care .p-rh-homes__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-rh-homes--care .p-rh-home:last-child { grid-column: 1 / -1; justify-self: center; width: calc((100% - 24px) / 2); }
  .p-rh-home__body { padding: 26px 22px 30px; }
  .p-rh-home__loc { font-size: 3rem; letter-spacing: .14em; }
  .p-rh-home__links a { padding-left: 30px; padding-right: 36px; letter-spacing: .06em; }
  .p-rh-homes--welina .p-rh-home__links { flex-direction: column; }
}
/* 769〜899px（ファーストビューの本文の改行を外す指定は、ファーストビューの節へ移した） */
@media screen and (min-width: 769px) and (max-width: 899px) {
  /* ページ内ナビ：4つ横並びだと「2つのプログラム」が入りきらないので、すき間と字間を詰める */
  .p-rh-anchor__item a { gap: 8px; padding-left: 4px; padding-right: 4px; letter-spacing: .04em; }
}

/* ---------- SP ---------- */
@media screen and (max-width: 768px) {
  .p-rh { --fs-body: 1.6rem; --fs-lead: 1.6rem; --fs-meta: 1.5rem; }
  .p-rh [id] { scroll-margin-top: 53px; }
  .p-rh-inner { padding: 0 20px; }
  .p-rh-section { --rh-pad: 80px; }
  .p-rh-section--sub { --rh-pad: 72px; }
  .p-rh-section--detail { --rh-pad: 72px; }
  .p-rh-head--sub { margin-bottom: 40px; }
  .p-rh-head__title { font-size: min(2.4rem, 6.4vw); letter-spacing: .08em; line-height: 1.65; }
  .p-rh-head--sub .p-rh-head__title { font-size: min(2.3rem, 6.1vw); display: block; margin-top: 14px; }
  .p-rh-head--sub .p-rh-head__title::before,
  .p-rh-head--sub .p-rh-head__title::after { display: none; }
  .p-rh-head__en { font-size: 1.5rem; letter-spacing: .36em; gap: 14px; }
  .p-rh-head__en::after { margin-left: -.36em; }
  .p-rh-head--sub .p-rh-head__en { margin-right: -.36em; }
  .p-rh-head__en::before,
  .p-rh-head__en::after { width: 24px; }
  /* 章の扉（スマホ）：帯を低くし、番号を小さく */
  .p-rh-head--chapter { margin-bottom: 56px; padding: 68px 0 56px; }
  .p-rh-head--chapter::before { height: 44px; }
  .p-rh-head__no { font-size: 6.4rem; }
  .p-rh-head--chapter .p-rh-head__en { margin-top: 18px; }
  .p-rh-head--chapter .p-rh-head__title { margin-top: 18px; }
  .p-rh-lead { line-height: 2; }
  .p-rh-lead--center { text-align: left; margin-bottom: 48px; }
  .p-rh-lead--after { margin-top: 48px; }
  .p-rh-no { font-size: 4.8rem; }
  .p-rh-no span { font-size: 1.5rem; }

  /* ページ内ナビ：2×2、内側だけ罫線。番号はラベルの上に */
  .p-rh-anchor { margin-top: 40px; }
  .p-rh-anchor__list { flex-wrap: wrap; padding: 0; }
  .p-rh-anchor__item { flex: 0 0 50%; }
  .p-rh-anchor__item + .p-rh-anchor__item::before { display: none; }
  .p-rh-anchor__item:nth-child(odd) { border-right: 1px solid var(--rh-gold-soft); }
  .p-rh-anchor__item:nth-child(-n+2) { border-bottom: 1px solid var(--rh-gold-soft); }
  .p-rh-anchor__item a {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: center;
    align-content: center;
    align-items: center;
    gap: 4px 10px;
    min-height: 68px;
    padding: 8px 6px;
    font-size: 1.5rem;
    letter-spacing: .04em;
  }
  .p-rh-anchor__item a::before { grid-column: 1 / -1; justify-self: center; }

  /* 背景 */
  .p-rh-issue { grid-template-columns: minmax(0, 1fr); margin-top: 52px; }
  .p-rh-issue__item { padding: 30px 0 32px; }
  .p-rh-issue__item + .p-rh-issue__item { border-left: 0; border-top: 1px solid var(--rh-hair); }
  .p-rh-issue__item:first-child { padding-top: 0; }
  .p-rh-issue__item:last-child { margin: 40px 0 0; padding: 38px 26px 36px; border-top: 0; outline-offset: -8px; }
  .p-rh-issue__item:last-child::before { left: 50%; top: -26px; margin: 0 0 0 -5px; transform: rotate(135deg); }
  .p-rh-issue__num { font-size: 5.2rem; }
  .p-rh-issue__title { margin: 16px 0 10px; font-size: 2rem; }

  /* 連携体制 */
  .p-rh-partner { flex-direction: column; align-items: stretch; margin-top: 24px; }
  .p-rh-partner__box { max-width: none; width: 100%; padding: 36px 16px 24px; }
  .p-rh-partner__logo { height: 46px; margin-bottom: 8px; }
  .p-rh-partner__logo .p-rh-logo-jikei { width: 230px; }
  .p-rh-partner__logo-tw { width: 176px; }
  .p-rh-partner__logo-tokyu { width: 84px; }
  .p-rh-partner__name { font-size: 1.6rem; }
  .p-rh-partner__x {
    align-self: center;
    width: 1px;
    height: 36px;
    padding: 0;
    font-size: 0;
    background: var(--rh-gold);
  }

  /* 監修：名刺のように顔と名前を並べる */
  .p-rh-doctor {
    grid-template-columns: min(116px, 30vw) minmax(0, 1fr);
    gap: 0 18px;
    align-items: center;
  }
  .p-rh-doctor__photo { margin: 0 9px 9px 0; }
  .p-rh-doctor__photo::before { inset: 9px -9px -9px 9px; }
  .p-rh-doctor__body { display: contents; }
  .p-rh-doctor__photo { grid-column: 1; grid-row: 1 / 3; align-self: start; }
  .p-rh-doctor__org { grid-column: 2; grid-row: 1; align-self: end; font-size: 1.5rem; line-height: 1.65; letter-spacing: .02em; }
  .p-rh-doctor__name { grid-column: 2; grid-row: 2; align-self: start; margin-top: 6px; font-size: min(2.8rem, 7.4vw); letter-spacing: .16em; }
  .p-rh-doctor__name::after { margin: 14px 0 0; width: 36px; }
  .p-rh-doctor__profile { grid-column: 1 / -1; margin-top: 34px; }
  .p-rh-doctor__msg { grid-column: 1 / -1; margin-top: 32px; padding: 30px 0 4px 22px; font-size: 1.6rem; line-height: 2; }
  .p-rh-doctor__msg::before { left: 16px; top: -14px; font-size: 6rem; }

  /* プログラム概要：縦に積み、2つの間に菱形の飾り罫 */
  .p-rh-programs { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; gap: 0; background: none; }
  .p-rh-program-card { grid-row: auto; grid-template-rows: auto; display: flex; flex-direction: column; }
  .p-rh-program-card + .p-rh-program-card { margin-top: 36px; padding-top: 47px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 11'%3E%3Cpath d='M0 5.5h96M124 5.5h96' stroke='%23C39B62' stroke-width='1'/%3E%3Cpath d='M110 .9l4.6 4.6-4.6 4.6-4.6-4.6z' fill='none' stroke='%23C39B62'/%3E%3C/svg%3E") 50% 0 / 220px 11px no-repeat; }
  .p-rh-program-card__type { margin-top: 22px; }
  .p-rh-program-card__title { font-size: min(2.3rem, 6vw); letter-spacing: .06em; }
  .p-rh-program-card__body { padding: 20px 0 0; }
  .p-rh-program-card__target { padding: 14px 0; }
  .p-rh-program-card__text { margin-top: 20px; }
  .p-rh-program-card__for { margin-bottom: 8px; font-size: 1.9rem; }
  .p-rh-program-card__link { margin-top: 26px; }
  .p-rh-program-card__link,
  .p-rh-home__links a { padding: 10px 44px 10px 16px; letter-spacing: .06em; }

  /* プログラム詳細 */
  .p-rh-detail__head { display: block; }
  .p-rh-no--lg { flex-direction: row; align-items: baseline; gap: 14px; font-size: 7.2rem; line-height: .9; }
  .p-rh-detail__heading { margin-top: 20px; padding: 22px 0 0; border-left: 0; border-top: 1px solid var(--rh-gold); }
  .p-rh-detail__title { font-size: min(2.4rem, 6.2vw); letter-spacing: .05em; }
  .p-rh-detail__target { font-size: 1.5rem; }
  .p-rh-detail__lead { margin: 30px 0 0; }

  .p-rh-cycle { grid-template-columns: minmax(0, 1fr); gap: 36px; margin-top: 48px; }
  .p-rh-cycle__fig { position: static; width: calc(100% + 24px); max-width: 460px; margin: 0 -12px; justify-self: center; }
  /* 図はスマホ幅で約0.7〜0.85倍に縮むので、図の中の文字を一回り大きくする */
  .p-rh-cycle__fig text { font-size: 22px; letter-spacing: .02em; }
  .p-rh-cycle__fig text[font-size="19"] { font-size: 20px; letter-spacing: 0; }
  .p-rh-cycle__fig .p-rh-cycle__no { font-size: 18px; letter-spacing: 0; }
  .p-rh-pillar { grid-template-columns: 52px minmax(0, 1fr); gap: 0 12px; padding: 28px 0 30px; }
  .p-rh-pillar__num { font-size: 4.2rem; }
  .p-rh-pillar__title { font-size: 1.9rem; }

  .p-rh-steps { margin-top: 52px; }
  /* STEP（スマホ）：丸は 60px。右の段に見出し「東急ウェリナ健康体操（座位）」（14字）が1行で入る幅を残す */
  .p-rh-step { grid-template-columns: 60px minmax(0, 1fr); gap: 0 14px; }
  .p-rh-step + .p-rh-step { margin-top: 52px; }
  .p-rh-step:not(:last-child)::after { left: 30px; top: 70px; bottom: -42px; }
  .p-rh-step__num { width: 60px; height: 60px; box-shadow: inset 0 0 0 3px var(--rh-sumi), inset 0 0 0 4px var(--rh-gold-line); }
  .p-rh-step__num span { font-size: 1.5rem; letter-spacing: .06em; margin-right: -.06em; }
  .p-rh-step__num b { font-size: 2.8rem; margin-top: 0; }
  .p-rh-step > div { padding-top: 2px; }
  .p-rh-step__title { font-size: 1.8rem; gap: 10px; letter-spacing: .02em; }
  .p-rh-step__text { margin-top: 12px; }

  /* 健康体操 */
  .p-rh-exercise { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .p-rh-exercise__photo { margin: 0 12px 12px 0; }
  .p-rh-exercise__photo::before { inset: 12px -12px -12px 12px; }
  .p-rh-exercise__nums { margin: 32px 0; }
  .p-rh-exercise__nums { grid-template-columns: minmax(0, 1fr); }
  .p-rh-exercise__num { display: grid; grid-template-columns: 120px minmax(0, 1fr); align-items: center; gap: 0 14px; padding: 20px 0; text-align: left; }
  .p-rh-exercise__num + .p-rh-exercise__num { border-left: 0; border-top: 1px solid var(--rh-hair); }
  .p-rh-exercise__num b { font-size: 6.4rem; text-align: center; }
  .p-rh-exercise__num b small { font-size: 1.7rem; margin-left: 3px; }
  .p-rh-exercise__num span { margin-top: 0; font-size: 1.5rem; line-height: 1.7; }

  /* 対象ホーム */
  .p-rh-homes + .p-rh-homes { margin-top: 72px; }
  .p-rh-homes__title { grid-template-columns: minmax(16px, 1fr) auto minmax(16px, 1fr); column-gap: 14px; margin-bottom: 30px; }
  .p-rh-homes__brand { font-size: min(2.4rem, 6.4vw); gap: 10px; letter-spacing: .12em; }
  .p-rh-homes__sub { font-size: 1.5rem; letter-spacing: 0; }
  .p-rh-homes__list,
  .p-rh-homes--welina .p-rh-homes__list { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .p-rh-home__photo img,
  .p-rh-homes--welina .p-rh-home__photo img { aspect-ratio: 16 / 9; }
  .p-rh-home__photo::after { inset: 8px; }
  .p-rh-home__body { padding: 24px 20px 26px; }
  .p-rh-home__loc { font-size: 2.8rem; }
  .p-rh-home__program { margin: 16px 0 18px; padding-top: 14px; }
  .p-rh-home__tel {
    min-height: 76px;
    border: 1px solid var(--rh-sumi);
    font-size: 3.1rem;
  }
  .p-rh-homes--welina .p-rh-home__links { flex-direction: column; }
  .p-rh-home__links { gap: 10px; margin-top: 12px; }
  .p-rh-home__links a { min-height: 56px; font-size: 1.5rem; }

  /* FAQ */
  .p-rh-faq__q { padding: 20px 50px 20px 42px; font-size: 1.6rem; letter-spacing: .02em; text-wrap: balance; word-break: auto-phrase; }
  .p-rh-faq__q::before,
  .p-rh-faq__a::before { left: 6px; font-size: 2.8rem; }
  .p-rh-faq__q::before { top: 18px; }
  .p-rh-faq__q::after { right: 6px; width: 30px; height: 30px; margin-top: -15px; }
  .p-rh-faq__a { padding: 0 12px 24px 42px; }

  /* CTA：カードの外側は画面端から16px以上あける */
  .p-rh-cta { padding: 80px 16px 72px; }
  .p-rh-cta::before { height: 44px; }
  .p-rh-cta__card { padding: 64px 14px 36px; outline-offset: -8px; }
  .p-rh-cta__card::before,
  .p-rh-cta__card::after { top: 16px; width: 40px; height: 40px; }
  .p-rh-cta__card::before { left: 16px; }
  .p-rh-cta__card::after { right: 16px; }
  .p-rh-cta__en { font-size: 1.5rem; letter-spacing: .36em; margin-right: -.36em; }
  /* 「まずは、ホームの見学から。」（13字）を1行に。入らない幅でも「ら。」だけを送らない */
  .p-rh-cta__title { font-size: min(2.2rem, 5.8vw); letter-spacing: .04em; text-wrap: balance; word-break: auto-phrase; }
  .p-rh-cta__text { margin-top: 14px; letter-spacing: 0; text-wrap: balance; }
  .p-rh-cta__btns { margin-top: 28px; }
  .p-rh-cta__btn { min-width: 0; width: 100%; min-height: 80px; padding: 12px 40px 16px 12px; font-size: min(1.6rem, 4.7vw); letter-spacing: .02em; box-shadow: inset 0 0 0 4px var(--rh-sumi), inset 0 0 0 5px var(--rh-gold-line); }
  .p-rh-cta__btn small { font-size: 1.5rem; letter-spacing: .02em; }
  .p-rh-cta__btn::after { right: 14px; }

  .p-rh-notes { padding-top: 40px; padding-bottom: 60px; }

  /* 下固定ボタン：ファーストビューを過ぎてから「対象のホーム」に着くまで表示（出し入れは JS）。
     墨の帯に、生成りのボタン（内側に金の細い線）。墨地の上の生成り 14.9:1、ボタンの文字（墨）は生成り地で 16:1 */
  .p-rh-sticky {
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 90;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
    background: rgba(29, 26, 24, .96);
    border-top: 1px solid var(--rh-gold-line);
    transition: transform .3s ease-out, visibility .3s;
  }
  .p-rh-sticky--hidden { transform: translateY(110%); visibility: hidden; }
  .p-rh-sticky__btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 56px;
    padding: 8px 46px;
    background: var(--rh-ivory);
    color: var(--rh-sumi);
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: .06em;
    text-align: center;
    text-decoration: none;
    box-shadow: inset 0 0 0 4px var(--rh-ivory), inset 0 0 0 5px var(--rh-gold);
  }
  .p-rh-sticky__btn:hover { background: #fff; text-decoration: none; }
  .p-rh-sticky__btn:focus-visible { outline: 3px solid var(--rh-gold-light); outline-offset: 3px; }
  .p-rh-sticky__btn::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 16px;
    width: 18px;
    height: 18px;
    margin: auto;
    transform: rotate(90deg);
    background: url(img/arrow_ink.svg) no-repeat 0 0 / contain;
  }
}

/* ---------- 大きいスマホ横向き・iPad mini 縦（600〜768px） ---------- */
/* スマホの1列をそのまま引き伸ばすと、写真や見出しの比率が崩れるので、タブレットに近い組み方にする */
@media screen and (min-width: 600px) and (max-width: 768px) {
  .p-rh-head__title,
  .p-rh-head--sub .p-rh-head__title { font-size: clamp(2.4rem, 3.8vw, 2.8rem); }
  .p-rh-partner { align-items: center; }
  .p-rh-partner__box { max-width: 520px; }
  .p-rh-exercise__photo { width: calc(100% - 12px); max-width: 440px; margin: 0 auto 12px; }
  .p-rh-homes__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
  .p-rh-homes--welina .p-rh-homes__list { grid-template-columns: minmax(0, calc((100% - 20px) / 2)); justify-content: center; gap: 20px; }
  .p-rh-homes--care .p-rh-home:last-child { grid-column: 1 / -1; justify-self: center; width: calc((100% - 20px) / 2); }
  /* 2列のカード幅（600px で約270px）でも、電話のアイコンと番号を1行に並べる */
  .p-rh-home__tel { column-gap: 8px; letter-spacing: .02em; font-size: 2.8rem; }
}

/* ---------- スマホ縦（480px 以下）：STEP の本文 ---------- */
/* 本文は番号の丸の下から全幅で組む（丸の右の段だと、文節で折り返したときに短い行が続くため） */
@media screen and (max-width: 480px) {
  .p-rh-step > div { display: contents; }
  .p-rh-step__title { grid-column: 2; align-self: center; }
  .p-rh-step__text { grid-column: 1 / -1; margin-top: 18px; }
  .p-rh-step:not(:last-child)::after { display: none; }
}

/* ---------- 小さいスマホ（360px 以下） ---------- */
/* 文字の大きさはスマホの下限（本文16px・補足15px・注記14px）を保ち、幅は余白と字間で稼ぐ */
@media screen and (max-width: 360px) {
  .p-rh-head__en { letter-spacing: .3em; }
  .p-rh-head__en::after { margin-left: -.3em; }
  .p-rh-doctor { grid-template-columns: 84px minmax(0, 1fr); gap: 0 12px; }
  .p-rh-doctor__org { letter-spacing: 0; }
  .p-rh-doctor__name { font-size: 2.4rem; letter-spacing: .1em; }
  .p-rh-program-card__link { padding: 10px 36px 10px 12px; letter-spacing: .02em; }
  .p-rh-home__body { padding: 20px 16px 22px; }
  .p-rh-home__tel { font-size: 2.8rem; letter-spacing: .02em; column-gap: 10px; }
  /* 3つの柱：番号の列をやめて番号を上に置き、本文を全幅で組む */
  .p-rh-pillar { grid-template-columns: minmax(0, 1fr); }
  .p-rh-pillar__num { margin-bottom: 10px; font-size: 3.6rem; }
  /* STEP：番号の丸を少し小さくして、見出し「専門的なアセスメントと、」を1行に収める */
  .p-rh-step { grid-template-columns: 58px minmax(0, 1fr); gap: 0 12px; }
  .p-rh-step:not(:last-child)::after { left: 29px; top: 68px; }
  .p-rh-step__num { width: 58px; height: 58px; }
  .p-rh-step__num span { letter-spacing: .02em; margin-right: 0; }
  .p-rh-step__num b { font-size: 2.6rem; }
  .p-rh-step__title { font-size: 1.7rem; letter-spacing: .02em; }
  /* 14種類・8つ：数字の列を詰めて、説明を語の途中で折らない */
  .p-rh-exercise__num { grid-template-columns: 96px minmax(0, 1fr); gap: 0 12px; }
  .p-rh-exercise__num b { font-size: 5.2rem; }
  .p-rh-exercise__num b small { margin-left: 2px; font-size: 1.5rem; }
  .p-rh-exercise__num span { letter-spacing: 0; }
  .p-rh-cta { padding: 64px 16px 56px; }
  /* ボタンの説明「ご希望のホームをお選びください」（15字・15px）を1行に収めるため、カードとボタンの左右の余白を詰める */
  .p-rh-cta__card { padding: 56px 8px 28px; outline-offset: -5px; }
  .p-rh-cta__btn { padding: 12px 30px 14px 8px; font-size: 1.6rem; letter-spacing: 0; }
  .p-rh-cta__btn small { letter-spacing: 0; }
  .p-rh-cta__btn::after { right: 10px; }
  /* 下固定ボタン：13字（資料請求・見学のお申し込み）を1行に収める */
  .p-rh-sticky { padding-left: 10px; padding-right: 10px; }
  .p-rh-sticky__btn { padding-left: 38px; padding-right: 38px; letter-spacing: .02em; }
  .p-rh-sticky__btn::after { right: 12px; }
}

/* =====================================================================
   写真（挿し絵）：写真AC の写真 7点＋柱01（自社の写真 exercise.jpg の切り出し）
   ・配置・比率・表示幅は release と同じ（img の sizes はそのまま使える）。額の線の色と、暗い帯の上の注記の色だけ変える
   ・写真AC の写真は <figure class="p-rh-photo">＋<figcaption class="p-rh-photo__cap">※写真はイメージです</figcaption>
   ・柱01 は自社の写真の切り出し。健康体操の章の写真と同じ画像なので、飾りとして alt="" の <div> にし、「イメージです」も付けない
   ・写真の枠（.p-rh-photo__img）の縦横比を CSS で先に決め、画像は object-fit: cover で敷く（読み込みでページがずれない）
   ・写真の表示幅を CSS で変えたら、index.html の img の sizes（画面幅ごとの表示幅）も合わせて直す
   ・比率は役割ごとにそろえる
       額装の写真（背景・見学のお誘い）… PC 4:3／タブレット・スマホ 3:2。金の細い枠を右下にずらして重ねる
       横長の帯（自立型プログラム）   … PC・タブレット 21:9／スマホ 2:1。同じく額装
       柱・STEP の小さい写真         … どの幅でも 3:2。枠なし
   ===================================================================== */
.p-rh-photo { margin: 0; min-width: 0; }
.p-rh-photo__img {
  position: relative;
  isolation: isolate;
  display: block;
  aspect-ratio: 3 / 2;
}
.p-rh-photo__img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: var(--rh-ivory2);
}
/* 「※写真はイメージです」：写真の右下に小さく（13px・#6e6660＝白地 5.6:1／生成り 5.2:1） */
.p-rh-photo__cap {
  margin-top: 8px;
  font-size: 1.3rem;
  line-height: 1.6;
  letter-spacing: .06em;
  color: #6e6660;
  text-align: right;
}
/* 額装：枠のずれ幅（--rh-offset）の分だけ右をあけ、画面の外へはみ出さないようにする。注記は枠の下に */
.p-rh-photo--frame { --rh-offset: 22px; padding-right: var(--rh-offset); }
.p-rh-photo--frame .p-rh-photo__img::before {
  content: "";
  position: absolute;
  inset: var(--rh-offset) calc(-1 * var(--rh-offset)) calc(-1 * var(--rh-offset)) var(--rh-offset);
  border: 1px solid var(--rh-gold);
  z-index: -1;
}
.p-rh-photo--frame .p-rh-photo__cap { margin: calc(var(--rh-offset) + 8px) calc(-1 * var(--rh-offset)) 0 0; }
/* 墨の帯（見学のお誘い）の上：額の線は金を透かし、注記は生成りの補足色（墨地 10.1:1） */
.p-rh-cta .p-rh-photo--frame .p-rh-photo__img::before { border-color: var(--rh-gold-line); }
.p-rh-cta .p-rh-photo__cap { color: var(--rh-on-dark-sub); }

/* 背景（#about）：リードの右に「階段を下りる女性」。PC の 4:3 では左右を少し切るので、女性のいる右寄りを残す */
.p-rh-about__photo .p-rh-photo__img { aspect-ratio: 4 / 3; }
.p-rh-about__photo img { object-position: 66% 50%; }

/* 自立型プログラム：リードの直後に、散歩道の帯 */
.p-rh-photo--band { margin-top: 60px; }
.p-rh-photo--band .p-rh-photo__img { aspect-ratio: 21 / 9; }
.p-rh-photo--band img { object-position: 50% 62%; }

/* 3つの柱：本文を包む div は display: contents にして、番号・分類・見出し・写真・本文を柱のグリッドに直接並べる */
.p-rh-pillar > div { display: contents; }
.p-rh-pillar__num { grid-column: 1; grid-row: 1 / span 2; }
.p-rh-pillar__tag { grid-column: 2; grid-row: 1; }
.p-rh-pillar__title { grid-column: 2; grid-row: 2; }
.p-rh-pillar__text { grid-column: 2; grid-row: 3; }
.p-rh-pillar__photo { grid-column: 1; grid-row: 3; }
.p-rh-pillar__photo .p-rh-photo__cap { letter-spacing: .02em; }
/* 01：自社の写真（1800×1200）から、入居者の皆さまが腕を上げている所を 3:2 で切り出す（release と同じ） */
.p-rh-pillar__photo--own .p-rh-photo__img { overflow: hidden; }
.p-rh-pillar__photo--own img { transform: scale(3.3241); transform-origin: 74.374% 33.373%; }

/* 見学のお誘い：母と娘の顔が写真の左〜中央。PC の 4:3 では左右を少し切る */
.p-rh-cta__photo .p-rh-photo__img { aspect-ratio: 4 / 3; }
.p-rh-cta__photo img { object-position: 60% 50%; }

/* ---------- 写真：柱（481px〜） ---------- */
@media screen and (min-width: 481px) {
  /* 左の列（番号と写真）は 148px。右の段には、見出し（10字）が1行で入る幅を先に確保する（release と同じ） */
  .p-rh-pillar {
    grid-template-columns: clamp(88px, calc(100% - 24px - 20.3rem), 148px) minmax(0, 1fr);
    grid-template-rows: auto auto 1fr;
    gap: 0 24px;
  }
  .p-rh-pillar__photo { margin-top: 8px; }
  .p-rh-pillar__photo .p-rh-photo__cap { font-size: min(1.3rem, 14px); word-break: auto-phrase; }
  .p-rh-pillar__title { word-break: auto-phrase; }
}

/* ---------- 写真：PC・タブレット（769px〜） ---------- */
@media screen and (min-width: 769px) {
  .p-rh-pillar { grid-template-columns: clamp(88px, calc(100% - 24px - 23.5rem), 148px) minmax(0, 1fr); }
  /* 背景：リード（左）と写真（右） */
  .p-rh-about {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 420px);
    gap: 0 64px;
    align-items: center;
  }
  .p-rh-about .p-rh-lead { max-width: none; margin: 0 0 48px; }
  /* STEP：本文の右に写真 */
  .p-rh-step > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    column-gap: 48px;
    align-items: start;
  }
  .p-rh-step__title { grid-column: 1 / -1; grid-row: 1; }
  .p-rh-step__text { grid-column: 1; grid-row: 2; }
  .p-rh-step__photo { grid-column: 2; grid-row: 2; margin-top: 22px; }
  /* STEP の見出しは、スマホ用に HTML に入れてある改行で PC・タブレットでも2行に折る（release と同じ） */
  .p-rh-step__name br.u-sp_display { display: inline !important; }
}

/* ---------- 写真：PC（1001px〜） ---------- */
@media screen and (min-width: 1001px) {
  .p-rh-cycle { gap: 56px; }
  .p-rh-step > div { grid-template-rows: auto 1fr; }
  .p-rh-step__title { grid-column: 1; }
  .p-rh-step__name { text-wrap: balance; }
  .p-rh-step__photo { grid-row: 1 / span 2; margin-top: 0; }
  /* 見学のお誘い：写真を左、招待状のカードを右に並べる。並びの幅は本文の段（1000px）にそろえる */
  .p-rh-cta {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(548px, 36em);
    align-items: center;
    gap: 0 48px;
    padding-left: max(20px, calc((100% - 1000px) / 2));
    padding-right: max(20px, calc((100% - 1000px) / 2));
  }
  .p-rh-cta__card { width: 100%; max-width: none; margin: 0; }
  .p-rh-cta__title,
  .p-rh-cta__text { text-wrap: balance; }
  .p-rh-cta__title { word-break: auto-phrase; }
}

/* ---------- 写真：タブレット（769〜1000px） ---------- */
@media screen and (min-width: 769px) and (max-width: 1000px) {
  .p-rh-about { grid-template-columns: minmax(0, 1fr) minmax(0, 340px); gap: 0 40px; }
  .p-rh-about__photo .p-rh-photo__img { aspect-ratio: 3 / 2; }
  .p-rh-step > div { grid-template-columns: minmax(0, 1fr) 240px; column-gap: 32px; }
  .p-rh-cta__photo { max-width: 480px; margin: 0 auto 48px; }
  .p-rh-cta__photo .p-rh-photo__img { aspect-ratio: 3 / 2; }
}

/* ---------- 写真：SP（〜768px） ---------- */
@media screen and (max-width: 768px) {
  .p-rh-photo--frame { --rh-offset: 12px; }
  .p-rh-photo__cap { margin-top: 6px; }
  .p-rh-photo--frame .p-rh-photo__cap { margin-top: calc(var(--rh-offset) + 4px); }
  .p-rh-about__photo { width: min(80%, 420px); margin: 28px 0 0 auto; }
  .p-rh-about__photo .p-rh-photo__img,
  .p-rh-cta__photo .p-rh-photo__img { aspect-ratio: 3 / 2; }
  .p-rh-photo--band { margin-top: 32px; }
  .p-rh-photo--band .p-rh-photo__img { aspect-ratio: 2 / 1; }
  .p-rh-step__photo { max-width: 280px; margin-top: 16px; }
  .p-rh-cta__photo { max-width: 440px; margin: 0 auto 32px; }
}

/* ---------- 写真：スマホ縦（〜480px） ---------- */
@media screen and (max-width: 480px) {
  .p-rh-pillar__photo { grid-column: 2; grid-row: 3; max-width: 216px; margin: 0 0 12px; }
  .p-rh-pillar__text { grid-column: 2; grid-row: 4; }
  /* 柱01（自社の写真の切り出し）は出さない（すぐ下の健康体操の章と同じ場面が続くため。release と同じ） */
  .p-rh-pillar__photo--own { display: none; }
  .p-rh-step__photo { grid-column: 2; max-width: 216px; }
  .p-rh-about__photo,
  .p-rh-cta__photo { width: min(80%, 280px); }
}
@media screen and (max-width: 360px) {
  .p-rh-pillar__num { grid-column: 1; grid-row: 1; }
  .p-rh-pillar__tag { grid-column: 1; grid-row: 2; }
  .p-rh-pillar__title { grid-column: 1; grid-row: 3; }
  .p-rh-pillar__photo { grid-column: 1; grid-row: 4; }
  .p-rh-pillar__text { grid-column: 1; grid-row: 5; }
}

/* ============================================================================
   ヒーローの見出し（2026-10-05 案3「中身まで見せる」）
   ご指示「ヒーローを見たときに、リハビリプログラムだということがぱっとわかりにくい。キーメッセージが強すぎて」により、
   見出しを「慈恵医大と連携した、リハビリテーションプログラム」にし、下に3つの札（監修・実地指導／転倒・骨折予防／健康長寿）を置く。
   札の言葉は、2つのプログラムのどちらにも当てはまるよう、本文にある言葉だけを使った。
   それまでのキーメッセージ「慈恵医大リハビリテーション科の知見を、毎日の暮らしに。」は、白い札の最初の一文へ。
   上の題字（.p-rh-hero__title）・題字帯・写真の高さの設定を、ここで上書きする（確認用ページ _variants/hero_fix_3 と同じ）
   ========================================================================== */
.p-rh-hero { --rh-title-fs: clamp(2.6rem, 2.45vw, 3.8rem); }
/* 写真の高さは PC だけ調整（札の段の分、写真を低くして「監修・実地指導」を最初の画面に収める。1280×800・1366×768・1024×768 で確認） */
@media screen and (min-width: 1001px) {
  .p-rh-hero { --rh-photo-h: clamp(194px, var(--rh-vh) - 468px - var(--rh-title-fs) * 1.35 - 92px, 640px); }
  .p-rh-hero__panel { padding-top: 16px; padding-bottom: calc(16px + var(--rh-rise)); }
}
.p-rh-hero__title.p-rh-hero__title--program { letter-spacing: .14em; padding-left: .14em; }
/* 3つの札：金の細い線の角丸。暗い面の上の金の文字（墨地 9.7:1） */
.p-rh-hero__tags { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 10px 0 0; padding: 0; list-style: none; }
.p-rh-hero__tags li { padding: 4px 16px; border: 1px solid var(--rh-gold-line); border-radius: 999px; font-size: 1.4rem; line-height: 1.6; letter-spacing: .12em; color: var(--rh-gold-light); }
/* 白い札の最初の一文（それまでのキーメッセージ）。明朝で本文より少し大きく */
.p-rh-hero__catch { display: block; margin-bottom: 8px; font-family: var(--rh-serif); font-weight: 500; font-size: 1.8rem; line-height: 1.6; letter-spacing: .14em; color: var(--rh-ink-deep); }
@media screen and (max-width: 1000px) {
  .p-rh-hero__title.p-rh-hero__title--program { font-size: clamp(2.6rem, 3.4vw, 3.2rem); }
}
@media screen and (max-width: 768px) {
  .p-rh-hero__title.p-rh-hero__title--program { font-size: min(2.4rem, 5.8vw); line-height: 1.5; letter-spacing: .06em; padding-left: .06em; }
  .p-rh-hero__tags { gap: 8px; margin-top: 14px; }
  .p-rh-hero__tags li { padding: 3px 12px; font-size: 1.3rem; letter-spacing: .06em; }
  .p-rh-hero__catch { margin-bottom: 14px; font-size: 1.7rem; letter-spacing: .06em; }
}