/* menu-shared.css — 撮影メニュー共通の骨格スタイル（旧 menu-20th.css を共通化）
   依存：global.css / components.css / menu.css
   読み込み条件：functions.php で is_page_template('_menu.php')（全撮影メニュー共通）
   役割：全撮影メニューの構造・レイアウト・寒色デフォルト基調を供給する骨格。
        七五三など per-slug の暖色テーマは theme-{slug}.css で上に重ねる（例：theme-753.css）。
        ＝旧 menu-20th.css と本文 byte 完全一致（先頭コメントのみ更新・出力不変）。
   クラス命名：.nb__*（new-base：案J専用）/ .jm__*（案I方式チャプターヘッダー）
   重複除外済み：.rv / .d1-.d4 / .site-hdr.sc / .nb__chapter scroll-margin-top
                / .nb__page-nav-* は global.css / components.css に既存
   ================================================================ */

/* ================================================================
   案J ナラティブ ベース構造（成人式専用）
   重複除外：.skip-link は global.css、.nb__page-nav-* は components.css に既存
================================================================ */

/* ── ページ全体 wrapper ────────────────────────────────────── */
.nb__page { background: var(--cream); }

/* ブレイクポイント補助クラス */
.nb__br-pc { display: none; }
.nb__br-sp { display: inline; } /* SP改行（H1のテキスト設定など）。PCは下の@768で非表示。 */
@media (min-width: 768px) {
  .nb__br-pc { display: inline; }
  .nb__br-sp { display: none; }
}

/* ── HERO ベース（白カード版） ──────────────────────────── */
.nb__hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 60px;
  overflow: hidden;
  background: var(--charcoal);
}
@supports (min-height: 100svh) {
  .nb__hero { min-height: 100svh; }
}
@media (min-width: 768px) {
  .nb__hero { padding-top: 72px; }
}
.nb__hero-bg { position: absolute; inset: 0; z-index: 0; }
.nb__hero-img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.nb__hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(28,28,28,.45) 0%, rgba(28,28,28,.28) 40%, rgba(28,28,28,.52) 100%);
}
/* 専用写真が未提供のメニュー（hero--noimg）：写真の代わりにテーマ色の濃いグラデ背景。
   各 theme-{slug}.css が .nb__page .nb__hero--noimg .nb__hero-bg を上書きしてテーマ色にする。
   デフォルトは寒色系（共通骨格の基調）。白文字カードが乗るので十分濃く。 */
.nb__hero--noimg .nb__hero-bg { background: linear-gradient(150deg, #3a4654 0%, #232c38 100%); }
.nb__hero-card {
  position: relative;
  z-index: 2;
  background: rgba(249,246,241,.94);
  border: 1px solid rgba(184,151,90,.22);
  box-shadow:
    0 2px 4px rgba(0,0,0,.04),
    0 8px 40px rgba(0,0,0,.14),
    inset 0 1px 0 rgba(255,255,255,.8);
  padding: 32px 24px;
  margin: 16px;
  max-width: 580px;
  width: calc(100% - 32px);
  text-align: center;
}
@media (min-width: 480px) {
  .nb__hero-card { padding: 44px 40px; margin: 24px; }
}
@media (min-width: 768px) {
  .nb__hero-card { padding: 56px 56px; max-width: 640px; margin: 32px auto; }
}
.nb__hero-card-en {
  display: block;
  font-family: var(--en);
  font-size: .55rem;
  letter-spacing: .36em;
  color: var(--gold);
  text-transform: uppercase;
  margin-bottom: 20px;
}
.nb__hero-h1 {
  font-family: var(--jp);
  font-size: clamp(1.2rem, 5vw, 1.72rem);
  font-weight: 300;
  letter-spacing: .12em;
  line-height: 1.7;
  color: var(--charcoal);
  margin-bottom: 16px;
}

/* 信頼証明バー（.nb__trust*）は menu.css に一本化（トップと線デザイン統一・全メニュー共通）。
   ページ間で桁/色/線がズレないよう、ここでは再定義しない。色変更も menu.css 側で行う。 */

/* HERO CTA */
.nb__hero-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.nb__cta-line {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 15px 32px;
  font-family: var(--jp);
  font-size: .86rem;
  font-weight: 500;
  letter-spacing: .08em;
  text-decoration: none;
  width: 100%;
  max-width: 320px;
}
.nb__final-line-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 36px;
  font-family: var(--jp);
  font-size: .9rem;
  font-weight: 500;
  letter-spacing: .1em;
  text-decoration: none;
  white-space: nowrap;
}
.nb__final-btn {
  font-family: var(--jp);
  font-size: .8rem;
  font-weight: 500;
  letter-spacing: .08em;
  padding: 14px 26px;
  white-space: nowrap;
}
.nb__hero-note {
  font-family: var(--sans); /* 直下の .nb__hero-example（ゴシック）と揃える */
  font-size: .66rem;
  color: var(--warm-gray);
  letter-spacing: .04em;
}

/* スクロールインジケーター */
.nb__scroll {
  position: absolute;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
/* rv が付くと .rv の transform: translateY(22px) で中央配置 translateX(-50%) が上書き
   されてしまうので、両軸を組み合わせた transform を専用定義 */
.rv.nb__scroll { transform: translate(-50%, 22px); }
.rv.nb__scroll.on { transform: translate(-50%, 0); }
.nb__scroll-line {
  display: block;
  width: 1px;
  height: 36px;
  background: linear-gradient(to bottom, rgba(255,255,255,.4), rgba(255,255,255,0));
  animation: nbScrollLine 2s ease infinite;
}
@keyframes nbScrollLine {
  0%   { transform: scaleY(0); transform-origin: top; }
  50%  { transform: scaleY(1); transform-origin: top; }
  51%  { transform: scaleY(1); transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}
.nb__scroll-txt {
  font-family: var(--en);
  font-size: .5rem;
  letter-spacing: .28em;
  color: rgba(255,255,255,.35);
  text-transform: uppercase;
}

/* ── ①-B キャンペーン告知カード（対象メニューのみ・ヒーロー直下／複数可） ───────
   サイト共通設定リピーターのキャンペーンを style 別カードで表示する（template-parts/menu/campaign-card.php）。
   PC＝写真右・文字左（案ア）／SP＝縦積み・ボタン下部（スマホファースト）。
   style：c=明るいパネル＋写真／c1=写真ぜんめん＋左暗幕／c3=写真ぜんめん＋浮遊ガラス／d=写真なしゴールド。
   per-slug テーマ（theme-{slug}.css）は .nb__camp-* を上書きしない＝どのメニューでも同じゴールド基調。 */
.nb__campaign {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 24px var(--sp); /* SPも左右に余白＝角丸カードとして見せる（2026-07-21 オーナーFBで全幅帯から再転換） */
  /* 地はクリームでなく暖色寄りの濃茶（2026-07-21 オーナー選定＝4案比較のC案）。
     写真の暗幕 rgba(18,14,10,…) と同系＝カード内の暗部と地続きになり、金枠が沈まず映える。
     無彩色の charcoal(#1C1C1C) だと金が冷たく浮くため不採用。 */
  background: #1a1512;
}
@media (min-width: 768px) { .nb__campaign { padding: 36px var(--sp); } }

/* カード共通の外枠（<a>） */
.nb__camp {
  position: relative;
  display: block;
  max-width: 920px;
  margin: 0 auto;
  width: 100%;
  overflow: hidden;
  text-decoration: none;
  border-radius: 14px; box-shadow: 0 6px 18px rgba(0,0,0,.12); /* SP/PC共通の角丸カード（2026-07-21 オーナーFB＝SPも角丸に戻す） */
}

/* 共通：ラベル行（CAMPAIGN＋期間限定）。ピル・グラデにせず情報として置く。
   既定色は暗地（c1/c3）用＝明るい地の c/d が各スタイル節で上書き。 */
.nb__camp-badges { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.nb__camp-badge {
  font-family: var(--en); font-size: .76rem; font-weight: 600; letter-spacing: .24em;
  color: var(--gold-lt);
}
.nb__camp-limited {
  font-family: var(--jp); font-size: .7rem; letter-spacing: .14em;
  color: rgba(255,255,255,.85);
  padding-left: 12px; border-left: 1px solid rgba(212,176,122,.55); /* ラベル2つの区切り罫 */
}

/* 共通：タイトル・説明 */
.nb__camp-title { font-family: var(--jp); font-weight: 600; line-height: 1.5; letter-spacing: .04em; }
.nb__camp-desc  { font-family: var(--jp); line-height: 1.7; }

/* 共通：CTA（ベタの金＋擬似要素シェブロン。つや・グロー影は使わない） */
.nb__camp-cta {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 13px 26px;
  font-family: var(--jp); font-size: .92rem; font-weight: 600; letter-spacing: .04em;
  color: #fff; background: var(--gold);
  border-radius: 999px;
  white-space: nowrap;
  transition: background var(--t);
}
.nb__camp-cta::after {
  content: ""; display: inline-block;
  width: .42em; height: .42em;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: rotate(-45deg);
  transition: transform var(--t);
}
.nb__camp:hover .nb__camp-cta { background: var(--gold-dk); }
.nb__camp:hover .nb__camp-cta::after { transform: translateX(3px) rotate(-45deg); }

/* ── style c：明るいパネル＋写真（SP=写真上→パネル下／PC=パネル左・写真右） ── */
.nb__camp--c { display: flex; flex-direction: column; background: var(--warm-white); border: 1px solid var(--gold-lt); }
.nb__camp--c .nb__camp-photo { order: -1; width: 100%; height: 170px; object-fit: cover; display: block; }
.nb__camp--c .nb__camp-panel { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 20px 22px; background: var(--warm-white); }
.nb__camp--c .nb__camp-title { color: var(--charcoal); font-size: 1.16rem; }
.nb__camp--c .nb__camp-desc  { color: var(--text2); font-size: .84rem; }
.nb__camp--c .nb__camp-badge { color: var(--gold-dk); }
.nb__camp--c .nb__camp-limited { color: var(--text2); border-left-color: var(--light-gray); } /* 明地の区切り罫は light-gray（type-and-color【8】） */
.nb__camp--c .nb__camp-cta { width: 100%; }
@media (min-width: 768px) {
  .nb__camp--c { flex-direction: row; align-items: stretch; }
  .nb__camp--c .nb__camp-panel { flex: 1; justify-content: center; padding: 26px 34px; position: relative; }
  .nb__camp--c .nb__camp-panel::after { content: ''; position: absolute; right: 0; top: 22px; bottom: 22px; width: 1px; background: linear-gradient(180deg, transparent, var(--gold-lt), transparent); }
  .nb__camp--c .nb__camp-photo { order: 0; width: 40%; height: auto; align-self: stretch; }
  .nb__camp--c .nb__camp-cta { width: auto; }
  .nb__camp--c .nb__camp-title { font-size: 1.3rem; }
}

/* ── style c1：写真ぜんめん＋暗幕（SP=下から暗・文字下／PC=左から暗・文字左） ── */
.nb__camp--c1 { min-height: 430px; }
.nb__camp--c1 .nb__camp-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nb__camp--c1 .nb__camp-ov { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(18,14,10,.94) 0%, rgba(18,14,10,.7) 30%, rgba(18,14,10,.15) 62%, rgba(18,14,10,0) 100%); }
/* ラベル行は本文の先頭（暗幕の上）＝写真上の素置きにしない（実背景の暗さを担保）。
   SPでは暗幕の薄い高さに掛かるため、タイトルと同系の文字影で写真柄への耐性を持たせる。 */
.nb__camp--c1 .nb__camp-body { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 20px; }
.nb__camp--c1 .nb__camp-badges { text-shadow: 0 1px 8px rgba(0,0,0,.55); }
.nb__camp--c1 .nb__camp-title { color: #fff; font-size: 1.2rem; text-shadow: 0 1px 10px rgba(0,0,0,.6); }
.nb__camp--c1 .nb__camp-desc  { color: rgba(255,255,255,.9); font-size: .84rem; }
.nb__camp--c1 .nb__camp-cta { width: 100%; }
@media (min-width: 768px) {
  .nb__camp--c1 { min-height: 300px; height: 300px; }
  .nb__camp--c1 .nb__camp-bg { object-position: right center; }
  .nb__camp--c1 .nb__camp-ov { background: linear-gradient(92deg, rgba(20,16,12,.93) 0%, rgba(20,16,12,.8) 32%, rgba(20,16,12,.28) 58%, rgba(20,16,12,0) 86%); }
  .nb__camp--c1 .nb__camp-body { top: 0; right: auto; justify-content: center; max-width: 56%; padding: 0 42px; }
  .nb__camp--c1 .nb__camp-cta { width: auto; }
  .nb__camp--c1 .nb__camp-title { font-size: 1.34rem; }
}

/* ── style c3：写真ぜんめん＋金線枠の浮遊ガラス（SP=下部に浮遊／PC=左半分に浮遊） ── */
.nb__camp--c3 { min-height: 460px; display: flex; flex-direction: column; justify-content: flex-end; }
.nb__camp--c3 .nb__camp-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.nb__camp--c3 .nb__camp-ov { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(18,14,10,.45), rgba(18,14,10,0) 55%); }
.nb__camp--c3 .nb__camp-glass {
  position: relative; z-index: 1; margin: 14px; padding: 18px 18px 20px;
  display: flex; flex-direction: column; align-items: flex-start; gap: 13px;
  background: rgba(26,21,16,.52);
  backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px);
  border: 1px solid rgba(212,176,122,.7); border-radius: 12px;
  box-shadow: 0 8px 22px rgba(0,0,0,.3);
}
.nb__camp--c3 .nb__camp-title { color: #fff; font-size: 1.2rem; text-shadow: 0 1px 10px rgba(0,0,0,.5); }
.nb__camp--c3 .nb__camp-desc  { color: rgba(255,255,255,.92); font-size: .84rem; }
.nb__camp--c3 .nb__camp-cta { width: 100%; }
@media (min-width: 768px) {
  .nb__camp--c3 { min-height: 330px; height: 330px; flex-direction: row; align-items: center; justify-content: flex-start; }
  .nb__camp--c3 .nb__camp-bg { object-position: right center; }
  .nb__camp--c3 .nb__camp-ov { background: linear-gradient(95deg, rgba(20,16,12,.34), rgba(20,16,12,.06) 60%); }
  .nb__camp--c3 .nb__camp-glass { width: calc(50% - 34px); margin: 26px; padding: 28px 32px; justify-content: center; gap: 15px; }
  .nb__camp--c3 .nb__camp-cta { width: auto; }
  .nb__camp--c3 .nb__camp-title { font-size: 1.36rem; }
}

/* ── style d：写真なしゴールド版（image 未設定時の自動フォールバック） ── */
.nb__camp--d { display: block; padding: 22px 24px; background: var(--warm-white); } /* 枠線は共通のキラン金リング（.nb__camp::after）に一本化 */
.nb__camp--d .nb__camp-d-body { display: flex; flex-direction: column; align-items: flex-start; gap: 13px; }
.nb__camp--d .nb__camp-title { color: var(--charcoal); font-size: 1.16rem; }
.nb__camp--d .nb__camp-desc  { color: var(--text2); font-size: .84rem; }
.nb__camp--d .nb__camp-badge { color: var(--gold-dk); }
.nb__camp--d .nb__camp-limited { color: var(--text2); border-left-color: var(--light-gray); }
.nb__camp--d .nb__camp-cta { width: 100%; }
@media (min-width: 768px) {
  .nb__camp--d { padding: 24px 30px; }
  .nb__camp--d .nb__camp-title { font-size: 1.24rem; }
  .nb__camp--d .nb__camp-cta { width: auto; }
}

/* 角の極細ダークライン対策（2026-07-21 オーナー指摘）
   金リング（::after）のmask角と、カード側 overflow:hidden の角丸クリップは別々に
   ラスタライズされる。カードが端数ピクセル位置に載ると両者の丸みが1px未満ずれ、
   その隙間から下の写真／暗幕が暗い極細線として角の弧に覗く（headless実測：
   left:20px＝出ない／20.5px・20.33px＝出る、で再現を確認）。
   対策＝写真と暗幕を金枠の内側（8px）まで下げ、内側の角丸を枠の内周半径（14-8=6px）に
   合わせる。1px だけ下げた版では枠の外側7px分と重なったままで、角の弧では写真が枠より
   外へ食み出して見えた（2026-07-21 オーナー指摘スクショ＝上辺・左辺・四隅の黒）。 */
.nb__camp-bg, .nb__camp-ov, .nb__camp-photo { border-radius: inherit; }
.nb__camp--c1 .nb__camp-bg, .nb__camp--c1 .nb__camp-ov,
.nb__camp--c3 .nb__camp-bg, .nb__camp--c3 .nb__camp-ov {
  inset: 8px; border-radius: 6px;
  /* width/height は各スタイル節の 100% を上書きして inset に従わせる（auto では後勝ちに負ける） */
  width: calc(100% - 16px); height: calc(100% - 16px);
}

/* ── キャンペーンカードのゴールド枠＝トップのキャンペーンバナーと同じ「キラン」（2026-07-21 オーナー要望）
   トップ（top.css .campaign-banner-text）の金グラデ横流し＋光パルスを、カード縁のリングに移植。
   リングの作り方＝::after を全面に重ね、mask の content-box 除外（padding=枠太さ）でグラデを枠だけに残す。
   グラデ・秒数・イージングはトップと同値（100deg・260%幅・4.2s・var(--ease)）＝サイト内で光り方を揃える。 */
.nb__camp::after {
  content: '';
  position: absolute; inset: 0; z-index: 3;
  border-radius: 14px;
  padding: 8px; /* ＝枠の太さ（1.5px→3px→8px＝オーナーFB「額縁ぐらい太く」B案採用） */
  background:
    linear-gradient(
      100deg,
      rgba(212,176,122,.85) 0%,
      rgba(212,176,122,.85) 38%,
      #fff6c7 46%,
      #fff 50%,
      #fff6c7 54%,
      rgba(212,176,122,.85) 62%,
      rgba(212,176,122,.85) 100%
    )
    100% 50% / 260% 100% no-repeat;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
          mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
  animation: campBorderShine 4.2s var(--ease) infinite, campBorderGlow 4.2s var(--ease) infinite;
}
@keyframes campBorderShine {
  0%, 42% { background-position: 100% 50%; }
  68%, 100% { background-position: 0 50%; }
}
@keyframes campBorderGlow {
  0%, 64%, 100% { filter: brightness(1) drop-shadow(0 0 3px rgba(212,176,122,.18)); }
  72% { filter: brightness(1.16) drop-shadow(0 0 8px rgba(212,176,122,.55)); }
  82% { filter: brightness(1.06) drop-shadow(0 0 5px rgba(212,176,122,.34)); }
}

@media (prefers-reduced-motion: reduce) {
  .nb__camp-cta, .nb__camp-cta::after { transition: none; }
  .nb__camp:hover .nb__camp-cta::after { transform: rotate(-45deg); }
  .nb__camp::after { animation: none; background: rgba(212,176,122,.85); } /* 動きなし＝静的な金枠 */
}

/* ── 章：共通レイアウト ──────────────────────────────────── */
.nb__chapter { display: block; scroll-margin-top: 108px; }
@media (min-width: 768px) {
  .nb__chapter { scroll-margin-top: 124px; }
}
.nb__chapter-body { min-width: 0; }

/* ── Chapter 1: 共感コピー ──────────────────────────────── */
.nb__chapter--empathy {
  background: var(--cream);
  padding-bottom: 64px;
}
@media (min-width: 768px) {
  .nb__chapter--empathy { padding-bottom: 96px; }
}
.nb__empathy-lead {
  font-family: var(--jp);
  font-size: clamp(1rem, 2.5vw, 1.15rem);
  font-weight: 300;
  letter-spacing: .1em;
  line-height: 1.9;
  color: var(--charcoal);
  margin-bottom: 24px;
}
.nb__empathy-txt { margin-bottom: 16px; }

/* 定義文ブロック（AIO対応） */
.nb__definition {
  margin-top: 40px;
  padding: 24px 20px;
  background: var(--warm-white);
  border-left: 3px solid var(--gold);
  border-bottom: 1px solid rgba(184,151,90,.18);
}
@media (min-width: 768px) {
  .nb__definition { padding: 28px 32px; }
}
.nb__definition-label {
  font-family: var(--en);
  font-size: .6rem;
  letter-spacing: .28em;
  color: var(--gold-dk); /* 明るい地の eyebrow は gold-dk（--gold=cream2.56:1でAA割れ・2026-07-21） */
  text-transform: uppercase;
  margin-bottom: 12px;
}
.nb__definition-text {
  font-family: var(--jp);
  font-size: .875rem;
  line-height: 2.0;
  letter-spacing: .04em;
  color: var(--text2);
}
.nb__definition-text strong {
  color: var(--charcoal);
  font-weight: 400;
}

/* ポイントリスト */
.nb__points {
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.nb__point {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 20px;
  background: var(--warm-white);
  border: 1px solid rgba(184,151,90,.14);
  transition: opacity .7s ease, transform .7s ease, border-color .3s ease, box-shadow .3s ease;
  /* opacity / transform を含めて .rv のフェードイン演出を完全に有効化
     （.rv の translateY(22px)→0 動きも合わせてアニメーションする） */
}
.nb__point:hover {
  border-color: rgba(184,151,90,.32);
  box-shadow: 0 4px 16px rgba(184,151,90,.08);
}
@media (min-width: 768px) {
  .nb__points { gap: 16px; }
  .nb__point { padding: 22px 28px; }
}
.nb__point-ic { color: var(--gold); font-size: .7rem; margin-top: 4px; flex-shrink: 0; }
.nb__point-title {
  font-family: var(--jp);
  font-size: .875rem;
  font-weight: 400;
  letter-spacing: .06em;
  color: var(--charcoal);
  margin-bottom: 6px;
}
.nb__point-desc { font-size: .8rem; margin-bottom: 0; }

/* ── 全幅写真帯（章区切り） ─────────────────────────────── */
.nb__photo-band {
  position: relative;
  width: 100%;
  height: 260px;
  overflow: hidden;
  background: var(--charcoal);
}
@media (min-width: 768px) { .nb__photo-band { height: 400px; } }
@media (min-width: 1100px) { .nb__photo-band { height: 500px; } }
.nb__photo-band-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  filter: brightness(.82);
}
.nb__photo-band--dark .nb__photo-band-img { filter: brightness(.55); }
.nb__photo-band-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(28,28,28,.2), rgba(28,28,28,.4));
}
.nb__photo-band-quote {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: var(--jp);
  font-size: clamp(1.4rem, 5vw, 2.8rem);
  font-weight: 300;
  letter-spacing: .2em;
  color: rgba(255,255,255,.72);
  white-space: nowrap;
  text-align: center;
}
/* rv を当てたとき、.rv の transform: translateY(22px) が中央配置 translate(-50%,-50%) を
   上書きしてしまうので、中央配置を保ったまま下に22px ずらした位置から fade in させる */
.rv.nb__photo-band-quote { transform: translate(-50%, calc(-50% + 22px)); }
.rv.nb__photo-band-quote.on { transform: translate(-50%, -50%); }
.nb__photo-band-quote--long {
  font-size: clamp(1.05rem, 3vw, 1.95rem);
  letter-spacing: .06em;
  white-space: normal;
  max-width: 100%;
  line-height: 1.75;
  padding: 0 8px;
  box-sizing: border-box;
  width: 100%;
  text-align: center;
}

/* ── Chapter 2: 撮影実例（ベース） ──────────────────────── */
.nb__chapter--works {
  background: var(--warm-white);
  padding-bottom: 64px;
}
@media (min-width: 768px) {
  .nb__chapter--works { padding-bottom: 96px; }
}

/* ── Chapter 3: 料金（ベース） ──────────────────────────── */
.nb__chapter--price {
  background: var(--cream);
  padding-bottom: 64px;
}
@media (min-width: 768px) {
  .nb__chapter--price { padding-bottom: 96px; }
}

/* メイン料金カード */
.nb__price-card {
  position: relative;
  background: var(--warm-white);
  border: 1px solid rgba(184,151,90,.24);
  padding: 22px 16px 20px;
  box-shadow: 0 4px 24px rgba(0,0,0,.06);
  display: flex;
  flex-direction: column;
  min-width: 0; /* grid アイテムの min-width:auto を打ち消す。長い金額/特典でカード列が押し広げられ SP の 1fr 1fr が不均等になるのを防ぐ */
}
@media (min-width: 768px) {
  .nb__price-card { padding: 32px 22px 28px; }
}
.nb__price-badge {
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--gold);
  color: #fff;
  font-family: var(--jp);
  font-size: .58rem;
  letter-spacing: .1em;
  padding: 3px 12px;
  white-space: nowrap;
}
@media (min-width: 768px) {
  .nb__price-badge { font-size: .65rem; padding: 4px 16px; }
}
.nb__price-plan-name {
  font-family: var(--jp);
  font-size: .72rem;
  letter-spacing: .06em;
  color: var(--warm-gray);
  margin-bottom: 12px;
  margin-top: 4px;
  text-align: center;
}
@media (min-width: 768px) {
  .nb__price-plan-name { font-size: .8rem; letter-spacing: .1em; margin-bottom: 16px; margin-top: 8px; }
}
/* 着数・衣装区分ピル（任意）。プラン名の直下に置く静かな区分タグ。
   ベタ塗り・影・一辺色バーは禁止（ai-tells）＝細い金の枠線＋透明背景のゴシック小文字。
   人気No.1バッジ（.nb__price-badge・金ベタ塗り）とは佇まいで別物と分かる控えめさ。 */
.nb__price-plan-name + .nb__price-outfits { margin-top: -6px; }
.nb__price-outfits {
  margin: 0 0 12px;
  text-align: center;
}
.nb__price-outfits-pill {
  display: inline-block;
  padding: 2px 10px;
  border: 1px solid rgba(184,151,90,.42);
  border-radius: 999px;
  background: transparent;
  font-family: var(--sans);
  font-size: .68rem;
  letter-spacing: .04em;
  line-height: 1.4;
  color: var(--gold-dk);
  white-space: nowrap;
}
@media (min-width: 768px) {
  .nb__price-outfits { margin-bottom: 16px; }
  .nb__price-outfits-pill { font-size: .72rem; padding: 3px 12px; }
}
/* ピル無しカードの高さ予約用プレースホルダ＝場所（高さ）だけ確保して見た目は透明。
   同一メニュー内でピルの有無が混在しても、価格・特典の縦位置がカード間で揃う（オーナー指摘 2026-07-12）。 */
.nb__price-outfits--empty .nb__price-outfits-pill {
  border-color: transparent;
  color: transparent;
}
.nb__price-main {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 2px;
  margin-bottom: 16px;
  border-bottom: 1px solid rgba(184,151,90,.18);
  padding-bottom: 14px;
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  .nb__price-main { gap: 4px; margin-bottom: 22px; padding-bottom: 18px; }
}
.nb__price-from {
  font-family: var(--en);
  font-size: .9rem;
  color: var(--gold);
}
@media (min-width: 768px) { .nb__price-from { font-size: 1.05rem; } }
.nb__price-num {
  font-family: var(--en);
  font-size: clamp(1.5rem, 6.5vw, 2.4rem);
  font-weight: 300;
  color: var(--charcoal);
  letter-spacing: .01em;
  line-height: 1;
}
@media (min-width: 768px) {
  .nb__price-num { font-size: clamp(1.8rem, 2.6vw, 2.4rem); }
}
/* 価格の後ろ（「〜」等・plan_price_suffix）＝金額に付く補助記号。通貨記号 .nb__price-from と同格の佇まいに
   揃え（同サイズ・同色）、金額を左右から挟む形にする。書体は --jp（明朝）＝数字の --en は欧文フォントで
   「〜」のグリフを持たず、環境依存の日本語フォントへ落ちて級数・書体が浮くため明示する（監査第13回）。
   .nb__price-main は align-items:baseline ゆえ数字とベースラインが揃う。 */
.nb__price-suffix {
  font-family: var(--jp);
  font-size: .9rem;
  color: var(--gold);
  line-height: 1;
}
@media (min-width: 768px) { .nb__price-suffix { font-size: 1.05rem; } }
.nb__price-includes {
  list-style: none;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0;
  flex: 1;
}
@media (min-width: 768px) {
  .nb__price-includes { gap: 10px; }
}
.nb__price-includes li {
  position: relative;
  padding-left: 14px;
  font-family: var(--sans);
  font-size: .7rem;
  letter-spacing: .02em;
  color: var(--text2);
  line-height: 1.55;
}
@media (min-width: 768px) {
  .nb__price-includes li { font-size: .78rem; padding-left: 16px; letter-spacing: .03em; line-height: 1.6; }
}
.nb__price-includes li::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: .775em;
  transform: translateY(-50%);
  color: var(--gold);
  font-family: var(--en);
  font-size: .68rem;
  line-height: 1;
}
@media (min-width: 768px) {
  .nb__price-includes li::before { font-size: .76rem; top: .8em; }
}

/* 料金タブ（1人用 / きょうだい用・デフォルト1人用）。
   旧＝七五三専用として theme-753.css に置いていたが、/price/ の七五三タブ内でも
   同じ見た目・操作感を再現する必要があり（オーナー要望 2026-07-11）、/price/ にも
   常時 enqueue される menu-shared.css（全撮影メニュー共通の骨格層）へ移設した。
   753 固有の朱色アクセント（.nb__price-tab.is-active の文字色）は theme-753.css に残置。
   grep 用：この2クラスの「地」は menu-shared.css が正・色の重ね掛けは theme-{slug}.css。 */
.nb__price-tabs {
  display: flex;
  gap: 6px;
  justify-content: center;
  max-width: 360px;
  margin: 0 auto 28px;
  padding: 5px;
  background: rgba(107, 123, 140, .10);
  border-radius: 999px;
}
.nb__price-tab {
  flex: 1 1 0;
  padding: 11px 14px;
  border: none;
  border-radius: 999px;
  background: transparent;
  font-family: var(--jp);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--warm-gray);
  cursor: pointer;
  transition: background .25s ease, color .25s ease, box-shadow .25s ease;
}
.nb__price-tab.is-active {
  background: #fff;
  color: var(--charcoal);
  box-shadow: 0 1px 5px rgba(0, 0, 0, .09);
}
.nb__price-tab:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}
.nb__price-panel[hidden] { display: none; }
/* タブ切替アニメ：パネルを opacity でフェード（ニュッ）。JS が is-entering を一瞬付与→除去。
   /price/ 側（price.js）は is-entering を付与しない簡易版のため、この規則は影響しない（opacity:1固定のまま）。 */
.nb__price-panel { opacity: 1; transition: opacity .42s var(--ease); }
.nb__price-panel.is-entering { opacity: 0; }

/* 料金プラン グリッド */
.nb__price-plans {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: 1fr;
  gap: 32px 12px;
  margin-bottom: 32px;
}
@media (min-width: 768px) {
  .nb__price-plans {
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 1fr;
    gap: 16px;
  }
}
.nb__price-card--main { border: 2px solid var(--gold); }
.nb__price-card--premium {
  background: linear-gradient(180deg, rgba(184,151,90,.08) 0%, rgba(249,246,241,.6) 100%);
  border-color: rgba(184,151,90,.42);
}

/* 料金カード上部 メディアエリア（カルーセル） */
.nb__price-card-media {
  position: relative;
  margin: -22px -16px 14px;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: rgba(184,151,90,.06);
}
@media (min-width: 768px) {
  .nb__price-card-media { margin: -32px -22px 18px; }
}
.nb__price-card--main .nb__price-card-media { margin-top: -22px; }
@media (min-width: 768px) {
  .nb__price-card--main .nb__price-card-media { margin-top: -32px; }
}
.nb__price-card-slides {
  display: flex;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  height: 100%;
  width: 100%;
}
.nb__price-card-slides::-webkit-scrollbar { display: none; }
/* PC：マウスドラッグで横スクロール（common.js [11] data-drag-scroll）。ドラッグ中はカーソルを掴む形＋選択防止。 */
.nb__price-card-slides.is-dragging { cursor: grabbing; user-select: none; }
.nb__price-card-slides.is-dragging img { cursor: grabbing; }
/* ドラッグ中は mandatory snap を解除＝マウスドラッグがスナップと競合してカクつくのを防ぐ
   （指/ボタンを離すと is-dragging が外れスナップ復帰＝最寄り写真に吸着。2026-06-17）。
   ＋ scroll-behavior:smooth を auto に上書き：JS が pointermove ごとに scrollLeft を直接
   セットするため、smooth だと1回ごとにアニメ補間が入り「マウスに追従が遅れてヌルッと滑る」。
   ドラッグ中だけ auto＝即時反映＝マウスに1:1で吸い付く（オーナー指摘「追従が悪い」2026-06-17）。 */
.nb__price-card-slides.is-dragging { scroll-snap-type: none; scroll-behavior: auto; }
.nb__price-card-slides img {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  object-fit: cover;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  display: block;
}
.nb__price-card-dots {
  position: absolute;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 5px;
  pointer-events: none;
  z-index: 2;
}
.nb__price-card-dots .nb__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,.55);
  transition: background .2s ease, transform .2s ease;
  box-shadow: 0 1px 2px rgba(0,0,0,.3);
  cursor: pointer;
  pointer-events: auto; /* 親 .nb__price-card-dots は pointer-events:none（スワイプ干渉防止）。dot 個別にクリック受領を許可 */
}
.nb__price-card-dots .nb__dot:hover { background: rgba(255,255,255,.8); }
.nb__price-card-dots .nb__dot:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.nb__price-card-dots .nb__dot.is-active {
  background: #fff;
  transform: scale(1.25);
}
.nb__price-card-media--icon {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(184,151,90,.12) 0%, rgba(184,151,90,.04) 100%);
}
.nb__price-card-media--icon svg {
  width: 38%;
  max-width: 78px;
  height: auto;
  color: var(--gold);
  opacity: .85;
}

/* ── 料金カード：タップで詳細展開（アコーディオン・各カード独立） ── */
.nb__price-card-hint {
  align-self: center;        /* カード(flex column)内で中央寄せ。フル幅ストレッチ防止 */
  display: inline-flex;
  align-items: center;
  justify-content: center;   /* ボタン内の文字を中央に */
  gap: 6px;
  margin-top: 14px;
  padding: 9px 22px;
  border: 1px solid var(--gold);
  border-radius: 999px;
  background: transparent;
  color: var(--gold);
  font-family: inherit;
  font-size: .82rem;
  letter-spacing: .04em;
  cursor: pointer;
  transition: background .2s ease, color .2s ease;
}
.nb__price-card-hint:hover { background: var(--gold-dk); color: #fff; } /* 白文字×gold=2.76:1→gold-dk 5.85:1（2026-07-09） */
.nb__price-card-hint:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.nb__price-card-hint-arr {
  font-size: .68em;
  transition: transform .3s var(--ease);
}
.nb__price-card.is-open .nb__price-card-hint-arr { transform: rotate(180deg); }
/* 詳細：grid-template-rows で滑らかに開閉（FAQ と同方式） */
.nb__price-card-detail {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .42s var(--ease);
}
.nb__price-card.is-open .nb__price-card-detail { grid-template-rows: 1fr; }
.nb__price-card-detail-inner {
  min-height: 0;
  overflow: hidden;
}
.nb__price-card.is-open .nb__price-card-detail-inner { padding-top: 12px; }
.nb__price-card-detail-inner > * { margin: 0 0 .6em; font-size: .82rem; line-height: 1.7; color: var(--warm-gray, #6b6256); }
.nb__price-card-detail-inner > *:last-child { margin-bottom: 0; }
/* アコーディオン OFF 時のリンク（ヒントと同じピルボタンで中央寄せ） */
.nb__price-card-link {
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 14px;
  padding: 9px 22px;
  border: 1px solid var(--gold);
  border-radius: 999px;
  background: transparent;
  color: var(--gold);
  font-size: .82rem;
  letter-spacing: .04em;
  text-decoration: none;
  transition: background .2s ease, color .2s ease;
}
.nb__price-card-link:hover { background: var(--gold); color: #fff; }

/* ご予約前に総額 安心バッジ */
.nb__price-trust-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(135deg, rgba(184,151,90,.14) 0%, rgba(184,151,90,.06) 100%);
  border: 1px solid rgba(184,151,90,.32);
  padding: 10px 18px;
  border-radius: 999px;
  margin: 4px 0 28px;
  font-family: var(--jp);
  font-size: .74rem;
  color: var(--charcoal);
  letter-spacing: .04em;
  line-height: 1.5;
  text-align: left;
}
@media (min-width: 768px) {
  .nb__price-trust-badge { font-size: .82rem; padding: 12px 22px; gap: 10px; }
}
.nb__price-trust-badge svg {
  flex-shrink: 0;
  color: var(--gold);
  width: 16px;
  height: 16px;
}
@media (min-width: 768px) {
  .nb__price-trust-badge svg { width: 18px; height: 18px; }
}

/* オプションカード（プラン別） */
.nb__price-opt-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin: 0 0 24px;
  text-align: left;
}
@media (min-width: 768px) {
  .nb__price-opt-cards { grid-template-columns: 1fr 1fr; gap: 14px; }
}
.nb__price-opt-card {
  background: var(--warm-white);
  border: 1px solid rgba(184,151,90,.16);
  border-radius: 4px;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  /* grid/flex アイテムの既定 min-width:auto は中身の max-content で膨らみ、
     狭幅端末(320/360px)でカードがトラック幅(1fr)を超えて横はみ出しする。
     min-width:0 で内容ではなくトラック幅に従わせ、長い行は内部で折り返させる。 */
  min-width: 0;
}
@media (min-width: 768px) {
  .nb__price-opt-card { padding: 20px 22px; }
}
.nb__price-opt-name {
  font-family: var(--sans);
  font-size: .82rem;
  letter-spacing: .04em;
  color: var(--charcoal);
  font-weight: 500;
}
.nb__price-opt-card .nb__price-opt-name {
  position: relative;
  font-family: var(--sans);
  font-size: .88rem;
  letter-spacing: .04em;
  color: var(--charcoal);
  font-weight: 600;
  line-height: 1.5;
  margin: 0;
  padding: 0 0 10px 14px;
  border-bottom: 1px dashed rgba(184,151,90,.24);
}
.nb__price-opt-card .nb__price-opt-name::before {
  content: '';
  position: absolute;
  left: 0;
  top: .75em;
  transform: translateY(-50%);
  width: 2px;
  height: 1em;
  background: var(--gold);
}
.nb__price-opt-sub {
  font-family: var(--sans);
  font-size: .68rem;
  color: var(--warm-gray);
  letter-spacing: .03em;
  margin: -4px 0 0;
}
.nb__price-opt-single {
  font-family: var(--en);
  font-size: 1rem; /* オプション価格は全カードで同サイズに統一（オーナー指示 2026-06-17・.amount と同値／2026-07-08 小さく見える指摘で .88→1remへ拡大） */
  font-weight: 600;
  color: var(--charcoal);
  letter-spacing: .02em;
  /* 商品名（左ラベル）が無い単一価格カード（例：土日祝の撮影）は、右端に孤立して「浮く」ため、
     カード内で上下左右の中央に置いてバランスさせる（オーナー指摘 2026-06-17）。
     margin:auto＝flex 縦カラム内で余白を均等に取り、タイトル下の余白の中央へ。 */
  text-align: center;
  margin: auto;
}
/* ※「1着につき」等の単位は、金額の右に添える方式をやめ、商品名と同じ左の位置（.plan）に
   1行レイアウト(.nb__price-opt-rows)で表示する方式へ変更（オーナー指示 2026-06-17）。
   旧 .nb__price-opt-unit ルールは未使用になったため削除。 */
.nb__price-opt-rows {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  /* PC で全幅に広がり名前↔金額が離れすぎる対策：リストを内容幅(max-content)基準＋中央寄せ。
     ただし max-content だけだと名前↔金額が詰まりすぎる（オーナー指摘「縮めすぎ」2026-06-17）ので
     min-width で最低幅を確保＝space-between で名前は左・金額は右へ程よく開く。
     SP はカード幅がこれより狭く max-width:100% で頭打ち＝従来どおり。 */
  width: -webkit-max-content;
  width: max-content;
  min-width: min(100%, 16em);
  max-width: 100%;
  margin-inline: auto;
}
/* オプション料金カード内の料金行は、カード幅いっぱいに開いて金額を右端へ寄せる
   （既定の max-content 中央寄せだと商品名の文字数でリスト幅が変わり、カードごと・行ごとに
   金額(¥/無料)の左端がバラつく＝オーナー指摘 2026-07-14）。台紙表・データ料金など既に揃っている
   .nb__price-extras-block .nb__price-opt-rows（price.css・width:100%）と同じ手法に寄せる。
   金額側は .amount の width:4.5em＋text-align:left で ¥ が縦に揃うため、全カードで縦一列に並ぶ。 */
.nb__price-opt-card .nb__price-opt-rows {
  width: 100%;
  min-width: 0;
  margin-inline: 0;
}
.nb__price-opt-rows li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px; /* 名前↔金額が詰まりすぎないよう最低間隔を確保（12→16px・オーナー指摘 2026-06-17） */
  font-family: var(--sans);
  font-size: .76rem;
  line-height: 1.4;
}
/* 項目名の「（補足）」＝1文字でも入らなければカッコを丸ごと次の行へ落とす（オーナー指摘 2026-07-29）。
   inline-block なので「入るなら同じ行のまま／入らないなら塊ごと改行」になり、
   「…追加・1 / ポーズ）」のようにカッコの途中で切れる見え方がなくなる。
   span を付けるのは PHP 側の nb_wrap_plan_paren()（inc/helpers.php）。 */
.nb__price-opt-rows .plan-note { display: inline-block; }
/* 項目名の本体側も、できる範囲で語の途中では切らない（「…フォトプラ / ン」を避ける）。
   auto-phrase＝日本語の文節単位で改行する指定。対応していないブラウザでは今までどおりの
   文字単位の折り返しになるだけ＝害はない（プログレッシブエンハンスメント）。 */
.nb__price-opt-rows .plan { word-break: auto-phrase; }

/* 対象別タブ（七五三の 1人用／きょうだい用 等）に連動して、いま選ばれていない対象の
   明細行・カードを隠す。付け外しは JS（menu-shared.js / price.js）が data-aud を見て行う。
   ⚠️ 行は直前の .nb__price-opt-rows li{display:flex} が効いているため、単独の .nb__aud-off
      （詳細度 0,1,0）では負ける＝同じ深さのセレクタで打ち消す必要がある。
   JS が動かない環境では何も付かない＝全行が見える（＝情報が欠けない側に倒す）。 */
.nb__aud-off { display: none; }
.nb__price-opt-rows li.nb__aud-off,
.nb__price-opt-card.nb__aud-off { display: none; }
/* サイズ小見出し行（フレームの「L判用」「2L用」等＝amount 空の行）。
   囲わず・色バーも使わず、字を締めた小見出し＋上に細い罫線1本で「サイズの塊」を区切る
   （design-voice の第一手段＝罫線1本／2大NG=カード化・色バーを避ける・オーナー指摘 2026-07-14）。
   罫線は見出しの上に置く＝前グループとの境界。先頭の見出しには線を出さない（:first-child で消す）。 */
.nb__price-opt-rows li.nb__opt-row--heading {
  display: block;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--light-gray);
}
.nb__price-opt-rows li.nb__opt-row--heading:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
.nb__price-opt-rows .nb__opt-heading {
  /* 料金一覧を参照するための実用ラベル＝ゴシック（--sans）。周りの商品名・金額行も --sans ゆえ揃う
     （type-and-color【1】参照する文字＝ゴシック／実用の一覧を明朝で組むと読み取りにくい・オーナー指摘 2026-07-14）。 */
  font-family: var(--sans);
  font-size: .72rem;
  font-weight: 700;
  color: var(--charcoal);
  letter-spacing: .08em;
}
.nb__price-opt-rows .plan {
  color: var(--text2);
  letter-spacing: .02em;
  flex-shrink: 1;
}
.nb__price-opt-rows .amount {
  font-family: var(--en);
  font-size: 1rem; /* 2026-07-08 小さく見える指摘で .88→1remへ拡大（.nb__price-opt-single と同値を維持） */
  font-weight: 600;
  color: var(--charcoal);
  letter-spacing: .02em;
  /* ¥マークで左揃え：固定幅 + 左寄せ + 等幅数字で、各行の左端＝¥が縦に揃う
     （オーナー希望 2026-06-17。右揃え＝末尾桁揃えから変更）。
     幅 4.5em は opt-rows の実上限プレーン「¥65,000」を内包（はみ出さない）。
     行頭「+」は下の .plus ルールで幅0化＝+の有無に関わらず ¥ の開始位置が揃う。 */
  text-align: left;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
  width: 4.5em;
}
/* 複数価格を1行に出す項目（例：六切／四切プリント＝六：¥8,800／四：¥9,900）。
   既定の .amount は ¥ 縦揃えのため width:4.5em だが、この行は2価格で収まらないので幅を解放する
   （この行は ¥ の縦揃え対象から外れる＝意図的）。
   行に flex-wrap を許可＝幅が足りれば1行、足りなければ価格だけ2行目へ右寄せで折返す
   （商品名が単語の途中で割れるのを防ぐ＝320px等の最狭端末対策）。 */
.nb__price-opt-rows li.nb__opt-row--wide { flex-wrap: wrap; }
.nb__price-opt-rows li.nb__opt-row--wide .amount {
  width: auto;
  margin-left: auto;
  font-variant-numeric: normal;
  white-space: nowrap;
}
/* 2価格行の和文ラベル（六：／四：／／）だけ金額より一回り小さく＝¥・数字は据え置きでスッキリ見せる。
   単独表示カード（.nb__price-opt-single＝item_single のみのメニュー固有カード）にも同じ注記スパンが
   出うるため同じセレクタで一緒に拾う（codexレビュー指摘：抜けているとカード種別で注記の見た目が不揃いになる）。 */
.nb__price-opt-rows .amount .amt-lbl,
.nb__price-opt-single .amt-lbl {
  font-size: .88em;
  color: var(--warm-gray);
}
/* 金額に添える和文の注記（例：「¥8,000（データ+1カット）」の括弧部分）。
   ¥数字は据え置き・注記だけ一回り小さく。注記スパンを丸ごと次行へ降ろす（block）＝¥金額の下に
   1行で収める。狭幅（〜389px）では nowrap にすると注記自体がカード幅を突き破るため（overflow-check
   実測：320/360px で 131px の注記がはみ出し）、狭幅では通常改行を許可し、390px以上でのみ nowrap で
   「（データ+1カッ／ト）」の途中割れを防ぐ（オーナー報告 2026-07-12・タスク指示どおり nowrap は390px以上限定）。 */
.nb__price-opt-rows .amount .amt-note,
.nb__price-opt-single .amt-note {
  display: block;
  font-size: .88em;
  color: var(--warm-gray);
  line-height: 1.35;
  /* white-space は継承プロパティ＝親 .nb__opt-row--wide .amount の nowrap（1008行）を明示的に断ち切る。
     無いと --wide 行の中では389px以下でも注記が nowrap を継承しカード幅を突き破る（codexレビュー指摘・
     9143e67で直した狭幅オーバーフローが --wide 行限定で再発する経路）。
     .nb__price-opt-single 側（単独表示カード）にも同じ注記スパンが出うるため同じセレクタで拾う
     （codexレビュー指摘：抜けているとカード種別で注記の見た目が不揃いになる）。 */
  white-space: normal;
}
@media (min-width: 390px) {
  .nb__price-opt-rows .amount .amt-note,
  .nb__price-opt-single .amt-note { white-space: nowrap; }
}
.nb__price-opt-rows .amount.is-free {
  /* 「無料」は和文ゆえ font-family だけ jp に上書き（2026-06-17：色・太さは .amount と統一＝
     以前の「緑・縮小」差別化は撤回）。
     ただし「基本価格の半額」等の長い和文ラベルまで ¥金額と同じ1remで出すと、狭いカード幅で
     不格好に折り返し・異様に大きく見える（オーナー報告 2026-07-12）。¥数字はサイズ据え置きのまま、
     和文ラベルだけ一回り縮小して可読性を確保する（「無料」等の短語は多少の強調が残ってよい）。
     2026-07-12：.82em は「少し小さすぎる」指摘で .88em へ一段戻す。 */
  font-family: var(--jp);
  font-size: .88em;
  /* 幅は .amount の 4.5em を em で継承すると、font-size を .88em に縮めた分だけ実寸も縮み
     （16px基準72px→10.7px基準48px）、金額欄が24px狭くなって右詰めの左端が右へズレる
     ＝「無料/半額」の行だけガタつく原因（オーナー指摘 2026-07-14）。
     幅だけ通常 .amount と同じ実寸に固定する（4.5em×1rem基準＝縮小font-sizeの影響を受けない）。 */
  width: 4.5rem;
}
.nb__price-opt-single .yen,
.nb__price-opt-single .plus,
.nb__price-opt-rows .amount .yen,
.nb__price-opt-rows .amount .plus {
  font-family: var(--en);
  font-weight: 500;
}
.nb__price-opt-single .yen,
.nb__price-opt-rows .amount .yen { margin-right: 1px; }
/* opt-rows の行頭「+」はレイアウト幅0で左へはみ出させる＝¥の開始位置を押さない。
   これで「+付き行」と「¥のみ行」が同じカードに混在しても ¥ が縦に揃う
   （width:0 の箱内で text-align:right ＝グリフが左へオーバーフロー。2026-06-17）。
   単独表示の .nb__price-opt-single .plus は対象外（1行表示で揃え不要）。 */
.nb__price-opt-rows .amount .plus {
  display: inline-block;
  width: 0;
  text-align: right;
  overflow: visible;
}

/* ── Chapter 9: 最終CTA ベース ──────────────────────────── */
.nb__chapter--cta {
  position: relative;
  overflow: hidden;
  background: var(--charcoal);
  display: block;
}
.nb__cta-bg { position: absolute; inset: 0; z-index: 0; }
.nb__cta-bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
  filter: brightness(.35) saturate(.8);
}
.nb__cta-bg-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(30,45,90,.60) 0%, rgba(28,28,28,.80) 100%);
}
.nb__cta-inner {
  position: relative;
  z-index: 1;
  padding: 80px 0;
}
@media (min-width: 768px) { .nb__cta-inner { padding: 120px 0; } }
.nb__cta-lead {
  font-family: var(--jp);
  font-size: clamp(1.05rem, 3vw, 1.4rem);
  font-weight: 300;
  letter-spacing: .1em;
  line-height: 1.9;
  color: rgba(255,255,255,.92);
  margin-bottom: 12px;
}
.nb__cta-sub {
  font-size: .82rem;
  margin-bottom: 0;
}
.nb__cta-text { margin-bottom: 32px; } /* 注釈との上下スペース統一（下記 .nb__cta-footnote margin-top と一致） */

/* ── 競合比較テーブル ──────────────────────────────────── */
.nb__compare { margin-top: 48px; margin-bottom: 48px; }
.nb__compare-h3 {
  font-family: var(--en);
  font-size: .7rem;
  font-weight: 400;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold-dk); /* 明るい地の小見出しは gold-dk（--gold=cream2.56:1でAA割れ・2026-07-21） */
  margin-bottom: 16px;
}
.nb__compare-table {
  width: 100%;
  font-family: var(--jp);
  font-size: .78rem;
  border: 1px solid rgba(184,151,90,.2);
  overflow: hidden;
}
.nb__compare-thead {
  display: grid;
  grid-template-columns: 1fr 72px 72px 72px;
  background: var(--charcoal);
  color: rgba(255,255,255,.92);
  font-size: .66rem;
  letter-spacing: .06em;
}
.nb__compare-thead > div {
  padding: 10px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.4;
}
.nb__compare-col--us {
  color: var(--gold) !important;
  font-weight: 500;
}
.nb__compare-row {
  display: grid;
  grid-template-columns: 1fr 72px 72px 72px;
  border-top: 1px solid rgba(184,151,90,.12);
}
.nb__compare-row:nth-child(odd) { background: rgba(184,151,90,.04); }
.nb__compare-label {
  padding: 10px 12px;
  color: var(--charcoal);
  font-size: .76rem;
  display: flex;
  align-items: center;
}
.nb__compare-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 8px;
}
.nb__compare-cell--us { background: rgba(184,151,90,.08); }
.nb__yn { font-size: 1rem; font-weight: 700; }
.nb__yn--yes { color: var(--gold-dk); }  /* 比較表○＝情報テキスト。theme-*.css を読む10メニューは詳細度＋後勝ちで各テーマ色/gold-dkに上書き済＝無影響。theme無しの20th・idphotoだけ素の gold(2.56:1・AA未達)が出るので gold-dk(4.45:1)へ（2026-07-06） */
.nb__yn--no { color: #c0392b; }
.nb__yn--cond { color: #888; }
@media (min-width: 768px) {
  .nb__compare-thead,
  .nb__compare-row {
    grid-template-columns: 1fr 90px 90px 90px;
    font-size: .82rem;
  }
  .nb__compare-label { font-size: .82rem; padding: 12px 16px; }
}

/* ── 振袖コレクション（トップ原本準拠：黒帯デザイン） ── */
.furi-wrap { background: var(--charcoal); }
.furi-header { padding: 32px var(--sp) 0; max-width: 1200px; margin: 0 auto; }
@media (min-width: 768px) { .furi-header { padding: 32px var(--sp-m) 0; } }
.furi-header p { font-family: var(--jp); font-size: .82rem; color: rgba(255,255,255,.5); letter-spacing: .04em; }
.furi-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; margin-top: 20px; }
@media (min-width: 600px) { .furi-grid { grid-template-columns: repeat(6, 1fr); } }
.furi-item { position: relative; overflow: hidden; aspect-ratio: 2/3; }
.furi-item > img { filter: brightness(1) saturate(1); width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); touch-action: manipulation; }
/* ホバーズームはマウス環境のみ（@media hover）。タッチで :hover が固着すると拡大解除後の再タップが
   不発になる（/costume/ カタログ .cos-cat-item と同根・Galaxy S25 実機 2026-06-21）。 */
@media (hover:hover) and (pointer:fine) { .furi-item:hover > img { transform: scale(1.04); } }
.furi-ov {
  position: absolute; inset: auto 0 0;
  height: 38%;
  background: linear-gradient(to top, rgba(28,24,20,.48) 0%, rgba(28,24,20,.20) 48%, rgba(28,24,20,0) 100%);
  opacity: 1;
  pointer-events: none;
}
.furi-lbl {
  position: absolute; bottom: 9px; left: 0; right: 0; text-align: center;
  color: #fff; font-family: var(--jp); font-size: .7rem; letter-spacing: .08em;
  opacity: 1;
}
.furi-footer { text-align: center; padding: 30px 0 44px; }

/* ── prefers-reduced-motion 対応 ─────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .nb__scroll-line { animation: none; opacity: .35; }
}

/* ================================================================
   案J HTML インライン由来の上書きスタイル
   ※ 上記「ベース構造」より後に置くことで、後出し優先で勝つ設計
================================================================ */

.nb__hero-sub { font-family: var(--jp); font-size: .875rem; font-weight: 300; color: rgba(255,255,255,.78); margin-bottom: 14px; line-height: 1.65; text-shadow: 0 2px 8px rgba(0,0,0,.55); }
/* サブ文だけは改行させず1行に（H1の nb__br-sp は有効のまま、サブ内の改行のみ無効化） */
.nb__hero-sub .nb__br-sp { display: none; }
/* SP：1行に収める（左右40px paddingで可読幅が狭いぶん字を詰める。トップ流の1行サブ文） */
@media (max-width: 767px) { .nb__hero-sub { font-size: .72rem; letter-spacing: 0; } }
.nb__hero-example { font-size: .64rem; color: #fff; margin-top: 4px; margin-bottom: 4px; text-shadow: 0 2px 6px rgba(0, 0, 0, 0.6); position: relative; z-index: 2; }

/* HERO：文字エリアを下に圧縮（画像視認性UP） */
.nb__hero-card-en { margin-bottom: 12px !important; }
.nb__hero-h1 { margin-bottom: 10px !important; line-height: 1.55 !important; }
.nb__hero-cta { gap: 6px !important; }

/* HERO：全要素を左寄せ */
.nb__hero-card { text-align: left !important; }
.nb__hero-card-en,
.nb__hero-h1,
.nb__hero-sub,
.nb__hero-note,
.nb__hero-example { text-align: left !important; }
.nb__hero-cta { align-items: flex-start !important; }
.nb__cta-line { margin-left: 0 !important; margin-right: auto !important; }

/* HERO：CTA 補足文ラッパー（PC時はボタン右横に） */
.nb__hero-cta-supplement { display: flex; flex-direction: column; gap: 2px; }
@media (min-width: 768px) {
  /* CTA群の横並び指定は PC2列レイアウト（右列で縦積み）導入で撤去。配置は下の @768 2列ブロックで指定。 */
  .nb__cta-line { flex: 0 0 auto; }
  .nb__hero-cta-supplement { gap: 4px; }
}

/* HERO：画像を見せる / 白カード除去 */
.nb__hero { align-items: flex-end; justify-content: flex-start !important; }
.nb__hero-overlay {
  background: linear-gradient(to bottom,
    rgba(18,18,18,0) 0%,
    rgba(18,18,18,.05) 22%,
    rgba(18,18,18,.32) 40%,
    rgba(18,18,18,.62) 60%,
    rgba(18,18,18,.84) 80%,
    rgba(18,18,18,.94) 100%);
}
.nb__hero-card {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  text-align: left;
  padding: 0 var(--sp) clamp(60px, 12vh, 100px); /* SPはトップ同様 var(--sp)=16px で左に詰める＝可読幅を広げ改行を自然に（PCは下の@768で var(--sp-m)=40px） */
  margin: 0 !important;
  max-width: 720px;
  width: 100%;
}
@media (min-width: 768px) {
  .nb__hero-card { padding: 0 var(--sp-m) clamp(140px, 18vh, 220px) var(--sp-m); }
}
.nb__hero-card-en { color: rgba(184,151,90,.85); }
.nb__hero-h1 { color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.42); }
/* .nb__trust* の暗背景HEROスタイルは menu.css に統合済み（トップと線デザイン統一）。 */
.nb__cta-line { max-width: 280px; }
.nb__hero-note { color: #fff !important; text-shadow: 0 2px 6px rgba(0, 0, 0, 0.6); position: relative; z-index: 2; }

/* ── HERO：PC2列構成（左列＝H1＋サブ文＋信頼バッジ／右列＝CTA群）（オーナーFB） ──
   ［CTAボタン・CTA補足・CTAコピー送信例］を2列目に寄せる。サブ文はトップ同様 H1 の下（左列）に置く。SP は従来どおり縦積み。 */
@media (min-width: 768px) {
  .nb__hero-card {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr);
    grid-template-rows: auto auto auto;
    align-content: end;
    column-gap: 48px;
    max-width: 1240px;
  }
  /* 左列：H1 → サブ文 → 信頼バッジ（縦積み・間隔は各要素の既存 margin）。 */
  .nb__hero-h1        { grid-column: 1; grid-row: 1; }
  .nb__hero-sub { grid-column: 1; grid-row: 2; }
  .nb__trust          { grid-column: 1; grid-row: 3; margin-bottom: 0; } /* 最下＝CTA群と下端を揃える（base 14px を打ち消す） */
  /* 右列：補足→送信例→ボタンの順で縦積み（column-reverse）。ボタンを最下段に置き、
     トップ（.hero-acts）同様、左列の信頼バッジと下端を揃える。補足・送信例はボタンの上＝トップのサブ文位置に相当。 */
  .nb__hero-cta       { grid-column: 2; grid-row: 1 / -1; align-self: end; flex-direction: column-reverse !important; align-items: flex-start !important; gap: 10px !important; }
}

/* ── HERO ジャーニー補足 ────────────────────────────────── */
.nb__hero-jrn { background: var(--charcoal); padding: 36px var(--sp) 44px; border-top: 2px solid rgba(184,151,90,.18); }
@media (min-width: 768px) { .nb__hero-jrn { padding: 44px var(--sp-m) 52px; } }
.nb__hero-jrn-inner { max-width: 1000px; margin: 0 auto; }
.nb__hero-jrn-h2 { font-family: var(--jp); font-size: clamp(.92rem, 2.5vw, 1.15rem); font-weight: 300; color: rgba(255,255,255,.75); text-align: center; margin-bottom: 32px; }
.nb__hero-jrn-h2 em { color: var(--gold); font-style: normal; }
.nb__hero-jrn-sub { font-size: .875rem; color: rgba(255,255,255,.54); margin-bottom: 20px; margin-top: -12px; line-height: 1.6; text-align: center; }
.nb__hero-jrn-steps { display: flex; flex-direction: column; gap: 0; max-width: 440px; margin: 0 auto; align-items: center; }
@media (min-width: 768px) { .nb__hero-jrn-steps { flex-direction: row; max-width: 100%; align-items: flex-start; } }
.nb__hero-jrn-step { display: flex; align-items: center; gap: 14px; position: relative; padding-bottom: 22px; min-height: 56px; width: 240px; }
.nb__hero-jrn-step:last-child { padding-bottom: 0; min-height: 0; }
.nb__hero-jrn-step:not(:last-child)::before { content: ''; position: absolute; left: 13px; top: calc(50% + 13px); bottom: -4px; width: 1px; background: rgba(184,151,90,.22); transform: translateX(-50%); }
@media (min-width: 768px) {
  .nb__hero-jrn-step { flex-direction: column; align-items: center; flex: 1; padding-bottom: 0; gap: 8px; min-height: 0; width: auto; }
  .nb__hero-jrn-step:last-child { min-height: 0; }
  .nb__hero-jrn-step:not(:last-child)::before { left: calc(50% + 14px); top: 13px; bottom: auto; width: calc(100% - 28px); height: 1px; transform: none; }
}
.nb__hero-jrn-dot { width: 26px; height: 26px; border-radius: 50%; background: rgba(184,151,90,.1); border: 1px solid rgba(184,151,90,.32); flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 0; position: relative; z-index: 1; }
.nb__hero-jrn-dot--active { background: var(--gold); border-color: var(--gold); }
.nb__hero-jrn-dot svg { width: 14px; height: 14px; stroke: var(--gold); fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.nb__hero-jrn-dot--active svg { stroke: #fff; }
.nb__hero-jrn-body { padding-top: 0; min-width: 130px; }
@media (min-width: 768px) { .nb__hero-jrn-body { text-align: center; } }
.nb__hero-jrn-label { font-family: var(--en); font-size: .57rem; letter-spacing: .1em; color: rgba(184,151,90,.7); display: block; margin-bottom: 2px; }
.nb__hero-jrn-title { font-size: .78rem; color: rgba(255,255,255,.68); line-height: 1.4; }
/* step2 の補足「@スタジオパズル（八戸）」を本文の横に inline 表示（SP/PC 共通） */
.nb__hero-jrn-title br { display: none; }
.nb__hero-jrn-title small { display: inline; margin-left: .35em; }
@media (max-width: 767px) {
  .nb__hero-jrn-steps {
    width: min(240px, 100%);
    align-items: stretch;
    position: relative;
  }
  .nb__hero-jrn-steps::before {
    content: '';
    position: absolute;
    left: 13px;
    top: 13px;
    bottom: 13px;
    width: 1px;
    background: rgba(184,151,90,.22);
    transform: translateX(-50%);
  }
  .nb__hero-jrn-step { width: 100%; min-height: 26px; padding-bottom: 0; }
  .nb__hero-jrn-step:not(:last-child) { margin-bottom: 22px; }
  .nb__hero-jrn-step:last-child { min-height: 26px; }
  .nb__hero-jrn-step:not(:last-child)::before { display: none; }
  .nb__hero-jrn-dot { background: linear-gradient(rgba(184,151,90,.1), rgba(184,151,90,.1)), var(--charcoal); }
  .nb__hero-jrn-dot--active { background: var(--gold); }
}

/* ── 中間CTA（.nb__mid-cta） ──────────────────────────────── */
.nb__mid-cta { background: var(--charcoal); padding: 36px var(--sp); text-align: center; }
@media (min-width: 768px) { .nb__mid-cta { padding: 44px var(--sp-m); } }
.nb__mid-cta-title { font-family: var(--jp); font-size: 1rem; font-weight: 300; color: #fff; margin-bottom: 8px; }
.nb__mid-cta-sub { font-size: .8rem; color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.5); margin-bottom: 20px; }
.nb__mid-cta .line-cta-btn { display: inline-flex; align-items: center; gap: 8px; padding: 13px 28px; }
.nb__mid-cta-example { font-size: .68rem; color: #fff !important; text-shadow: 0 1px 3px rgba(0,0,0,.5); margin-top: 10px; }
.nb__price-note { color: #fff !important; text-shadow: 0 1px 3px rgba(0,0,0,.5); }

/* ── Chapter 02 ギャラリー：SP=2列×3行 / PC=6列×1行 ────── */
.nb__chapter--works .nb__gallery-scroll {
  overflow: visible;
  padding: 0;
  margin-top: 32px;
}
.nb__chapter--works .nb__gallery-scroll::-webkit-scrollbar { display: none; }
.nb__chapter--works .nb__gallery-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 0;
  width: 100%;
  list-style: none;
  margin: 0;
}
@media (min-width: 768px) {
  .nb__chapter--works .nb__gallery-list {
    grid-template-columns: repeat(6, 1fr);
    gap: 12px;
  }
}
.nb__chapter--works .nb__gallery-item { flex: unset; width: auto; }
.nb__chapter--works .nb__gallery-link { display: block; color: inherit; text-decoration: none; }
.nb__chapter--works .nb__gallery-fig { margin: 0; position: relative; overflow: hidden; }
.nb__chapter--works .nb__gallery-fig img {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform .4s var(--ease);
}
.nb__chapter--works .nb__gallery-fig:hover img { transform: scale(1.04); }
.nb__chapter--works .nb__gallery-cap {
  display: block;
  font-family: var(--jp);
  font-size: .72rem;
  letter-spacing: .04em;
  color: var(--warm-gray);
  padding: 8px 2px 0;
  line-height: 1.5;
}

/* ── オプションエリア（案J style.css 準拠：金色見出し＋金線） ── */
.nb__price-options {
  padding: 24px 0 0;
  text-align: left;
}
.nb__price-opt-title {
  font-family: var(--jp);
  /* 明朝＋小サイズ＋薄ゴールドで細く見える指摘（2026-07-10・オーナー案C採用）。サイズ・字重を上げ、
     色を薄い--goldから濃い--gold-dkへ（コントラスト確保）。下線・字間・中央寄せの佇まいは維持＝
     装飾を足さず構造で見やすくする。--gold-dk はクリーム背景で AA コントラスト確保。 */
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: .06em;
  color: var(--gold-dk);
  margin-bottom: 16px;
  border-bottom: 1.5px solid rgba(122,97,54,.35);
  padding-bottom: 11px;
  text-align: center;
}
.nb__price-options .nb__price-note {
  color: var(--charcoal) !important;
  text-shadow: none;
  text-align: center;
}

/* ── 証明写真（idphoto）専用 料金マトリクス表（サイズ × 枚数）── */
.nb__idp-price { text-align: left; }
.nb__idp-block { margin-bottom: 32px; }
.nb__idp-block:last-of-type { margin-bottom: 16px; }
/* スマホは横スクロール（5列＋見出しで横幅が足りないため）。スクロール可能を視覚で示す。 */
.nb__idp-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid rgba(184,151,90,.16);
  border-radius: 4px;
  background: var(--warm-white);
}
.nb__idp-scroll:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.nb__idp-table {
  border-collapse: collapse;
  width: 100%;
  min-width: 520px; /* これ未満ではスクロール（スマホ）／以上は表全体が収まる（PC） */
  font-size: .82rem;
}
.nb__idp-table th,
.nb__idp-table td {
  border: 1px solid rgba(184,151,90,.16);
  padding: 9px 8px;
  text-align: center;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.nb__idp-table thead th {
  background: rgba(184,151,90,.08);
  color: var(--gold-dk);  /* サイズ表ヘッダ＝情報テキスト。合成背景#F4EEE5上で gold 2.39:1→gold-dk 4.16:1 でAA相当（2026-07-06） */
  font-family: var(--sans);
  font-weight: 600;
  letter-spacing: .02em;
}
.nb__idp-table tbody th {
  background: rgba(184,151,90,.045);
  font-family: var(--sans);
  font-weight: 600;
  color: var(--charcoal);
  text-align: left;
}
.nb__idp-table .nb__idp-th-size { text-align: left; }
/* サイズ名の下に小さく出す用途（例：履歴書・障害者手帳）。任意・空なら出ない */
.nb__idp-table tbody th .nb__idp-size-note {
  display: block;
  margin-top: 3px;
  font-family: var(--sans);
  font-weight: 400;
  font-size: .74em;
  line-height: 1.4;
  color: var(--warm-gray);
}
.nb__idp-table td { color: var(--charcoal); }
.nb__idp-table .yen { font-size: .82em; margin-right: 1px; }
.nb__idp-price .nb__price-note {
  color: var(--charcoal) !important;
  text-shadow: none;
  text-align: center;
  margin-top: 12px;
}
/* オプションは縦並びの定義リスト（プラン左・価格右）。既存 .nb__price-opt-rows と同トーン。 */
.nb__idp-opt-list {
  list-style: none;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(184,151,90,.16);
  border-radius: 4px;
  background: var(--warm-white);
  overflow: hidden;
}
.nb__idp-opt-list li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 11px 16px;
  font-size: .84rem;
}
.nb__idp-opt-list li + li { border-top: 1px solid rgba(184,151,90,.12); }
.nb__idp-opt-list .plan { color: var(--charcoal); font-family: var(--sans); }
.nb__idp-opt-list .amount {
  font-weight: 600;
  color: var(--charcoal);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.nb__idp-opt-list .amount .yen { font-size: .82em; margin-right: 1px; }
@media (min-width: 768px) {
  .nb__idp-table { font-size: .9rem; }
  .nb__idp-table th, .nb__idp-table td { padding: 12px 14px; }
  .nb__idp-opt-list li { padding: 13px 20px; font-size: .9rem; }
}

/* ── スタンダード商品（台紙）：組み立て式の入門商品（standard_product を持つメニューのみ＝753 等） ── */
.nb__price-standard { margin-top: 4px; text-align: left; }
.nb__price-standard-lead {
  font-family: var(--sans);
  font-size: .8rem;
  line-height: 1.8;
  color: var(--warm-gray);
  letter-spacing: .03em;
  margin: 0 0 12px;
  text-align: center;
}
.nb__price-standard-card {
  background: var(--warm-white);
  border: 1px solid rgba(184,151,90,.16);
  border-radius: 4px;
  padding: 16px 18px;
}
@media (min-width: 768px) { .nb__price-standard-card { padding: 20px 22px; } }
/* 最安の入口（撮影料＋六切の合算「¥14,300〜」）＝主プランカードより控えめな級数。
   下端のヘアラインが見出しと積み上げ項目を仕切る（区切り線は全幅＝ブロックの border-bottom で引く。
   .nb__price-opt-rows は max-content 幅で中央寄せのため ul 側に罫線を引くと中途半端になる）。 */
.nb__price-standard-head {
  text-align: center;
  padding-bottom: 14px;
  margin-bottom: 14px;
  border-bottom: 1px solid rgba(184,151,90,.16);
}
.nb__price-standard-headlabel {
  font-family: var(--sans);
  font-size: .72rem;
  letter-spacing: .08em;
  color: var(--warm-gray);
  margin: 0 0 4px;
}
.nb__price-standard-headprice {
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  gap: 2px;
  margin: 0;
}
.nb__price-standard-yen {
  font-family: var(--en);
  font-size: .82rem;
  color: var(--gold);
}
.nb__price-standard-num {
  font-family: var(--en);
  font-size: clamp(1.4rem, 5vw, 1.8rem);
  font-weight: 300;
  color: var(--charcoal);
  letter-spacing: .01em;
  line-height: 1;
}
.nb__price-standard-tilde {
  font-family: var(--en);
  font-size: .9rem;
  color: var(--warm-gray);
}
.nb__price-standard-headnote {
  font-family: var(--sans);
  font-size: .7rem;
  line-height: 1.7;
  color: var(--text2);
  letter-spacing: .02em;
  margin: 5px 0 0;
}
.nb__price-standard-adds {
  font-family: var(--sans);
  font-size: .76rem;
  line-height: 1.9;
  color: var(--text2);
  letter-spacing: .02em;
  margin: 12px 2px 0;
  text-align: center;
}

/* ── Chapter 09: 最終CTA（h2は左揃え、本文は中央揃え） ── */
.nb__chapter--cta .jm__sec-h2 { color: #fff; }
.nb__chapter--cta .jm__marker-label { color: var(--gold); } /* 既定ch9は暗地＝gold-dk(2.9:1)でなく--gold(4.7:1)。テーマ持ちページは各theme-*.cssが上書き */
.nb__chapter--cta .jm__hdiv { background: rgba(184,151,90,.6); }
.nb__chapter--cta .nb__cta-text { text-align: center; }
.nb__chapter--cta .nb__cta-lead { text-align: center; }
.nb__chapter--cta .nb__cta-sub { text-align: center; }
.nb__chapter--cta .nb__cta-footnote {
  text-align: center;
  font-size: .68rem;
  color: rgba(255,255,255,.5);
  margin-top: 32px; /* リード→ボタン と ボタン→注釈 のスペースを揃える */
}

/* ── 料金後 Price After CTA ──────────────────────────────── */
.nb__price-after-cta {
  background: var(--charcoal);
  padding: 72px var(--sp);
  text-align: center;
  position: relative;
  overflow: hidden;
}
@media (min-width: 768px) { .nb__price-after-cta { padding: 96px var(--sp-m); } }
.nb__price-after-cta::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 48px;
  height: 1px;
  background: var(--gold);
}
.nb__price-after-cta-inner { max-width: 560px; margin: 0 auto; }
.nb__price-after-cta-en {
  font-family: var(--en);
  font-size: .66rem;
  letter-spacing: .28em;
  color: var(--gold);
  text-transform: uppercase;
  display: block;
  margin-bottom: 20px;
  opacity: .9;
}
.nb__price-after-cta-title {
  font-family: var(--jp);
  font-size: clamp(1.15rem, 3.4vw, 1.55rem);
  font-weight: 300;
  color: #fff;
  line-height: 1.75;
  margin: 0 0 22px;
  letter-spacing: .03em;
}
.nb__price-after-cta-title em { font-style: normal; color: var(--gold); font-weight: 400; }
.nb__price-after-cta-desc {
  font-size: .82rem;
  color: rgba(255,255,255,.62);
  line-height: 1.9;
  margin: 0 0 32px;
  letter-spacing: .02em;
}
.nb__price-after-cta-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  padding: 16px 38px;
  font-size: .88rem;
  text-decoration: none;
}
.nb__price-after-cta-note {
  font-size: .7rem;
  color: rgba(255,255,255,.52);
  margin: 20px 0 0;
  line-height: 1.6;
  letter-spacing: .04em;
}

/* ── Chapter 4: 振袖プラン ──────────────────────────────── */
.nb__chapter--furisode { background: var(--warm-white); padding-bottom: 64px; }
@media (min-width: 768px) { .nb__chapter--furisode { padding-bottom: 96px; } }
.nb__furi-cards { display: grid; grid-template-columns: 1fr; gap: 14px; margin-top: 24px; counter-reset: furi; }
@media (min-width: 768px) { .nb__furi-cards { grid-template-columns: repeat(3, 1fr); } }
.nb__furi-card { position: relative; border: 1px solid var(--light-gray); border-radius: 6px; padding: 26px 22px 26px 84px; background: #fff; display: flex; flex-direction: column; counter-increment: furi; }
.nb__furi-card::before { content: counter(furi, decimal-leading-zero); position: absolute; left: 22px; top: 26px; font-family: var(--en); font-size: 2.3rem; font-weight: 500; line-height: 1; letter-spacing: .01em; color: var(--gold); }
.nb__furi-card-name { font-family: var(--jp); font-size: .98rem; font-weight: 600; letter-spacing: .02em; color: var(--charcoal); margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--light-gray); }
.nb__furi-card-desc { font-size: .8rem; color: var(--text2); line-height: 1.78; flex: 1; }
.nb__furi-card--cta { background: linear-gradient(180deg, #fff 0%, rgba(184,151,90,.05) 100%); border-color: rgba(184,151,90,.32); }
.nb__furi-card-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 16px;
  padding: 10px 16px;
  background: #06C755; /* LINE公式ブランド色（オーナー確定・2026-07-09） */
  color: #fff !important;
  border: none;
  border-radius: 2px;
  font-size: .76rem;
  font-weight: 500;
  text-decoration: none;
  width: 100%;
}

/* CH4 独立CTA（card3_cta=false のメニュー＝七五三・家族写真ほか）：
   3カードを対等にし、LINE相談ボタンをカード群の下へ1つ集約する形。
   色はLINE緑でテーマ非依存＝全メニュー共通の骨格なので menu-shared に置く。
   ※成人式は ch4_card3_cta=true でこの要素は出力されず、card3内蔵CTA（.nb__furi-card-btn）を使う。 */
.nb__page .nb__furi-cta-wrap { display: flex; justify-content: center; margin-top: 24px; }
.nb__page .nb__furi-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 32px;
  background: #06C755; /* LINE公式ブランド色（オーナー確定・2026-07-09） */
  color: #fff !important;
  border: none;
  border-radius: 2px;
  font-size: .82rem;
  font-weight: 500;
  text-decoration: none;
  transition: opacity .2s;
}
.nb__page .nb__furi-cta-btn:hover { opacity: .88; }
.nb__page .nb__furi-cta-btn svg { width: 18px; height: 18px; }

/* ── Chapter 5: なぜおだしまか ──────────────────────────── */
.nb__chapter--why { background: var(--cream); padding-bottom: 64px; }
@media (min-width: 768px) { .nb__chapter--why { padding-bottom: 96px; } }
.nb__why-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 24px; }
@media (min-width: 768px) { .nb__why-grid { grid-template-columns: repeat(3, 1fr); } }
.nb__why-card { background: var(--warm-white); border: 1px solid var(--light-gray); border-radius: 6px; padding: 20px; }
.nb__why-val { font-family: var(--en); font-size: 1.8rem; font-weight: 300; color: var(--gold); line-height: 1; margin-bottom: 4px; }
.nb__why-val-unit { font-size: .7rem; color: var(--warm-gray); }
.nb__why-title { font-size: .82rem; color: var(--charcoal); font-weight: 500; margin-top: 8px; margin-bottom: 4px; }
.nb__why-desc { font-size: .75rem; color: var(--text2); line-height: 1.65; }

/* ── Chapter 6: 撮影の流れ詳細（ダーク全幅） ──────────── */
.nb__flow-detail { background: var(--charcoal); }
.nb__flow-detail-inner { max-width: 1200px; margin: 0 auto; padding: var(--sec-sp) var(--sp); }
@media (min-width: 768px) { .nb__flow-detail-inner { padding: var(--sec-pc) var(--sp-m); } }
.nb__flow-dl { display: flex; flex-direction: column; gap: 0; }
.nb__flow-dl-item { display: grid; grid-template-columns: 52px 1fr; gap: 20px; position: relative; padding-bottom: 32px; }
.nb__flow-dl-item:last-child { padding-bottom: 0; }
.nb__flow-dl-item:not(:last-child)::after { content: ''; position: absolute; left: 25px; top: 56px; bottom: 0; width: 2px; background: linear-gradient(to bottom, rgba(184,151,90,.44), rgba(184,151,90,.07)); }
.nb__flow-dl-dot { width: 52px; height: 52px; border-radius: 50%; background: rgba(184,151,90,.1); border: 1px solid rgba(184,151,90,.32); display: flex; align-items: center; justify-content: center; flex-shrink: 0; position: relative; z-index: 1; font-family: var(--en); font-size: .7rem; color: var(--gold); letter-spacing: .04em; }
.nb__flow-dl-body { padding-top: 8px; }
.nb__flow-dl-phase { font-family: var(--en); font-size: .62rem; color: var(--gold); letter-spacing: .12em; display: block; margin-bottom: 4px; opacity: .85; }
.nb__flow-dl-title { font-family: var(--jp); font-size: .95rem; color: #fff; margin-bottom: 6px; }
.nb__flow-dl-desc { font-size: .83rem; color: rgba(255,255,255,.56); line-height: 1.75; }
.nb__flow-dl-cost { display: inline-flex; align-items: center; gap: 6px; background: rgba(184,151,90,.08); border: 1px solid rgba(184,151,90,.18); padding: 4px 12px; border-radius: 2px; margin-top: 8px; font-size: .7rem; color: rgba(184,151,90,.88); }
.nb__flow-dl-costs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.nb__flow-dl-costs .nb__flow-dl-cost { margin-top: 0; }
.nb__flow-dl-qa { margin-top: 10px; background: rgba(255,255,255,.03); border-radius: 4px; padding: 10px 14px; }
.nb__flow-dl-qa-q { font-size: .74rem; color: rgba(255,255,255,.66); margin-bottom: 4px; }  /* この素の白系はtheme無しの20th/idphotoでのみ最終色（.nb__flow-detailが黒#1C1C1Cのまま）。旧.4は黒地3.72:1でAA未達→.66で7.61:1。theme有り10メニューはtheme-*.cssが背景を明グラデ＋文字を濃色に上書き（そちらが正）（2026-07-06） */
.nb__flow-dl-qa-a { font-size: .78rem; color: rgba(255,255,255,.64); line-height: 1.65; }

/* 「当日の目安」ブロック（CH6冒頭）＝罫線と余白で組む。カード化・角丸影・一辺色バーは使わない。
   ここは theme 無しの 20th/idphoto（.nb__flow-detail が黒地）での最終色。theme 有り10メニューは
   各 theme-*.css が明地に上書きする（そちらが正）。 */
.nb__flow-est { margin: 0 0 40px; padding-bottom: 4px; max-width: 640px; }
.nb__flow-est-heading {
  font-family: var(--sans);
  font-size: .98rem;
  font-weight: 600;
  letter-spacing: .06em;
  color: var(--gold);
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(184,151,90,.28);
}
.nb__flow-est-dl { margin: 0; }
.nb__flow-est-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.nb__flow-est-row:last-child { border-bottom: 0; }
.nb__flow-est-label {
  font-family: var(--sans);
  font-size: .72rem;
  letter-spacing: .04em;
  color: rgba(255,255,255,.56);
}
.nb__flow-est-val {
  margin: 0;
  font-family: var(--sans);
  font-size: .92rem;
  line-height: 1.7;
  color: rgba(255,255,255,.9);
}
.nb__flow-est-note {
  margin-top: 12px;
  font-size: .74rem;
  line-height: 1.75;
  color: rgba(255,255,255,.5);
}
@media (min-width: 600px) {
  .nb__flow-est-row {
    grid-template-columns: 15rem 1fr;
    gap: 20px;
    align-items: baseline;
  }
}

/* dark bg overrides（撮影の流れ ch6） */
.nb__flow-detail .jm__sec-h2 { color: #fff; }
.nb__flow-detail .jm__marker-label { color: var(--gold); } /* 黒地の20th/idphotoではgold-dk(2.9:1)でなく--gold(4.7:1)。theme有り10メニューは後読みのtheme-*.cssが上書き（2026-07-21） */
.nb__flow-detail .jm__hdiv { background: rgba(184,151,90,.6); }
.nb__flow-detail .jm__marker-dot { box-shadow: 0 0 0 4px rgba(184,151,90,.3); }
.nb__flow-detail .jm__sec-sub { color: rgba(255,255,255,.58); }
.nb__flow-detail .line-cta-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  gap: 8px;
  background: rgba(6,199,85,.12);
  border: 1px solid rgba(6,199,85,.45);
  padding: 11px 20px;
  border-radius: 2px;
  margin-top: 14px;
  font-size: .82rem;
  color: #06C755;
  text-decoration: none;
  font-weight: 500;
  line-height: 1.5;
  transition: opacity .7s ease, transform .7s ease, background .2s var(--ease), border-color .2s var(--ease);
  /* opacity / transform 両方含めて .rv フェードを有効化（将来 rv 付与時のため） */
}
.nb__flow-detail .line-cta-btn svg { width: 16px; height: 16px; }
.nb__flow-detail .line-cta-btn:hover {
  background: rgba(6,199,85,.2);
  border-color: rgba(6,199,85,.7);
}

/* ── Chapter 7（フォトギャラリー・CSSマーキー）は廃止（2026-07-09）＝関連スタイル一式を撤去。
      撮影実例は CH2 グリッド／サイト全体の入口はトップの .gtrack 帯に一本化。 ── */

/* ── Chapter 8: FAQ アコーディオン ──────────────────────── */
.nb__chapter--faq-acc { background: var(--warm-white); padding-bottom: 64px; }
@media (min-width: 768px) { .nb__chapter--faq-acc { padding-bottom: 96px; } }
.nb__faq-acc { display: flex; flex-direction: column; gap: 0; border-top: 1px solid var(--light-gray); }
.nb__faq-acc-item { border-bottom: 1px solid var(--light-gray); background: #fff; transition: opacity .7s ease, transform .7s ease, background .25s var(--ease); /* opacity / transform 両方含めて .rv のフェード（translateY も）を有効化 */ }
.nb__faq-acc-item:hover { background: var(--cream); }
.nb__faq-acc-item.open { background: var(--cream); }
.nb__faq-acc-q {
  background: transparent;
  border: none;
  border-left: 2px solid transparent;
  padding: 22px 22px 22px 20px;
  display: flex;
  align-items: center;
  gap: 16px;
  cursor: pointer;
  transition: border-color .25s var(--ease);
  list-style: none;
}
.nb__faq-acc-item:hover .nb__faq-acc-q,
.nb__faq-acc-item.open .nb__faq-acc-q { border-left-color: var(--gold); }
.nb__faq-acc-qm {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid rgba(184,151,90,.4);
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--en);
  font-size: .76rem;
  color: var(--gold);
  flex-shrink: 0;
  line-height: 1;
  font-weight: 400;
  letter-spacing: 0;
  transition: background .25s var(--ease), color .25s var(--ease);
}
.nb__faq-acc-item.open .nb__faq-acc-qm { background: var(--gold-dk); color: #fff; } /* 白文字×gold=2.76:1→gold-dk 5.85:1（2026-07-09） */
.nb__faq-acc-qt { font-size: .9rem; color: var(--charcoal); line-height: 1.7; flex: 1; letter-spacing: .02em; }
.nb__faq-acc-arr {
  position: relative;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  font-size: 0;
  color: transparent;
}
.nb__faq-acc-arr::before,
.nb__faq-acc-arr::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  background: var(--warm-gray);
  transition: transform .3s var(--ease), opacity .3s var(--ease), background .25s var(--ease);
}
.nb__faq-acc-arr::before { width: 12px; height: 1px; transform: translate(-50%, -50%); }
.nb__faq-acc-arr::after { width: 1px; height: 12px; transform: translate(-50%, -50%); }
.nb__faq-acc-item:hover .nb__faq-acc-arr::before,
.nb__faq-acc-item:hover .nb__faq-acc-arr::after { background: var(--gold); }
.nb__faq-acc-item.open .nb__faq-acc-arr::before { background: var(--gold); }
.nb__faq-acc-item.open .nb__faq-acc-arr::after { transform: translate(-50%, -50%) rotate(90deg); opacity: 0; }
/* アコーディオン：フワッと開く（max-height アニメ） */
.nb__faq-acc-a {
  display: block !important;
  max-height: 0;
  overflow: hidden;
  padding: 0 22px 0 66px;
  font-size: .85rem;
  color: var(--text2);
  line-height: 1.9;
  background: transparent;
  letter-spacing: .02em;
  opacity: 0;
  visibility: hidden; /* C-001：閉状態はa11yツリーから除外（hidden属性は不使用＝max-height/opacityアニメを維持） */
  border-left: 2px solid transparent;
  transition: max-height .38s ease, opacity .24s ease, padding .3s ease, border-color .25s ease, visibility 0s linear .38s;
}
.nb__faq-acc-item.open .nb__faq-acc-a {
  max-height: 500px;
  opacity: 1;
  visibility: visible; /* 開く時は即座に見える＝delay無し */
  padding-top: 18px;
  padding-bottom: 22px;
  border-left: 2px solid var(--gold);
  transition: max-height .38s ease, opacity .24s ease, padding .3s ease, border-color .25s ease, visibility 0s linear 0s;
}

/* JS が動かない環境では全問を開いた状態で出す（2026-07-27・共通部品 .faq-item と同じ手当て）。
   開閉は JS が付ける .open だけが担うため、これが無いと質問文しか読めない。
   ※7問目以降の畳み込み（data-faq-extra）は JS 側の仕事＝JS 無効なら最初から全問出る。 */
@media (scripting: none) {
  .nb__faq-acc-a {
    max-height: none;
    opacity: 1;
    visibility: visible;
    padding-top: 18px;
    padding-bottom: 22px;
  }
  .nb__faq-acc-arr { display: none; }
  .nb__faq-acc-q { cursor: default; }
}

/* ── 緊急性ブロック ────────────────────────────────────── */
.nb__urgency { background: var(--indigo); padding: 40px var(--sp); text-align: center; }
@media (min-width: 768px) { .nb__urgency { padding: 48px var(--sp-m); } }
.nb__urgency-badge {
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.2);
  padding: 5px 14px;
  border-radius: 2px;
  font-family: var(--en);
  font-size: .68rem;
  color: rgba(255,255,255,.85);
  letter-spacing: .14em;
  white-space: nowrap;
  margin-bottom: 18px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.nb__urgency-badge::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 3px rgba(184,151,90,.18);
}
.nb__urgency-body { max-width: 580px; margin: 0 auto; }
.nb__urgency-title { font-family: var(--jp); font-size: clamp(1rem, 2.4vw, 1.15rem); font-weight: 300; color: #fff; margin-bottom: 10px; line-height: 1.6; letter-spacing: .02em; }
.nb__urgency-text { font-size: .82rem; color: rgba(255,255,255,.62); line-height: 1.85; letter-spacing: .02em; }

/* ── 注意ボックス ──────────────────────────────────────── */
.nb__price-note-box { background: rgba(30,45,90,.05); border: 1px solid rgba(30,45,90,.14); border-radius: 4px; padding: 12px 16px; font-size: .8rem; color: var(--text2); line-height: 1.72; margin-top: 16px; }

/* ── ボタン中央揃え ────────────────────────────────────── */
.nb__works-cta,
.nb__price-bottom-cta,
.nb__faq-bottom { text-align: center; margin-top: 28px; }

/* ── CH2「ロケ地から見る」リンク行（internal-link.md【12】宿題2）──────────
   カード化せず本文リンクの意匠（金＋下線）でそっと置く＝寄り道リンクなので上の枠ボタンより弱く。
   区切り記号は置かず flex の gap で離す＝折り返しても行末に「・」が取り残されない。
   ★並べ方＝ラベルを上の行に独立させ、リンクを下段に中央でまとめる（オーナー確定 2026-07-25）。
     ラベルとリンクを1行に混ぜると、狭い端末で最後のリンクだけ次行に落ちて読みにくい。
   ※ 縦積みでは align-items が「横方向のそろえ」になる＝center を明示（既定の stretch/baseline では左に寄る）。 */
.nb__works-loc {
  margin: 20px auto 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  font-size: .84rem;
  letter-spacing: .02em;
}
.nb__works-loc-label { color: var(--text2); }
.nb__works-loc-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 20px;
}
.nb__works-loc a { color: var(--gold-dk); text-decoration: underline; text-underline-offset: 3px; }
.nb__works-loc a:hover { color: var(--gold); }

/* ── FAQ「初期6問＋残りを見る」──────────────────────────────
   隠すのは JS が付ける --hidden クラスの display 切替のみ（HTML は全問出力＝SEO死守）。
   ボタンは共通 .text-cta を流用。ただし .text-cta の → はページ遷移の記号なので、
   その場で開く操作には合わない＝矢印を下向きの「開く」記号に差し替える。 */
.nb__faq-acc-item--hidden { display: none; }
.nb__faq-more { text-align: center; margin-top: 22px; }
.text-cta--reveal::after { content: '＋'; font-size: .9em; }
@media (min-width: 768px) { .nb__faq-more { margin-top: 26px; } }
/* FAQ末尾の2ボタン（「残りのN問を見る＋」／「よくある質問をもっと見る→」）を同じ幅に揃える
   （オーナー指摘 2026-07-14）。どちらも .text-cta＝inline-flex・nowrap で文字数ぶんの幅になるため、
   広い方（もっと見る）に合わせた共通 min-width を与えて幅を統一。親は text-align:center 済み＝中央寄せは維持。
   max-width:100% で最狭端末では両ボタンとも親幅で頭打ち＝はみ出さず、かつ同幅を保つ。 */
.nb__faq-more .text-cta,
.nb__faq-bottom .text-cta {
  min-width: 16rem;
  max-width: 100%;
}
.nb__cta-buttons { display: flex; flex-direction: column; align-items: center; gap: 12px; }
@media (min-width: 600px) {
  .nb__cta-buttons { flex-direction: row; justify-content: center; flex-wrap: wrap; }
}
.nb__final-line-btn { min-width: 220px; justify-content: center; }
.nb__final-btn { min-width: 180px; justify-content: center; }

/* ── jm__marker：案I方式チャプターヘッダー ──────────────── */
.jm__marker { display: flex; align-items: center; gap: 16px; margin-bottom: 28px; }
.jm__marker-dot { width: 14px; height: 14px; border-radius: 50%; background: var(--gold); flex-shrink: 0; box-shadow: 0 0 0 4px rgba(184,151,90,.2); }
/* ★オーナーFB：各撮影メニューのテーマ層が独自の菱形◆（.jm__marker-label::before）を持つため、
   共通骨格の丸◯（.jm__marker-dot）は二重マーカーになり不要。全メニューページで非表示に。 */
.nb__page .jm__marker-dot { display: none; }
.jm__marker-label { font-family: var(--en); font-size: .7rem; letter-spacing: .2em; color: var(--gold-dk); } /* 明るい地は gold-dk（--gold=cream2.56:1でAA割れ）。暗地の既定ch9は下の .nb__chapter--cta 側で--goldへ戻す（2026-07-21） */
.jm__sec-h2 { font-family: var(--jp); font-size: clamp(1.3rem, 3vw, 1.9rem); font-weight: 300; color: var(--charcoal); margin-bottom: 8px; line-height: 1.5; }
.jm__hdiv { width: 32px; height: 1px; background: var(--gold); margin: 12px 0 24px; }
.jm__sec-sub { font-size: .875rem; color: var(--warm-gray); margin-bottom: 32px; line-height: 1.8; }

/* chapter section 上余白 */
.nb__chapter-body > .c { padding-top: 64px; }
@media (min-width: 768px) { .nb__chapter-body > .c { padding-top: 96px; } }



/* ── 納品までの目安カード（.nb-delivery .receipt）─────────────────────
   **見た目の正典は components.css の `.receipt` 群**（全ページ共通・バーの伸長演出込み）。
   ここには書き写さない＝2026-07-29 まで約95行を二重管理しており、片方だけ直して
   /flow/ と見た目がズレる事故が起きた（オーナー指摘・続き465）。
   `.nb-delivery` は「納品目安カード」を JS が掴むための識別子として残す
   （/price/ の証明写真タブで price.js が hidden を切り替える）。
   ここに置いてよいのは料金文脈での配置の差だけ。現状は差が無いため空。 */