/* VISION24 | personal-feminine.css — 上書きレイヤー（両店共用）
   personal 系の最後に読む。店差は personal-{store}.css でさらに上書き */

/*══════════════════════════════════════════════════════════════════
   案5 | FEMININE — 女性向けトンマナ（案4からの差分・上書き専用レイヤー）
   制約：新しい色は追加しない。**既存トークンにある色だけ**を使い、
        その「配分」を変える。#FEE801 は変更なし。
   変えるもの：
     1. 英字の「斜体900」を全廃 → 非斜体・細字・広字間
     2. 見出しのウェイト 900 → 700（詰まった印象を取る）
     3. 太い罫（2〜4px）→ 細い罫（1〜2px）。金色3px上罫 → 黄色の細い下線
     4. FEATURES の斜め巨大黄英字 → 水平・小型のラベル
     5. 角丸は**トークンの値を変えず、参照先の付け替え**で対応。ハード落ち影 → やわらかい影
     6. 黒ベタ面を「価格とCTAだけ」に集中させ、FEATURES 内は白・淡黄へ
     7. 行間・字間を広げる
   使う色はすべて既存トークン：
     --fill-white #FFFFFF / --bg-lightgray #F0F0F0 / --ink-line #E0E0E0
     --c-paleyellow #FFF8B9 / --c-paleyellow-2 #FFFDE9 / --fill-yellow #FEE801
     --c-gold #8A6D00 / --c-wine #6E1F2E / --c-wine-tint #F7EDEF
   このブロックを消せば案4の見た目に戻る。
   ══════════════════════════════════════════════════════════════════*/

body.gym-24h--hirao,
body.gym-personal--hirao{
  --r-xl: 20px;   /* 大きい面（アメニティ写真・締めコピー）専用に新設 */
}

/* 主要カード：--r（6px）→ --r-lg（12px）へ付け替え
   ※ CONTACT/RSV（tabs・embed・form）は24hと同型のため対象外 */
.vision-plan-card,
.vision-plan__tabs,
.vision-flow li,
.vision-location__table,
.vision-location__map,
.vision-faq__item,
.vision-gallery__figure,
.vision-intro__card,
.vision-voice__card,
.vision-cafe__tile,
.vision-trainers__panel,
.vision-table-scroll{
  border-radius: var(--r-lg);
}

.sec-ttl__en,
.vision-feat-block__en,
.vision-app__step-num,
.vision-stat__gauge-val b,
.vision-stat__hero-main b,
.vision-ptmain__price,
.vision-ptsub__price,
.vision-trust__num,
.vision-intro__card-num,
.vision-price-hook__price,
.vision-price-hook__yen,
.vision-price-hook__diet-price,
.vision-price-hook__camp-price,
.vision-price-hook__push-en,
.vision-gym-stats b,
.vision-gym-stats__catalog-en,
.vision-gym-why__num,
.vision-gym-close__en,
.site-header__brand::before{
  font-style: normal;
}

h1, h2, h3, h4,
.sec-ttl__jp,
.vision-feat-block__jp{ font-weight: 700; }

.sec-ttl__jp{ letter-spacing: .02em; }
.vision-feat-block__jp{ letter-spacing: .02em; line-height: 1.55; }

.sec-ttl__en{
  font-weight: 500;
  font-size: clamp(.74rem, 1.6vw, .86rem);
  letter-spacing: .34em;
  color: var(--ink-lightgray);
  margin-bottom: 14px;
}

/* 和文見出し：上の金色3px罫 → 下の黄色い細い下線へ */
.sec-ttl__jp{
  border-top: 0;
  padding-top: 0;
}
.sec-ttl .sec-ttl__jp::after{
  content: "";
  display: block;
  width: 44px;
  height: 3px;
  margin: 16px auto 0;
  border-radius: var(--r-chip);
  background: var(--fill-yellow);
}

/* FEATURES の斜め巨大黄英字（−7deg・8.4rem）→ 水平・小型のラベル */
.sec-ttl--c2{ padding: 8px 0 8px; }
.sec-ttl--c2 .sec-ttl__en{
  position: static;
  transform: none;
  left: auto; right: auto; top: auto;
  font-style: normal;
  font-weight: 500;
  font-size: clamp(.74rem, 1.6vw, .86rem);
  line-height: 1.4;
  letter-spacing: .34em;
  color: var(--ink-lightgray);
  white-space: normal;
}
.sec-ttl--c2 .sec-ttl__jp{ padding-top: 0; }

.btn{
  border-width: 1px;
  border-radius: var(--r-chip);
  font-weight: 700;
  letter-spacing: .04em;
}
.btn--primary{ border-color: var(--fill-yellow-deep); }
.vision-plan__tabs{ border-width: 1px; }
.vision-plan__tab + .vision-plan__tab{ border-left-width: 1px; }
/* CONTACT/RSV の枠・タブ区切りは lp-sections（24h）の2pxを維持 */
.vision-sec-nav__list a{ border-bottom-width: 2px; }
.vision-trainer__catch{ border-left-width: 2px; }
.vision-trainer__fact{ border-left-width: 2px; }
.vision-trainers__thumb{ border-width: 1px; }
.vision-gym-specs li{ border-left-width: 2px; }
.vision-faq__cat-ttl::after,
.vision-faq__item summary::after{ border-width: 2px; }

.sec-ttl__lead{ line-height: 2; }
.vision-feat-block__lead{ line-height: 2; }

/* ── 7. ハード落ち影 → やわらかい影（黒の透過のみ・新色なし） ─ */
.vision-gym-stats > li,
.vision-gym-stats__catalog a,
.vision-two-map__pass{
  box-shadow: 0 2px 8px rgba(0,0,0,.05), 0 14px 32px -18px rgba(0,0,0,.28);
}
.btn{ box-shadow: 0 2px 8px rgba(0,0,0,.05), 0 12px 26px -16px rgba(0,0,0,.26); }
.btn--onblack{ box-shadow: none; }
.vision-two-map__pass{ border-radius: var(--r-chip); }
.vision-gym-stats__catalog a{ border-radius: var(--r-lg); }

/* マシン数字パネル：黒地×黄数字 → 白地×黒数字（黄は数字下のバー） */
.vision-gym-stats > li{
  background: var(--fill-white);
  color: var(--ink-black);
  border: 1px solid var(--ink-line);
  border-radius: var(--r-lg);
}
.vision-gym-stats b{
  position: relative;
  color: var(--ink-black);
  font-weight: 700;
  letter-spacing: -.01em;
  padding-bottom: 10px;
}
.vision-gym-stats b::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 28px;
  height: 3px;
  border-radius: var(--r-chip);
  background: var(--fill-yellow);
}
.vision-gym-stats__jp{ color: var(--ink-black); font-weight: 700; }
.vision-gym-stats__en{ color: var(--ink-lightgray); font-weight: 500; letter-spacing: .2em; }
.vision-gym-stats > .vision-gym-stats__catalog{ border: 0; background: none; box-shadow: none; }

/* 比較枠：黄ベタ → 淡黄＋黄の細枠。角丸を揃える */
.vision-gym-vs__other{
  background: var(--bg-lightgray);
  border: 1px solid var(--ink-line);
  border-radius: var(--r-lg);
}
.vision-gym-vs__us{
  background: var(--c-paleyellow-2);
  color: var(--ink-black);
  border: 1px solid var(--fill-yellow);
  border-radius: var(--r-lg);
}
.vision-gym-vs span{ font-weight: 700; letter-spacing: .22em; font-size: .64rem; }

.vision-gym-specs li{
  border: 1px solid var(--ink-line);
  border-radius: var(--r-lg);
  padding-left: 50px;
  position: relative;
}
.vision-gym-specs li::before{
  content: "";
  position: absolute;
  left: 16px;
  top: 16px;
  width: 24px;
  height: 24px;
  border-radius: var(--r-dot);
  background: var(--ink-accenttint);
}
.vision-gym-specs li::after{
  content: "";
  position: absolute;
  left: 24px;
  top: 22px;
  width: 6px;
  height: 10px;
  border-right: 2px solid var(--ink-accent);
  border-bottom: 2px solid var(--ink-accent);
  transform: rotate(45deg);
}
.vision-gym-specs b{ font-weight: 700; }

/* 締めコピー：黒地×黄英字 → 淡黄地×黒文字＋ゴールド英字 */
.vision-gym-close{
  background: var(--c-paleyellow-2);
  color: var(--ink-black);
  border: 1px solid var(--fill-yellow);
  border-radius: var(--r-xl);
}
.vision-gym-close__en{
  color: var(--c-gold);
  font-weight: 500;
  letter-spacing: .34em;
}

/*══════════════════════════════════════════════════════════════════
   03 相当：AMENITY（案5で新設）— 既存トークンのみで構成
   ══════════════════════════════════════════════════════════════════*/
.vision-amenity{ padding: 8px 0 40px; }
.vision-amenity__top{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  gap: clamp(20px, 3vw, 34px);
  align-items: start;
  margin: 0 0 clamp(28px, 4vw, 44px);
}
.vision-amenity__photos{ position: relative; }
.vision-amenity__viewport{
  position: relative;
  overflow: hidden;
  border: 1px solid var(--ink-line);
  border-radius: var(--r-xl);
  background: var(--fill-white);
  box-shadow: 0 2px 8px rgba(0,0,0,.04), 0 16px 34px -20px rgba(0,0,0,.26);
}
.vision-amenity__track{
  display: flex;
  transition: transform .45s cubic-bezier(.22,.7,.2,1);
}
.vision-amenity__photo{
  flex: 0 0 100%;
  min-width: 0;
  margin: 0;
  background: var(--fill-white);
}
.vision-amenity__photo img{
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display: block;
}
.vision-amenity__photo figcaption{
  padding: 12px 16px 14px;
  font-size: .78rem;
  font-weight: 700;
  color: var(--ink-gray);
  letter-spacing: .02em;
}
.vision-amenity__nav{
  display: none;
  position: absolute;
  top: calc((100% - 2.8rem) / 2);
  z-index: 2;
  place-items: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--r-dot);
  background: rgba(12, 12, 12, .72);
  color: var(--ink-white);
  cursor: pointer;
  transform: translateY(-50%);
  transition: background-color .2s ease, color .2s ease;
}
.js .vision-amenity__nav{ display: grid; }
.vision-amenity__nav:hover,
.vision-amenity__nav:focus-visible{
  background: var(--fill-yellow);
  color: var(--ink-black);
  outline: none;
}
.vision-amenity__nav--prev{ left: 10px; }
.vision-amenity__nav--next{ right: 10px; }
.vision-amenity__nav svg{
  width: 18px;
  height: 18px;
  display: block;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.vision-amenity__dots{
  display: none;
  justify-content: center;
  gap: 8px;
  margin: 12px 0 0;
}
.js .vision-amenity__dots{ display: flex; }
.vision-amenity__dot{
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: var(--r-dot);
  background: var(--ink-line);
  cursor: pointer;
}
.vision-amenity__dot.is-on{ background: var(--ink-accent); }
.vision-amenity__list{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.vision-amenity__list li{
  display: flex;
  gap: 12px;
  padding: 16px 16px 14px;
  background: var(--fill-white);
  border: 1px solid var(--ink-line);
  border-radius: var(--r-lg);
  box-shadow: 0 1px 6px rgba(0,0,0,.03), 0 12px 26px -20px rgba(0,0,0,.22);
}
.vision-amenity__ico{
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: var(--r-dot);
  background: var(--ink-accenttint);
  color: var(--ink-accent);
}
.vision-amenity__ico svg{
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.vision-amenity__list b{
  display: block;
  margin: 0 0 3px;
  font-size: .92rem;
  font-weight: 700;
  line-height: 1.5;
}
/* アイコン用の span を巻き込まないよう、直下の div 内だけに当てる */
.vision-amenity__list li > div > span{
  display: block;
  font-size: .78rem;
  line-height: 1.85;
  color: var(--ink-gray);
}

.vision-trust--stat .vision-trust__item{ position: relative; }
.vision-trust__list li:not(:first-child),
.vision-trust--stat .vision-trust__item:not(:first-child){ border-left: 0; }
.vision-trust--stat .vision-trust__item:not(:first-child)::before{
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 36px;
  background: var(--ink-line);
}

@media (min-width: 768px) and (max-width: 1023px){
  .vision-trust--stat .vision-trust__item:nth-child(odd)::before{ content: none; }
}

@media (min-width: 1024px){
  .vision-trust--stat .vision-trust__list{
    display: flex;
    justify-content: center;
    align-items: stretch;
    
    margin-inline: auto;
  }
  .vision-trust--stat .vision-trust__item{
    flex: 0 0 auto;
    width: 224px;
    min-width: 0;
    padding-inline: 16px;
  }
}

.vision-ba__ratio{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
  gap: clamp(20px, 3vw, 34px);
  align-items: center;
  margin: clamp(24px, 3.5vw, 36px) 0 0;
  padding: 20px;
  background: var(--fill-white);
  border: 1px solid var(--ink-line);
  border-radius: var(--r-lg);
}
.vision-ba__ratio-photo{
  margin: 0;
  border-radius: var(--r);
  overflow: hidden;
}
.vision-ba__ratio-photo img{
  width: 100%;
  height: auto;
  display: block;
}
.vision-ba__ratio-ttl{
  margin: 0 0 8px;
  font-size: clamp(1.05rem, 2vw, 1.25rem);
  font-weight: 700;
  line-height: 1.5;
  
  color: var(--ink-black);
}
.vision-ba__ratio-desc{
  margin: 0;
  font-size: 1rem;
  line-height: 1.75;
  color: var(--ink-gray);
}
@media (max-width: 640px){
  .vision-ba__ratio{ grid-template-columns: 1fr; padding: 16px; }
}

/* ── ブロック小見出し（ポイント／一覧／ジャーニーの区切り） ── */
.vision-amenity__ttl{
  margin: clamp(30px, 4vw, 44px) 0 16px;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1.5;
}
.vision-amenity__ttl-en{
  display: block;
  margin: 0 0 4px;
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .3em;
  color: var(--ink-lightgray);
}

/* ── 設備・アメニティ一覧（テキストのみ・ラベル＋内容の定義リスト） ── */
.vision-amenity__spec{
  margin: 0;
  border-top: 1px solid var(--ink-line);
}
.vision-amenity__spec > div{
  display: grid;
  grid-template-columns: 168px minmax(0, 1fr);
  gap: 4px 20px;
  padding: 14px 4px;
  border-bottom: 1px solid var(--ink-line);
}
.vision-amenity__spec dt{
  margin: 0;
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.7;
  color: var(--ink-black);
}
.vision-amenity__spec dd{
  margin: 0;
  font-size: 1rem;
  line-height: 1.9;
  color: var(--ink-gray);
}
@media (max-width: 640px){
  .vision-amenity__spec > div{
    grid-template-columns: 1fr;
    gap: 2px;
    padding: 13px 2px;
  }
  .vision-amenity__spec dt{ color: var(--ink-lightgray); font-size: .72rem; letter-spacing: .06em; }
}

.vision-amenity__journey{
  position: relative;
  padding-top: 188px; /* カード上に切り抜きがぽんと出る分 */
  margin: 0 0 18px;
}
/* 道は「点線」。進行は足跡。塗り進むバーは置かない */
.vision-amenity__rail{
  position: absolute;
  top: 165px;
  left: calc(10% - 4px);
  right: calc(10% - 4px);
  height: 0;
  border-top: 1px dashed var(--ink-line);
}
.vision-amenity__trail{
  position: absolute;
  inset: 0;
  display: block;
  pointer-events: none;
}

.vision-amenity__print{
  position: absolute;
  left: calc(var(--p) * 100%);
  top: 0;
  width: 14px;
  height: 22px;
  margin: -10px 0 0 -7px;
  opacity: 0;
  color: var(--fill-yellow);
  
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.22));
  transform:
    translate3d(0, calc(var(--side) * 9px), 0)
    rotate(90deg)
    scaleX(var(--side))
    scale(.78);
  transition: opacity .32s ease, transform .32s cubic-bezier(.2, .7, .2, 1);
}
.vision-amenity__print.is-on{
  opacity: .92;
  transform:
    translate3d(0, calc(var(--side) * 9px), 0)
    rotate(calc(90deg + var(--side) * 6deg))
    scaleX(var(--side))
    scale(1);
}
.vision-amenity__print svg{
  width: 100%;
  height: 100%;
  display: block;
}

/* 切り抜き人物：歩かせず、到達したステップの余白にぽんと出す */
.vision-amenity__figure{
  position: absolute;
  left: 50%;
  bottom: 100%;
  width: 84px;
  height: 148px;
  margin: 0 0 28px -42px;
  pointer-events: none;
  z-index: 2;
}
.vision-amenity__figure img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: bottom center;
  display: block;
  filter: drop-shadow(0 6px 10px rgba(0,0,0,.16));
}
.js .vision-amenity__figure{
  opacity: 0;
  transform: scale(.62);
  transition: opacity .2s ease, transform .38s cubic-bezier(.2, 1.55, .35, 1);
}
.js .vision-amenity__stop.is-passed .vision-amenity__figure,
.js .vision-amenity__stop.is-active .vision-amenity__figure{
  opacity: 1;
  transform: scale(1);
}

/* ゴール：道の終端＝5番の位置に、ブランドカラーの★が弾んで出る */
.vision-amenity__finish{
  position: absolute;
  left: 100%;
  top: 0;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin: -17px 0 0 -17px;
  border-radius: var(--r-dot);
  background: var(--fill-yellow);
  color: var(--ink-black);
  opacity: 0;
  transform: scale(.2) rotate(-45deg);
  transition: opacity .25s ease, transform .55s cubic-bezier(.2, 1.5, .4, 1);
  z-index: 5;
  pointer-events: none;
}
.vision-amenity__finish.is-on{
  opacity: 1;
  transform: scale(1) rotate(0deg);
}
.vision-amenity__finish svg{
  width: 19px;
  height: 19px;
  display: block;
  fill: currentColor;
}
/* 弾けるリング */
.vision-amenity__finish::before{
  content: "";
  position: absolute;
  inset: -5px;
  border-radius: var(--r-dot);
  border: 2px solid var(--fill-yellow);
  opacity: 0;
}
.vision-amenity__finish.is-on::before{
  animation: amenityBurst .75s ease-out .1s;
}
@keyframes amenityBurst{
  from{ opacity: .85; transform: scale(.55); }
  to  { opacity: 0;   transform: scale(2);   }
}
/* ゴールしたカードを一度だけ弾ませる */
.js .vision-amenity__stop.is-goal{
  background: var(--c-paleyellow);
  border-color: var(--fill-yellow);
  animation: amenityGoal .6s cubic-bezier(.2, 1.4, .4, 1);
}
@keyframes amenityGoal{
  0%  { transform: scale(1); }
  45% { transform: scale(1.045); }
  100%{ transform: scale(1); }
}

.vision-amenity__flow{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: amenityflow;
}
.vision-amenity__flow li{
  position: relative;
  padding: 16px 8px;
  background: var(--fill-tint-2);
  border: 1px solid var(--ink-line);
  border-radius: var(--r-lg);
  text-align: center;
  font-size: clamp(.7rem, 1.25vw, .88rem);
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
  transition: background-color .3s ease, border-color .3s ease, opacity .3s ease;
}
/* 番号バッジはレールの上に乗せる */
.vision-amenity__flow li::before{
  counter-increment: amenityflow;
  content: counter(amenityflow);
  position: absolute;
  top: -33px;
  left: 50%;
  transform: translateX(-50%);
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: var(--r-dot);
  background: var(--ink-accent);
  border: 2px solid var(--ink-accent);
  font-size: .64rem;
  font-weight: 700;
  color: var(--ink-white);
  transition: background-color .3s ease, border-color .3s ease, color .3s ease;
  z-index: 1;
}
/* JS が動くときだけ「未通過」を淡く見せる */
.js .vision-amenity__stop{ opacity: .5; }
.js .vision-amenity__stop::before{
  background: var(--fill-white);
  border-color: var(--ink-line);
  color: var(--ink-lightgray);
}
.js .vision-amenity__stop.is-passed,
.js .vision-amenity__stop.is-active{ opacity: 1; }
.js .vision-amenity__stop.is-passed::before,
.js .vision-amenity__stop.is-active::before{
  background: var(--ink-accent);
  border-color: var(--ink-accent);
  color: var(--ink-white);
}
.js .vision-amenity__stop.is-active{
  background: var(--ink-accenttint);
  border-color: var(--ink-accent);
}
@media (prefers-reduced-motion: reduce){
  .vision-amenity__print{ transition: none; }
  .vision-amenity__finish{ transition: none; }
  .vision-amenity__finish.is-on::before{ animation: none; }
  .js .vision-amenity__stop.is-goal{ animation: none; }
  .js .vision-amenity__stop{ opacity: 1; }
  .js .vision-amenity__figure{ transition: none; }
}
.vision-amenity__note{
  margin: 0;
  font-size: .74rem;
  color: var(--ink-lightgray);
}

@media (prefers-reduced-motion: reduce){
  .vision-amenity__track{ transition: none; }
}
@media (max-width: 900px){
  .vision-amenity__top{ grid-template-columns: 1fr; }

  .vision-amenity__journey{
    padding-top: 0;
    padding-left: 0;
  }
  .vision-amenity__rail{
    left: 50%;
    right: auto;
    top: 34px;
    bottom: 34px;
    width: 0;
    height: auto;
    margin-left: 0;
    border-top: 0;
    border-left: 1px dashed var(--ink-line);
  }
  
  .vision-amenity__print{
    left: 0;
    top: calc(var(--p) * 100%);
    margin: -10px 0 0 -7px;
    transform:
      translate3d(calc(var(--side) * 10px), 0, 0)
      rotate(180deg)
      scaleX(var(--side))
      scale(.78);
  }
  .vision-amenity__print.is-on{
    transform:
      translate3d(calc(var(--side) * 10px), 0, 0)
      rotate(calc(180deg + var(--side) * 6deg))
      scaleX(var(--side))
      scale(1);
  }
  
  .vision-amenity__finish{
    left: 0;
    top: 100%;
    margin: -9px 0 0 -17px;
  }

  
  .vision-amenity__flow{
    grid-template-columns: 1fr 1fr;
    column-gap: 48px;
    row-gap: 30px;
  }
  .vision-amenity__stop:nth-child(1){ grid-area: 1 / 1; }
  .vision-amenity__stop:nth-child(2){ grid-area: 2 / 2; }
  .vision-amenity__stop:nth-child(3){ grid-area: 3 / 1; }
  .vision-amenity__stop:nth-child(4){ grid-area: 4 / 2; }
  .vision-amenity__stop:nth-child(5){ grid-area: 5 / 1; }

  .vision-amenity__flow li{
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 176px;
    padding: 14px 12px;
    text-align: center;
    font-size: 1rem;
    line-height: 1.7;
    white-space: normal;
  }
  /* ジグザグの空き列に人物を置く。1・3・5は右、2・4は左 */
  .vision-amenity__figure{
    top: 50%;
    bottom: auto;
    width: 100%;
    height: 168px;
    margin: -84px 0 0;
    z-index: 2;
  }
  .vision-amenity__stop:nth-child(odd) .vision-amenity__figure{
    left: calc(100% + 48px);
  }
  .vision-amenity__stop:nth-child(even) .vision-amenity__figure{
    left: auto;
    right: calc(100% + 48px);
  }

  /* 番号バッジ：中央レール上（カードの外側 24px＝column-gap の半分） */
  .vision-amenity__flow li::before{
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
  }
  .vision-amenity__stop:nth-child(odd)::before{ left: auto; right: -35px; }
  .vision-amenity__stop:nth-child(even)::before{ left: -35px; right: auto; }

  /* カード端から中央バッジへのコネクタ */
  .vision-amenity__stop::after{
    content: "";
    position: absolute;
    top: 50%;
    width: 13px;
    height: 0;
    border-top: 1px solid var(--ink-line);
  }
  .vision-amenity__stop:nth-child(odd)::after{ right: -13px; }
  .vision-amenity__stop:nth-child(even)::after{ left: -13px; }
}
@media (max-width: 520px){
  .vision-amenity__list{ grid-template-columns: 1fr; }
}