:root{
  color-scheme: light;
  --ink:#1a1a2e; --ink-2:#4a5068; --ink-3:#7c839c;
  --paper:#ffffff; --tint:#f2f6fd; --tint-2:#e6eefb; --line:#d9e2f2;
  --blue-deep:#1245a8; --blue:#1a6fc8; --sky:#1bbde8; --ice:#caf8ff; --brand:#3f63ed;
  --coin:#f5b921; --coin-deep:#d98f0b;
  --ok:#14a37f;
  --grad:linear-gradient(135deg,#1245a8 0%,#1a6fc8 40%,#1bbde8 80%,#38d9f5 100%);
  --radius:14px;
  --font:"Noto Sans JP","Hiragino Sans","Yu Gothic",sans-serif;
  --num:"Outfit","Noto Sans JP",sans-serif;
}
*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.8;-webkit-font-smoothing:antialiased}
a{color:inherit}
h1,h2,h3{text-wrap:balance;line-height:1.35;margin:0}
p{margin:0}
.wrap{max-width:1120px;margin:0 auto;padding-inline:20px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;text-decoration:none;border-radius:999px;padding:14px 28px;border:0;cursor:pointer;font-family:inherit;font-size:15px;transition:transform .15s ease, box-shadow .15s ease}
.btn:hover{transform:translateY(-1px)}
.btn:focus-visible,summary:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.btn-coin{background:var(--coin);color:#3b2a00;box-shadow:0 6px 0 var(--coin-deep)}
.btn-coin:hover{box-shadow:0 7px 0 var(--coin-deep)}
.btn-ghost{background:rgba(255,255,255,.14);color:#fff;border:1.5px solid rgba(255,255,255,.6)}
.btn-blue{background:var(--blue);color:#fff}
.btn-line{background:#fff;color:var(--blue);border:1.5px solid var(--blue)}


/* 1 ヘッダー */
.hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.hdr .wrap{display:flex;align-items:center;gap:20px;height:68px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:900;color:var(--brand);font-size:18px}
.logo svg{width:36px;height:34px}
.nav{display:flex;gap:22px;margin-left:auto;font-size:14px;font-weight:500}
.nav a{text-decoration:none;color:var(--ink-2)}
.nav a:hover{color:var(--blue)}
.hdr .btn{padding:10px 18px;font-size:14px;box-shadow:0 4px 0 var(--coin-deep)}
@media (max-width:960px){.nav{display:none}.hdr .btn{margin-left:auto}}

/* 2 FV */
.fv{background:var(--grad);color:#fff;overflow:hidden}
.fv .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;padding-block:72px 64px}
.eyebrow{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.06em;border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:4px 14px;margin-bottom:22px}
.fv h1{font-size:clamp(30px,4.6vw,50px);font-weight:900;letter-spacing:.01em}
.fv h1 em{font-style:normal;color:var(--ice)}
.fv .lead{margin-top:20px;font-size:16px;max-width:34em;color:rgba(255,255,255,.92)}
.fv .ctas{display:flex;flex-wrap:wrap;gap:16px;margin-top:32px}
.fv-sub{margin-top:14px;font-size:12px;color:rgba(255,255,255,.75)}
.coin{position:absolute;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff3c4 0 12%,#f8cb45 30%,#e79e10 72%,#c77a06 100%);box-shadow:inset 0 -4px 0 rgba(0,0,0,.12),0 8px 20px rgba(0,30,90,.25);display:grid;place-items:center;font:800 var(--s,20px)/1 var(--num);color:#b06b00}
.coin::after{content:"P"}
@media (prefers-reduced-motion:no-preference){.coin{animation:float 6s ease-in-out infinite}.coin:nth-of-type(2n){animation-delay:-3s}}
@keyframes float{50%{transform:translateY(-10px)}}
.phone-stage{position:relative;justify-self:center;width:min(300px,100%)}
.phone{position:relative;z-index:2;background:#0d1b3d;border-radius:36px;padding:10px;box-shadow:0 30px 60px rgba(4,20,60,.4)}
.screen{background:#f4f7fd;border-radius:28px;overflow:hidden;color:var(--ink)}
.scr-top{background:var(--grad);color:#fff;padding:22px 16px 16px}
.scr-top small{font-size:11px;opacity:.85}
.pt{font:800 30px/1.1 var(--num);display:flex;align-items:baseline;gap:4px}
.pt span{font-size:13px;font-weight:700}
.scr-body{padding:12px;display:grid;gap:8px}
.ms{display:flex;align-items:center;gap:10px;background:#fff;border-radius:12px;padding:10px 12px;font-size:12px;border:1px solid var(--line)}
.ms i{width:30px;height:30px;border-radius:9px;background:var(--tint-2);flex:none;display:grid;place-items:center;font-style:normal;font-weight:900;color:var(--blue);font-size:12px}
.ms b{margin-left:auto;font:700 13px var(--num);color:var(--coin-deep);white-space:nowrap}
.ms.done{opacity:.55}
.ms.done b{color:var(--ok)}
.scr-cap{font-size:11px;font-weight:700;color:var(--ink-3);padding:4px 4px 0}
@media (max-width:860px){.fv .wrap{grid-template-columns:1fr;padding-block:48px}.phone-stage{margin-top:8px}}

/* 3 信頼 */
.trust{background:var(--paper);border-bottom:1px solid var(--line)}
.trust .wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding-block:28px}
.trust-item{display:flex;align-items:center;gap:14px;padding:6px 24px;border-left:1px solid var(--line)}
.trust-item:first-child{border-left:0}
.trust-item strong{font:800 30px/1 var(--num);color:var(--blue);white-space:nowrap}
.trust-item strong small{font:700 15px var(--font)}
.trust-item p{font-size:13px;color:var(--ink-2);line-height:1.6}
.note{font-size:11px;color:var(--ink-3)}
@media (max-width:760px){.trust .wrap{grid-template-columns:1fr}.trust-item{border-left:0;border-top:1px solid var(--line);padding:14px 4px}.trust-item:first-child{border-top:0}}

/* 共通セクション */
.sec{padding-block:88px}
.sec.alt{background:var(--tint)}
.sec-head{margin-bottom:44px;max-width:680px}
.sec-head .en{font:700 13px var(--num);letter-spacing:.18em;color:var(--sky)}
.sec-head h2{font-size:clamp(24px,3.2vw,34px);font-weight:900;margin-top:8px}
.sec-head p{margin-top:14px;color:var(--ink-2)}
.center{text-align:center;margin-inline:auto}

/* 4 課題 */
.pains{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pain{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px 20px}
.pain .q{font:800 13px var(--num);color:#e0556e;letter-spacing:.08em}
.pain h3{font-size:17px;margin-top:6px}
.pain p{font-size:13px;color:var(--ink-2);margin-top:10px;line-height:1.7}
.bridge{margin-top:36px;text-align:center;font-weight:700;font-size:18px}
.bridge span{color:var(--blue)}
@media (max-width:900px){.pains{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.pains{grid-template-columns:1fr}}

/* 5 仕組み */
.flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:stretch;gap:12px}
.node{background:#fff;border-radius:var(--radius);border:1px solid var(--line);padding:24px;display:flex;flex-direction:column;gap:10px}
.node .who{font-size:12px;font-weight:700;color:#fff;background:var(--blue);border-radius:6px;padding:2px 10px;align-self:flex-start}
.node.user .who{background:var(--coin-deep)}
.node.op .who{background:var(--ok)}
.node h3{font-size:18px}
.node ul{margin:0;padding-left:1.1em;font-size:13px;color:var(--ink-2)}
.arrow{align-self:center;color:var(--sky);font:800 26px var(--num)}
.flow-cap{margin-top:18px;font-size:13px;color:var(--ink-3);text-align:center}
@media (max-width:860px){.flow{grid-template-columns:1fr}.arrow{transform:rotate(90deg);justify-self:center}}

/* 6 選ばれる理由 */
.reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.reason{background:#fff;padding:28px 26px}
.reason h3{font-size:17px;display:flex;align-items:center;gap:10px}
.reason h3 .ic{width:34px;height:34px;border-radius:10px;background:var(--tint-2);color:var(--blue);display:grid;place-items:center;flex:none}
.reason p{font-size:13px;color:var(--ink-2);margin-top:10px}
.chip{display:inline-block;font-size:11px;font-weight:700;border-radius:5px;padding:1px 7px;margin-left:6px;vertical-align:2px}
.chip.std{background:#e2f6ef;color:#0b7a5d}
.chip.opt{background:#fff1d6;color:#9a6200}
@media (max-width:860px){.reasons{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.reasons{grid-template-columns:1fr}}

/* 7 機能・画面 */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.tabs button{font:700 13px var(--font);border:1px solid var(--line);background:#fff;color:var(--ink-2);border-radius:999px;padding:8px 16px;cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--blue);border-color:var(--blue);color:#fff}
.feat{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center}
.feat h3{font-size:22px}
.feat p{margin-top:12px;color:var(--ink-2)}
.feat ul{margin:16px 0 0;padding-left:1.1em;color:var(--ink-2);font-size:14px}
.shot{background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 20px 40px rgba(18,69,168,.12);overflow:hidden}
.shot-bar{display:flex;gap:6px;padding:10px 12px;background:var(--tint-2)}
.shot-bar i{width:9px;height:9px;border-radius:50%;background:#b8c6e2}
.shot-body{padding:18px;display:grid;gap:14px}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.kpi{border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.kpi small{font-size:11px;color:var(--ink-3)}
.kpi b{display:block;font:800 20px var(--num);font-variant-numeric:tabular-nums}
.bars{display:flex;align-items:flex-end;gap:8px;height:120px;border-bottom:1px solid var(--line);padding-top:6px}
.bars span{flex:1;background:linear-gradient(to top,var(--blue),var(--sky));border-radius:4px 4px 0 0}
.bars span:last-child{background:var(--coin)}
.shot-cap{font-size:11px;color:var(--ink-3)}
.dummy{display:inline-block;font-size:10px;font-weight:700;color:#c43b55;border:1px dashed #e7879a;border-radius:4px;padding:0 5px;margin-left:6px}
.rows{display:grid;gap:6px;font-size:12px}
.rows div{display:flex;justify-content:space-between;border-bottom:1px dashed var(--line);padding-bottom:6px}
@media (max-width:860px){.feat{grid-template-columns:1fr}}

/* 8 事例 */
.case{display:grid;grid-template-columns:1fr 1fr;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.case-l{background:var(--grad);color:#fff;padding:36px}
.case-l .app{font-size:13px;opacity:.85}
.case-l h3{font-size:24px;margin-top:6px}
.case-l .res{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:28px}
.case-l .res div{background:rgba(255,255,255,.14);border-radius:12px;padding:14px}
.case-l .res b{display:block;font:800 30px var(--num)}
.case-l .res small{font-size:12px}
.case-r{padding:36px;display:grid;gap:18px}
.step-lbl{font-size:12px;font-weight:700;color:var(--blue);letter-spacing:.06em}
.case-r p{font-size:14px;color:var(--ink-2)}
.voice{border-left:3px solid var(--coin);padding-left:14px;font-size:14px}
@media (max-width:860px){.case{grid-template-columns:1fr}}

/* 9 流れ */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:12px;counter-reset:s}
.steps li{counter-increment:s;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px 16px;position:relative}
.steps li::before{content:"STEP " counter(s);display:block;font:800 12px var(--num);letter-spacing:.1em;color:var(--sky)}
.steps b{display:block;font-size:16px;margin-top:4px}
.steps p{font-size:12px;color:var(--ink-2);margin-top:6px;line-height:1.6}
.steps .who{display:inline-block;margin-top:10px;font-size:11px;font-weight:700;border-radius:5px;padding:1px 7px;background:var(--tint-2);color:var(--blue)}
.steps .who.you{background:#fff1d6;color:#9a6200}
.span-note{margin-top:18px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;font-size:13px;color:var(--ink-2)}
.span-note strong{font:800 22px var(--num);color:var(--blue)}
@media (max-width:1000px){.steps{grid-template-columns:repeat(3,1fr)}}
@media (max-width:560px){.steps{grid-template-columns:1fr 1fr}}

/* 10 費用 */
.price{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px 24px}
.pcard.main{border:2px solid var(--blue)}
.pcard small{font-size:13px;font-weight:700;color:var(--ink-2)}
.pcard .v{font:800 40px/1.2 var(--num);color:var(--blue);margin-top:6px}
.pcard .v span{font:700 16px var(--font)}
.pcard .v.tbd{font:700 20px/1.6 var(--font);color:var(--ink-3)}
.pcard p{font-size:13px;color:var(--ink-2);margin-top:10px}
.support{margin-top:20px;display:flex;flex-wrap:wrap;gap:10px}
.support span{font-size:13px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 14px}
@media (max-width:760px){.price{grid-template-columns:1fr}}

/* 11 FAQ */
.faq{display:grid;gap:10px;max-width:840px;margin-inline:auto}
.faq details{background:#fff;border:1px solid var(--line);border-radius:12px}
.faq summary{list-style:none;cursor:pointer;padding:18px 48px 18px 56px;font-weight:700;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q";position:absolute;left:20px;top:16px;font:800 18px var(--num);color:var(--blue)}
.faq summary::after{content:"+";position:absolute;right:20px;top:14px;font:500 22px var(--num);color:var(--ink-3)}
.faq details[open] summary::after{content:"−"}
.faq .a{padding:0 24px 20px 56px;color:var(--ink-2);font-size:14px}

/* 12 お知らせ */
.news{display:grid;border-top:1px solid var(--line)}
.news a{display:grid;grid-template-columns:110px 100px 1fr;gap:16px;align-items:center;padding:18px 4px;border-bottom:1px solid var(--line);text-decoration:none}
.news a:hover b{color:var(--blue)}
.news time{font:600 14px var(--num);color:var(--ink-3);font-variant-numeric:tabular-nums}
.news .cat{font-size:11px;font-weight:700;text-align:center;border-radius:5px;padding:2px 0;background:var(--tint-2);color:var(--blue)}
.news b{font-weight:500}
.news-more{margin-top:20px;text-align:right}
.news-more a{font-weight:700;color:var(--blue);text-decoration:none}
@media (max-width:600px){.news a{grid-template-columns:auto auto;}.news b{grid-column:1/-1}}

/* 13 会社 */
.about{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.ceo{display:flex;gap:20px;align-items:flex-start}
.ceo .ph{width:112px;aspect-ratio:1;border-radius:14px;background:repeating-linear-gradient(45deg,var(--tint-2) 0 8px,#fff 8px 16px);border:1px dashed #b8c6e2;display:grid;place-items:center;font-size:11px;color:var(--ink-3);flex:none;max-width:100%}
.ceo blockquote{margin:0;font-size:15px}
.ceo cite{display:block;margin-top:10px;font-style:normal;font-size:13px;color:var(--ink-2)}
.ceo-link{display:inline-block;margin-top:16px;font-weight:700;color:var(--blue);text-decoration:none}
.co{width:100%;border-collapse:collapse;font-size:14px}
.co th{width:30%;text-align:left;font-weight:700;color:var(--ink-2);padding:12px 0;border-bottom:1px solid var(--line);vertical-align:top}
.co td{padding:12px 0;border-bottom:1px solid var(--line)}
@media (max-width:860px){.about{grid-template-columns:1fr}}

/* 14 CTA・フッター */
.final{background:var(--grad);color:#fff;text-align:center;overflow:hidden}
.final .wrap{padding-block:80px}
.final h2{font-size:clamp(24px,3.4vw,36px);font-weight:900}
.final p{margin-top:14px;color:rgba(255,255,255,.9)}
.final .ctas{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;margin-top:30px}
.ftr{background:#0d1b3d;color:#c5d0ea;font-size:13px}
.ftr .wrap{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:32px;padding-block:52px 28px}
.ftr .logo{color:#fff}
.ftr h4{margin:0 0 12px;font-size:13px;color:#fff}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ftr a{text-decoration:none}
.ftr a:hover{color:#fff}
.copy{border-top:1px solid rgba(255,255,255,.12);padding-block:18px;font-size:12px;color:#8391b5}
@media (max-width:760px){.ftr .wrap{grid-template-columns:1fr 1fr}}

/* 管理画面の再現 */
.feat-wide{grid-template-columns:1fr;gap:24px}
.feat-txt{max-width:680px}
.adm{--a:#3f63ed;--a2:#2d50d6;--abg:#f7f8fb;--aink:#1f2433;--aline:#e4e7ef;display:grid;grid-template-columns:190px 1fr;background:var(--abg);color:var(--aink);font-family:Inter,"Noto Sans JP",sans-serif;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 20px 40px rgba(18,69,168,.12);font-size:12px;line-height:1.5}
.adm-side{background:#fff;border-right:1px solid var(--aline);padding:16px 10px;display:flex;flex-direction:column;gap:2px}
.adm-brand{display:flex;gap:8px;align-items:center;padding:0 6px 14px;border-bottom:1px solid var(--aline);margin-bottom:8px}
.adm-brand svg{width:26px;height:25px}
.adm-brand b{display:block;font-size:13px}
.adm-brand small{font-size:10px;color:#7a8196}
.adm-grp{font-size:10px;color:#8a90a3;padding:10px 8px 4px}
.adm-side span{padding:7px 10px;border-radius:7px;font-weight:600;color:#3b4257}
.adm-side span.on{background:#e8edfd;color:var(--a2)}
.adm-main{padding:18px;display:grid;gap:12px;min-width:0}
.adm-title{font-size:15px;font-weight:700}
.adm-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.seg{display:inline-flex;flex-wrap:wrap;gap:2px;background:#fff;border:1px solid var(--aline);border-radius:10px;padding:3px}
.seg span{padding:5px 10px;border-radius:7px;color:#4a5068;white-space:nowrap}
.seg span.on{background:var(--a);color:#fff}
.seg.sm span{padding:3px 9px;font-size:11px}
.adm-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.adm-kpis div{background:#fff;border:1px solid var(--aline);border-radius:10px;padding:10px 14px}
.adm-kpis div.on{background:#eef1fd;border-color:#c9d3fb;box-shadow:inset 3px 0 0 var(--a)}
.adm-kpis small{color:#5b6278;font-size:11px}
.adm-kpis b{display:block;font-size:20px;font-weight:800;font-variant-numeric:tabular-nums}
.adm-kpis b i{font-style:normal;font-size:11px;font-weight:500;color:#7a8196;margin-left:2px}
.adm-card{background:#fff;border:1px solid var(--aline);border-radius:10px;padding:12px 14px}
.adm-card-h{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;align-items:center;margin-bottom:6px}
.adm-chart{width:100%;height:auto;display:block}
.adm-chart text{font-size:10px;fill:#6b7288}
.adm-chart .gl{stroke:#eceff5}
.adm-chart .ln{fill:none;stroke:var(--a);stroke-width:2.5;stroke-linejoin:round}
.adm-chart .ar{fill:var(--a);opacity:.1}
.adm-chart .pt-end{fill:#fff;stroke:var(--a);stroke-width:2.5}
.csv{border:1px solid #c9d3fb;color:var(--a2);border-radius:6px;padding:3px 10px;font-weight:600}
.adm-tbl-wrap{overflow-x:auto}
.adm-tbl{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;white-space:nowrap}
.adm-tbl th{font-size:10px;color:#6b7288;font-weight:600;text-align:right;padding:8px 10px;border-bottom:1px solid var(--aline)}
.adm-tbl td{text-align:right;padding:9px 10px;border-bottom:1px solid var(--aline)}
.adm-tbl th:first-child,.adm-tbl td:first-child,.adm-tbl th:nth-child(2),.adm-tbl td:nth-child(2){text-align:left}
.adm-tbl em{font-style:normal;font-size:10px;border-radius:4px;padding:1px 6px;background:#eef1fd;color:var(--a2)}
.adm-tbl em.and{background:#e3f5ea;color:#1c7a45}
.adm-tbl tr.sum td{background:#eef1fd;font-weight:700;color:var(--a2)}
@media (max-width:860px){.adm{grid-template-columns:1fr}.adm-side{display:none}.adm-kpis{grid-template-columns:1fr 1fr}}

[hidden]{display:none!important}
.tab-r{position:absolute;opacity:0;pointer-events:none}
.tabs label{font:700 13px var(--font);border:1px solid var(--line);background:#fff;color:var(--ink-2);border-radius:999px;padding:8px 16px;cursor:pointer}
#r-dash:checked ~ .tabs label[for="r-dash"]{background:var(--blue);border-color:var(--blue);color:#fff}
#r-ms:checked ~ .tabs label[for="r-ms"]{background:var(--blue);border-color:var(--blue);color:#fff}
#r-wall:checked ~ .tabs label[for="r-wall"]{background:var(--blue);border-color:var(--blue);color:#fff}
#r-ex:checked ~ .tabs label[for="r-ex"]{background:var(--blue);border-color:var(--blue);color:#fff}
#r-ui:checked ~ .tabs label[for="r-ui"]{background:var(--blue);border-color:var(--blue);color:#fff}
#p-dash,#p-ms,#p-wall,#p-ex,#p-ui{display:none}
#r-dash:checked ~ #p-dash{display:grid}
#r-ms:checked ~ #p-ms{display:grid}
#r-wall:checked ~ #p-wall{display:grid}
#r-ex:checked ~ #p-ex{display:grid}
#r-ui:checked ~ #p-ui{display:grid}
.tab-r:focus-visible ~ .tabs{outline:3px solid var(--sky);outline-offset:4px;border-radius:12px}
.phone-stage.duo{width:min(380px,100%)}
@media (max-width:980px){.fv .wrap{grid-template-columns:1fr}.phone-stage.duo{margin-top:8px}}
/* PDF素材の反映 */
.phone .screen img{display:block;width:100%;height:auto}
.phone-stage.duo{width:min(360px,100%);display:grid}
.phone-stage.duo .phone{grid-area:1/1;width:74%;padding:8px;border-radius:30px}
.phone-stage.duo .phone .screen{border-radius:22px}
.phone-stage.duo .phone:not(.back){justify-self:end;margin-top:40px}
.phone-stage.duo .phone.back{transform:rotate(-6deg);opacity:.92}
.trust .wrap{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.trust .wrap{grid-template-columns:1fr 1fr}.trust-item:nth-child(3){border-left:0}}
@media (max-width:520px){.trust .wrap{grid-template-columns:1fr}}
.market{display:grid;grid-template-columns:1fr 1.1fr;gap:40px;align-items:center}
.market .sec-head{margin-bottom:0}
.mchart{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.mchart figcaption{font-weight:700;font-size:14px;margin-bottom:12px}
.mbars{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;height:220px;align-items:end}
.mbars div{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px}
.mbars span{width:70%;height:calc(var(--h) * .72);background:#1f3a73;border-radius:4px 4px 0 0}
.mbars .hi span{background:var(--blue)}
.mbars b{font:700 12px var(--num);font-variant-numeric:tabular-nums}
.mbars i{font:500 11px/1.3 var(--font);font-style:normal;color:var(--ink-3);text-align:center;min-height:2.6em}
.src{font-size:11px;color:var(--ink-3);margin-top:10px}
@media (max-width:860px){.market{grid-template-columns:1fr}}
.shots{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.shots figure{margin:0;display:flex;flex-direction:column;gap:10px;align-items:center;text-align:center}
.shots img{width:100%;max-width:210px;border-radius:14px;box-shadow:0 14px 30px rgba(18,69,168,.18)}
.snum{font-weight:700;font-size:13px;color:#fff;background:#12234d;border-radius:999px;padding:4px 16px}
.shots figcaption{font-size:13px;color:var(--ink-2)}
.mpoints{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.mpoints div{border-top:3px solid var(--coin);padding-top:14px}
.mpoints h3{font-size:17px}
.mpoints p{font-size:13px;color:var(--ink-2);margin-top:6px}
@media (max-width:860px){.shots{grid-template-columns:1fr 1fr}.mpoints{grid-template-columns:1fr}}
.reasons.r2{grid-template-columns:1fr 1fr}
@media (max-width:560px){.reasons.r2{grid-template-columns:1fr}}
.ipm{display:grid;grid-template-columns:.8fr 1.2fr;gap:0;margin-top:28px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:#fff}
.ipm-big{background:#12234d;color:#fff;padding:32px;display:flex;flex-direction:column;justify-content:center;gap:6px}
.ipm-big small{color:var(--coin);font-weight:700}
.ipm-big b{font:800 64px/1 var(--num)}
.ipm-big b span{font:700 26px var(--font)}
.ipm-big p{font-size:13px;color:#c5d0ea}
.ipm-bars{padding:28px;display:grid;gap:12px}
.ipm-lead{font-size:14px;color:var(--ink-2)}
.hb{display:grid;grid-template-columns:110px 1fr 44px;gap:10px;align-items:center;font-size:13px}
.hb i{display:block;height:22px;width:var(--w);background:#12234d;border-radius:0 4px 4px 0}
.hb.mute i{background:#aab5cc}
.hb b{font:700 15px var(--num)}
.ipm-bars ul{margin:0;padding-left:1.1em;font-size:14px;font-weight:700}
@media (max-width:760px){.ipm{grid-template-columns:1fr}}
.realshot{justify-self:center}
.realshot img{width:min(280px,100%);border-radius:18px;box-shadow:0 20px 40px rgba(18,69,168,.18)}
.case2{display:grid;grid-template-columns:1fr 1.15fr;gap:20px}
.cstats{display:grid;gap:12px}
.cstats div{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px 22px;display:grid;grid-template-columns:120px 1fr;gap:12px;align-items:center}
.cstats b{font:800 42px/1 var(--num);color:#12234d}
.cstats b span{font:700 18px var(--font)}
.cstats p{font-weight:700;font-size:14px;line-height:1.6}
.cstats small{font-weight:400;color:var(--ink-2);font-size:12px}
.cfigs{display:grid;grid-template-columns:1fr 200px;grid-template-rows:auto auto;gap:12px}
.cfig{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px;display:flex;flex-direction:column;gap:8px}
.cfig figcaption{font-size:13px;font-weight:700}
.cfig img{width:100%;border-radius:6px}
.cfig.rank{grid-column:2;grid-row:1/3;align-items:center;justify-content:center;text-align:center}
.cfig.rank figcaption{font-size:12px;color:var(--ink-2)}
@media (max-width:960px){.case2{grid-template-columns:1fr}}
@media (max-width:520px){.cfigs{grid-template-columns:1fr}.cfig.rank{grid-column:auto;grid-row:auto}.cfig.rank img{max-width:180px}.cstats div{grid-template-columns:1fr}}
.pcard{text-align:center}
.pcard .v{font-size:56px}
.pcard.main{background:#12234d;border-color:#12234d;color:#fff}
.pcard.main small{color:var(--coin)}
.pcard.main .v{color:#fff}
.pcard.main p{color:#c5d0ea}
.pnote{margin-top:16px;font-size:12px;color:var(--ink-2);max-width:60em}
.rm-h{margin-top:48px;font-size:18px}
.roadmap{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.roadmap div{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;display:flex;flex-direction:column;gap:8px}
.roadmap .st{align-self:flex-start;font-size:12px;font-weight:700;border-radius:999px;padding:2px 14px;background:var(--tint-2);color:var(--ink-2)}
.roadmap .now{border:2px solid var(--blue)}
.roadmap .now .st{background:var(--coin);color:#3b2a00}
.roadmap b{font-size:17px}
.roadmap p{font-size:13px;color:var(--ink-2)}
@media (max-width:760px){.roadmap{grid-template-columns:1fr}}

/* 画像レビュー修正 */
.coin{background:url(../images/icon_coin.png) center/contain no-repeat;box-shadow:none;border-radius:0;filter:drop-shadow(0 8px 14px rgba(0,30,90,.3))}
.coin::after{content:none}
.phone-stage.duo{width:min(400px,100%);display:flex;align-items:flex-start;justify-content:center;gap:14px}
.phone-stage.duo .phone{grid-area:auto;width:50%;padding:6px;border-radius:24px;transform:none;opacity:1;margin:0}
.phone-stage.duo .phone .screen{border-radius:19px}
.phone-stage.duo .phone:not(.back){margin-top:36px}
.phone .screen img,.shots img,.realshot img{image-rendering:auto}
.shots img{border-radius:16px}
.realshot img{width:min(300px,100%)}
.cfig img{border:1px solid var(--line)}
.cfig.rank img{max-width:170px;border-radius:10px}
.phone-stage.duo .phone.back{transform:none;opacity:1}
@media (max-width:860px){.coin{display:none}}

/* 仕組み（元構成） */
.flow2{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:14px;align-items:stretch}
.fnode{background:var(--tint);border:1px solid var(--line);border-radius:var(--radius);padding:24px;display:flex;flex-direction:column;gap:10px}
.fnode .who{align-self:flex-start;font-size:12px;font-weight:700;color:#fff;background:var(--blue);border-radius:6px;padding:2px 10px}
.fnode.user .who{background:var(--coin-deep)}
.fnode.op .who{background:var(--ok)}
.fnode h3{font-size:19px}
.fnode>p{font-size:13px;color:var(--ink-2)}
.fimgs{display:flex;gap:10px;justify-content:center;margin-top:auto;padding-top:8px}
.fimgs img{width:calc(50% - 5px);max-width:150px;border-radius:12px;box-shadow:0 10px 22px rgba(18,69,168,.16)}
.fimgs.one img{width:60%;max-width:170px}
.farrow{align-self:center;font:800 28px var(--num);color:var(--sky)}
.effects{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:12px}
.effects li{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px;display:grid;gap:2px}
.effects b{font-size:15px;color:#0b7a5d}
.effects span{font-size:12px;color:var(--ink-2);line-height:1.6}
.roles{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.roles div{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;border-top:3px solid var(--blue);padding-top:12px;font-size:13px;color:var(--ink-2)}
.roles div:last-child{border-color:var(--coin)}
.roles b{color:var(--ink);font-size:14px}
@media (max-width:900px){.flow2{grid-template-columns:1fr}.farrow{transform:rotate(90deg);justify-self:center}.roles{grid-template-columns:1fr}}

/* IPMフック */
.fv-stat{display:inline-grid;grid-template-columns:auto auto auto;align-items:center;gap:4px 14px;margin-top:26px;padding:12px 20px;background:rgba(8,24,70,.35);border:1px solid rgba(255,255,255,.35);border-radius:14px;color:#fff;text-decoration:none;max-width:100%}
.fv-stat .k{font-size:13px;font-weight:700;color:var(--ice)}
.fv-stat b{font:800 40px/1 var(--num);color:var(--coin)}
.fv-stat b small{font:700 18px var(--font)}
.fv-stat .d{font-size:12px;line-height:1.5;color:rgba(255,255,255,.9)}
.fv-stat .d small{color:rgba(255,255,255,.65)}
.fv-stat:hover{background:rgba(8,24,70,.5)}
@media (max-width:520px){.fv-stat{grid-template-columns:auto auto}.fv-stat .d{grid-column:1/-1}}
.trust-item.hl strong{color:var(--coin-deep)}
.ipmband{background:#0f1f47;color:#fff;overflow:hidden}
.ipmband .wrap{padding-block:88px;display:grid;gap:40px}
.ib-head .en{font:700 13px var(--num);letter-spacing:.18em;color:var(--sky)}
.ib-head h2{font-size:clamp(26px,3.6vw,40px);font-weight:900;margin-top:10px}
.ib-head h2 em{font-style:normal;font-family:var(--num);font-weight:800;color:var(--coin);font-size:1.35em}
.ib-head p{margin-top:16px;color:#c5d0ea;max-width:44em}
.ib-body{display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:stretch}
.ib-chart{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius);padding:28px;display:grid;gap:20px;align-content:center}
.ib-row{display:grid;grid-template-columns:120px 1fr 64px;gap:14px;align-items:center}
.ib-row .lb{font-size:14px;font-weight:700}
.ib-row .bar{height:44px;background:rgba(255,255,255,.06);border-radius:6px;overflow:hidden}
.ib-row .bar i{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,#f8cb45,#f5b921);border-radius:6px}
.ib-row.mute .bar i{background:#6d7ba0}
.ib-row b{font:800 28px var(--num);font-variant-numeric:tabular-nums}
.ib-row.mute b{color:#aab5cc}
.ib-src{font-size:11px;color:#8391b5}
.ib-points{display:grid;gap:12px}
.ib-points div{background:#fff;color:var(--ink);border-radius:var(--radius);padding:16px 20px}
.ib-points small{font-size:12px;font-weight:700;color:var(--ink-3)}
.ib-points b{display:block;font-size:22px;font-weight:900;color:#12234d;margin-top:2px}
.ib-points p{font-size:12px;color:var(--ink-2);margin-top:2px}
.ib-note{font-size:11px;color:#8391b5}
@media (max-width:860px){.ib-body{grid-template-columns:1fr}.ib-row{grid-template-columns:96px 1fr 52px}.ib-row b{font-size:22px}}

/* ===================================================
   以下はモックに無い部品（旧サイトから移植）
   =================================================== */

section,footer{position:relative}

/* 言語別フォント */
html[lang="ko"]{--font:"Noto Sans KR","Noto Sans JP",sans-serif;word-break:keep-all}
html[lang="zh-Hant"]{--font:"Noto Sans TC","Noto Sans JP",sans-serif}
html[lang="zh-Hans"]{--font:"Noto Sans SC","Noto Sans JP",sans-serif}
html{scroll-behavior:smooth}
section[id]{scroll-margin-top:72px}

/* ヘッダー：言語切替・ハンバーガー */
.hdr .wrap{gap:16px}
.lang-switcher{position:relative}
.lang-toggle{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;background:transparent;border:1px solid var(--line);border-radius:6px;font:500 13px var(--font);color:var(--ink-2);cursor:pointer;white-space:nowrap}
.lang-toggle:hover{border-color:#bfdbfe;background:#f0f7ff}
.lang-toggle .lang-icon{font-size:15px;line-height:1}
.lang-toggle .lang-arrow{font-size:11px;color:#9ca3af;line-height:1}
.lang-switcher[data-lang-switcher] .lang-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:160px;margin:0;padding:6px 0;background:#fff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 8px 24px rgba(15,23,42,.12);list-style:none;z-index:101}
.lang-menu[hidden]{display:none}
.lang-menu a{display:block;padding:8px 14px;font-size:14px;color:#374151;white-space:nowrap;text-decoration:none}
.lang-menu a:hover{background:#f0f7ff;color:var(--blue)}
.lang-menu a.is-current{font-weight:700;color:var(--blue);background:rgba(26,111,200,.06)}
.lang-menu a.is-current::before{content:"✓ "}
.hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;background:none;border:none;cursor:pointer;padding:8px;border-radius:4px}
.hamburger span{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;transition:transform .3s ease,opacity .3s ease;transform-origin:center}
.hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger.active span:nth-child(2){opacity:0;transform:scaleX(0)}
.hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nav-sp{display:none;flex-direction:column;background:#fff;border-top:1px solid var(--line);padding:8px 0 16px;box-shadow:0 8px 24px rgba(0,0,0,.08)}
.nav-sp.open{display:flex}
.nav-sp-link{display:block;padding:13px 24px;font-size:15px;font-weight:500;color:var(--ink-2);text-decoration:none;border-bottom:1px solid #f3f5fa}
.nav-sp-link:hover{background:#f0f7ff;color:var(--blue)}
@media (max-width:960px){.hamburger{display:flex}.hdr .hdr-cta{margin-left:auto}}
@media (max-width:600px){.hdr .hdr-cta{display:none}.lang-switcher{margin-left:auto}.lang-toggle .lang-label{display:none}}

/* ファーストビューの P コイン（旧サイトと同じ浮遊アニメーション） */
.fv .wrap{position:relative;z-index:1}
.hero-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.coin{animation:float 7s ease-in-out infinite}
.hero-bg .coin{display:block;height:auto;background:none;filter:none;pointer-events:none;user-select:none}
.coin-dim{opacity:.15;animation:float-dim 9s ease-in-out infinite}
@keyframes float{
  0%,100%{transform:translateY(0) rotate(0deg)}
  33%{transform:translateY(-18px) rotate(4deg)}
  66%{transform:translateY(-8px) rotate(-3deg)}
}
@keyframes float-dim{
  0%,100%{transform:translateY(0) rotate(0deg)}
  33%{transform:translateY(-9px) rotate(2deg)}
  66%{transform:translateY(-4px) rotate(-1.5deg)}
}
/* PC：文字列（左）と端末画像（右）を避けて、端と中央のすき間に置く */
.hero-bg .c1{left:2%;top:8%;width:88px}
.hero-bg .c2{left:47%;top:6%;width:72px}
.hero-bg .c3{left:52%;top:74%;width:56px}
.hero-bg .c4{left:4%;top:62%;width:64px}
.hero-bg .c5{left:88%;top:10%;width:84px}
.hero-bg .c6{left:90%;top:60%;width:100px}
.hero-bg .d1{left:8%;top:86%;width:80px}
.hero-bg .d2{left:95%;top:34%;width:110px}
.hero-bg .d3{left:64%;top:88%;width:76px}
.hero-bg .d4{left:34%;top:90%;width:96px}
.hero-bg .d5{left:-3%;top:34%;width:110px}
.hero-bg .d6{left:74%;top:1%;width:90px}
/* 余白が狭い幅では、左端のコインを画面外に少しはみ出させる */
@media (max-width:1440px){
  .hero-bg .c1{left:-36px}
  .hero-bg .c4{left:-24px}
}
/* 1カラム（〜960px）：くっきりしたコインは見出しの上と端末画像のまわりに。文字の近くは薄いコインだけ */
@media (max-width:960px){
  .hero-bg .coin{display:none}
  .hero-bg .c2{display:block;left:calc(100% - 64px);top:1%;width:80px}
  .hero-bg .c5{display:block;left:calc(100% - 52px);top:57%;width:50px}
  .hero-bg .c1{display:block;left:-24px;top:66%;width:70px}
  .hero-bg .c6{display:block;left:calc(100% - 40px);top:80%;width:80px}
  .hero-bg .c4{display:block;left:6px;top:92%;width:44px}
  .hero-bg .d5{display:block;left:-42px;top:0;width:100px}
  .hero-bg .d1{display:block;left:-50px;top:44%;width:90px}
  .hero-bg .d3{display:block;left:calc(100% - 40px);top:36%;width:85px}
}
@media (prefers-reduced-motion:reduce){.coin,.coin-dim{animation:none}}

/* お問い合わせフォーム */
.contact-form{max-width:760px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:16px;padding:48px 48px 44px;text-align:left}
.form-hp{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden}
.form-row{display:block}
/* 項目の間隔を 22px と 28px の混在から 24px にそろえ、送信ボタンの上だけ 28px あける */
.form-group{margin-bottom:24px}
.btn-submit{margin-top:4px}
.form-group label{display:block;font-size:14px;font-weight:700;margin-bottom:8px;color:#374151}
.required{color:#ef4444;margin-left:2px}
.form-group input,.form-group textarea{width:100%;padding:12px 16px;border:1px solid #d1d5db;border-radius:8px;font-family:inherit;font-size:15px;color:var(--ink);background:#fff;transition:border-color .2s,box-shadow .2s;appearance:none;-webkit-appearance:none}
.form-group input::placeholder,.form-group textarea::placeholder{color:#c4c9d4}
.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(26,111,200,.14)}
.form-group input.error,.form-group textarea.error{border-color:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,.12)}
.form-group textarea{resize:vertical;min-height:140px}
.form-error{display:block;font-size:12px;color:#ef4444;margin-top:5px;min-height:16px}
/* エラーがないときも高さを持ち、必須項目の下だけ余白が広がっていたため、空のときは消す */
.form-error:empty{display:none}
.form-help{display:block;font-size:12px;font-weight:400;color:#6b7280;margin:-2px 0 8px;line-height:1.5}
/* 選択肢は折り返しの横並びだと 2 列目の位置が行ごとにずれるため、同じ幅の列にそろえる */
.radio-group{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px 16px;padding:4px 0 2px}
.form-group .radio-option{display:inline-flex;align-items:center;gap:8px;margin-bottom:0;font-size:14px;font-weight:500;color:#374151;cursor:pointer}
.radio-group input[type="radio"]{appearance:auto;-webkit-appearance:auto;width:18px;height:18px;min-width:18px;margin:0;padding:0;border:none;border-radius:0;box-shadow:none;accent-color:var(--blue);cursor:pointer}
.btn-submit{width:100%;background:var(--coin);color:#3b2a00;font:700 16px var(--font);padding:16px;border:none;border-radius:999px;cursor:pointer;box-shadow:0 6px 0 var(--coin-deep);transition:transform .15s ease,box-shadow .15s ease}
.btn-submit:hover{transform:translateY(-1px);box-shadow:0 7px 0 var(--coin-deep)}
.btn-submit:disabled{opacity:.6;cursor:not-allowed;transform:none}
.form-success{text-align:center;margin-top:18px;font-size:14px;font-weight:500;min-height:22px;color:transparent}
.form-success.is-success{color:#10b981}
.form-success.is-error{color:#ef4444}
@media (max-width:768px){.contact-form{padding:32px 20px 28px}}

/* お知らせ（投稿から表示） */
.news-empty{padding:18px 4px;color:var(--ink-3);border-bottom:1px solid var(--line)}
.news-page{min-height:60vh}
.news-page .news-title{font-size:clamp(24px,3.2vw,34px);font-weight:900;margin-top:8px}
.post{max-width:760px;margin:0 auto}
.post-meta{display:flex;gap:12px;align-items:center;font:600 14px var(--num);color:var(--ink-3)}
.post-meta .cat{font:700 11px var(--font);border-radius:5px;padding:2px 10px;background:var(--tint-2);color:var(--blue)}
.post h1{font-size:clamp(22px,3vw,30px);font-weight:900;margin-top:12px}
.post-body{margin-top:28px;color:var(--ink-2);font-size:16px}
.post-body > * + *{margin-top:1.2em}
.post-body h2{font-size:22px;color:var(--ink);margin-top:2em}
.post-body h3{font-size:18px;color:var(--ink);margin-top:1.6em}
.post-body img{height:auto;border-radius:8px}
.post-body a{color:var(--blue)}
.post-back{margin-top:48px}
.post-back a{font-weight:700;color:var(--blue);text-decoration:none}
.news-pager{display:flex;justify-content:center;gap:12px;margin-top:28px}
.news-pager a{display:inline-grid;place-items:center;width:44px;height:44px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--blue);font-weight:700;text-decoration:none}

/* 代表写真 */
.ceo img.ph{display:block;object-fit:cover;border:0;background:none;border-radius:14px}

/* 代表メッセージ（その場で開閉） */
.ceo-msg{margin-top:16px}
.ceo-msg summary{list-style:none;cursor:pointer;display:inline-block}
.ceo-msg summary::-webkit-details-marker{display:none}
.ceo-msg[open] summary{margin-bottom:12px}
.ceo-msg-body{background:var(--tint);border-radius:var(--radius);padding:24px;font-size:14px;color:var(--ink-2)}
.ceo-msg-body p + p{margin-top:1em}
.ceo-msg-body .ceo-sign{display:block;text-align:right;font-weight:700;color:var(--ink)}

/* ファーストビューのボタン: 本文が左寄せなので、タブレット幅では左寄せのままにし、
   スマホ幅ではボタンと IPM の箱を横幅いっぱいにそろえる(中央寄せだと幅の違うボタンが左端とずれて見えた) */
@media (max-width:560px){.fv .ctas{flex-direction:column}.fv .ctas .btn{width:100%;justify-content:center}.fv-stat{display:grid;width:100%;grid-template-columns:auto 1fr}}

/* ===================================================
   スマホ表示の整形
   =================================================== */
/* 日本語の見出し・ボタン・短い文は文節で改行する（対応ブラウザのみ。非対応は従来どおり） */
html[lang="ja"] :is(h1,h2,h3,.btn,.bridge,.eyebrow,.trust-item p,.ib-points b,.span-note span,.copy,.faq summary){word-break:auto-phrase}
/* 日本語の本文も文節で改行し、行頭の長音・小書きかなを禁止、最終行に数文字だけ残るのを防ぐ */
/* フッターは列が狭く、文節で折り返せないとスマホで横にはみ出すため除外 */
/* text-wrap は一括指定で white-space の折り返し禁止まで解除してしまうので、最終行の調整だけを text-wrap-style で指定する */
/* 数字＋単位(strong / b の中の small)は折り返さないので対象から外す */
html[lang="ja"] :is(p,li,dd,small,blockquote,figcaption,.faq .a,.roles span,.form-help):not(.ftr *,strong *,b *){word-break:auto-phrase;line-break:strict;text-wrap-style:pretty}
/* 数字＋単位は途中で折り返さない */
.ipmband h2 em,.trust-item strong,.cstats b,.span-note strong{white-space:nowrap}
/* 1 列になったグリッドが中身の最小幅に押し広げられ、320px 幅で横スクロールが出るのを防ぐ */
@media (max-width:980px){.fv .wrap{grid-template-columns:minmax(0,1fr)}}
@media (max-width:860px){.market,.adm{grid-template-columns:minmax(0,1fr)}}
.adm-main{grid-template-columns:minmax(0,1fr)}
/* 市場グラフは棒が 6 本あり、320px 幅では内側の余白 24px だと収まらない */
@media (max-width:400px){.mchart{padding:16px}
  /* 1 本あたり約 33px に対して数値(32,838)が約 40px あり、列が押し広げられて枠からはみ出すため */
  .mbars{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.mbars b{font-size:10px}}
/* 320px 前後では小見出しの文字が角丸の枠からはみ出すため、文字と内側の余白を詰める */
@media (max-width:360px){.eyebrow{font-size:12px;letter-spacing:.02em;padding:4px 10px}
  /* 管理画面モックの数値カードは 2 列だと右側が枠からはみ出すため 1 列にする */
  .adm-kpis{grid-template-columns:minmax(0,1fr)}}
/* PC 幅でだけ改行したい位置に <br class="pc"> を置く(スマホ幅では文節改行に任せる) */
@media (max-width:760px){br.pc{display:none}}
br.sp{display:none}
@media (max-width:760px){br.sp{display:revert}}
@media (min-width:361px) and (max-width:760px){.sp-nw{white-space:nowrap}}
/* IPM グラフのタイトル(出典の行にあった「平均IPM…」をグラフの上に移した) */
.ib-title{font-size:13px;font-weight:700;color:#c5d0ea}
/* 選ばれる理由: PC の 3 列では列方向に詰め、「初期費用」を左上、「アイテム」を「ミッション」の真下に置く */
@media (min-width:861px){.reasons:not(.r2){grid-auto-flow:column;grid-template-rows:repeat(4,auto)}}
/* 見出しが 2 行のカードがあっても、同じ段のカードで本文の開始位置をそろえる(見出しと本文の 2 行をサブグリッドで共有) */
.reasons:not(.r2) .reason{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0}
.reasons:not(.r2) .reason h3{align-self:start}
/* 「最短」は小さく、「1週間」を大きく見せる */
.span-note strong small{font:700 13px var(--font);margin-right:2px}
/* 途中で折り返したくない語句(「えらべるPay」に、最短1週間で など) */
.nw{white-space:nowrap}
html[lang="ja"] .ib-head>p{max-width:none}
/* コピーライトは .wrap も持つため、フッター段組みのグリッドが効いて左の 1 列目に押し込まれていた */
.ftr .wrap.copy{display:block}
/* 上部の数字の帯: 説明文が 2 行と 3 行に分かれて高さがでこぼこになるため、
   日本語版は 1200px 以上で余白を詰めて <br> の位置でだけ改行し、それより狭い幅では 2 列にする */
@media (min-width:1200px){html[lang="ja"] .trust-item{padding-inline:14px;gap:12px}html[lang="ja"] .trust-item p{white-space:nowrap}}
/* 2 列・1 列のときは数字の欄の幅をそろえ、説明文の書き出し位置を上下でそろえる */
@media (max-width:1199px){html[lang="ja"] .trust-item strong{min-width:104px}}
@media (min-width:901px) and (max-width:1199px){html[lang="ja"] .trust .wrap{grid-template-columns:1fr 1fr;row-gap:12px}html[lang="ja"] .trust-item:nth-child(3){border-left:0}}
/* 761〜860px はラベル列 96px に 14px の文字が入り「ポイ活機能あ／り」と折れるため、ラベル幅を文字に合わせる */
@media (min-width:761px) and (max-width:860px){html[lang="ja"] .ib-row{grid-template-columns:auto minmax(0,1fr) 52px}}

@media (max-width:760px){
  /* IPM のバー：ラベルが1文字ずつ折り返さないよう幅と文字サイズを調整 */
  .ib-row{grid-template-columns:96px 1fr 52px;gap:10px}
  .ib-row .lb{font-size:12px;line-height:1.4}
  /* 代表紹介：写真を上、コメントを下に */
  .ceo{flex-direction:column;align-items:flex-start;gap:14px}
  .ceo .ph,.ceo img.ph{width:96px;height:96px}
  .ceo-msg-body{padding:18px}
  /* フッターのコピーライトは小さく中央に */
  .copy{text-align:center;font-size:11px}
}
@media (max-width:520px){
  /* 導入の流れ：2列だと見出しが崩れるので1列に */
  .steps{grid-template-columns:1fr}
  .steps li{padding:18px 18px 16px}
  /* 最終CTA のボタンは横幅いっぱいに揃える */
  .final .ctas .btn{width:100%}
}

/* アプリ画面：暗い背景を切り抜いたダイアログ画像を、端末枠なしのカードとして浮かせる */
.phone-stage.duo .phone{background:none;padding:0;border-radius:0;box-shadow:none}
.phone-stage.duo .phone .screen{background:none;border-radius:0;overflow:visible}
.phone .screen img,.fimgs img,.realshot img{border-radius:0;box-shadow:none;filter:drop-shadow(0 18px 28px rgba(4,20,60,.28))}
.fimgs img,.realshot img{filter:drop-shadow(0 10px 20px rgba(18,69,168,.18))}

/* ===================================================
   デザインレビュー（小島さん）反映
   =================================================== */
/* 画面外周の白い縁（ブラウザ標準の余白）をなくす */
body{margin:0}
/* ファーストビューの強調語は黄色系 */
.fv h1 em{color:var(--coin)}
/* 課題カードの番号は水色、アイコンを添える */
.pain-top{display:flex;align-items:center;justify-content:space-between}
.pain .q{color:var(--sky)}
.pain-ic{width:40px;height:40px;border-radius:10px;background:var(--tint-2);color:var(--blue);display:grid;place-items:center}
/* 線のアイコン共通 */
.ico{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.effects b,.roles b{display:inline-flex;align-items:center;gap:8px}
.effects b .ico{color:#0b7a5d}
.roles div:first-child b .ico{color:var(--blue)}
.roles div:last-child b .ico{color:var(--coin-deep)}
/* 左右の枠は高さがそろって伸びるため、余った高さで折り返し後の行が下に押されないよう上に詰める */
.roles div{align-content:flex-start}
/* 事例のグラフは元のサイズより大きく引き伸ばさない（ぼやけ防止） */
.cfig img[src*="case-revenue"]{max-width:577px;align-self:center}
.cfig img[src*="case-installs"]{max-width:747px;align-self:center}
/* ランキングの図だけキャプションが画像の下にあり、上下に余白が空いて浮いて見えたため、
   他の図と同じくキャプションを上端に置き、画像は残りの領域の中央に置く */
.cfig.rank{justify-content:flex-start;text-align:left}
.cfig.rank figcaption{order:-1;align-self:stretch;font-size:13px;font-weight:700;color:var(--ink)}
.cfig.rank img{margin-block:auto}
/* 導入の流れ: 見出しの行数や本文の長さがカードごとに違っても、
   STEP 番号・見出し・本文・担当ラベルの位置を同じ行のカードでそろえる(サブグリッド) */
.steps li{display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:0;align-content:start}
.steps .who{align-self:start;justify-self:start}
html[lang="ja"] #flow .steps p{word-break:normal;text-wrap-style:auto}
@media (min-width:1001px){html[lang="ja"] #flow .steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* 仕組みの 3 枚のカード: 見出しの行数が違っても、ラベル・見出し・本文の開始位置を 3 枚でそろえる(横並びのときだけ)。
   本文と画像(効果のリスト)は .fbody にまとめ、画像は下端に寄せる */
.fbody{display:flex;flex-direction:column;gap:10px;flex:1}
.fnode>.fbody>p{font-size:13px;color:var(--ink-2)}
@media (min-width:901px){
  .flow2{grid-template-rows:auto auto 1fr;row-gap:10px}
  .fnode{display:grid;grid-row:1/span 3;grid-template-rows:subgrid;row-gap:10px}
  .farrow{grid-row:1/span 3}
  .fnode .who{justify-self:start;align-self:start}
}
/* 機能と画面のタブ: スマホ幅で 2 個・2 個・1 個と折り返してでこぼこになるため、1 行で横にスクロールさせる */
@media (max-width:760px){.tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-20px;padding-inline:20px}.tabs::-webkit-scrollbar{display:none}.tabs label{flex:none;white-space:nowrap}}