/* ==========================================================================
   秋キャンペーンLP /lp/autumn-2026.html 専用（PSC-2610-W01）
   モチーフ＝「キャンペーンテープ」。斜めの帯を紙面全体の言語にする：
   ヒーローの地、セクションの境界、見出しの下線、ステッカー、工程の札、CTAの地。
   配色＝ロゴ実測5色（BLUE #5DBADA 支配／GREEN #A0CA34／GOLD #E8D843／ROSE #C279A8／SUMI #231815）
   ＋アクセント PURPLE #8E70C2。色面の上の文字は墨、墨面の上は白。
   本LPだけが読み込む（本文冒頭の <link>）。
   ========================================================================== */
.lpa{
  --blue:#5DBADA; --green:#A0CA34; --gold:#E8D843; --rose:#C279A8; --sumi:#231815; --purple:#8E70C2;
  --paper:#FFFDF7; --ink:#231815; --ink2:#4a4a4a; --line:#E6E1D6;
  --tape:repeating-linear-gradient(-18deg,var(--gold) 0 28px,var(--green) 28px 56px,var(--rose) 56px 84px,var(--blue) 84px 112px);
  font-family:'Noto Sans JP',-apple-system,'Hiragino Kaku Gothic ProN','Yu Gothic',Meiryo,sans-serif;
  color:var(--ink); background:var(--paper); overflow-x:hidden; line-height:1.75;
}
.lpa *,.lpa *::before,.lpa *::after{box-sizing:border-box}
.lpa img{max-width:100%;display:block}
.lpa .cv{max-width:1180px;margin-inline:auto;padding-inline:20px}
/* 本LPだけが読むCSSなので全体セレクタでよい：フッター共通の無料トライアル帯はCTAと重複するため非表示 */
.footer-trial-cta{display:none!important}
.lp-page .lpa{padding-top:0}

/* ---------- 共通部品 ---------- */
.lpa .sticker{display:inline-block;background:var(--gold);color:var(--ink);font-weight:900;padding:.35em 1em;border-radius:999px;transform:rotate(-4deg);box-shadow:0 6px 0 rgba(35,24,21,.12);letter-spacing:.04em}
.lpa .sticker.rose{background:var(--rose)}
.lpa .sticker.green{background:var(--green)}
.lpa .sticker.blue{background:var(--blue)}
.lpa .tape-line{height:14px;background:var(--tape);transform:skewY(-2deg);margin:0 -2vw}
.lpa h2.hd{font-size:clamp(28px,4.2vw,44px);font-weight:900;line-height:1.25;letter-spacing:.01em;margin:0 0 .35em;position:relative;display:inline-block}
.lpa h2.hd::after{content:"";position:absolute;left:0;right:0;bottom:.08em;height:.42em;background:var(--gold);z-index:-1;transform:skewX(-12deg)}
.lpa .lead{font-size:clamp(15px,1.3vw,18px);color:var(--ink2);margin:0 0 1.5em}
.lpa .sec{padding:clamp(56px,8vw,110px) 0;position:relative}
.lpa .sec.alt{background:#fff}
.lpa .btn-camp{display:inline-flex;align-items:center;gap:.6em;background:var(--sumi);color:#fff;font-weight:900;font-size:clamp(17px,1.5vw,22px);padding:.9em 2.2em;border-radius:999px;text-decoration:none;box-shadow:0 10px 0 var(--gold);transition:transform .15s,box-shadow .15s}
.lpa .btn-camp:hover{transform:translateY(3px);box-shadow:0 7px 0 var(--gold);color:#fff}
.lpa .btn-camp .material-symbols-outlined{font-size:1.3em}
.lpa .note{font-size:13px;color:var(--ink2)}

/* ---------- ヒーロー ---------- */
.lpa .hero{background:var(--blue);position:relative;overflow:hidden;padding:clamp(40px,6vw,80px) 0 0}
.lp-page .lpa .hero{padding-top:calc(133px + 32px)}
@media (max-width:991px){.lp-page .lpa .hero{padding-top:40px}}
.lpa .hero::before{content:"";position:absolute;inset:auto -10% -40px -10%;height:46%;background:var(--tape);transform:rotate(-4deg);opacity:.95}
.lpa .hero::after{content:"";position:absolute;right:-6%;top:-10%;width:42vw;height:42vw;max-width:560px;max-height:560px;border-radius:50%;background:rgba(255,255,255,.18)}
.lpa .hero .cv{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:32px;align-items:center;padding-bottom:clamp(90px,12vw,160px)}
.lpa .hero-badge{display:inline-flex;align-items:center;gap:.6em;background:var(--sumi);color:#fff;font-weight:900;border-radius:999px;padding:.45em 1.2em .45em .6em;font-size:clamp(13px,1.1vw,16px);letter-spacing:.06em}
.lpa .hero-badge .dot{width:.9em;height:.9em;border-radius:50%;background:var(--gold);box-shadow:0 0 0 .3em rgba(232,216,67,.35)}
.lpa .hero-dates{display:flex;align-items:baseline;gap:.3em;font-weight:900;line-height:1;margin:.6em 0 .2em;color:var(--ink)}
.lpa .hero-dates .d{font-size:clamp(44px,7vw,96px);letter-spacing:-.02em}
.lpa .hero-dates .w{font-size:clamp(14px,1.4vw,20px);align-self:flex-end;margin-bottom:.4em;font-weight:700}
.lpa .hero-dates .arrow{font-size:clamp(28px,4vw,56px);margin:0 .15em}
.lpa .hero-h1{font-size:clamp(28px,3.6vw,50px);font-weight:900;line-height:1.3;margin:.2em 0 .5em;letter-spacing:.01em}
.lpa .hero-h1 .ul{background:linear-gradient(transparent 62%,var(--gold) 62%)}
.lpa .hero-lead{font-size:clamp(15px,1.25vw,18px);font-weight:500;margin:0 0 1.4em;max-width:34em}
.lpa .hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:18px 22px}
.lpa .hero-cta .note{color:var(--ink)}
.lpa .kv{position:relative}
.lpa .kv img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:28px;border:8px solid #fff;box-shadow:0 24px 60px rgba(35,24,21,.22);transform:rotate(2deg)}
.lpa .kv .free{position:absolute;left:-18px;top:-26px;width:clamp(110px,13vw,170px);aspect-ratio:1;border-radius:50%;background:var(--gold);display:grid;place-content:center;text-align:center;font-weight:900;line-height:1.05;transform:rotate(-10deg);box-shadow:0 10px 0 rgba(35,24,21,.15)}
.lpa .kv .free b{display:block;font-size:clamp(34px,4.2vw,56px);letter-spacing:-.02em}
.lpa .kv .free small{display:block;font-size:clamp(11px,1vw,14px);font-weight:700}
.lpa .kv .days{position:absolute;right:-10px;bottom:-18px;background:var(--rose);border-radius:18px;padding:.6em 1.1em;font-weight:900;line-height:1.1;transform:rotate(4deg);box-shadow:0 8px 0 rgba(35,24,21,.15)}
.lpa .kv .days b{font-size:clamp(28px,3.2vw,44px)}
.lpa .kv .days small{display:block;font-size:12px;font-weight:700}
@media (max-width:860px){
  .lpa .hero .cv{grid-template-columns:1fr;gap:40px}
  .lpa .kv{margin-top:8px;padding:26px 10px 20px 18px}
  .lpa .kv img{transform:rotate(1deg)}
}

/* ---------- 3つの数字 ---------- */
.lpa .nums{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:-70px;position:relative;z-index:2}
.lpa .num{background:#fff;border-radius:22px;padding:26px 24px 22px;box-shadow:0 14px 40px rgba(35,24,21,.1);border-top:10px solid var(--blue);text-align:center}
.lpa .num:nth-child(2){border-top-color:var(--gold)}
.lpa .num:nth-child(3){border-top-color:var(--rose)}
.lpa .num .lab{display:inline-block;font-weight:900;font-size:14px;letter-spacing:.1em;color:var(--ink2)}
.lpa .num .big{font-size:clamp(34px,3.6vw,52px);font-weight:900;line-height:1.1;margin:.15em 0 .2em;letter-spacing:-.01em}
.lpa .num .big small{font-size:.5em;margin-left:.1em}
.lpa .num p{margin:0;font-size:14px;color:var(--ink2)}
@media (max-width:860px){.lpa .nums{grid-template-columns:1fr;margin-top:-40px}}

/* ---------- お届けする内容（2カラム＋写真） ---------- */
.lpa .scope{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:start}
.lpa .cardset{display:grid;gap:18px}
.lpa .card{background:#fff;border-radius:20px;padding:24px 26px;border:2px solid var(--line);position:relative}
.lpa .card::before{content:"";position:absolute;left:28px;top:-11px;width:84px;height:20px;background:var(--tape);transform:rotate(-3deg);border-radius:3px;opacity:.9}
.lpa .card h3{font-size:19px;font-weight:900;margin:.2em 0 .6em}
.lpa .card ul{margin:0;padding:0;list-style:none}
.lpa .card li{padding:.3em 0 .3em 1.7em;position:relative;font-size:15px}
.lpa .card li::before{content:"check";font-family:'Material Symbols Outlined';position:absolute;left:0;top:.35em;color:var(--green);font-size:1.15em;font-weight:700}
.lpa .card.me li::before{color:var(--rose)}
.lpa .photo{border-radius:24px;overflow:hidden;border:8px solid #fff;box-shadow:0 18px 44px rgba(35,24,21,.15);transform:rotate(-2deg)}
.lpa .photo img{aspect-ratio:4/3;object-fit:cover;width:100%}
.lpa .photo.r{transform:rotate(2deg)}
.lpa .cap{font-size:13px;color:var(--ink2);text-align:center;margin-top:14px}
@media (max-width:860px){.lpa .scope{grid-template-columns:1fr}}

/* ---------- 流れ（5枚の札） ---------- */
.lpa .steps{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;counter-reset:st}
.lpa .step{background:#fff;border-radius:18px;padding:52px 18px 20px;position:relative;border:2px solid var(--line);min-height:190px}
.lpa .step::before{counter-increment:st;content:counter(st);position:absolute;left:16px;top:-16px;width:44px;height:44px;border-radius:50%;background:var(--blue);display:grid;place-content:center;font-weight:900;font-size:20px;transform:rotate(-8deg);box-shadow:0 5px 0 rgba(35,24,21,.15)}
.lpa .step:nth-child(2)::before{background:var(--green)}.lpa .step:nth-child(3)::before{background:var(--gold)}.lpa .step:nth-child(4)::before{background:var(--rose)}.lpa .step:nth-child(5)::before{background:var(--purple)}
.lpa .step h4{font-size:16px;font-weight:900;margin:0 0 .4em}
.lpa .step p{margin:0;font-size:13.5px;color:var(--ink2)}
.lpa .step .hl{display:inline-block;background:var(--gold);padding:0 .3em;font-weight:900;color:var(--ink)}
@media (max-width:1000px){.lpa .steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.lpa .steps{grid-template-columns:1fr}}

/* ---------- ご用意いただくもの（4枚） ---------- */
.lpa .mats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.lpa .mat{background:#fff;border-radius:18px;padding:22px 20px;border-top:8px solid var(--blue);box-shadow:0 10px 30px rgba(35,24,21,.07)}
.lpa .mat:nth-child(2){border-top-color:var(--gold)}.lpa .mat:nth-child(3){border-top-color:var(--rose)}.lpa .mat:nth-child(4){border-top-color:var(--purple)}
.lpa .mat .material-symbols-outlined{font-size:40px;color:var(--ink);display:block;margin-bottom:6px}
.lpa .mat h4{font-size:17px;font-weight:900;margin:0 0 .4em}
.lpa .mat p{margin:0;font-size:13.5px;color:var(--ink2)}
@media (max-width:1000px){.lpa .mats{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.lpa .mats{grid-template-columns:1fr}}
.lpa .figs{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:40px}
.lpa .figs img{border-radius:14px;border:1px solid var(--line);background:#fff}
@media (max-width:760px){.lpa .figs{grid-template-columns:1fr}}

/* ---------- 条件（読む表） ---------- */
.lpa .terms{background:#fff;border-radius:22px;padding:10px 28px;border:2px solid var(--line)}
.lpa .terms dl{margin:0}
.lpa .terms .row{display:grid;grid-template-columns:220px 1fr;gap:18px;padding:16px 0;border-bottom:1px dashed var(--line)}
.lpa .terms .row:last-child{border-bottom:0}
.lpa .terms dt{font-weight:900;font-size:15px;margin:0}
.lpa .terms dd{margin:0;font-size:14.5px;color:var(--ink2)}
@media (max-width:700px){.lpa .terms .row{grid-template-columns:1fr;gap:4px}}

/* ---------- 最後のCTA（墨面） ---------- */
.lpa .cta{background:var(--sumi);color:#fff;position:relative;overflow:hidden;padding:clamp(60px,8vw,110px) 0}
.lpa .cta::before{content:"";position:absolute;inset:-30px -10% auto -10%;height:34px;background:var(--tape);transform:rotate(-2deg)}
.lpa .cta h2{font-size:clamp(26px,3.6vw,44px);font-weight:900;line-height:1.3;margin:0 0 .4em}
.lpa .cta p{color:#e6e1d6;margin:0 0 1.4em;max-width:40em}
.lpa .cta .btn-camp{background:var(--gold);color:var(--ink);box-shadow:0 10px 0 var(--rose)}
.lpa .cta .btn-camp:hover{color:var(--ink);box-shadow:0 7px 0 var(--rose)}
.lpa .cta .dates{display:inline-block;background:#fff;color:var(--ink);font-weight:900;border-radius:12px;padding:.4em 1em;margin-bottom:1.2em;transform:rotate(-2deg)}
.lpa .cta .tiny{font-size:12px;color:#bfb8ad;margin-top:2.5em}
.lpa .cta a{color:#fff}
.lpa .cta .tiny a{color:#bfb8ad}


/* ==========================================================================
   モチーフの別案（data-motif で切替。無指定＝テープ案）
   grad＝グラデーション／geo＝幾何学模様／soft＝やわらかい多色
   ========================================================================== */

/* ---- grad：ブランド色の斜めグラデーション ---- */
.lpa[data-motif="grad"]{--tape:linear-gradient(100deg,var(--blue) 0%,var(--green) 45%,var(--gold) 100%)}
.lpa[data-motif="grad"] .hero{background:linear-gradient(115deg,#5DBADA 0%,#7cc9c9 38%,#A0CA34 72%,#E8D843 100%)}
.lpa[data-motif="grad"] .hero::before{inset:auto -10% -30% -10%;height:70%;background:radial-gradient(60% 80% at 20% 100%,rgba(194,121,168,.55),transparent 70%),radial-gradient(50% 70% at 85% 90%,rgba(232,216,67,.7),transparent 70%);transform:none;opacity:1}
.lpa[data-motif="grad"] .hero::after{background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.55),rgba(255,255,255,0) 70%)}
.lpa[data-motif="grad"] .sticker{background:linear-gradient(90deg,var(--gold),var(--green));transform:rotate(-2deg);box-shadow:0 6px 18px rgba(35,24,21,.15)}
.lpa[data-motif="grad"] .sticker.blue{background:linear-gradient(90deg,var(--blue),#8fd3ea)}
.lpa[data-motif="grad"] .sticker.rose{background:linear-gradient(90deg,var(--rose),#e3b3d2)}
.lpa[data-motif="grad"] .sticker.green{background:linear-gradient(90deg,var(--green),#cfe38a)}
.lpa[data-motif="grad"] h2.hd::after{background:linear-gradient(90deg,var(--gold),var(--rose));transform:none;border-radius:4px;opacity:.85}
.lpa[data-motif="grad"] .card::before{background:linear-gradient(90deg,var(--blue),var(--green));border-radius:999px;transform:none}
.lpa[data-motif="grad"] .num{border-top:0;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,var(--blue),var(--green),var(--gold)) border-box;border:3px solid transparent}
.lpa[data-motif="grad"] .kv .free{background:linear-gradient(135deg,var(--gold),#f3e98a);transform:rotate(-6deg)}
.lpa[data-motif="grad"] .kv .days{background:linear-gradient(135deg,var(--rose),#e0a9cb);transform:rotate(2deg)}
.lpa[data-motif="grad"] .btn-camp{box-shadow:0 10px 24px rgba(35,24,21,.25)}
.lpa[data-motif="grad"] .cta{background:linear-gradient(115deg,#231815 0%,#2d3a44 60%,#1f5673 100%)}
.lpa[data-motif="grad"] .cta::before{background:linear-gradient(90deg,var(--blue),var(--green),var(--gold),var(--rose));transform:none;height:10px;inset:0 0 auto 0}
.lpa[data-motif="grad"] .cta .btn-camp{box-shadow:0 10px 24px rgba(0,0,0,.35)}

/* ---- geo：幾何学模様（丸・三角・半円のタイル） ---- */
.lpa[data-motif="geo"] .hero{background-color:var(--blue);
  background-image:
    radial-gradient(circle at 50% 50%,var(--gold) 0 18px,transparent 19px),
    linear-gradient(135deg,var(--rose) 50%,transparent 50%),
    radial-gradient(circle at 0% 100%,var(--green) 0 34px,transparent 35px),
    linear-gradient(45deg,transparent 50%,rgba(255,255,255,.35) 50%);
  background-size:140px 140px,140px 140px,140px 140px,140px 140px;
  background-position:0 0,70px 70px,70px 0,0 70px}
.lpa[data-motif="geo"] .hero::before{inset:0;height:100%;background:linear-gradient(90deg,rgba(93,186,218,.92) 0%,rgba(93,186,218,.85) 55%,rgba(93,186,218,.55) 100%);transform:none;opacity:1}
.lpa[data-motif="geo"] .hero::after{display:none}
.lpa[data-motif="geo"] .hero .cv{padding-bottom:clamp(70px,9vw,120px)}
.lpa[data-motif="geo"] .sticker{border-radius:0;transform:rotate(-3deg);clip-path:polygon(0 0,100% 0,96% 100%,4% 100%)}
.lpa[data-motif="geo"] h2.hd::after{background:repeating-linear-gradient(90deg,var(--gold) 0 14px,var(--green) 14px 28px,var(--rose) 28px 42px,var(--blue) 42px 56px);transform:none;height:.3em;bottom:0}
.lpa[data-motif="geo"] .card::before{width:22px;height:22px;border-radius:50%;background:var(--gold);transform:none;top:-11px;left:24px;box-shadow:30px 0 0 var(--green),60px 0 0 var(--rose)}
.lpa[data-motif="geo"] .num{border-top:0;position:relative;overflow:hidden}
.lpa[data-motif="geo"] .num::after{content:"";position:absolute;right:-24px;top:-24px;width:72px;height:72px;border-radius:50%;background:var(--blue)}
.lpa[data-motif="geo"] .num:nth-child(2)::after{background:var(--gold);border-radius:0;transform:rotate(45deg)}
.lpa[data-motif="geo"] .num:nth-child(3)::after{background:var(--rose);border-radius:50% 0 0 50%}
.lpa[data-motif="geo"] .kv img{border-radius:0;transform:none;border-width:10px}
.lpa[data-motif="geo"] .kv .free{border-radius:0;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);width:clamp(130px,15vw,190px);transform:none;box-shadow:none}
.lpa[data-motif="geo"] .kv .days{border-radius:0;transform:none}
.lpa[data-motif="geo"] .step{border-radius:0}
.lpa[data-motif="geo"] .step::before{border-radius:0;transform:rotate(0);clip-path:polygon(50% 0,100% 100%,0 100%);height:48px;place-content:end center;padding-bottom:2px}
.lpa[data-motif="geo"] .mat{border-radius:0}
.lpa[data-motif="geo"] .cta{background-color:var(--sumi);background-image:radial-gradient(circle at 50% 50%,rgba(255,255,255,.08) 0 18px,transparent 19px);background-size:140px 140px}
.lpa[data-motif="geo"] .cta::before{background:repeating-linear-gradient(90deg,var(--gold) 0 40px,var(--green) 40px 80px,var(--rose) 80px 120px,var(--blue) 120px 160px);transform:none;height:14px;inset:0 0 auto 0}

/* ---- soft：やわらかい多色（にじむ色面） ---- */
.lpa[data-motif="soft"]{background:#fff}
.lpa[data-motif="soft"] .hero{background:#f6fbfd}
.lpa[data-motif="soft"] .hero::before{inset:-20% -10% -20% -10%;height:auto;transform:none;opacity:1;filter:blur(70px);
  background:
    radial-gradient(38% 45% at 14% 28%,rgba(93,186,218,.75),transparent 70%),
    radial-gradient(34% 40% at 84% 22%,rgba(232,216,67,.7),transparent 70%),
    radial-gradient(40% 46% at 70% 88%,rgba(194,121,168,.6),transparent 70%),
    radial-gradient(36% 42% at 24% 92%,rgba(160,202,52,.6),transparent 70%)}
.lpa[data-motif="soft"] .hero::after{display:none}
.lpa[data-motif="soft"] .hero .cv{padding-bottom:clamp(70px,9vw,120px)}
.lpa[data-motif="soft"] .hero-badge{background:#fff;color:var(--ink);box-shadow:0 6px 20px rgba(35,24,21,.12)}
.lpa[data-motif="soft"] .hero-h1 .ul{background:linear-gradient(transparent 60%,rgba(232,216,67,.8) 60%)}
.lpa[data-motif="soft"] .sticker{transform:rotate(0);box-shadow:none;background:rgba(232,216,67,.55);border-radius:999px}
.lpa[data-motif="soft"] .sticker.blue{background:rgba(93,186,218,.5)}
.lpa[data-motif="soft"] .sticker.rose{background:rgba(194,121,168,.45)}
.lpa[data-motif="soft"] .sticker.green{background:rgba(160,202,52,.5)}
.lpa[data-motif="soft"] h2.hd::after{display:none}
.lpa[data-motif="soft"] .sec:not(.alt){background:linear-gradient(180deg,#fff,#f6fbfd)}
.lpa[data-motif="soft"] .card{border:0;box-shadow:0 14px 40px rgba(93,186,218,.14);border-radius:28px}
.lpa[data-motif="soft"] .card::before{display:none}
.lpa[data-motif="soft"] .num{border-top:0;border-radius:28px;box-shadow:0 14px 40px rgba(93,186,218,.16);background:linear-gradient(180deg,#fff,#f3fafc)}
.lpa[data-motif="soft"] .kv img{border-radius:40px;transform:none;border:0;box-shadow:0 30px 70px rgba(93,186,218,.3)}
.lpa[data-motif="soft"] .kv .free{background:rgba(232,216,67,.9);transform:rotate(0);box-shadow:0 14px 30px rgba(35,24,21,.12)}
.lpa[data-motif="soft"] .kv .days{background:rgba(194,121,168,.85);transform:rotate(0);box-shadow:0 14px 30px rgba(35,24,21,.12);color:var(--ink)}
.lpa[data-motif="soft"] .btn-camp{background:var(--ink);box-shadow:0 14px 30px rgba(35,24,21,.25)}
.lpa[data-motif="soft"] .btn-camp:hover{transform:translateY(2px)}
.lpa[data-motif="soft"] .step{border:0;border-radius:24px;box-shadow:0 10px 30px rgba(93,186,218,.12)}
.lpa[data-motif="soft"] .step::before{transform:none;box-shadow:none}
.lpa[data-motif="soft"] .mat{border-top:0;border-radius:24px;box-shadow:0 10px 30px rgba(93,186,218,.12)}
.lpa[data-motif="soft"] .mat::before{content:"";display:block;width:48px;height:6px;border-radius:999px;background:var(--blue);margin-bottom:14px}
.lpa[data-motif="soft"] .mat:nth-child(2)::before{background:var(--gold)}
.lpa[data-motif="soft"] .mat:nth-child(3)::before{background:var(--rose)}
.lpa[data-motif="soft"] .mat:nth-child(4)::before{background:var(--green)}
.lpa[data-motif="soft"] .terms{border:0;box-shadow:0 10px 30px rgba(93,186,218,.1);border-radius:28px}
.lpa[data-motif="soft"] .cta{background:#f6fbfd;color:var(--ink)}
.lpa[data-motif="soft"] .cta::before{inset:-20% -10% -20% -10%;height:auto;transform:none;filter:blur(70px);
  background:radial-gradient(40% 50% at 20% 50%,rgba(93,186,218,.55),transparent 70%),radial-gradient(40% 50% at 80% 40%,rgba(194,121,168,.5),transparent 70%),radial-gradient(40% 50% at 50% 100%,rgba(232,216,67,.6),transparent 70%)}
.lpa[data-motif="soft"] .cta h2{position:relative}
.lpa[data-motif="soft"] .cta p{color:var(--ink2);position:relative}
.lpa[data-motif="soft"] .cta .tiny,.lpa[data-motif="soft"] .cta .tiny a{color:var(--ink2)}
.lpa[data-motif="soft"] .cta .dates{background:#fff;transform:none;box-shadow:0 6px 20px rgba(35,24,21,.1);position:relative}
.lpa[data-motif="soft"] .cta .btn-camp{background:var(--ink);color:#fff;box-shadow:0 14px 30px rgba(35,24,21,.25);position:relative}
.lpa[data-motif="soft"] .cta .btn-camp:hover{color:#fff}

/* ==== mix：KV＝D やわらかい多色／本文＝C 幾何学模様（2026-10-05 山口決定） ==== */
.lpa[data-motif="mix"] .sticker{border-radius:0;transform:rotate(-3deg);clip-path:polygon(0 0,100% 0,96% 100%,4% 100%)}
.lpa[data-motif="mix"] h2.hd::after{background:repeating-linear-gradient(90deg,var(--gold) 0 14px,var(--green) 14px 28px,var(--rose) 28px 42px,var(--blue) 42px 56px);transform:none;height:.3em;bottom:0}
.lpa[data-motif="mix"] .card::before{width:22px;height:22px;border-radius:50%;background:var(--gold);transform:none;top:-11px;left:24px;box-shadow:30px 0 0 var(--green),60px 0 0 var(--rose)}
.lpa[data-motif="mix"] .num{border-top:0;position:relative;overflow:hidden}
.lpa[data-motif="mix"] .num::after{content:"";position:absolute;right:-24px;top:-24px;width:72px;height:72px;border-radius:50%;background:var(--blue)}
.lpa[data-motif="mix"] .num:nth-child(2)::after{background:var(--gold);border-radius:0;transform:rotate(45deg)}
.lpa[data-motif="mix"] .num:nth-child(3)::after{background:var(--rose);border-radius:50% 0 0 50%}
.lpa[data-motif="mix"] .step{border-radius:0}
.lpa[data-motif="mix"] .step::before{border-radius:0;transform:rotate(0);clip-path:polygon(50% 0,100% 100%,0 100%);height:48px;place-content:end center;padding-bottom:2px}
.lpa[data-motif="mix"] .mat{border-radius:0}
.lpa[data-motif="mix"] .cta{background-color:var(--sumi);background-image:radial-gradient(circle at 50% 50%,rgba(255,255,255,.08) 0 18px,transparent 19px);background-size:140px 140px}
.lpa[data-motif="mix"] .cta::before{background:repeating-linear-gradient(90deg,var(--gold) 0 40px,var(--green) 40px 80px,var(--rose) 80px 120px,var(--blue) 120px 160px);transform:none;height:14px;inset:0 0 auto 0}
.lpa[data-motif="mix"] .hero{background:#f6fbfd}
.lpa[data-motif="mix"] .hero::before{inset:-20% -10% -20% -10%;height:auto;transform:none;opacity:1;filter:blur(70px);
  background:
    radial-gradient(38% 45% at 14% 28%,rgba(93,186,218,.75),transparent 70%),
    radial-gradient(34% 40% at 84% 22%,rgba(232,216,67,.7),transparent 70%),
    radial-gradient(40% 46% at 70% 88%,rgba(194,121,168,.6),transparent 70%),
    radial-gradient(36% 42% at 24% 92%,rgba(160,202,52,.6),transparent 70%)}
.lpa[data-motif="mix"] .hero::after{display:none}
.lpa[data-motif="mix"] .hero .cv{padding-bottom:clamp(70px,9vw,120px)}
.lpa[data-motif="mix"] .hero-badge{background:#fff;color:var(--ink);box-shadow:0 6px 20px rgba(35,24,21,.12)}
.lpa[data-motif="mix"] .hero-h1 .ul{background:linear-gradient(transparent 60%,rgba(232,216,67,.8) 60%)}
.lpa[data-motif="mix"] .kv img{border-radius:40px;transform:none;border:0;box-shadow:0 30px 70px rgba(93,186,218,.3)}
.lpa[data-motif="mix"] .kv .free{background:rgba(232,216,67,.9);transform:rotate(0);box-shadow:0 14px 30px rgba(35,24,21,.12)}
.lpa[data-motif="mix"] .kv .days{background:rgba(194,121,168,.85);transform:rotate(0);box-shadow:0 14px 30px rgba(35,24,21,.12);color:var(--ink)}

/* スマホでは申込ボタンを1行に収める */
@media (max-width:480px){.lpa .btn-camp{font-size:15px;padding:.9em 1.3em;gap:.4em;white-space:nowrap}}

/* ---------- 初稿の範囲の図版（お届けする内容の冒頭・2026-10-06） ---------- */
.lpa .scopefig{margin:8px 0 44px;background:#fff;border-radius:24px;box-shadow:0 18px 50px rgba(35,24,21,.10);overflow:hidden}
.lpa .scopefig img{width:100%;height:auto}
@media (max-width:640px){.lpa .scopefig{margin:4px -6px 32px;border-radius:18px}}
/* カードを外し写真だけにした版（2026-10-06）：写真を中央に1枚 */
.lpa .scope.solo{grid-template-columns:1fr;max-width:720px;margin-inline:auto}

/* ---------- 2つの期間（2026-10-06）：ヒーローの2段表示 ---------- */
.lpa .hero-periods{display:grid;gap:.5em;margin:.7em 0 .9em}
.lpa .hero-periods .hp-lab{display:inline-flex;align-items:center;gap:.5em;font-weight:900;font-size:clamp(13px,1.1vw,16px);background:#fff;border-radius:999px;padding:.25em .9em .25em .3em;box-shadow:0 3px 0 rgba(35,24,21,.1)}
.lpa .hero-periods .hp-lab b{display:inline-grid;place-content:center;width:1.6em;height:1.6em;border-radius:50%;background:var(--blue);font-size:.9em}
.lpa .hero-periods .hp-lab.r b{background:var(--rose)}
.lpa .hero-periods .hero-dates{margin:.12em 0 0}
.lpa .hero-periods .hero-dates .d{font-size:clamp(40px,5.4vw,74px)}
.lpa .hero-periods .hero-dates .arrow{font-size:clamp(24px,3vw,42px)}

/* ---------- 対象となる方（2つの期間の帯） ---------- */
.lpa .periods{padding-top:clamp(30px,4vw,60px)}
.lpa .tl{background:#fff;border-radius:24px;padding:clamp(20px,3vw,34px) clamp(18px,3vw,36px) 18px;box-shadow:0 14px 40px rgba(35,24,21,.08);display:grid;grid-template-columns:minmax(0,.9fr) auto minmax(0,1.3fr);column-gap:26px;align-items:center}
.lpa .tl-row{display:contents}
.lpa .tl-row>*{padding:14px 0}
.lpa .tl-row.r1>*{border-bottom:1px dashed var(--line)}
.lpa .tl-lab{display:flex;align-items:center;gap:12px}
.lpa .tl-lab .no{flex:none;display:grid;place-content:center;width:42px;height:42px;border-radius:50%;background:var(--blue);font-weight:900;font-size:20px;transform:rotate(-8deg);box-shadow:0 4px 0 rgba(35,24,21,.15)}
.lpa .r2 .tl-lab .no{background:var(--rose)}
.lpa .tl-lab b{display:block;font-size:clamp(16px,1.4vw,19px);font-weight:900;line-height:1.35}
.lpa .tl-lab small{display:block;font-size:13px;color:var(--ink2)}
.lpa .tl-date{font-weight:900;font-size:clamp(28px,3.2vw,44px);line-height:1;letter-spacing:-.01em;white-space:nowrap}
.lpa .tl-date small{font-size:.38em;margin:0 .15em;font-weight:700}
.lpa .tl-date .ar{font-size:.55em;margin:0 .25em;vertical-align:.12em}
.lpa .tl-track{position:relative;height:22px;background:repeating-linear-gradient(90deg,#efeadf 0 6px,transparent 6px 10px) content-box;background-clip:content-box}
.lpa .tl-bar{position:absolute;left:0;top:14px;height:22px;width:calc(var(--e) / 37 * 100%);border-radius:999px;background:var(--blue)}
.lpa .r2 .tl-bar{background:var(--rose)}
.lpa .tl-track{height:auto;min-height:22px}
.lpa .tl-track::before{content:"";display:block;height:22px}
.lpa .tl-axis{grid-column:3;position:relative;height:24px;margin-top:4px}
.lpa .tl-axis span{position:absolute;top:0;left:calc(var(--p) / 37 * 100%);font-size:12.5px;font-weight:700;color:var(--ink2);transform:translateX(-50%)}
.lpa .tl-axis span:first-child{transform:none}
.lpa .tl-axis .end{left:auto;right:0;transform:none}
.lpa .tl-axis::before{content:"";position:absolute;left:calc(12 / 37 * 100%);bottom:100%;height:118px;border-left:2px dashed rgba(35,24,21,.25)}
.lpa .tl-note{margin:16px 0 0;font-weight:700;font-size:15px}
@media (max-width:900px){
  .lpa .tl{grid-template-columns:1fr}
  .lpa .tl-row>*{padding:6px 0;border:0!important}
  .lpa .tl-row.r1 .tl-track{padding-bottom:16px;border-bottom:1px dashed var(--line)!important}
  .lpa .tl-row.r2 .tl-lab{padding-top:16px}
  .lpa .tl-axis{grid-column:1}
  .lpa .tl-axis::before{display:none}
}
.lpa .cta .dates .sep{margin:0 .4em;opacity:.6}
/* ヒーローの2段目（制作支援の受付期間）は小さく：主役はライセンスのお申し込み期間（2026-10-06） */
.lpa .hero-periods .hp + .hp{margin-top:.15em}
.lpa .hero-periods .hp + .hp .hp-lab{font-size:clamp(12px,1vw,14px);box-shadow:none;background:rgba(255,255,255,.8)}
.lpa .hero-periods .hp + .hp .hero-dates .d{font-size:clamp(24px,2.6vw,34px);letter-spacing:0}
.lpa .hero-periods .hp + .hp .hero-dates .arrow{font-size:clamp(14px,1.5vw,20px)}
.lpa .hero-periods .hp + .hp .hero-dates .w{font-size:clamp(11px,1vw,14px);margin-bottom:.2em}
/* KVの写真をA0パネル版にしたため、「無料」の丸を左下へ（左上だとポスターの題名に重なる・2026-10-06） */
.lpa .kv .free{top:auto;bottom:-24px}