/* ============================================================
   採用LP(recruit.html)専用スタイル
   ─ 白磁の明るいボディ × 夜のヒーロー/店舗カード のコントラスト構成。
   ─ 共通の見た目(ヘッダー/フッター/メニュー/reveal)は style.css を継承し、
     このファイルは body.rp 配下だけを上書きする。
   ============================================================ */

:root{
  --rp-ink:#12141B;         /* 夜(ヒーロー・店舗カード・CTAの基調) */
  --rp-bg:#F4F6F9;          /* 白磁(ページ地色) */
  --rp-panel:#FFFFFF;
  --rp-line:rgba(18,20,27,.10);
  --rp-tx:#22262F;
  --rp-tx2:#6B7280;
  --rp-gold:#B89A5E;        /* 暗い背景の上で使う金 */
  --rp-gold2:#D8B97C;
  --rp-goldd:#96793F;       /* 明るい背景の上で使う金(コントラスト確保) */
  --rp-line-green:#00B900;  /* LINE公式カラー(CTA専用) */
}

body.rp{
  background:var(--rp-bg);
  color:var(--rp-tx);
}
/* 色テイクオーバーはビューポート大の固定レイヤーだけを塗り替える
   (body背景のtransitionだとページ全長の再描画になりスクロールがかくつく) */
body.rp::after{
  content:""; position:fixed; inset:0; z-index:-1;
  background-color:var(--rp-tint, var(--rp-bg));
  transition:background-color .8s ease;
}

/* PC専用レール(モバイルでは出さない) */
.rp .r-rail{ display:none; }

/* 見出しまわり(白磁の上に濃紺の巨大英字) */
.rp .r-entitle{
  color:var(--rp-tx);
  /* 長い語(CONDITIONS等)がカラム幅を突き破らないよう上限を抑える */
  font-size:clamp(34px, 9.5vw, 46px);
  letter-spacing:.02em;
}
.rp .r-jpsub{ color:var(--rp-tx2); }
.rp .r-sec{ padding:72px 0 12px; }
.rp .r-trio{ display:flex; gap:7px; }

/* ---------- 開演ヒーロー ---------- */
.rp .r-hero{
  position:relative; min-height:100svh; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end;
}
.rp .r-stage{
  position:absolute; inset:0;
  background:
    radial-gradient(rgba(255,255,255,.10) 1px, transparent 1.4px),
    radial-gradient(120% 90% at 65% 30%, #4A2A3C 0%, #262133 55%, #12141B 100%);
  background-size:12px 12px, 100% 100%;
}
.rp .r-phslot{
  position:absolute; top:12svh; left:50%; transform:translateX(-50%);
  width:min(58vw,240px); aspect-ratio:3/4; border-radius:8px;
  border:1px solid rgba(255,255,255,.25);
  background:linear-gradient(160deg, rgba(255,255,255,.10), rgba(255,255,255,.03));
  background-size:cover; background-position:center top;
  display:grid; place-items:center;
}
.rp .r-phslot::after{
  content:""; position:absolute; inset:7px;
  border:1px solid rgba(255,255,255,.14); border-radius:4px;
}
.rp .r-phslot span{
  font-family:'Montserrat',sans-serif; font-size:10px; letter-spacing:.24em;
  color:rgba(255,255,255,.5);
}
.rp .r-phslot.has-photo span{ display:none; }
.rp .r-phslot.has-photo::after{ display:none; }
/* 夜の舞台が下端で白磁に明ける=「夜に、咲け。」の転調 */
.rp .r-shade{
  position:absolute; inset:0;
  background:linear-gradient(transparent 34%, var(--rp-bg) 88%);
}
.rp .r-tate{
  position:absolute; top:max(76px, 9svh); right:5vw; margin:0;
  writing-mode:vertical-rl;
  font-size:clamp(40px, 11vw, 64px); font-weight:700; color:#fff;
  letter-spacing:.26em; line-height:1.22;
  text-shadow:0 0 30px rgba(214,96,140,.45);
}
.rp .r-tate em{
  font-style:normal;
  background:linear-gradient(180deg, #3E6C96, #C4526F, #D8548A);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.rp .r-badge{
  position:absolute; top:max(84px, 10svh); left:5vw;
  width:clamp(88px, 24vw, 112px); aspect-ratio:1;
}
.rp .r-badge svg{
  width:100%; height:100%;
  font-family:'Montserrat',sans-serif;
  animation:r-spin 14s linear infinite;
}
@keyframes r-spin{ to{ transform:rotate(360deg); } }
.rp .r-badge-core{
  position:absolute; inset:0; display:grid; place-items:center; text-align:center;
}
.rp .r-badge-core b{
  display:block; font-size:clamp(15px,4vw,18px); color:#fff; line-height:1.1;
  font-family:'Montserrat',sans-serif; font-variant-numeric:tabular-nums;
}
.rp .r-badge-core i{
  font-style:normal; font-size:9px; color:var(--rp-gold2); letter-spacing:.12em;
}
.rp .r-hero-body{
  position:relative; padding:0 6vw calc(24px + env(safe-area-inset-bottom));
  max-width:560px;
}
/* ヒーロー下部は白磁に明けた上に乗るので、文字は濃色に */
.rp .r-eyebrow{
  margin:12px 0 0; font-size:10px; letter-spacing:.4em; color:var(--rp-goldd);
}
.rp .r-sub{
  margin:10px 0 16px; font-size:13.5px; color:#4A515E; max-width:21em; line-height:2;
}
.rp .r-chips{ display:flex; flex-wrap:wrap; gap:7px; margin-bottom:18px; }
.rp .r-chips span{
  font-size:12px; color:var(--rp-tx); background:#fff;
  border:1px solid rgba(18,20,27,.16); border-radius:99px; padding:4px 12px;
}

/* ---------- CTA(共通) — 白磁の上で目立つ夜色ボタン ---------- */
.rp .r-cta{
  display:flex; align-items:center; justify-content:center; gap:8px;
  background:var(--rp-ink); color:#fff; text-decoration:none;
  border-radius:14px; padding:16px 22px;
  font-weight:700; font-size:15px; letter-spacing:.04em;
  box-shadow:0 4px 0 rgba(18,20,27,.22);
  transition:transform .15s ease;
}
.rp .r-cta:active{ transform:scale(.97); }
.rp .r-cta small{
  display:block; font-size:10px; font-weight:400; opacity:.75; letter-spacing:.1em;
}
/* LINE応募ボタン — 立体グロス仕上げ(緑グラデ+上面ハイライト+押し込み影) */
.rp .r-cta.line{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg, #3BDC5E 0%, #06C755 48%, #00A244 100%);
  color:#fff; border-radius:999px; padding:17px 24px;
  font-size:16px; letter-spacing:.05em;
  box-shadow:0 5px 0 #008A3C, 0 12px 24px rgba(0,185,0,.32);
  text-shadow:0 1px 2px rgba(0,90,35,.35);
}
.rp .r-cta.line::before{
  content:""; position:absolute; left:5%; right:5%; top:3px; height:46%;
  border-radius:999px; pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.45), rgba(255,255,255,.05));
}
.rp .r-cta.line:active{
  transform:translateY(4px);
  box-shadow:0 1px 0 #008A3C, 0 6px 14px rgba(0,185,0,.28);
}
.rp .r-cta.line .li-badge{
  width:34px; height:34px; font-size:9px;
  box-shadow:0 1px 3px rgba(0,90,35,.3);
}
.rp .r-cta .cta-in{ text-align:center; }
/* ボタン上の併記文言(＼ まずはお気軽にご相談ください ／) */
.rp .cta-note{
  display:block; text-align:center; margin:0 0 10px;
  font-size:12.5px; font-weight:600; letter-spacing:.08em; color:var(--rp-tx);
}
/* 夜色セクションの上では白文字に */
.rp .r-cv .cta-note,
.rp .r-last.has-photo .cta-note,
.rp .r-hero.full-photo .cta-note{
  color:#fff; text-shadow:0 1px 10px rgba(0,0,0,.4);
}

/* ---------- マーキー帯 ---------- */
.rp .r-mq{
  overflow:hidden; white-space:nowrap;
  border-top:1px solid var(--rp-line); border-bottom:1px solid var(--rp-line);
  padding:9px 0; background:#fff;
}
.rp .r-mq-track{
  display:inline-block; animation:r-mqx 18s linear infinite;
  font-family:'Montserrat',sans-serif; font-size:12px; letter-spacing:.34em; color:var(--rp-tx2);
}
@keyframes r-mqx{ to{ transform:translateX(-50%); } }

/* ---------- スタックデッキ ---------- */
.rp .r-story-head{ padding-bottom:20px; }
.rp .r-deck{ position:relative; max-width:760px; margin:0 auto; }
.rp .r-wcard{
  position:sticky; overflow:hidden;
  min-height:88svh; border-radius:22px 22px 0 0;
  display:flex; flex-direction:column; justify-content:flex-end;
  box-shadow:0 -16px 36px rgba(31,41,55,.22);
  /* stickyで重なり合うカードを合成レイヤーに昇格(影+紋様の再描画を隔離) */
  will-change:transform; transform:translateZ(0);
}
.rp .r-wcard .r-wbg{
  position:absolute; inset:0;
  background-image:radial-gradient(rgba(255,255,255,.13) 1px, transparent 1.4px);
  background-size:12px 12px;
}
/* 背景画像モード(管理画面の「背景画像」登録時。暗めのスクリムはJS側のグラデで焼く) */
.rp .r-wcard .r-wbgimg{
  position:absolute; inset:0;
  background-size:cover; background-position:center top;
}
.rp .r-bgword{
  position:absolute; top:26px; left:-4px; margin:0;
  font-family:'Montserrat',sans-serif; font-size:clamp(80px, 24vw, 150px);
  font-weight:700; line-height:1; white-space:nowrap;
  color:transparent; -webkit-text-stroke:1.2px rgba(255,255,255,.3);
  pointer-events:none;
}
@supports (animation-timeline: view()){
  .rp .r-bgword{
    animation:r-drift linear both;
    animation-timeline:view();
    animation-range:entry 0% cover 70%;
  }
  @keyframes r-drift{
    from{ transform:translateY(70px); }
    to{ transform:translateY(-10px); }
  }
}
.rp .r-widx{
  position:absolute; top:18px; right:18px;
  font-family:'Montserrat',sans-serif; font-size:10px; letter-spacing:.3em;
  color:rgba(255,255,255,.8);
  border:1px solid rgba(255,255,255,.4); border-radius:99px; padding:4px 12px;
}
.rp .r-wph{
  position:absolute; top:120px; right:20px; overflow:hidden;
  width:clamp(130px, 38vw, 180px); aspect-ratio:3/4; border-radius:8px;
  border:1px solid rgba(255,255,255,.4); background:rgba(255,255,255,.08);
  display:grid; place-items:center; text-align:center;
}
.rp .r-wph span{
  font-family:'Montserrat',sans-serif; font-size:9px; letter-spacing:.18em;
  color:rgba(255,255,255,.75); line-height:2.2;
}
.rp .r-wph::after{
  content:""; position:absolute; inset:5px;
  border:1px solid rgba(255,255,255,.2); border-radius:4px;
  pointer-events:none;
}
.rp .r-wph.has-photo::after{ display:none; }
/* 内装写真スライド(クロスフェード) */
.rp .r-wph .wps{
  position:absolute; inset:0; opacity:0;
  background-size:cover; background-position:center;
  transition:opacity .9s ease;
}
.rp .r-wph .wps.on{ opacity:1; }
.rp .r-wfoot{
  position:relative; padding:90px 6vw 30px;
  background:linear-gradient(transparent, rgba(0,0,0,.55) 70%);
}
.rp .r-wname{
  margin:0 0 6px; font-family:'Montserrat',sans-serif;
  font-size:clamp(32px, 9vw, 44px); font-weight:600; color:#fff; line-height:1;
  letter-spacing:.03em;
}
.rp .r-wsub{
  margin:0 0 14px; font-family:'Montserrat',sans-serif;
  font-size:10px; letter-spacing:.3em; color:rgba(255,255,255,.7);
}
.rp .r-wcopy{ margin:0 0 10px; font-size:13.5px; color:#fff; max-width:22em; line-height:2; }
.rp .r-wfit{ margin:0 0 18px; font-size:12.5px; color:rgba(255,255,255,.86); }
.rp .r-wfit b{ color:#fff; }

/* ---------- 条件テーブル ---------- */
.rp .r-cond{ width:100%; border-collapse:collapse; font-size:13.5px; }
.rp .r-cond th{
  white-space:nowrap; text-align:left; vertical-align:top;
  color:var(--rp-tx2); font-weight:500; letter-spacing:.06em;
  padding:12px 16px 12px 0; border-bottom:1px solid var(--rp-line);
}
.rp .r-cond td{
  color:var(--rp-tx); padding:12px 0; border-bottom:1px solid var(--rp-line); line-height:1.9;
}

/* ---------- SAFETY ---------- */
.rp .r-safe{ display:grid; gap:12px; grid-template-columns:1fr; }
@media (min-width:720px){ .rp .r-safe{ grid-template-columns:1fr 1fr; } }
.rp .r-safe .rs{
  display:flex; gap:14px; align-items:flex-start;
  background:var(--rp-panel); border:1px solid var(--rp-line);
  border-radius:14px; padding:16px;
}
.rp .r-safe .rs-ic{
  flex:0 0 auto; width:32px; height:32px; border-radius:9px;
  background:rgba(184,154,94,.16); color:var(--rp-gold2);
  display:grid; place-items:center; font-size:14px;
}
.rp .r-safe h3{ margin:0 0 4px; font-size:14px; color:var(--rp-tx); }
.rp .r-safe p{ margin:0; font-size:12.5px; color:var(--rp-tx2); line-height:1.9; }

/* ---------- 応募フロー ---------- */
.rp .r-flow{ list-style:none; margin:0; padding:0; counter-reset:rst; }
.rp .r-flow li{ position:relative; padding:0 0 26px 46px; counter-increment:rst; }
.rp .r-flow li::before{
  content:counter(rst);
  position:absolute; left:0; top:0; width:29px; height:29px; border-radius:50%;
  background:var(--rp-goldd); color:#fff;
  font-family:'Montserrat',sans-serif; font-weight:700; font-size:14px;
  display:grid; place-items:center;
}
.rp .r-flow li::after{
  content:""; position:absolute; left:14px; top:32px; bottom:4px; width:1px;
  background:var(--rp-line);
}
.rp .r-flow li:last-child::after{ display:none; }
.rp .r-flow h3{ margin:3px 0 3px; font-size:14.5px; color:var(--rp-tx); }
.rp .r-flow p{ margin:0; font-size:12.5px; color:var(--rp-tx2); line-height:1.9; }

/* ---------- FAQ ---------- */
.rp .r-faq details{ border-bottom:1px solid var(--rp-line); }
.rp .r-faq summary{
  list-style:none; cursor:pointer; padding:15px 2px;
  font-size:13.5px; color:var(--rp-tx); font-weight:500;
  display:flex; justify-content:space-between; align-items:center; gap:12px;
}
.rp .r-faq summary::-webkit-details-marker{ display:none; }
.rp .r-faq summary::after{
  content:"+"; color:var(--rp-goldd); font-size:18px; flex:0 0 auto;
  transition:transform .25s ease;
}
.rp .r-faq details[open] summary::after{ content:"−"; }
.rp .r-faq details p{
  margin:0; padding:0 2px 16px; font-size:12.5px; color:var(--rp-tx2); line-height:2;
}

/* ---------- 締めCTA・追従CTA ---------- */
.rp .r-last{ padding-bottom:80px; }
.rp .r-last-inner{ display:flex; flex-direction:column; align-items:center; gap:16px; text-align:center; }
.rp .r-last-copy{ margin:6px 0 0; font-size:13.5px; color:var(--rp-tx2); line-height:2.2; }
.rp .r-sticky{
  position:fixed; left:0; right:0; bottom:0; z-index:40;
  padding:10px 16px calc(12px + env(safe-area-inset-bottom));
  background:linear-gradient(transparent, rgba(244,246,249,.95) 45%);
  transform:translateY(110%); transition:transform .35s ease;
}
.rp .r-sticky.show{ transform:none; }
.rp .r-sticky .r-cta{ max-width:560px; margin:0 auto; }
/* 追従バーはコンパクトに(併記文言は小さめ・余白詰め) */
.rp .r-sticky .cta-note{ margin-bottom:6px; font-size:11px; }

/* ---------- LINEバッジ(ヘッダーピル/CTA共通の白丸アイコン) ---------- */
.rp .li-badge{
  flex:0 0 auto; display:grid; place-items:center;
  width:26px; height:26px; border-radius:50%; background:#fff;
  font-family:'Montserrat',sans-serif; font-size:7px; font-weight:800;
  letter-spacing:.02em; color:var(--rp-line-green);
}
.rp .r-cta .li-badge{ width:30px; height:30px; font-size:8px; }

/* ---------- ヘッダーのLINE応募ピル(1stビューの上のCTA) ---------- */
.rp .gh-line{
  pointer-events:auto; flex:0 0 auto; display:flex; align-items:center; gap:6px;
  margin:18px 8px 0 auto; padding:9px 12px; border-radius:99px;
  background:var(--rp-line-green); color:#fff; text-decoration:none;
  font-size:11.5px; font-weight:700; letter-spacing:.02em; white-space:nowrap;
  box-shadow:0 4px 14px rgba(0,0,0,.25);
}
.rp .gh-line .li-badge{ width:22px; height:22px; font-size:6px; }
/* ロゴ板が長いときにピルを潰さない(ピル優先で板側を縮める) */
.rp .gh .logo-plate{ flex-shrink:1; min-width:0; }

/* ---------- ヒーロー: 1枚画像フルブリードモード ---------- */
.rp .r-hero.full-photo .r-phslot{
  top:0; left:0; transform:none; width:100%; height:100%;
  aspect-ratio:auto; border:0; border-radius:0;
  background-size:cover; background-position:center top;
}
.rp .r-hero.full-photo .r-phslot::after{ display:none; }
/* 下端は白磁ではなく夜に沈める(画像を主役にした転調) */
.rp .r-hero.full-photo .r-shade{
  background:linear-gradient(rgba(18,20,27,.32), transparent 26%,
    transparent 48%, rgba(18,20,27,.78) 84%, rgba(18,20,27,.94) 100%);
}
.rp .r-hero.full-photo .r-eyebrow{ color:var(--rp-gold2); }
.rp .r-hero.full-photo .r-sub{ color:#E8EAF0; text-shadow:0 1px 10px rgba(0,0,0,.4); }
.rp .r-hero.full-photo .r-chips span{
  background:rgba(255,255,255,.14); color:#fff; border-color:rgba(255,255,255,.34);
  backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
}

/* ---------- なぜFROZEなのか(夜の帯+宣材スライド) ---------- */
.rp .r-why{
  background:
    radial-gradient(90% 60% at 50% 0%, rgba(216,84,138,.34), transparent 70%),
    radial-gradient(70% 50% at 15% 90%, rgba(62,108,150,.25), transparent 70%),
    #191423;
  color:#fff; padding:64px 0 46px; overflow:hidden;
}
.rp .rw-inner{ padding:0 6vw; text-align:center; }
.rp .rw-title{
  margin:0 0 26px; font-size:clamp(26px, 7.6vw, 34px); font-weight:700;
  letter-spacing:.06em; line-height:1.7;
}
.rp .rw-title span{ display:block; }
.rp .rw-body p{
  margin:0 0 26px; font-size:13.5px; line-height:2.3; letter-spacing:.05em; color:#E9E4EF;
}
.rp .rw-slider{ margin-top:8px; overflow:hidden; white-space:nowrap; }
.rp .rw-track{ display:inline-flex; animation:rw-x 36s linear infinite; }
.rp .rw-half{ display:inline-flex; gap:12px; padding-right:12px; }
.rp .rw-half img{
  width:min(46vw, 210px); aspect-ratio:3/4; object-fit:cover;
  border-radius:12px; border:1px solid rgba(255,255,255,.18);
}
@keyframes rw-x{ to{ transform:translateX(-50%); } }

/* ---------- BRAND POWER: 特に強い強み①② ---------- */
.rp .rb-strong{
  margin-top:26px; background:#fff; border:1px solid var(--rp-line); border-radius:18px;
  padding:24px 16px 22px; text-align:center; box-shadow:0 4px 14px rgba(31,41,55,.05);
}
.rp .rb-strong .st-chip{
  display:inline-block; background:var(--rp-ink); color:#fff;
  font-size:11px; font-weight:700; letter-spacing:.14em;
  border-radius:4px; padding:6px 14px;
}
.rp .rb-strong .st-title{
  margin:16px 0 0; font-size:clamp(20px, 5.8vw, 26px); letter-spacing:.06em;
  background:linear-gradient(90deg, #C4526F, #D8548A);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.rp .rb-strong .st-title::after{
  content:""; display:block; width:56px; height:2px; margin:12px auto 0;
  background:linear-gradient(90deg, #C4526F, #3E6C96); opacity:.5;
}
.rp .rb-strong .st-sub{ margin:12px 0 0; font-size:13px; line-height:2; color:var(--rp-tx); }
.rp .rb-strong .st-lineup{
  margin:18px 0 14px; font-size:12.5px; font-weight:700; letter-spacing:.1em; color:var(--rp-tx);
  background:linear-gradient(90deg, #F5E6EC, #E9EEF6); border-radius:8px; padding:9px 0;
}
.rp .st-media{ display:grid; gap:14px; }
.rp .st-media figure{ margin:0; }
.rp .st-media img{
  display:block; width:100%; border-radius:12px; border:1px solid var(--rp-line);
}
.rp .st-media figcaption{
  margin-top:8px; font-size:12px; line-height:1.9; color:var(--rp-tx);
  background:#F6F7FA; border-radius:10px; padding:10px 12px;
}
/* 稼げるロジックのフロー図 */
.rp .st-flow{ margin-top:18px; display:grid; gap:10px; }
.rp .st-step{
  display:flex; align-items:center; gap:12px; text-align:left;
  background:linear-gradient(100deg, #3E6C96, #C4526F);
  color:#fff; border-radius:12px; padding:14px 16px;
  font-size:13px; font-weight:700; letter-spacing:.04em; line-height:1.8;
}
.rp .st-step i{
  flex:0 0 34px; width:34px; height:34px; border-radius:50%;
  display:grid; place-items:center; font-style:normal;
  background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.4);
  font-family:'Montserrat',sans-serif; font-size:14px;
}
.rp .st-arrow{ text-align:center; color:#C4526F; font-size:13px; line-height:1; }
.rp .st-result{
  margin:20px 0 2px; font-size:clamp(17px, 4.8vw, 21px); font-weight:700;
  line-height:1.9; letter-spacing:.05em; color:var(--rp-tx);
}
.rp .st-result::before{
  content:""; display:block; width:40px; height:3px; margin:0 auto 14px;
  background:linear-gradient(90deg, #C4526F, #D8548A); border-radius:2px;
}

/* ---------- CAST VISUAL(夜の帯・縦型スライドショー) ---------- */
.rp .r-cv{
  background:
    radial-gradient(80% 55% at 50% 100%, rgba(196,82,111,.30), transparent 70%),
    #14121C;
  color:#fff; text-align:center; padding:58px 0 62px; overflow:hidden;
}
.rp .cv-eyebrow{ margin:0; font-size:11px; letter-spacing:.34em; color:#D8548A; }
.rp .cv-title{
  margin:14px 0 24px; font-size:clamp(24px, 6.8vw, 30px); font-weight:700;
  letter-spacing:.08em; line-height:1.8;
}
.rp .cv-carousel{
  display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory;
  padding:6px 19% 10px; scrollbar-width:none;
}
.rp .cv-carousel::-webkit-scrollbar{ display:none; }
.rp .cv-slide{
  flex:0 0 62%; scroll-snap-align:center;
  transform:scale(.9); opacity:.55; transition:transform .35s ease, opacity .35s ease;
}
.rp .cv-slide.on{ transform:scale(1); opacity:1; }
.rp .cv-slide img{
  display:block; width:100%; aspect-ratio:3/4; object-fit:cover;
  border-radius:14px; border:1px solid rgba(255,255,255,.2);
}
.rp .cv-dots{ display:flex; justify-content:center; gap:9px; margin:16px 0 0; }
.rp .cv-dots i{
  width:8px; height:8px; border-radius:50%;
  border:1px solid rgba(255,255,255,.6); background:transparent;
}
.rp .cv-dots i.on{ background:#D8548A; border-color:#D8548A; }
.rp .cv-sub{
  margin:18px auto 22px; max-width:30em; padding:0 6vw;
  font-size:12.5px; line-height:2.2; color:#E4E0EA;
}
.rp .r-cv .r-cta{ max-width:min(84%, 420px); margin:0 auto; }

/* ---------- 募集要項: こんな方をお待ちしています ---------- */
.rp .rq-wanted{
  background:linear-gradient(160deg, #FBF0F4, #F0F3F9);
  border:1px solid var(--rp-line); border-radius:16px;
  padding:20px 18px; margin-bottom:22px;
}
.rp .rq-wanted .rq-head{
  margin:0 0 12px; text-align:center; font-size:14.5px; font-weight:700;
  letter-spacing:.08em; color:#B4436B;
}
.rp .rq-wanted ul{ list-style:none; margin:0; padding:0; }
.rp .rq-wanted li{
  position:relative; padding:11px 2px 11px 34px; font-size:13.5px; font-weight:600;
  color:var(--rp-tx); border-bottom:1px solid rgba(18,20,27,.07); line-height:1.8;
}
.rp .rq-wanted li:last-child{ border-bottom:0; }
.rp .rq-wanted li::before{
  content:"✓"; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:22px; height:22px; border-radius:6px; display:grid; place-items:center;
  background:linear-gradient(135deg, #C4526F, #D8548A); color:#fff; font-size:12px;
}

/* ---------- 締めのCTA: ヒーロー画像モード ---------- */
.rp .r-last{ position:relative; }
.rp .r-last-photo{ display:none; }
.rp .r-last.has-photo{
  padding:0; overflow:hidden;
}
.rp .r-last.has-photo .r-last-photo{
  display:block; position:absolute; inset:0;
  background-size:cover; background-position:center top;
}
.rp .r-last.has-photo .r-last-photo::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(rgba(18,20,27,.20), rgba(18,20,27,.42) 60%, rgba(18,20,27,.66));
}
.rp .r-last.has-photo .r-last-inner{
  position:relative; z-index:1; min-height:78svh; justify-content:center;
  padding-top:40px; padding-bottom:48px;
}
.rp .r-last.has-photo .r-last-copy{
  color:#fff; font-weight:600; text-shadow:0 1px 12px rgba(0,0,0,.45);
}
.rp .r-last.has-photo .r-cta{ width:min(84%, 420px); }
/* 写真モード時は写真とフッターを直結(共通footerのmargin-top:88pxが白帯になるため) */
.rp .r-last.has-photo + footer{ margin-top:0; }

/* ---------- 動きを抑えたい人へ ---------- */
@media (prefers-reduced-motion: reduce){
  .rp .r-badge svg{ animation:none; }
  .rp .r-mq-track{ animation:none; }
  .rp .rw-track{ animation:none; }
  .rp .r-bgword{ animation:none !important; }
  body.rp{ transition:none; }
}

/* ============================================================
   PC表示 — 中央にスマホ幅のLP、左右に固定レール
   (左=ブランド+応募CTA / 右=セクションナビ。舞台は白磁+3色のグロー)
   ============================================================ */
@media (min-width:1080px){
  :root{ --rp-col:470px; }  /* 中央カラム(スマホビュー)の幅 */

  /* 舞台背景 — ドット紋様+3店舗色のかすかなグロー。
     背景はビューポート固定の::afterレイヤーに描く
     (background-attachment:fixedはスクロール毎の再描画でかくつくため使わない)。
     色テイクオーバー(--rp-tint)は同じレイヤーの地色として下で光る */
  body.rp::after{
    background-image:
      radial-gradient(rgba(18,20,27,.045) 1px, transparent 1.4px),
      radial-gradient(50% 60% at 8% 12%,  rgba(62,108,150,.10), transparent 70%),
      radial-gradient(45% 55% at 92% 20%, rgba(196,82,111,.09), transparent 70%),
      radial-gradient(55% 60% at 88% 88%, rgba(216,84,138,.08), transparent 70%);
    background-size:14px 14px, 100% 100%, 100% 100%, 100% 100%;
  }

  /* 中央カラム: LP本体をスマホ幅に閉じ込める */
  .rp > .r-hero, .rp > .r-mq, .rp > .r-sec, .rp > .r-deck, .rp > footer,
  .rp > .r-why, .rp > .r-cv{
    width:var(--rp-col);
    margin-left:auto; margin-right:auto;
    position:relative; z-index:1;
  }
  /* カラムの「板」— 継ぎ目なく背面に敷く(白磁の舞台に浮かぶ端末) */
  body.rp::before{
    content:""; position:fixed; top:0; bottom:0;
    left:calc(50% - var(--rp-col)/2); width:var(--rp-col);
    background:var(--rp-bg);
    box-shadow:0 0 70px rgba(31,41,55,.22);
    z-index:0;
  }

  /* サイト共通ヘッダーと追従CTAはPCでは出さない(左レールが担う) */
  .rp .gh{ display:none; }
  .rp .r-sticky{ display:none !important; }

  /* カラム内の余白・位置をスマホ想定値に固定(vwはPCでは広すぎる) */
  .rp .r-hero{ min-height:92vh; }
  .rp .r-tate{ right:26px; font-size:52px; }
  .rp .r-badge{ left:24px; width:100px; }
  .rp .r-hero-body{ padding:0 26px 26px; max-width:none; }
  .rp .r-wfoot{ padding:90px 26px 30px; }
  .rp .r-phslot{ width:230px; }
  .rp .r-deck{ max-width:var(--rp-col); }
  .rp .r-sec .container{ padding-left:26px; padding-right:26px; }
  .rp .rw-inner{ padding:0 26px; }
  .rp .cv-sub{ padding:0 26px; }
  .rp .rw-half img{ width:200px; }

  /* ---------- レール共通 — 中央カラムのすぐ脇に寄せる ---------- */
  .rp .r-rail{
    display:flex; flex-direction:column;
    position:fixed; top:0; bottom:0; z-index:2;
    width:min(320px, calc(50% - var(--rp-col)/2 - 46px));
    padding:34px 0;
    pointer-events:none;              /* 背景は透過。リンク類だけ有効化 */
  }
  .rp .r-rail a{ pointer-events:auto; }

  /* ---------- 左レール: ブランド+CTA(カラム左脇・右揃え) ---------- */
  .rp .r-rail-l{
    left:auto; right:calc(50% + var(--rp-col)/2 + 24px);
    align-items:flex-end; text-align:right;
  }
  .rp .r-rail-logo{
    display:flex; align-items:center; gap:10px;
    color:var(--rp-tx); text-decoration:none;
    font-size:20px; font-weight:800; letter-spacing:.28em;
  }
  .rp .r-rail-main{
    margin:auto 0; display:flex; flex-direction:column;
    align-items:flex-end; gap:14px; max-width:340px;
  }
  .rp .r-rail-eyebrow{ margin:0; font-size:10px; letter-spacing:.4em; color:var(--rp-goldd); }
  .rp .r-rail-copy{
    margin:0; font-size:clamp(34px, 3.4vw, 48px); font-weight:700;
    color:var(--rp-tx); letter-spacing:.14em; line-height:1.3;
  }
  .rp .r-rail-copy em{
    font-style:normal;
    background:linear-gradient(90deg, #3E6C96, #C4526F, #D8548A);
    -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  .rp .r-rail-sub{ margin:0 0 6px; font-size:13px; color:#5B6371; line-height:2.1; }
  .rp .r-rail-cta{ width:280px; pointer-events:auto; }
  .rp .r-rail-note{ margin:0; font-size:11px; color:#8A919E; letter-spacing:.06em; }

  /* ---------- 右レール: セクションナビ(カラム右脇・左揃え) ---------- */
  .rp .r-rail-r{
    right:auto; left:calc(50% + var(--rp-col)/2 + 24px);
    align-items:flex-start; text-align:left;
  }
  .rp .r-rail-nav{
    margin:auto 0; display:flex; flex-direction:column; gap:20px;
  }
  .rp .r-rail-nav a{
    color:#4A515E; text-decoration:none; font-size:13.5px; letter-spacing:.08em;
    display:flex; align-items:center; justify-content:flex-start; gap:10px;
    transition:color .2s ease;
  }
  .rp .r-rail-nav a::after{
    content:""; order:-1; width:9px; height:9px; transform:rotate(45deg); border-radius:2px;
    background:rgba(18,20,27,.18); transition:background .2s ease;
  }
  .rp .r-rail-nav a:hover{ color:var(--rp-ink); }
  .rp .r-rail-nav a:hover::after{ background:var(--rp-goldd); }
  .rp .r-rail-site{
    color:#8A919E; text-decoration:none; font-size:12px; letter-spacing:.1em;
  }
  .rp .r-rail-site:hover{ color:var(--rp-ink); }
}

/* レール同士がぶつかる中間幅(1080-1279px)はレールを細く・カラムに密着 */
@media (min-width:1080px) and (max-width:1279px){
  .rp .r-rail{ width:min(250px, calc(50% - var(--rp-col)/2 - 32px)); padding:28px 0; }
  .rp .r-rail-l{ right:calc(50% + var(--rp-col)/2 + 16px); }
  .rp .r-rail-r{ left:calc(50% + var(--rp-col)/2 + 16px); }
  .rp .r-rail-copy{ font-size:30px; }
  .rp .r-rail-cta{ width:100%; }
}

/* ============================================================
   BRAND POWER — 数字で見る実績
   ============================================================ */
.rp .rb-intro{margin:0 0 18px;font-size:13px;line-height:2.1;color:var(--rp-tx2);white-space:pre-line;}
.rp .rb-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.rp .rb-stat{background:#fff;border:1px solid var(--rp-line);border-radius:16px;
  padding:20px 12px 18px;text-align:center;box-shadow:0 4px 14px rgba(31,41,55,.05);}
.rp .rb-stat .lb{display:block;font-family:'Montserrat',sans-serif;font-size:10px;
  letter-spacing:.22em;color:var(--rp-tx2);}
.rp .rb-stat .lb::after{content:"";display:block;width:18px;height:2px;margin:7px auto 12px;
  background:currentColor;opacity:.35;}
.rp .rb-stat .num{font-family:'Montserrat',sans-serif;font-weight:800;
  font-size:clamp(30px,8.5vw,46px);line-height:1;letter-spacing:.01em;white-space:nowrap;}
.rp .rb-stat .unit{font-size:14px;font-weight:700;margin-left:2px;white-space:nowrap;}
.rp .rb-stat .ds{display:block;margin-top:9px;font-size:11.5px;letter-spacing:.04em;color:var(--rp-tx);}
.rp .rb-stat .nt{display:inline-block;margin-top:9px;font-size:10px;line-height:1.6;
  background:#FBE9EF;color:#B4436B;border-radius:6px;padding:3px 9px;}
.rp .rb-stat::after{content:"◆";display:block;margin-top:10px;font-size:8px;}
/* 交互アクセント(mauveローズ × sianブルー) */
.rp .rb-stat:nth-child(odd) .num,.rp .rb-stat:nth-child(odd)::after{color:#C4526F;}
.rp .rb-stat:nth-child(even) .num,.rp .rb-stat:nth-child(even)::after{color:#3E6C96;}

/* SNS・メディア出演支援カード */
.rp .rb-sns{margin-top:12px;background:#fff;border:1px solid var(--rp-line);border-radius:16px;
  padding:18px;box-shadow:0 4px 14px rgba(31,41,55,.05);}
.rp .rb-sns .sn-eyebrow{margin:0;font-family:'Montserrat',sans-serif;font-size:10px;
  letter-spacing:.26em;color:#C4526F;}
.rp .rb-sns h3{margin:6px 0 8px;font-size:17px;letter-spacing:.04em;color:var(--rp-tx);}
.rp .rb-sns .sn-desc{margin:0 0 14px;font-size:12px;line-height:2;color:var(--rp-tx2);}
.rp .rb-acc{border:1px solid var(--rp-line);border-radius:12px;padding:12px 14px;}
.rp .rb-acc .ac-head{margin:0 0 8px;font-family:'Montserrat',sans-serif;font-size:12px;
  font-weight:700;letter-spacing:.12em;color:var(--rp-tx);}
.rp .rb-acc .ac-row{display:flex;justify-content:space-between;align-items:center;
  padding:7px 2px;border-bottom:1px solid var(--rp-line);font-size:12.5px;}
.rp .rb-acc .ac-row:last-of-type{border-bottom:0;}
.rp .rb-acc .ac-row b{font-family:'Montserrat',sans-serif;font-size:16px;color:#C4526F;}
.rp .rb-acc .ac-total{margin-top:8px;text-align:center;font-size:11.5px;font-weight:700;
  background:linear-gradient(90deg,#C4526F,#D8548A);color:#fff;border-radius:8px;padding:7px 0;}

/* 実際のSNS投稿画像 */
.rp .rb-shots{margin-top:12px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.rp .rb-shots img{display:block;width:100%;aspect-ratio:9/16;object-fit:cover;
  border-radius:12px;border:1px solid var(--rp-line);}

/* ============================================================
   REAL CAST — 実際のキャストの声
   ============================================================ */
.rp .rv-card{background:#fff;border:1px solid var(--rp-line);border-radius:18px;
  padding:18px;margin-bottom:14px;box-shadow:0 4px 14px rgba(31,41,55,.05);}
.rp .rv-head{display:flex;align-items:center;gap:11px;margin:0 0 14px;}
.rp .rv-num{flex:0 0 26px;width:26px;height:26px;transform:rotate(45deg);border-radius:6px;
  display:grid;place-items:center;color:#fff;}
.rp .rv-num i{transform:rotate(-45deg);font-style:normal;font-family:'Montserrat',sans-serif;
  font-size:11px;font-weight:700;}
.rp .rv-head h3{margin:0;font-size:15.5px;letter-spacing:.04em;color:var(--rp-tx);}
.rp .rv-body{display:grid;grid-template-columns:104px 1fr;gap:12px;align-items:start;}
.rp .rv-ph{aspect-ratio:3/4;border-radius:12px;background:#EDEFF3 center/cover no-repeat;
  display:grid;place-items:center;}
.rp .rv-ph span{font-size:10px;color:#A7AEBB;letter-spacing:.1em;text-align:center;line-height:1.9;}
.rp .rv-ph.has-photo span{display:none;}
.rp .rv-quote{position:relative;border-radius:14px;padding:16px 16px 14px;
  font-size:12.5px;line-height:2;color:var(--rp-tx);white-space:pre-line;}
.rp .rv-quote::before{content:"“";position:absolute;top:-2px;left:10px;
  font-family:Georgia,serif;font-size:30px;line-height:1;}
.rp .rv-attr{display:inline-flex;align-items:center;gap:6px;margin-top:10px;
  font-size:11px;border-radius:99px;padding:5px 12px;}
.rp .rv-attr::before{content:"👤";font-size:11px;}
/* 交互アクセント(ブルー/ローズ) */
.rp .rv-card:nth-child(odd) .rv-num{background:#3E6C96;}
.rp .rv-card:nth-child(odd) .rv-quote{background:#EEF4FA;}
.rp .rv-card:nth-child(odd) .rv-quote::before{color:#3E6C96;}
.rp .rv-card:nth-child(odd) .rv-attr{background:#EEF4FA;color:#33587C;}
.rp .rv-card:nth-child(even) .rv-num{background:#C4526F;}
.rp .rv-card:nth-child(even) .rv-quote{background:#FBEDF2;}
.rp .rv-card:nth-child(even) .rv-quote::before{color:#C4526F;}
.rp .rv-card:nth-child(even) .rv-attr{background:#FBEDF2;color:#A04465;}

@media (min-width:760px){
  .rp .rb-stats{grid-template-columns:repeat(2,1fr);}
  .rp .rv-body{grid-template-columns:140px 1fr;}
}