/* ==========================================================================
   ONE LUKE LP — 共通スタイル
   tokens/tokens.css に準拠。fc.html / recruit.html から読み込む。
   ========================================================================== */

.ol-lp-scope{
  --brand:#43B0BA; --brand-light:#83CCD2; --brand-pale:#CFE1E3;
  --deep:#24737B; --deeper:#1F6B72; --darkest:#17565C; --tint:#F5FAFA;
  --ink:#333; --muted:#767676; --decor:#B2B2B2;
  --bg:#EAEAEA; --surface:#fff; --line:#E5E5E5; --line-strong:#D6D6D6;
  --font-ja:"Zen Kaku Gothic New","Noto Sans JP","Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
  --font-en:"Montserrat",sans-serif;
  --r-md:10px; --r-lg:20px; --r-pill:999px;
  --shadow:0 2px 12px rgba(51,51,51,.06);
  --ease:cubic-bezier(.16,1,.3,1);
  --sec-py:120px;
}
@media(max-width:767px){ .ol-lp-scope{ --sec-py:64px; } }

.ol-lp-scope *{box-sizing:border-box;margin:0;padding:0}
.ol-lp-scope{scroll-behavior:smooth;scroll-padding-top:80px}
.ol-lp-scope{font-family:var(--font-ja);font-size:16px;line-height:1.8;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
/* 横スクロール防止。body に overflow-x:hidden を指定すると body 自体がスクロール
   コンテナになり、ページ内アンカー（#model など）が効かなくなるため clip を使う。
   clip 非対応ブラウザ向けに hidden をフォールバックとして先に置いている。 */
.ol-lp-scope{overflow-x:hidden}
@supports (overflow:clip){ .ol-lp-scope{overflow-x:clip} }
.ol-lp-scope img{max-width:100%;height:auto;display:block}
.ol-lp-scope a{color:inherit}

/* 日本語の折り返しを文節単位にする。Chrome系のみ有効だが、非対応ブラウザは
   従来どおりの折り返しになるだけで崩れない。text-wrap は行末の泣き別れを減らす。 */
.ol-lp-scope h1,.ol-lp-scope h2,.ol-lp-scope h3,.ol-lp-scope h4,.ol-lp-scope p,.ol-lp-scope li,.ol-lp-scope dd,.ol-lp-scope dt,.ol-lp-scope summary,.ol-lp-scope figcaption{word-break:auto-phrase;line-break:strict}
.ol-lp-scope h1,.ol-lp-scope h2,.ol-lp-scope h3,.ol-lp-scope h4{text-wrap:balance}
.ol-lp-scope p,.ol-lp-scope .sec-lead{text-wrap:pretty}

.ol-lp-scope .wrap{width:min(1200px,100% - 80px);margin-inline:auto}
.ol-lp-scope .wrap-n{width:min(880px,100% - 80px);margin-inline:auto}
@media(max-width:767px){ .ol-lp-scope .wrap,.ol-lp-scope .wrap-n{width:min(1200px,100% - 40px)} }

/* ---- header ---- */
.ol-lp-scope .hdr{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.ol-lp-scope .hdr .inner{display:flex;align-items:center;justify-content:space-between;gap:16px;height:72px}
.ol-lp-scope .hdr .brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-height:44px}
.ol-lp-scope .hdr .brand img{height:38px;width:auto;max-width:220px;object-fit:contain}
.ol-lp-scope .hdr .brand span{font-size:15px;font-weight:700;letter-spacing:.16em;color:var(--brand);white-space:nowrap}
.ol-lp-scope .hdr .brand small{display:block;font-family:var(--font-en);font-size:9px;letter-spacing:.18em;color:var(--muted);font-weight:500}
@media(max-width:767px){ .ol-lp-scope .hdr .inner{height:60px} .ol-lp-scope .hdr .brand img{height:30px;max-width:150px} .ol-lp-scope .hdr .brand span{font-size:13px} }
/* 狭い画面ではロゴだけにする。ロゴ内に社名が入っているため情報は落ちない。 */
@media(max-width:560px){ .ol-lp-scope .hdr .brand .brand-txt{display:none} }
@media(max-width:400px){ .ol-lp-scope .hdr .brand img{max-width:120px} .ol-lp-scope .hdr .btn.sm{font-size:13px;padding:0 16px;letter-spacing:.02em} }

/* ロゴSVG（assets/img/logo.svg）に「ワンルーク」の文字が既に含まれている場合は、
   次の1行のコメントを外すと、隣のテキストが消えて二重表示になりません。 */
/* .hdr .brand .brand-txt{display:none} */

/* ---- buttons ---- */
.ol-lp-scope .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:240px;height:60px;padding:0 32px;border:0;border-radius:var(--r-pill);font-family:var(--font-ja);font-size:16px;font-weight:500;letter-spacing:.08em;cursor:pointer;text-decoration:none;transition:transform .15s var(--ease),background .15s ease,box-shadow .15s ease}
.ol-lp-scope .btn-primary{background:var(--deep);color:#fff;box-shadow:0 4px 0 0 var(--darkest)}
.ol-lp-scope .btn-primary:hover{background:var(--deeper);transform:translateY(2px);box-shadow:0 2px 0 0 var(--darkest)}
.ol-lp-scope .btn-secondary{background:#fff;color:var(--deep);border:1.5px solid var(--deep)}
.ol-lp-scope .btn-secondary:hover{background:var(--tint)}
.ol-lp-scope .btn-ghost{background:rgba(255,255,255,.92);color:var(--deep);border:1.5px solid rgba(255,255,255,.7)}
.ol-lp-scope .btn:focus-visible{outline:3px solid var(--brand);outline-offset:3px}
.ol-lp-scope .btn.sm{height:44px;min-width:auto;padding:0 22px;font-size:14px}
.ol-lp-scope .btn.md{height:52px;min-width:220px}
.ol-lp-scope .btnrow{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.ol-lp-scope .btnrow.center{justify-content:center}
@media(max-width:767px){ .ol-lp-scope .btn{width:100%;min-width:0} .ol-lp-scope .btn.sm{width:auto} }

.ol-lp-scope .link{color:var(--deep);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}

/* ---- section ---- */
.ol-lp-scope .sec{padding:var(--sec-py) 0}
.ol-lp-scope .sec.white{background:var(--surface)}
.ol-lp-scope .sec.pale{background:var(--brand-pale)}
.ol-lp-scope .sec-head{text-align:center;margin-bottom:56px}
.ol-lp-scope .sec-head.left{text-align:left}
.ol-lp-scope .sec-en{font-family:var(--font-en);font-size:clamp(28px,4.5vw,42px);font-weight:500;letter-spacing:.12em;line-height:1;color:var(--decor);text-transform:uppercase}
.ol-lp-scope .sec-ja{font-size:clamp(14px,1.4vw,16px);font-weight:700;letter-spacing:.3em;color:var(--brand);margin-top:14px}
.ol-lp-scope .sec-lead{max-width:74ch;margin:28px auto 0;font-size:clamp(16px,1.6vw,18px);line-height:1.9;letter-spacing:.02em}
.ol-lp-scope .sec-head.left .sec-lead{margin-inline:0}

/* ---- hero ---- */
.ol-lp-scope .hero{position:relative;min-height:min(78vh,660px);display:flex;align-items:center;overflow:hidden;background:var(--ink)}
.ol-lp-scope .hero>img,.ol-lp-scope .hero>picture{position:absolute;inset:0;width:100%;height:100%}
.ol-lp-scope .hero>img,.ol-lp-scope .hero>picture img{width:100%;height:100%;object-fit:cover;object-position:50% 38%}
@media(max-width:767px){ .ol-lp-scope .hero>img,.ol-lp-scope .hero>picture img{object-position:50% 42%} }
/* 写真が明るいと白文字が読みにくくなるため、実測して濃度を上げている
   （本文の最悪コントラスト 2.94:1 → 4.7:1 以上）。写真を差し替えたら再確認すること。 */
.ol-lp-scope .hero .veil{position:absolute;inset:0;background:linear-gradient(100deg,rgba(15,38,41,.88) 0%,rgba(15,38,41,.72) 50%,rgba(15,38,41,.42) 100%)}
/* スマホは横幅がないぶん文字が写真の明るい部分にかかるので、縦方向にも少し落とす */
@media(max-width:767px){
  .ol-lp-scope .hero .veil{background:linear-gradient(180deg,rgba(15,38,41,.86) 0%,rgba(15,38,41,.74) 55%,rgba(15,38,41,.62) 100%)}
}
.ol-lp-scope .hero .inner{position:relative;padding:88px 0}
.ol-lp-scope .hero-en{font-family:var(--font-en);font-size:clamp(13px,1.6vw,17px);font-weight:500;letter-spacing:.22em;color:rgba(255,255,255,.82);margin-bottom:26px}
.ol-lp-scope .hero h1{font-size:clamp(28px,4.6vw,52px);font-weight:500;line-height:1.45;letter-spacing:.05em;color:#fff}
.ol-lp-scope .hero h1 em{font-style:normal;color:#9FDCE2}
.ol-lp-scope .hero p.sub{margin-top:24px;max-width:56ch;font-size:clamp(15px,1.6vw,17px);line-height:1.9;color:rgba(255,255,255,.94)}
.ol-lp-scope .hero .btnrow{margin-top:40px}
.ol-lp-scope .hero-badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.ol-lp-scope .hero-badges span{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.4);color:#fff;font-size:12px;letter-spacing:.1em;padding:5px 14px;border-radius:var(--r-pill)}
@media(max-width:767px){ .ol-lp-scope .hero{min-height:0} .ol-lp-scope .hero .inner{padding:56px 0 64px} }
/* 狭い画面では見出しの最終行に2文字だけ残りやすいので、少し詰める */
@media(max-width:400px){ .ol-lp-scope .hero h1{font-size:25px;letter-spacing:.03em} }

/* ---- stats ---- */
/* 列数はブラウザ任せ（auto-fit）にすると項目数と割り切れず最終行に空きが出るため、
   項目数ごとに列数を明示する。n2〜n6 は中の .stat の個数を表す。 */
.ol-lp-scope .stats{display:grid;grid-template-columns:repeat(2,1fr);background:var(--surface);border-radius:var(--r-md);box-shadow:var(--shadow);overflow:hidden}
.ol-lp-scope .stats.n2{grid-template-columns:repeat(2,1fr)}
.ol-lp-scope .stats.n3{grid-template-columns:repeat(3,1fr)}
.ol-lp-scope .stats.n4{grid-template-columns:repeat(4,1fr)}
.ol-lp-scope .stats.n6{grid-template-columns:repeat(6,1fr)}
@media(max-width:1023px){ .ol-lp-scope .stats.n6{grid-template-columns:repeat(3,1fr)} }
@media(max-width:899px){ .ol-lp-scope .stats.n4{grid-template-columns:repeat(2,1fr)} }
@media(max-width:599px){
  .ol-lp-scope .stats.n3{grid-template-columns:1fr}
  .ol-lp-scope .stats.n6{grid-template-columns:repeat(2,1fr)}
}
.ol-lp-scope .stat{padding:36px 20px;text-align:center;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.ol-lp-scope .stat .num{font-family:var(--font-en);font-size:clamp(38px,5.5vw,58px);font-weight:600;color:var(--deep);line-height:1}
.ol-lp-scope .stat .unit{font-family:var(--font-ja);font-size:18px;color:var(--ink);margin-left:3px}
.ol-lp-scope .stat .lbl{font-size:13px;color:var(--muted);letter-spacing:.08em;margin-top:14px;line-height:1.6}
@media(max-width:599px){ .ol-lp-scope .stat{padding:28px 10px} .ol-lp-scope .stat .lbl{font-size:12px;letter-spacing:.02em} }
.ol-lp-scope .note{font-size:12px;color:var(--muted);margin-top:14px;line-height:1.7}

/* ---- cards ---- */
.ol-lp-scope .grid{display:grid;gap:40px}
.ol-lp-scope .g2{grid-template-columns:repeat(2,1fr)}
@media(max-width:860px){ .ol-lp-scope .g2{grid-template-columns:1fr} }
.ol-lp-scope .g3{grid-template-columns:repeat(3,1fr)}
@media(max-width:899px){ .ol-lp-scope .g3{grid-template-columns:1fr} }
.ol-lp-scope .g4{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
@media(max-width:767px){ .ol-lp-scope .grid{gap:24px} }

.ol-lp-scope .card{background:var(--surface);border-radius:var(--r-md);box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column}
.ol-lp-scope .card .ph{aspect-ratio:16/10;background:#DCE7E8;overflow:hidden}
.ol-lp-scope .card .ph img,.ol-lp-scope .card .ph picture{width:100%;height:100%;display:block}
.ol-lp-scope .card .ph img{object-fit:cover}
.ol-lp-scope .card .bd{padding:30px;flex:1}
.ol-lp-scope .card .lbl{font-family:var(--font-en);font-size:12px;font-weight:500;letter-spacing:.4em;color:var(--brand);text-transform:uppercase}
.ol-lp-scope .card h3{font-size:19px;font-weight:700;margin-top:12px;line-height:1.65}
.ol-lp-scope .card .rule{width:40px;height:1px;background:var(--decor);margin:20px 0}
.ol-lp-scope .card p{font-size:15px;color:var(--ink)}

/* ---- steps ---- */
.ol-lp-scope .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:46px}
@media(max-width:1099px){ .ol-lp-scope .steps{grid-template-columns:repeat(2,1fr);gap:44px 24px} }
@media(max-width:599px){ .ol-lp-scope .steps{grid-template-columns:1fr} }
.ol-lp-scope .step{position:relative;background:var(--surface);border-radius:var(--r-md);box-shadow:var(--shadow);padding:46px 24px 26px}
.ol-lp-scope .step .bdg{position:absolute;top:-22px;left:20px;width:68px;height:68px;border-radius:50%;background:#fff;border:1.5px solid var(--brand-light);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.1}
.ol-lp-scope .step .bdg span{font-family:var(--font-en);font-size:10px;letter-spacing:.2em;color:var(--brand)}
.ol-lp-scope .step .bdg strong{font-family:var(--font-en);font-size:23px;font-weight:500;color:var(--ink)}
.ol-lp-scope .step h4{font-size:17px;font-weight:700;margin-bottom:10px}
.ol-lp-scope .step p{font-size:14px}

/* ---- flow（開業までの流れ）----
   8項目を2列に置くと視線がジグザグして順番が読み取りにくかったため、
   1本の縦線でつないだ縦並びに変更。矢印を8個散らすより静かで、
   ONE LUKE の余白の多いトーンにも合う。 */
.ol-lp-scope .flow{max-width:780px;margin:48px auto 0;background:var(--surface);
      border-radius:var(--r-md);box-shadow:var(--shadow);padding:48px 44px}
.ol-lp-scope .flow-item{position:relative;padding:0 0 34px 78px}
.ol-lp-scope .flow-item:last-child{padding-bottom:0}
/* 番号どうしをつなぐ縦線。最後の項目には引かない。 */
.ol-lp-scope .flow-item::before{content:"";position:absolute;left:25px;top:58px;bottom:-2px;
                   width:2px;background:var(--brand-pale)}
.ol-lp-scope .flow-item:last-child::before{display:none}
.ol-lp-scope .flow-no{position:absolute;left:0;top:0;width:52px;height:52px;border-radius:50%;
         background:var(--tint);border:1.5px solid var(--brand-light);
         display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.05}
.ol-lp-scope .flow-no small{font-family:var(--font-en);font-size:8px;letter-spacing:.16em;color:var(--brand)}
.ol-lp-scope .flow-no b{font-family:var(--font-en);font-size:18px;font-weight:600;color:var(--deep)}
.ol-lp-scope .flow-item h4{font-size:18px;font-weight:700;margin:11px 0 8px}
.ol-lp-scope .flow-item p{font-size:15px;color:var(--ink)}
.ol-lp-scope .flow-item .when{display:inline-block;margin-left:10px;font-size:11px;letter-spacing:.06em;
                 background:var(--brand-pale);color:var(--deep);padding:2px 10px;
                 border-radius:var(--r-pill);vertical-align:2px;font-weight:500}
@media(max-width:767px){
  .ol-lp-scope .flow{padding:32px 22px;margin-top:36px}
  .ol-lp-scope .flow-item{padding:0 0 30px 60px}
  .ol-lp-scope .flow-no{width:44px;height:44px}
  .ol-lp-scope .flow-no b{font-size:16px}
  .ol-lp-scope .flow-item::before{left:21px;top:50px}
  .ol-lp-scope .flow-item h4{font-size:17px;margin-top:8px}
}

/* ---- cost（初期費用）----
   .cost-total は現在未使用。資料どおり2表構成にするため合算額の表示を外した。
   合算を出す場合に備えてスタイルは残してある。 */
.ol-lp-scope .cost-note{font-size:13px;color:var(--muted);margin:10px 0 34px;line-height:1.8}
.ol-lp-scope .cost-total{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px;
            background:var(--brand-pale);border-radius:var(--r-md);padding:24px 28px;margin-top:28px}
.ol-lp-scope .cost-total .lb{font-size:16px;font-weight:700;color:var(--deep)}
.ol-lp-scope .cost-total .vl{font-family:var(--font-en);font-size:clamp(26px,4vw,34px);font-weight:600;color:var(--deep)}
.ol-lp-scope .cost-total .vl em{font-family:var(--font-ja);font-style:normal;font-size:16px;font-weight:500;color:var(--ink);margin-left:4px}
.ol-lp-scope .tbl td.amt{text-align:right;font-family:var(--font-en);font-size:18px;white-space:nowrap}
.ol-lp-scope .tbl td.amt em{font-family:var(--font-ja);font-style:normal;font-size:14px;color:var(--muted);margin-left:3px}
@media(max-width:767px){ .ol-lp-scope .tbl td.amt{text-align:left} }

/* ---- growth（出店の推移）---- */
.ol-lp-scope .gm{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:14px;margin-top:44px}
.ol-lp-scope .gm-m{background:var(--surface);border-radius:var(--r-md);padding:20px 14px;text-align:center;box-shadow:var(--shadow)}
.ol-lp-scope .gm-m .mo{font-size:12px;color:var(--muted);letter-spacing:.1em}
.ol-lp-scope .gm-m .ct{font-family:var(--font-en);font-size:30px;font-weight:600;color:var(--deep);line-height:1;margin-top:8px}
.ol-lp-scope .gm-m .ct em{font-family:var(--font-ja);font-style:normal;font-size:12px;color:var(--ink);margin-left:2px}
.ol-lp-scope .gm-m.zero .ct{color:var(--decor)}

.ol-lp-scope .shops{display:flex;flex-wrap:wrap;gap:8px;margin-top:36px}
.ol-lp-scope .shops span{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);
            padding:7px 15px;font-size:13px;color:var(--ink);white-space:nowrap}
.ol-lp-scope .shops span b{font-family:var(--font-en);font-size:11px;color:var(--brand);font-weight:600;margin-right:7px}

/* ---- fit（向いている・向いていない）---- */
.ol-lp-scope .fit{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:44px}
@media(max-width:860px){ .ol-lp-scope .fit{grid-template-columns:1fr;gap:20px} }
.ol-lp-scope .fit-col{background:var(--surface);border-radius:var(--r-md);box-shadow:var(--shadow);padding:34px 32px}
.ol-lp-scope .fit-col h3{font-size:18px;font-weight:700;margin-bottom:22px;display:flex;align-items:center;gap:10px}
.ol-lp-scope .fit-col h3::before{content:"";width:26px;height:26px;border-radius:50%;flex:none;
  background:var(--brand-pale) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2324737B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/15px no-repeat}
.ol-lp-scope .fit-col.no h3::before{background:#F3F3F3 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3C/svg%3E") center/13px no-repeat}
.ol-lp-scope .fit-col ul{list-style:none}
.ol-lp-scope .fit-col li{position:relative;padding-left:20px;margin-bottom:16px;font-size:15px;line-height:1.85}
.ol-lp-scope .fit-col li:last-child{margin-bottom:0}
.ol-lp-scope .fit-col li::before{content:"";position:absolute;left:0;top:12px;width:6px;height:6px;border-radius:50%;background:var(--brand-light)}
.ol-lp-scope .fit-col.no li::before{background:var(--decor)}
.ol-lp-scope .fit-col li strong{display:block;font-weight:700;margin-bottom:2px}
.ol-lp-scope .fit-col.no{background:#FAFAFA}

/* ---- table ---- */
.ol-lp-scope .tbl{width:100%;border-collapse:collapse;background:var(--surface);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow)}
.ol-lp-scope .tbl th{width:230px;padding:20px 24px;text-align:left;vertical-align:top;font-size:15px;font-weight:500;color:var(--deep);background:var(--tint);border-bottom:1px solid var(--line)}
.ol-lp-scope .tbl td{padding:20px 24px;font-size:16px;border-bottom:1px solid var(--line);vertical-align:top}
.ol-lp-scope .tbl tr:last-child th,.ol-lp-scope .tbl tr:last-child td{border-bottom:0}
.ol-lp-scope .tbl td .sm{font-size:13px;color:var(--muted);display:block;margin-top:6px}
@media(max-width:767px){
  .ol-lp-scope .tbl th{width:auto;display:block;border-bottom:0;padding:14px 18px 8px}
  .ol-lp-scope .tbl td{display:block;padding:0 18px 18px}
}

/* ---- form: 送信結果・ハニーポット ---- */
/* ハニーポットは人間に見せない。display:none はbotに気づかれやすいので画面外に逃がす。 */
.ol-lp-scope .ol-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ol-lp-scope .ol-form-note{margin:0 0 14px;font-size:14px;line-height:1.7;min-height:0}
.ol-lp-scope .ol-form-note.is-error{color:#C94A4A;background:#FFF5F5;border-left:3px solid #EB7070;
                       padding:12px 16px;border-radius:0 8px 8px 0}
.ol-lp-scope .ol-form-done{background:var(--surface);border-radius:var(--r-md);box-shadow:var(--shadow);
              padding:48px 36px;max-width:620px;margin-inline:auto;text-align:center}
.ol-lp-scope .ol-form-done .ttl{font-size:22px;font-weight:700;color:var(--deep);margin-bottom:16px}
.ol-lp-scope .ol-form-done .ttl::before{content:"";display:block;width:56px;height:56px;margin:0 auto 20px;
  border-radius:50%;background:var(--brand-pale) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2324737B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/26px no-repeat}
.ol-lp-scope .ol-form-done p{font-size:15px;line-height:1.9}
.ol-lp-scope .ol-form-done .sm{font-size:13px;color:var(--muted);margin-top:16px}
.ol-lp-scope button[disabled]{opacity:.6;cursor:default}

/* ---- faq ---- */
.ol-lp-scope .faq{background:var(--surface);border-radius:var(--r-md);box-shadow:var(--shadow);overflow:hidden}
.ol-lp-scope .faq details{border-bottom:1px solid var(--line)}
.ol-lp-scope .faq details:last-child{border-bottom:0}
.ol-lp-scope .faq summary{list-style:none;cursor:pointer;padding:22px 26px;font-size:16px;font-weight:500;display:flex;align-items:flex-start;gap:16px}
.ol-lp-scope .faq summary::-webkit-details-marker{display:none}
.ol-lp-scope .faq summary::before{content:"＋";color:var(--brand);font-size:20px;line-height:1.5;flex:none}
.ol-lp-scope .faq details[open] summary::before{content:"−"}
.ol-lp-scope .faq .ans{padding:0 26px 24px 62px;font-size:15px;color:var(--ink)}

/* ---- tags ---- */
.ol-lp-scope .tag{display:inline-block;padding:5px 13px;background:var(--brand-pale);color:var(--deep);border-radius:6px;font-size:12px;font-weight:500;letter-spacing:.08em;margin:0 8px 8px 0}

/* ---- form ---- */
.ol-lp-scope .form{background:var(--surface);border-radius:var(--r-md);box-shadow:var(--shadow);padding:36px;max-width:620px;margin-inline:auto}
.ol-lp-scope .fld{margin-bottom:22px}
.ol-lp-scope .fld label{display:block;font-size:14px;font-weight:500;margin-bottom:8px}
.ol-lp-scope .req{display:inline-block;background:#EB7070;color:#fff;font-size:11px;padding:1px 9px;border-radius:var(--r-pill);margin-left:8px;vertical-align:1px;letter-spacing:.06em}
.ol-lp-scope .inp{width:100%;min-height:52px;padding:13px 16px;background:#fff;border:1px solid var(--line-strong);border-radius:var(--r-md);font-size:16px;font-family:var(--font-ja);color:var(--ink);line-height:1.6}
.ol-lp-scope .inp:focus{border-color:var(--deep);outline:2px solid rgba(36,115,123,.25)}
.ol-lp-scope .inp::placeholder{color:#A0A0A0}
.ol-lp-scope select.inp{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--deep) 50%),linear-gradient(135deg,var(--deep) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat}
.ol-lp-scope .hint{font-size:13px;color:var(--muted);margin-top:6px}

/* ---- misc ---- */
.ol-lp-scope .split{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.ol-lp-scope .split img{border-radius:var(--r-md)}
@media(max-width:900px){ .ol-lp-scope .split{grid-template-columns:1fr;gap:32px} }

.ol-lp-scope .bar{display:flex;align-items:flex-end;gap:2.2%;height:220px;margin-top:8px}
.ol-lp-scope .bar .b{flex:1;background:var(--deep);border-radius:4px 4px 0 0;position:relative;min-height:3px}
.ol-lp-scope .bar .b.hl{background:var(--brand)}
.ol-lp-scope .bar .b i{position:absolute;bottom:-26px;left:50%;transform:translateX(-50%);font-size:11px;color:var(--muted);font-style:normal;white-space:nowrap}
/* 累計グラフ：棒の上に累計値を出す */
.ol-lp-scope .bar.cum{height:250px;gap:1.6%}
.ol-lp-scope .bar.cum .b{border-radius:5px 5px 0 0}
.ol-lp-scope .bar.cum .b em{position:absolute;top:-26px;left:50%;transform:translateX(-50%);
               font-family:var(--font-en);font-size:15px;font-weight:600;color:var(--deep);font-style:normal}
.ol-lp-scope .bar.cum .b.hl em{font-size:19px}
@media(max-width:767px){
  .ol-lp-scope .bar.cum{height:180px}
  .ol-lp-scope .bar.cum .b em{font-size:11px;top:-20px}
  .ol-lp-scope .bar.cum .b.hl em{font-size:14px}
  .ol-lp-scope .bar .b i{font-size:9px}
}
.ol-lp-scope .barwrap{background:var(--surface);border-radius:var(--r-md);box-shadow:var(--shadow);padding:36px 32px 54px}
@media(max-width:767px){ .ol-lp-scope .bar{height:150px} .ol-lp-scope .bar .b i{font-size:8px} .ol-lp-scope .barwrap{padding:26px 18px 48px} }

.ol-lp-scope .donuts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:32px}
.ol-lp-scope .donut{text-align:center}
.ol-lp-scope .donut .ring{width:140px;height:140px;margin:0 auto 16px;border-radius:50%;display:grid;place-items:center;position:relative}
.ol-lp-scope .donut .ring::after{content:"";position:absolute;inset:18px;background:var(--bg);border-radius:50%}
.ol-lp-scope .donut .ring b{position:relative;z-index:1;font-family:var(--font-en);font-size:30px;font-weight:600;color:var(--deep)}
.ol-lp-scope .donut .cap{font-size:14px;font-weight:700}
.ol-lp-scope .donut .sub{font-size:12px;color:var(--muted);margin-top:4px}
.ol-lp-scope .sec.white .donut .ring::after{background:var(--surface)}
.ol-lp-scope .sec.pale .donut .ring::after{background:var(--brand-pale)}

.ol-lp-scope .cta-band{text-align:center}
.ol-lp-scope .cta-band h2{font-size:clamp(22px,3vw,32px);font-weight:500;line-height:1.6;letter-spacing:.04em}
.ol-lp-scope .cta-band p{margin-top:20px;font-size:16px}

.ol-lp-scope .fixed-cta{position:fixed;left:0;right:0;bottom:0;z-index:200;background:rgba(255,255,255,.97);border-top:1px solid var(--line);padding:10px 16px calc(10px + env(safe-area-inset-bottom));display:none;gap:10px}
.ol-lp-scope .fixed-cta .btn{height:48px;font-size:15px;flex:1;padding:0 12px;letter-spacing:.02em;white-space:nowrap}
.ol-lp-scope .fixed-cta .btn-primary{flex:1.6}
@media(max-width:767px){ .ol-lp-scope .fixed-cta{display:flex} .ol-lp-scope{padding-bottom:78px} }
@media(max-width:389px){ .ol-lp-scope .fixed-cta .btn{font-size:13px;padding:0 8px} }

/* ---- 掲載メディア ---- */
.ol-lp-scope .media{background:var(--surface);border-radius:var(--r-md);box-shadow:var(--shadow);padding:40px 44px;margin-top:44px}
.ol-lp-scope .media .badge{display:inline-block;line-height:0;border:1px solid var(--line);border-radius:6px;overflow:hidden;transition:box-shadow .15s ease,transform .15s var(--ease)}
.ol-lp-scope .media .badge:hover{box-shadow:0 4px 14px rgba(51,51,51,.10);transform:translateY(-2px)}
.ol-lp-scope .media .badge img{width:220px;height:auto}
.ol-lp-scope .media h3{font-size:22px;font-weight:700;line-height:1.65;margin:26px 0 20px}
.ol-lp-scope .media blockquote{border-left:3px solid var(--brand-pale);padding-left:18px;font-size:16px;line-height:1.9;color:var(--ink)}
.ol-lp-scope .media .cite{margin-top:20px;font-size:14px;color:var(--muted);line-height:1.85}
.ol-lp-scope .media .btn{margin-top:28px}
@media(max-width:767px){
  .ol-lp-scope .media{padding:30px 24px}
  .ol-lp-scope .media h3{font-size:19px}
  .ol-lp-scope .media .btn{width:100%}
}

/* ---- 他のフランチャイズとの比較表 ---- */
.ol-lp-scope .cmp{width:100%;border-collapse:collapse;background:var(--surface);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow);margin-top:36px}
.ol-lp-scope .cmp th,.ol-lp-scope .cmp td{padding:18px 20px;text-align:left;vertical-align:top;font-size:15px;line-height:1.8;border-bottom:1px solid var(--line)}
.ol-lp-scope .cmp thead th{background:var(--tint);font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--deep)}
.ol-lp-scope .cmp thead th.ol{background:var(--brand-pale)}
.ol-lp-scope .cmp tbody th{width:170px;background:var(--tint);font-weight:700;color:var(--deep)}
.ol-lp-scope .cmp td.ol{background:rgba(131,204,210,.10);font-weight:500}
.ol-lp-scope .cmp tr:last-child th,.ol-lp-scope .cmp tr:last-child td{border-bottom:0}
@media(max-width:767px){
  .ol-lp-scope .cmp,.ol-lp-scope .cmp tbody,.ol-lp-scope .cmp tbody tr,.ol-lp-scope .cmp tbody th,.ol-lp-scope .cmp tbody td{display:block;width:auto}
  .ol-lp-scope .cmp thead{display:none}
  .ol-lp-scope .cmp tbody tr{border-bottom:1px solid var(--line)}
  .ol-lp-scope .cmp tbody tr:last-child{border-bottom:0}
  .ol-lp-scope .cmp tbody th{border-bottom:0;padding:16px 18px 10px;font-size:15px}
  .ol-lp-scope .cmp tbody td{border-bottom:0;padding:0 18px 10px;font-size:14px}
  .ol-lp-scope .cmp tbody td:last-child{padding-bottom:18px}
  .ol-lp-scope .cmp tbody td::before{content:attr(data-l);display:block;font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--muted);margin-bottom:3px}
  .ol-lp-scope .cmp tbody td.ol::before{color:var(--deep)}
}

.ol-lp-scope footer{background:var(--ink);color:rgba(255,255,255,.78);padding:56px 0 40px;font-size:13px;line-height:1.9}
.ol-lp-scope footer .ftop{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:flex-start;padding-bottom:28px;border-bottom:1px solid rgba(255,255,255,.16)}
.ol-lp-scope footer .fname{color:#fff;font-size:15px;font-weight:700;letter-spacing:.14em}
.ol-lp-scope footer .fbtm{padding-top:22px;font-size:12px;color:rgba(255,255,255,.55)}
.ol-lp-scope footer a{color:rgba(255,255,255,.86)}
/* フッターの各リンクは1行ずつ独立しているので、タップ領域を44px確保する */
.ol-lp-scope footer .ftop a{display:inline-flex;align-items:center;min-height:44px}

/* フェードインは JS が動いているときだけ有効にする。
   JS無効・IntersectionObserver未発火でもコンテンツが消えないようにするための保険。 */
.js .ol-lp-scope .reveal{opacity:0;transform:translateY(22px)}
@media(prefers-reduced-motion:no-preference){
  .js .ol-lp-scope .reveal{transition:opacity .6s ease,transform .6s var(--ease)}
}
.js .ol-lp-scope .reveal.on{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){ .js .ol-lp-scope .reveal{opacity:1;transform:none;transition:none} .ol-lp-scope{scroll-behavior:auto} }
