/* BUILDERS' APP — site.css / inner.css に足す分だけ */
.nav .logo .lock{width:170px}
.ft-brand.logo .lock{width:170px}
@media (max-width:900px){.nav .logo .lock{width:140px}}
.drawer .sis{font-size:12px;color:var(--ink2);margin-top:18px;border-bottom:1px solid var(--line);padding-bottom:4px}

/* ヒーロー左（価格） */
.price .kick{font-size:14px;font-weight:700;letter-spacing:.04em;margin-bottom:14px}
.price .was .till{margin-left:6px;font-size:11px;color:var(--ink2)}
.price .inc{grid-template-columns:repeat(3,auto)}

/* Why: 製品名に分類 */
.wcard h3 small{display:inline-block;margin-left:10px;font-size:11px;font-weight:400;color:var(--ink2);letter-spacing:.08em;vertical-align:middle}
.wcard .ul{display:inline-block;margin-top:14px}

/* Lineup スライド: 要点3つ */
.sl .side.r .nm .yomi{display:block;font-family:"Zen Kaku Gothic New",sans-serif;font-size:11px;letter-spacing:.18em;color:var(--ink2);font-weight:400;margin-top:4px}
.sl .pts{list-style:none;margin:0;padding:0;display:grid;gap:10px;max-width:46em}
.sl .pts li{display:grid;grid-template-columns:11em 1fr;gap:12px;font-size:12px;align-items:baseline}
.sl .pts b{font-weight:700}.sl .pts span{color:var(--ink2)}
.aprice .pr-row{display:flex;align-items:flex-end;gap:12px}
.aprice b{font-family:"Nimbus Sans",sans-serif;font-weight:400;font-size:34px;letter-spacing:-.03em;line-height:1}
.aprice.big b{font-size:clamp(40px,4vw,56px)}
.aprice .fix{display:grid;row-gap:3px;padding-bottom:4px}
.aprice .fix i{font-style:normal;font-size:11px;font-weight:700;letter-spacing:.12em;border:1px solid var(--ink);padding:2px 7px;border-radius:999px;white-space:nowrap}
.aprice .fix em{font-style:normal;font-size:11px;color:var(--ink2);white-space:nowrap}
.aprice .was{margin-top:6px;font-size:11px;color:var(--ink2);display:flex;gap:6px;align-items:baseline;white-space:nowrap}
.aprice .was s{font-family:"Nimbus Sans",sans-serif;font-size:13px}
.sum{grid-template-columns:1fr auto auto}

/* 設置に含まれるもの */
.svc .sh2{max-width:760px;margin-bottom:40px}.svc .sh2 .lead{margin-top:16px;font-size:14px;line-height:2;color:var(--ink2)}
.sgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
@media (max-width:900px){.sgrid{grid-template-columns:1fr 1fr;gap:10px}.sl .pts li{grid-template-columns:1fr;gap:2px}.sum{grid-template-columns:1fr auto;grid-template-areas:"l l" "m r"}}

/* 製品ページ */
.detail .hero4 .nm .yomi{display:block;font-size:11px;letter-spacing:.18em;color:var(--ink2);font-weight:400;margin-top:6px}
.alead{max-width:44em;margin-top:48px}.alead p{font-size:15.5px;line-height:2}.alead .fine{margin-top:14px;font-size:12px;color:var(--ink2)}.alead code{font-family:"Nimbus Sans",sans-serif;border:1px solid var(--line);padding:1px 6px;border-radius:4px}
.chg{margin-top:80px}
.chg-l{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 32px}
.chg-l li{padding-top:14px;border-top:1px solid var(--line)}
.chg-l i{font-family:"Nimbus Sans",sans-serif;font-style:normal;font-size:12px;color:var(--ink2);letter-spacing:.1em}
.chg-l b{display:block;margin-top:8px;font-size:16px;font-weight:700;line-height:1.5}
.chg-l p{margin-top:8px;font-size:13.5px;line-height:1.95;color:var(--ink)}
.scrs{margin-top:80px}
.scr-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 28px}
.scr img{width:100%;height:auto;border:1px solid var(--line);display:block}
.scr figcaption{margin-top:10px;font-size:12px;line-height:1.8;color:var(--ink2)}
.deep{margin-top:96px;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:56px;row-gap:28px;align-items:start}
.deep-h h2{font-size:clamp(22px,2.2vw,30px);font-weight:500;letter-spacing:-.02em;line-height:1.5}
.deep-h p{margin-top:16px;font-size:14.5px;line-height:2}
.deep-f{grid-column:2;grid-row:1/3;margin:0}.deep-f img{width:100%;height:auto;border:1px solid var(--line)}.deep-f figcaption{margin-top:10px;font-size:12px;color:var(--ink2);line-height:1.8}
.deep-l{grid-column:1;list-style:none;margin:0;padding:0;display:grid;gap:16px}
/* 見出しの b だけを block に。本文の <p> の中で強調に使う b まで折れていた（2026-08-25 修正） */
.deep-l > li > b{display:block;font-size:14px;font-weight:700}.deep-l p{margin-top:4px;font-size:13px;line-height:1.9;color:var(--ink)}
.deep .fine{grid-column:1/-1;font-size:12px;color:var(--ink2);line-height:1.9;max-width:60em}
.two2{margin-top:96px}
.two-g{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.two-g h4{font-size:14px;font-weight:700;padding-bottom:10px;border-bottom:1px solid var(--ink)}
.two-g ul{list-style:none;margin:12px 0 0;padding:0}.two-g li{font-size:13px;line-height:1.8;padding:6px 0 6px 16px;position:relative;border-bottom:1px solid var(--line)}
.two-g li::before{content:"";position:absolute;left:0;top:1.05em;width:6px;height:1px;background:var(--ink)}
.two-g ul.no li{color:var(--ink2)}.two-g ul.no li::before{width:6px;height:6px;border-radius:50%;border:1px solid var(--ink2);background:transparent;top:.95em;left:-1px}
.pbar{margin-top:96px;grid-template-columns:auto 1fr auto;gap:40px}
.pbar .pb-m b{display:block;font-size:12px;letter-spacing:.1em;color:var(--ink2)}.pbar .pb-m p{margin-top:6px;font-size:13px;line-height:1.9;max-width:34em}
.pbar .pb-r{display:grid;gap:12px;justify-items:start}
@media (max-width:900px){.chg-l,.scr-g,.two-g{grid-template-columns:1fr}.deep{grid-template-columns:1fr}.deep-f{grid-column:1;grid-row:auto}.deep-l{grid-column:1}.pbar{grid-template-columns:1fr;gap:20px}.chg,.scrs,.deep,.two2,.pbar{margin-top:56px}}

/* 導入の流れ */
.steps5{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;border-top:1px solid var(--ink);padding-top:28px}
.steps5 li i{font-family:"Nimbus Sans",sans-serif;font-style:normal;font-size:28px;line-height:1;letter-spacing:-.03em}
.steps5 li b{display:block;margin-top:10px;font-size:15px;font-weight:700}
.steps5 li p{margin-top:8px;font-size:12px;line-height:1.9;color:var(--ink2)}
.chk{list-style:none;margin:0;padding:0}.chk li{position:relative;padding:8px 0 8px 26px;border-bottom:1px solid var(--line);font-size:14px}
.chk li::before{content:"";position:absolute;left:0;top:.95em;width:14px;height:14px;border-radius:50%;border:1px solid var(--ink)}
.chk li::after{content:"";position:absolute;left:4px;top:1.15em;width:6px;height:3px;border-left:1.2px solid var(--ink);border-bottom:1.2px solid var(--ink);transform:rotate(-45deg)}
.gsec{grid-template-columns:280px 1fr}
.ptable-w{overflow-x:auto}
.ptable{width:100%;border-collapse:collapse;font-size:13.5px}
.ptable th,.ptable td{text-align:left;padding:14px 12px;border-bottom:1px solid var(--line);vertical-align:baseline}
.ptable thead th{font-size:11px;letter-spacing:.1em;color:var(--ink2);font-weight:400;border-bottom:1px solid var(--ink)}
.ptable tbody th a{font-family:"Nimbus Sans",sans-serif;font-size:16px;font-weight:700;letter-spacing:.04em;border-bottom:1px solid var(--ink)}.ptable tbody th small{display:block;font-size:11px;color:var(--ink2);margin-top:2px}
.ptable td b{font-family:"Nimbus Sans",sans-serif;font-size:20px;font-weight:400;letter-spacing:-.02em}.ptable td s{margin-left:8px;font-family:"Nimbus Sans",sans-serif;color:var(--ink2);font-size:12px}
@media (max-width:900px){.steps5{grid-template-columns:1fr 1fr;gap:18px 14px}.ptable{min-width:560px}}

/* 相談 */
.egrid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:48px;align-items:start}
.egrid .form select{width:100%;height:46px;border:1px solid var(--ink);background:#fff;font:inherit;padding:0 12px;border-radius:0;appearance:none;-webkit-appearance:none}
@media (max-width:900px){.egrid{grid-template-columns:1fr;gap:28px}}
.app .why-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.app .wcard{grid-template-columns:1fr;grid-template-rows:auto;padding:24px}
.app .wcard .pains{grid-column:1}.app .wcard h3,.app .wcard p,.app .wcard .ul{grid-column:1}
.app .wcard p{font-size:13.5px;line-height:1.95}
@media (max-width:900px){.app .why-grid{grid-template-columns:1fr}}
/* ヘッダー・フッターは compact の署名組み */
.nav .logo .lock-c{width:auto;height:52px}
.ft-brand.logo .lock-c{width:auto;height:64px}
@media (max-width:900px){.nav .logo .lock-c{height:44px}}
.price .kick{margin-bottom:16px}
.sl .pts li{grid-template-columns:13em 1fr}
.app .hero .txt p.ph{margin-top:14px}
.app .hero .txt .pill{margin-top:22px}
.app .svc h2{font-size:clamp(26px,2.6vw,38px);line-height:1.4;letter-spacing:-.02em}
@media (max-width:900px){.app .svc h2{font-size:24px}}
@media (max-width:900px){.app .top{min-height:0;display:block}.app .hero{display:block;flex:none;padding:14px 0 18px}.app .hero-g{display:block}.app .txt{display:block}}
.app .hero .txt p.ph{padding:0!important;margin-top:14px!important}
/* Flow: 5段をイラストで */
.steps5{grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;border-top:0;padding-top:0}
.steps5 li{position:relative;padding-top:0}
.steps5 li .il{width:100%;aspect-ratio:4/3;display:grid;place-items:center;margin-bottom:14px;border-bottom:1px solid var(--line)}
.steps5 li .il img{width:78%;height:auto;display:block}
.steps5 li i{font-size:12px;letter-spacing:.12em;color:var(--ink2)}
.steps5 li b{margin-top:6px}
.steps5 li:not(:last-child)::after{content:"";position:absolute;right:-14px;top:36%;width:8px;height:8px;border-top:1px solid var(--ink);border-right:1px solid var(--ink);transform:rotate(45deg)}
@media (max-width:900px){.steps5{grid-template-columns:1fr 1fr;gap:22px 16px}.steps5 li:not(:last-child)::after{display:none}.steps5 li .il img{width:70%}}
/* 価格表: 製品のスクショつき */
.ptable tbody th{width:46%}
.pth{display:grid;grid-template-columns:150px 1fr;gap:14px;align-items:center;border:0!important}
.pth img{width:150px;height:auto;border:1px solid var(--line);display:block}
.pth span b{display:block;font-family:"Nimbus Sans",sans-serif;font-size:16px;font-weight:700;letter-spacing:.04em}
.pth span small{display:block;font-size:11.5px;color:var(--ink2);margin-top:4px;line-height:1.6}
.ptable tbody th a{font-size:inherit;border-bottom:0}
@media (max-width:900px){.pth{grid-template-columns:110px 1fr}.pth img{width:110px}.ptable{min-width:640px}}
/* 相談: 右の案内は縦積み */
.egrid .ways{display:grid;grid-template-columns:1fr;gap:12px}
.egrid .ways .way{padding:18px 20px}
/* 横長ロゴ（確定） */
.nav .logo .lock{width:188px;height:auto}
.ft-brand.logo .lock{width:188px;height:auto}
@media (max-width:900px){.nav .logo .lock{width:150px}}
@media (max-width:900px){.app .gsec{grid-template-columns:1fr;gap:16px}}
.cf{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:0}
.cf li{display:grid;grid-template-columns:12em 1fr;gap:14px;padding:12px 0;border-top:1px solid var(--line);font-size:13.5px;line-height:1.9}
.cf li:last-child{border-bottom:1px solid var(--line)}
.cf li b{font-weight:700}.cf li span{color:var(--ink)}
@media (max-width:900px){.cf li{grid-template-columns:1fr;gap:4px}}
/* Setup カード: イラスト */
.app .scard .sil{width:130px;margin:14px auto 10px}.app .scard .sil img{width:100%;height:auto;display:block}
.app .scard{display:flex;flex-direction:column}.app .scard .more{margin-top:auto;padding-top:14px}
/* Why カード: 下端を揃える・詰まりをほどく */
.app .wcard{display:flex;flex-direction:column;padding:28px 26px 24px}
.app .wcard .pains{margin-bottom:18px}
.app .wcard h3{margin-top:0}
.app .wcard .tg{font-size:15px;font-weight:700;margin-top:10px;line-height:1.6}
.app .wcard p{margin-top:10px}
.app .wcard .ul{margin-top:auto;padding-top:22px;align-self:flex-start}
/* Lineup: 下の要約に空気を入れる */
.app .sum{padding-top:36px;margin-top:36px;column-gap:64px;align-items:center}
.app .sl .pts{gap:14px}.app .sl .pts li{font-size:13px;grid-template-columns:13.5em 1fr}
.app .sl .pts b{letter-spacing:.01em}
@media (max-width:900px){.app .sum{padding-top:20px;margin-top:20px}.app .scard .sil{width:96px}}
/* Why: 左にイラスト（WEB と同じ組み） */
.app .wcard{display:grid;grid-template-columns:150px 1fr;grid-template-rows:auto auto auto auto 1fr;column-gap:22px;padding:24px}
.app .wcard .ico{grid-row:1/6;align-self:start;padding-top:6px}.app .wcard .ico img{width:100%;height:auto}
.app .wcard .pains,.app .wcard h3,.app .wcard .tg,.app .wcard p,.app .wcard .ul{grid-column:2}
.app .wcard .ul{align-self:end;margin-top:14px}
.app .why-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.app .wcard{grid-template-columns:1fr}.app .wcard .ico{grid-row:auto;max-width:140px;margin:0 auto}.app .wcard .pains,.app .wcard h3,.app .wcard .tg,.app .wcard p,.app .wcard .ul{grid-column:1}}
/* 画面の横帯（製品ページ） */
.smap{margin-top:80px}
.pgs .pg small{display:block;font-size:11.5px;color:var(--ink2);line-height:1.7;margin-top:4px;white-space:normal}

@media (max-width:900px){.smap{margin-top:56px}}
/* Why: イラストは上に（3列でも詰まらない） */
.app .wcard{grid-template-columns:1fr;grid-template-rows:auto;column-gap:0;padding:24px 26px 22px}
.app .wcard .ico{grid-row:auto;width:150px;margin:0 auto 10px;padding:0}
.app .wcard .pains,.app .wcard h3,.app .wcard .tg,.app .wcard p,.app .wcard .ul{grid-column:1}
.app .wcard .ul{align-self:start;margin-top:auto;padding-top:18px}
@media (max-width:900px){
  .app .why-grid{grid-template-columns:1fr!important;gap:12px}
  .app .wcard .ico{width:120px}
  .aprice b{font-size:28px;white-space:nowrap}.aprice .pr-row{gap:10px}
}
/* Why: 実画面のスクショを上に */
.app .wcard .wshot{display:block;margin:-24px -26px 18px;border-bottom:1px solid var(--line);overflow:hidden;aspect-ratio:16/9;background:var(--bg2)}
.app .wcard .wshot img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.app .wcard:hover .wshot img{transform:scale(1.03)}
@media (max-width:900px){.app .wcard .wshot{margin:-24px -26px 16px}}

/* Manifesto: 箱をやめて、01→02→03 の流れで読ませる */
.manif{padding:120px var(--pad) 0}
.manif .wh{margin-bottom:40px}
/* ===== 製品ページ: 課題→解決→効果→画面→機能→価格 ===== */
.pstep{display:grid;grid-template-columns:180px minmax(0,1fr);column-gap:48px;margin-top:96px;padding-top:28px;border-top:1px solid var(--ink)}
.pk{display:flex;flex-direction:column;gap:6px}.pk i{font-family:"Nimbus Sans",sans-serif;font-style:normal;font-size:28px;letter-spacing:-.03em;line-height:1}.pk span{font-size:12px;letter-spacing:.18em;color:var(--ink2)}
.pb h2{font-size:clamp(22px,2vw,28px);font-weight:500;letter-spacing:-.02em;line-height:1.5}
.pb h2.big{font-size:clamp(30px,3.2vw,46px);letter-spacing:-.03em;line-height:1.35;font-weight:700}
.pb .lead{margin-top:18px;font-size:15px;line-height:2;max-width:40em}
.pts3{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.pts3 li{padding-top:14px;border-top:1px solid var(--line)}.pts3 i{font-family:"Nimbus Sans",sans-serif;font-style:normal;font-size:12px;color:var(--ink2);letter-spacing:.1em}
.pts3 b{display:block;margin-top:8px;font-size:17px;font-weight:700;line-height:1.5}.pts3 p{margin-top:8px;font-size:13.5px;line-height:1.9;color:var(--ink2)}
.chg-l{margin-top:24px;gap:22px 28px}.chg-l b{font-size:15px}.chg-l p{font-size:13px;color:var(--ink2)}
.stats{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.stats li{border-top:1px solid var(--line);padding-top:12px}.stats b{display:block;font-family:"Nimbus Sans",sans-serif;font-weight:400;font-size:clamp(34px,3.4vw,48px);letter-spacing:-.03em;line-height:1}.stats span{display:block;margin-top:6px;font-size:12px;color:var(--ink2);letter-spacing:.04em}
.feat-chips{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.feat-chips li{font-size:12px;line-height:1.5;padding:8px 12px;border:1px solid var(--ink);border-radius:999px;background:#fff}
.noin{margin-top:22px;border-top:1px solid var(--line);padding-top:12px}.noin summary{cursor:pointer;font-size:13px;color:var(--ink2);list-style:none;display:inline-flex;align-items:center;gap:8px}.noin summary::before{content:"+";font-family:"Nimbus Sans";font-size:16px;line-height:1}.noin[open] summary::before{content:"−"}
.noin ul{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 24px}.noin li{font-size:12px;color:var(--ink2);padding-left:14px;position:relative;line-height:1.7}.noin li::before{content:"";position:absolute;left:0;top:.75em;width:6px;height:6px;border-radius:50%;border:1px solid var(--ink2)}.noin .fine{margin-top:10px}
.price-s .pgrid2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.price-s .aprice.big b{font-size:clamp(56px,6vw,84px);letter-spacing:-.045em}.price-s .aprice.big b i{font-style:normal;font-size:.58em;vertical-align:.18em;margin-right:.04em}
.price-s .fix{display:grid;row-gap:2px;padding:0 0 12px 16px;border-left:1px solid var(--ink);align-self:end}.price-s .fx1{font-size:14px;font-weight:700;letter-spacing:.08em}.price-s .fx2{font-size:11px;color:var(--ink2)}
.price-s .pnote{margin-top:18px;font-size:13px;line-height:1.95;color:var(--ink);max-width:30em}
.price-s .incl-h{display:block;font-size:12px;letter-spacing:.12em;color:var(--ink2);margin-bottom:6px}
.price-s .pbtn{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-top:22px}
.pbar{display:none}
@media (max-width:900px){.pstep{grid-template-columns:1fr;row-gap:14px;margin-top:64px}.pts3{grid-template-columns:1fr;gap:16px}.stats{grid-template-columns:1fr 1fr}.price-s .pgrid2{grid-template-columns:1fr;gap:24px}.noin ul{grid-template-columns:1fr}}
/* 3列の行をそろえる（subgrid）: 番号／声／見出し／本文 が横一線に */
@media (min-width:901px){
  .pts3{grid-template-rows:auto auto auto}.pts3 li{display:grid;grid-row:span 3;grid-template-rows:subgrid}
  .chg-l{grid-template-rows:auto auto auto}.chg-l li{display:grid;grid-row:span 3;grid-template-rows:subgrid;align-content:start}
  .app .why-grid{grid-template-rows:auto auto auto auto auto auto}.app .wcard{display:grid;grid-row:span 6;grid-template-rows:subgrid}.app .wcard .ul{align-self:end}
}
.pg img{height:auto}
.minis .mini img{height:auto}
/* SP: 製品ページの間延びを詰める */
@media (max-width:900px){
  .pstep{margin-top:48px;padding-top:20px;row-gap:10px}
  .pk{flex-direction:row;align-items:baseline;gap:10px}.pk i{font-size:20px}
  .pb h2{font-size:20px}.pb h2.big{font-size:26px}
  .pb .lead{margin-top:12px;font-size:14px}
  .pts3{margin-top:14px;gap:0}
  .pts3 li{padding:14px 0 16px;border-top:1px solid var(--line)}
  .pts3 b{font-size:15.5px;margin-top:6px}.pts3 p{font-size:13px;margin-top:6px}
  .chg-l{margin-top:14px;gap:0}.chg-l li{padding:14px 0 16px}
  .stats{margin-top:12px;gap:10px}.stats b{font-size:30px}
  .feat-chips{margin-top:18px;gap:6px}.feat-chips li{font-size:11.5px;padding:6px 10px;line-height:1.5}
  .deep{margin-top:48px}
  .price-s .aprice.big b{font-size:44px}
}
.pstep,.smap{scroll-margin-top:90px}
/* SP: ヒーロー＋流れる帯を1画面に収める（帯の反射の下端＝画面の下端） */
@media (max-width:900px){
  .app .top{min-height:calc(100svh - 72px)!important;display:flex!important;flex-direction:column;overflow:hidden}
  .app .hero{flex:1 1 auto;display:flex!important;align-items:center;padding:10px 0 8px}
  .app .hero-g{display:block!important;width:100%}
  .app .hero .txt{display:block}
  .app .flow{flex:0 0 auto;margin-top:0;padding-top:0}
  .app .flow-track{padding-bottom:40px}
  .app .flow-track img{height:112px;-webkit-box-reflect:below 4px linear-gradient(rgba(255,255,255,0) 55%,rgba(255,255,255,.25))}
}
@media (max-width:900px){
  .app .hero{align-items:center}
  .app .flow-track{padding-bottom:48px}
  .app .flow-track img{height:130px}
}


/* ===== SP ファーストビュー（確定・両サイト共通） ===== */
.sp2{display:none}
@media (max-width:900px){
  .sp2{display:inline}
  .top{min-height:calc(100svh - 72px)!important;display:flex!important;flex-direction:column;overflow:hidden}
  .hero{flex:1 1 auto;display:flex!important;align-items:center;padding:0}
  .hero-g{display:block!important;width:100%;padding:0 22px}
  .name-wrap{display:none!important}
  .txt{max-width:none;margin:0!important}
  .txt h1{font-size:30px;line-height:1.5;letter-spacing:-.03em;font-weight:700}
  .txt .tag{margin-top:20px;font-size:15.5px;font-weight:700;letter-spacing:.01em}
  .txt p.ph{margin-top:14px;font-size:13.5px;line-height:2}
  .txt p.ph+p.ph{display:none}
  .txt .pill{margin-top:24px;height:52px;padding:0 26px;font-size:14.5px}
  .flow{flex:0 0 auto;margin:0!important;padding:0!important;border:0}
  .flow-track{padding-bottom:46px}
  .flow-track img{height:146px}
  .hl{display:inline;background:linear-gradient(#E6E6E6,#E6E6E6) no-repeat 0 78%/100% .40em;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 .04em}
  .hl::after{display:none}
}
@media (max-width:900px){
  .txt h1{font-size:clamp(30px,8.6vw,38px);line-height:1.42;letter-spacing:-.035em}
  .txt .tag{margin-top:18px;font-size:15px}
  .txt p.ph{margin-top:12px;font-size:13px;line-height:1.92}
  .txt .pill{margin-top:20px;height:50px}
  .flow-track{padding-bottom:42px}
  .flow-track img{height:132px}
  .hero-g{padding:0 20px}
}
@media (max-width:900px){
  .txt p.ph{margin-top:14px;font-size:14.5px;line-height:1.95;letter-spacing:.01em}
  .txt .tag{margin-top:18px;font-size:16px}
  .txt .pill{display:flex;width:fit-content;margin-left:auto;margin-right:auto;margin-top:24px}
  .flow-track img{height:126px}
  .flow-track{padding-bottom:40px}
}
@media (max-width:900px){
  /* 本文は文節でだけ折る（語の途中で切らない） */
  .txt p.ph{text-wrap:pretty}
  .txt p.ph span{display:inline-block;white-space:nowrap}
}
@media (max-width:370px){
  .txt p.ph{font-size:13.5px}
}
/* ヒーローのボタンを大きく */
.txt .pill.lg,.hero .pill.lg{height:56px;padding:0 34px;font-size:15px;letter-spacing:.02em}
@media (max-width:900px){
  .txt .pill{height:56px!important;padding:0 30px!important;font-size:15.5px!important;margin-top:22px}
  .flow-track img{height:120px}
  .flow-track{padding-bottom:38px}
}
/* ===== Lineup カルーセルを WEB と同じ落ち着きに ===== */
@media (min-width:901px){
  .app .sl .side.r .nm{font-size:clamp(20px,1.9vw,26px);font-weight:700;line-height:1.45}
  .app .sl .side.r .nm .yomi{margin-top:6px}
  .app .sl .side.r .en{margin-top:10px;font-size:12px;line-height:1.8;color:var(--ink2);font-family:"Zen Kaku Gothic New",sans-serif;letter-spacing:.02em}
  .app .feat .sl .shot{background:var(--bg2)}
  .app .sum{grid-template-columns:auto auto auto;justify-content:space-between;column-gap:40px;align-items:center}
  .app .sl .pts{display:grid;grid-template-columns:repeat(3,minmax(0,210px));gap:0 26px;max-width:none}
  .app .sl .pts li{display:block;border-top:1px solid var(--line);padding-top:12px}
  .app .sl .pts i{font-family:"Nimbus Sans",sans-serif;font-style:normal;font-size:11px;letter-spacing:.1em;color:var(--ink2)}
  .app .sl .pts b{display:block;margin-top:6px;font-size:14px;line-height:1.5}
  .app .sl .pts span{display:block;margin-top:5px;font-size:12px;line-height:1.75;color:var(--ink2)}
}
.aprice .pr-row small{font-family:"Zen Kaku Gothic New",sans-serif;font-size:11px;color:var(--ink2);margin-left:10px;white-space:nowrap}
@media (max-width:900px){
  .app .sl .pts{display:grid;gap:8px}
  .app .sl .pts li{display:grid;grid-template-columns:auto 1fr;column-gap:8px}
  .app .sl .pts i{display:none}
  .app .sl .pts b{font-size:13px}.app .sl .pts span{font-size:12px;grid-column:1/-1}
}
@media (max-width:900px){
  .app .sum{grid-template-columns:minmax(0,1fr) auto!important;grid-template-areas:"l l" "m r"!important;column-gap:12px}
  .app .sum-l{grid-area:l;min-width:0}
  .app .sl .pts{grid-template-columns:1fr!important;gap:12px}
  .app .sl .pts li{grid-template-columns:1fr!important;min-width:0}
  .app .sl .pts b{display:block}
  .app .sl .pts span{display:block;grid-column:1!important;margin-top:2px}
  .app .sum-m{grid-area:m}.app .sum-r{grid-area:r;justify-self:end}
}
@media (max-width:900px){.app .sum-m .aprice .pr-row{flex-wrap:wrap;align-items:baseline}.app .sum-m .aprice .pr-row small{margin-left:0;width:100%;margin-top:2px;font-size:11px}.app .sum-m{min-width:0}}
@media (min-width:901px){.app .txt p{max-width:none}.app .txt p.ph{max-width:none}}


/* ============================================================
   BUILDERS' APP の色 — 水（2026-08-24 B案で確定）
   水面・しずく・マーカーの3か所だけ。ボタンと文字は黒のまま。
   ============================================================ */
body.app{--water:#EBF0F2;--drop:#DCE5E9;--mark:#E0E9ED}
.app .hl{background-image:none}
.app .hl::after{background:var(--mark)}
.app .hl2{background-image:linear-gradient(var(--mark),var(--mark))}
@media (max-width:900px){.app .hl{background-image:linear-gradient(var(--mark),var(--mark))}}

/* ============================================================
   Lineup — 3本を縦に、全部並べる（カルーセル廃止）
   ============================================================ */
.lrows{display:grid;border-top:1px solid var(--line);margin-top:26px}
.lrow{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:44px;align-items:start;padding:40px 0;border-bottom:1px solid var(--line)}
.lshot{display:block;overflow:hidden;background:#f4f4f4}
.lshot img{width:100%;height:auto;display:block;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.lshot:hover img{transform:scale(1.02)}
.ltxt{display:flex;flex-direction:column;min-width:0}
.lmeta{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.08em;color:var(--ink2)}
.lst{border:1px solid var(--line);padding:2px 9px;border-radius:999px;font-size:11px}
.lnm{font-family:"Nimbus Sans",sans-serif;font-size:30px;letter-spacing:-.01em;margin:12px 0 0;line-height:1.1}
.lnm .yomi{font-family:"Zen Kaku Gothic New",sans-serif;font-size:11px;letter-spacing:.18em;color:var(--ink2);font-weight:400;margin-left:12px;vertical-align:middle}
.ltg{font-size:15px;font-weight:700;margin:12px 0 0;line-height:1.6}
.lpain{margin:14px 0 0;font-size:13.5px;font-weight:700}
.lpain span{display:block;font-size:11px;font-weight:400;letter-spacing:.1em;color:var(--ink2);margin-bottom:5px}
.lrow .pts{list-style:none;margin:22px 0 0;padding:20px 0 0;border-top:1px solid var(--line);display:grid;gap:13px}
.lrow .pts li{display:grid;grid-template-columns:1.7em 12.5em 1fr;gap:10px;font-size:12px;align-items:baseline}
.lrow .pts i{font-style:normal;font-size:11px;color:var(--ink2)}
.lrow .pts b{font-weight:700}
.lrow .pts span{color:var(--ink2);line-height:1.85}
.lfoot{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-top:28px;flex-wrap:wrap}
.lpr b{font-family:"Nimbus Sans",sans-serif;font-size:26px;letter-spacing:-.01em;display:block;line-height:1.1}
.lpr small{font-size:11px;color:var(--ink2);letter-spacing:.04em}
.lacts{display:flex;align-items:center;gap:18px}
.app .feat .more{display:flex;align-items:center;justify-content:flex-start;gap:22px;margin-top:38px;flex-wrap:wrap;padding-left:0;padding-right:0}
@media (max-width:900px){
  .lrow{grid-template-columns:1fr;gap:18px;padding:28px 0}
  .lnm{font-size:25px}
  .lrow .pts li{grid-template-columns:1.5em 1fr}
  .lrow .pts li b,.lrow .pts li span{grid-column:2}
  .lfoot{margin-top:22px}
  .lacts{gap:14px}
}

/* ============================================================
   /lineup/ — 受け持ちの図 ／ 比較表 ／ 共通の価格
   ============================================================ */
.lineup .lmap-s,.lineup .ltab-s,.lineup .ldetail,.lineup .lprice{margin-top:76px}
.lineup .cta{margin-top:90px}
.lp-list{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.lp-list li{background:#fff;padding:24px 26px}
.lp-list b{display:block;font-size:14px;margin-bottom:9px}
.lp-list span{font-size:12px;color:var(--ink2);line-height:1.95}
.lp-more{margin-top:28px}
@media (max-width:760px){.lp-list{grid-template-columns:1fr}.lp-list li{padding:20px 22px}}

/* Lineup セクションの器を、他のセクションと同じ左右に揃える（カルーセル前提の全幅をやめた） */
.app .feat{padding:120px var(--pad) 110px}
.app .feat .fh{padding-left:0;padding-right:0}
.app .lrow .pts li{grid-template-columns:1.7em 14em 1fr}
@media (max-width:900px){
  .app .feat{padding:80px 20px 72px}
  .app .feat .fh{padding:0 0 24px}
  .app .lrow .pts li{grid-template-columns:1.5em 1fr}
}

/* 比較表：横スクロールしても、行の名前が残るように */
.cmp3 th{position:sticky;left:0;background:#fff;z-index:2}
.cmp3 thead th{z-index:3}

/* SP：比較表は列ごとに吸い付かせる（中途半端な位置で止まると読めないため） */
@media (max-width:900px){
  .tw{scroll-snap-type:x mandatory;scroll-padding-left:110px}
  .cmp3 td{scroll-snap-align:start}
}

/* ============================================================
   Lineup — 横3つのサムネイル（増えたら3つずつ折り返す）
   ============================================================ */
.lcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:26px}
.lcard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);padding:0 0 22px;color:inherit;transition:border-color .3s ease}
.lcard:hover{border-color:var(--ink)}
.lc-im{display:block;overflow:hidden;background:#f4f4f4;border-bottom:1px solid var(--line)}
.lc-im img{width:100%;height:auto;display:block;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.lcard:hover .lc-im img{transform:scale(1.03)}
.lc-meta{display:flex;align-items:center;gap:10px;margin:18px 22px 0;font-size:11px;letter-spacing:.08em;color:var(--ink2)}
.lc-meta .lst{border:1px solid var(--line);border-radius:999px;padding:2px 8px;font-size:10px}
.lc-nm a{color:inherit}
.lc-nm{font-family:"Nimbus Sans",sans-serif;font-size:25px;letter-spacing:-.01em;line-height:1.1;margin:11px 22px 0}
.lc-nm .yomi{font-family:"Zen Kaku Gothic New",sans-serif;font-size:11px;letter-spacing:.16em;color:var(--ink2);font-weight:400;margin-left:10px;vertical-align:middle}
.lc-tg{margin:11px 22px 0;font-size:13.5px;font-weight:700;line-height:1.65}
.lc-pain{margin:9px 22px 0;font-size:12px;color:var(--ink2);line-height:1.8}
.lc-b{display:flex;flex-direction:column;flex:1;min-width:0}
.lc-foot{margin:auto 22px 0;padding-top:18px}
.lc-pr b{font-family:"Nimbus Sans",sans-serif;font-size:21px;letter-spacing:-.01em;display:block;line-height:1.1}
.lc-pr small{font-size:11px;color:var(--ink2)}
.lc-act{margin-top:14px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
@media (max-width:1080px){.lcards{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}
@media (max-width:700px){
  .lcards{grid-template-columns:1fr;gap:14px}
  .lc-nm{font-size:22px}
  .lc-meta,.lc-nm,.lc-tg,.lc-pain{margin-left:18px;margin-right:18px}
  .lc-act{gap:14px}
  .lc-foot{margin-left:18px;margin-right:18px;padding-top:15px}
}

/* マーカーは文字に少しかぶせる（PCで下に離れて引かれていた） */
.app .hl::after{bottom:.13em;height:.46em}

/* Setup のカード：下端を揃える（高さの決まり方を1つにする） */

/* 末尾CTA：デモと相談を並べる */
.cta-acts{display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap;margin-top:26px}

/* CTA の並びを本文の左端に合わせる */
.cta-acts{justify-content:flex-start}

/* ============================================================
   Company（BA）— 数字の3枚
   ============================================================ */
.cnums{list-style:none;margin:10px 0 0;padding:22px 0 0;border-top:1px solid var(--ink);display:grid;gap:12px}
.cnums li{display:grid;grid-template-columns:12em 1fr;gap:20px;align-items:baseline;padding-bottom:12px;border-bottom:1px solid var(--line)}
.cnums b{font-family:"Nimbus Sans",sans-serif;font-size:20px;letter-spacing:-.01em}
.cnums span{font-size:13px;color:var(--ink2);line-height:1.8}
@media (max-width:640px){.cnums li{grid-template-columns:1fr;gap:2px}.cnums b{font-size:18px}}

/* ============================================================
   Price — プライスカード3枚
   ============================================================ */
.prcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:34px}
.prcard{display:flex;flex-direction:column;border:1px solid var(--ink);background:#fff;padding:26px 24px 24px}
.prc-h .lno{font-size:11px;letter-spacing:.1em;color:var(--ink2)}
.prc-h h3{font-family:"Nimbus Sans",sans-serif;font-size:26px;letter-spacing:-.01em;line-height:1.1;margin:10px 0 0;font-weight:400}
.prc-h h3 .yomi{font-family:"Zen Kaku Gothic New",sans-serif;font-size:11px;letter-spacing:.16em;color:var(--ink2);margin-left:10px;vertical-align:middle}
.prc-h p{margin-top:10px;font-size:12px;color:var(--ink2);line-height:1.8}
.prc-pr{margin-top:20px;padding:18px 0 16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.prc-pr b{font-family:"Nimbus Sans",sans-serif;font-size:32px;letter-spacing:-.02em;line-height:1}
.prc-pr small{font-size:11px;color:var(--ink2)}
.prc-zero{margin-left:auto;font-size:11px;border:1px solid var(--ink);padding:3px 9px;border-radius:999px;white-space:nowrap}
.prc-inc{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:9px}
.prc-inc li{font-size:12px;color:var(--ink2);line-height:1.7;padding-left:16px;position:relative}
.prc-inc li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:1px;background:var(--ink2)}
.prc-act{margin-top:auto;padding-top:24px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.pnote{margin-top:84px}
.opt-l{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.opt-l li{background:#fff;padding:24px 26px}
.opt-l b{display:block;font-size:14.5px;margin-bottom:9px}
.opt-l b small{font-size:11px;color:var(--ink2);font-weight:400;margin-left:7px}
.opt-l span{font-size:12px;color:var(--ink2);line-height:2}
.pnote-more{margin-top:30px;display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.price-p .cta{margin-top:90px}
@media (max-width:980px){.prcards{grid-template-columns:1fr;gap:14px}.opt-l{grid-template-columns:1fr}}

/* ============================================================
   受け持ちの相関図（PC=時間軸／SP=縦のつながり）
   ============================================================ */
.rel{margin-top:24px}
.rel svg{width:100%;height:auto;font-family:"Zen Kaku Gothic New","Hiragino Sans",sans-serif}
.rel .nm{font-family:"Nimbus Sans",sans-serif;font-size:19px;fill:#111}
.rel .cat{font-size:11px;fill:#707070;letter-spacing:.06em}
.rel .sub{font-size:12px;fill:#707070}
.rel .ax{font-size:11px;fill:#707070;letter-spacing:.04em}
.rel .lane{font-size:11px;fill:#707070;letter-spacing:.08em}
.rel .rel{font-size:11.5px;fill:#111}
.rel text.rel{font-size:11.5px;fill:#111}
.rel .rel-pc{display:block}
.rel .rel-sp{display:none}
@media (max-width:820px){.rel .rel-pc{display:none}.rel .rel-sp{display:block}}
.lm-note{margin-top:20px;font-size:12px;color:var(--ink2);line-height:1.95;max-width:54em}

/* ============================================================
   3本の違い（比較カード）
   ============================================================ */
.ccards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:30px}
.ccard{display:flex;flex-direction:column;border:1px solid var(--line);background:#fff}
.ccard:hover{border-color:var(--ink)}
.cc-im{display:block;overflow:hidden;background:#f4f4f4;border-bottom:1px solid var(--line)}
.cc-im img{width:100%;height:auto;display:block;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.ccard:hover .cc-im img{transform:scale(1.03)}
.cc-b{display:flex;flex-direction:column;flex:1;padding:20px 22px 22px}
.cc-meta{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.08em;color:var(--ink2)}
.cc-meta .lst{border:1px solid var(--line);border-radius:999px;padding:2px 8px;font-size:10px}
.cc-nm{font-family:"Nimbus Sans",sans-serif;font-size:24px;letter-spacing:-.01em;line-height:1.1;margin:10px 0 0;font-weight:400}
.cc-nm .yomi{font-family:"Zen Kaku Gothic New",sans-serif;font-size:11px;letter-spacing:.16em;color:var(--ink2);margin-left:10px;vertical-align:middle}
.cc-tg{margin:10px 0 0;font-size:13.5px;font-weight:700;line-height:1.6}
.cc-dl{margin:18px 0 0;padding:16px 0 0;border-top:1px solid var(--line)}
.cc-dl dt{font-size:10px;letter-spacing:.12em;color:var(--ink2);margin-top:14px}
.cc-dl dt:first-child{margin-top:0}
.cc-dl dd{margin:6px 0 0;font-size:12px;line-height:1.8;color:var(--ink2)}
.cc-dl dd.cc-pain{color:var(--ink);font-weight:700}
.cc-pts{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.cc-pts li{padding-left:14px;position:relative;line-height:1.7}
.cc-pts li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:1px;background:var(--ink2)}
.cc-dl .chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.cc-dl .chips span{border:1px solid var(--line);padding:3px 8px;font-size:11px;line-height:1.5;color:var(--ink2)}
.cc-dl .chips b{font-family:"Nimbus Sans",sans-serif;font-size:12px;color:#111;margin-right:4px}
.cc-foot{margin-top:auto;padding-top:20px}
.cc-pr b{font-family:"Nimbus Sans",sans-serif;font-size:21px;letter-spacing:-.01em;display:block;line-height:1.1}
.cc-pr small{font-size:11px;color:var(--ink2)}
.cc-act{margin-top:14px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
@media (max-width:1080px){.ccards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.ccards{grid-template-columns:1fr;gap:14px}.cc-b{padding:18px 18px 20px}}

/* flow の価格：数字を1つ大きく、条件は小さく */
.fprice{display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:center;border:1px solid var(--ink);padding:26px 28px}
.fp-main b{font-family:"Nimbus Sans",sans-serif;font-size:44px;letter-spacing:-.02em;line-height:1;display:block}
.fp-main span{display:block;margin-top:8px;font-size:11.5px;color:var(--ink2)}
.fp-main em{display:inline-block;font-style:normal;margin-left:10px;border:1px solid var(--ink);color:var(--ink);border-radius:999px;padding:2px 9px;font-size:11px}
.fp-sub{list-style:none;margin:0;padding:0 0 0 34px;border-left:1px solid var(--line);display:grid;gap:10px}
.fp-sub b{font-family:"Nimbus Sans",sans-serif;font-size:15px;margin-right:10px}
.fp-sub span{font-size:12px;color:var(--ink2)}
.fp-more{margin-top:22px}
@media (max-width:760px){.fprice{grid-template-columns:1fr;gap:20px;padding:22px 20px}.fp-sub{padding:18px 0 0;border-left:0;border-top:1px solid var(--line)}.fp-main b{font-size:36px}}

/* ============================================================
   Why — 声 → 転換 → 結果。3つとも形を変える
   ============================================================ */
.mf-h{max-width:46em}
.mf-h h2{margin-top:16px;font-size:clamp(26px,3vw,40px);line-height:1.4;letter-spacing:-.03em;font-weight:700}
.mf-lead{margin-top:18px;font-size:14px;line-height:2.05;color:var(--ink2);max-width:38em}
.mf{list-style:none;margin:56px 0 0;padding:0}
.mf-s{display:grid;grid-template-columns:170px minmax(0,1fr);gap:48px;padding:40px 0;border-top:1px solid var(--line)}
.mf-s:last-child{border-bottom:1px solid var(--line)}
.mf-k i{font-family:"Nimbus Sans",sans-serif;font-style:normal;font-size:34px;letter-spacing:-.02em;line-height:1;display:block;color:var(--ink)}
.mf-k span{display:block;margin-top:10px;font-size:11px;letter-spacing:.14em;color:var(--ink2)}
.mf-c h3{font-size:21px;font-weight:700;line-height:1.55;letter-spacing:-.02em}
.mf-c>p{margin-top:16px;font-size:13.5px;line-height:2.05;color:var(--ink2);max-width:40em}
.mf-q{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:10px;max-width:40em}
.mf-q li{font-size:14.5px;line-height:1.75;padding:2px 0 2px 18px;border-left:2px solid var(--mark)}
.mf-q li::before{content:"「"}
.mf-q li::after{content:"」"}
.mf-turn .mf-c h3{font-size:clamp(22px,2.5vw,30px);line-height:1.45}
.mf-turn .mf-c>p{margin-top:18px}
.mf-f{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:22px}
.mf-f>div{background:#fff;padding:16px 16px 14px}
.mf-f b{font-family:"Nimbus Sans",sans-serif;font-size:19px;letter-spacing:-.01em;display:block;line-height:1.2}
.mf-f span{display:block;margin-top:6px;font-size:11px;color:var(--ink2);line-height:1.6}
@media (max-width:900px){
  .mf{margin-top:36px}
  .mf-s{grid-template-columns:1fr;gap:14px;padding:28px 0}
  .mf-k{display:flex;align-items:baseline;gap:12px}
  .mf-k i{font-size:22px}
  .mf-k span{margin-top:0}
  .mf-c h3{font-size:18px}
  .mf-turn .mf-c h3{font-size:20px}
  .mf-q li{font-size:13.5px}
  .mf-f{grid-template-columns:1fr 1fr}
}

/* 末尾CTA：言葉と行き先を2列に */

/* カード内の .more がページ余白（--pad）を継いで、1800px幅で文字が1字ずつ折れていた */
.app .scard .more,.app .gcard .more{padding-left:0!important;padding-right:0!important}
/* 引用の罫は、見える濃さで */
.mf-q li{border-left-color:var(--ink)}

/* ============================================================
   Setup — 箱をやめて、4本の柱に。アイコンは大きく
   ============================================================ */
.app .svc .sgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px;align-items:stretch;margin-top:44px}
.app .svc .scard{display:flex;flex-direction:column;background:transparent;border:0;border-top:1px solid var(--ink);border-radius:0;box-shadow:none;padding:22px 0 0;text-align:left}
.app .svc a.scard:hover{transform:none;box-shadow:none}
.app .svc .scard .lb{font-size:11px;letter-spacing:.12em;color:var(--ink2);font-family:"Nimbus Sans",sans-serif}
.app .svc .scard .sil{width:128px;margin:14px 0 0;opacity:1}
.app .svc .scard .sil img{width:100%;height:auto;display:block}
.app .svc .scard h5{margin-top:20px;font-size:16px;font-weight:700;line-height:1.5}
.app .svc .scard ul{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.app .svc .scard li{font-size:12px;color:var(--ink2);line-height:1.7;padding-left:15px;position:relative}
.app .svc .scard li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:1px;background:var(--ink2)}
.app .svc .scard .more{display:inline-block;align-self:flex-start;margin-top:auto;padding-top:20px;font-size:11.5px;text-align:left;border-bottom:1px solid var(--ink);padding-bottom:2px}
.app .svc .scard .more::after{content:none}
@media (max-width:1080px){.app .svc .sgrid{grid-template-columns:1fr 1fr;gap:30px 28px}}
@media (max-width:640px){
  .app .svc .sgrid{grid-template-columns:1fr;gap:0;margin-top:32px}
  .app .svc .scard{padding:20px 0 22px}
  .app .svc .scard .sil{width:84px;margin-top:12px}
  .app .svc .scard h5{margin-top:14px;font-size:15px}
}

/* ============================================================
   製品ロゴ（ロックアップ）— 名前の代わりに置く
   ============================================================ */
.pmark{display:block;height:34px;width:auto;max-width:100%}
.lc-nm,.cc-nm,.prc-h h3,.detail .nm{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.lc-nm a{display:block;line-height:0}
.lc-nm .yomi,.cc-nm .yomi,.prc-h h3 .yomi{margin-left:0}
.cc-nm .pmark{height:32px}
.prc-h h3 .pmark{height:34px}
.detail .nm .pmark{height:36px}
@media (max-width:700px){
  .lc-nm .pmark{height:28px}
  .cc-nm .pmark{height:26px}
  .prc-h h3 .pmark{height:28px}
  .detail .nm .pmark{height:28px}
}

/* ============================================================
   A-1/B-1 文節の塊は、中で折らない（html の overflow-wrap:anywhere が効いていた）
   ============================================================ */
.wb,.hl,.mf-q li{overflow-wrap:break-word;word-break:normal}

/* ============================================================
   A-2 製品ページ「含まれるもの」が2列で器からはみ出していた
   ============================================================ */
.app .chk{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.app .chk li{white-space:normal}
@media (max-width:900px){.app .chk{grid-template-columns:1fr}}

/* ============================================================
   A-3 スマホの当たり判定を44pxに（本文中のリンクは対象外）
   ============================================================ */
@media (max-width:900px){
  .toc a{min-height:44px;display:flex;align-items:center}
  .side-cta a.pill.sm,.cta-acts .ul,.lc-act .ul,.cc-act .ul,.prc-act .ul,.cta-r .ul,.feat .more .ul,.pnote-more .ul,.inc-more .ul{min-height:44px;display:inline-flex;align-items:center}
  .lc-act,.cc-act,.prc-act{gap:12px}
}

/* ============================================================
   B-2 読ませる段落の1行を、44字までに
   ============================================================ */
.sub,.lead,.fine,.st-note,.lm-note,.mf-lead,.ft-desc,.note p,.rc-n{max-width:44em}

/* ============================================================
   C-5 セクションの間隔を1つの規則に（節=112 / 帯の内側=80 / 見出しの下=32）
   ============================================================ */
.app .feat{padding-top:112px;padding-bottom:112px}
.app .manif{padding-top:112px;padding-bottom:0}
.app .sh{padding-top:112px;padding-bottom:32px}
.app .svc{margin-top:112px;padding-top:80px;padding-bottom:80px}
.app .cta{margin-top:112px;padding-top:0;padding-bottom:88px}
@media (max-width:900px){
  .app .feat{padding-top:72px;padding-bottom:72px}
  .app .manif{padding-top:72px}
  .app .sh{padding-top:72px;padding-bottom:24px}
  .app .svc{margin-top:72px;padding-top:56px;padding-bottom:56px}
  .app .cta{margin-top:72px;padding-bottom:64px}
}
/* A-3 追補：スタンドアロンのテキストリンクは、スマホで44px */
@media (max-width:900px){ a.ul{min-height:44px;display:inline-flex;align-items:center} }

/* ============================================================
   B-1 仕上げ：見出しは行の長さを均す、本文は最終行を1〜2字にしない
   ============================================================ */
h1,h2,h3,h4,h5,.lc-tg,.cc-tg,.stk-use{text-wrap:balance}
p,li,dd{text-wrap:pretty}
@media (max-width:900px){.pill.sm{min-height:44px}}

/* ============================================================
   ヒーローの「含まれるもの」— 1つずつ枠に入れて、アイコンを立てる
   （BA は site.css の複製を持っているので、ここに書く）
   ============================================================ */
.app .price .inc{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding-top:18px}
.app .price .inc li{background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 12px 9px 9px;gap:9px;white-space:normal;line-height:1.45;transition:border-color .25s ease,transform .25s ease}
.app .price .inc li:hover{border-color:var(--ink);transform:translateY(-1px)}
.app .price .inc li svg{width:16px;height:16px;flex:none;box-sizing:content-box;padding:6px;border-radius:9px;background:var(--bg2);stroke-width:1.5}
.app .price .all{margin-top:10px;background:var(--ink);color:#fff;border-radius:12px;padding:11px 14px;gap:10px;font-size:12.5px}
.app .price .all .chk{border-color:#fff;width:17px;height:17px}
.app .price .all .chk::after{border-left-color:#fff;border-bottom-color:#fff}
@media (max-width:900px){
  .app .price .inc{grid-template-columns:1fr 1fr;gap:7px}
  .app .price .inc li{font-size:11px;padding:8px 10px 8px 8px;border-radius:10px}
  .app .price .inc li svg{padding:5px;border-radius:8px}
  .app .price .all{font-size:11.5px;padding:10px 12px}
}
@media (max-width:420px){.app .price .inc{grid-template-columns:1fr}}

/* ============================================================
   Switch — 乗り換えと、そのあと
   ============================================================ */
.swi{padding:112px var(--pad) 0}
.swi .wh{max-width:46em}
.swi h2{margin-top:16px;font-size:clamp(26px,3vw,40px);line-height:1.4;letter-spacing:-.03em;font-weight:700}
.swi-lead{margin-top:18px;font-size:14px;line-height:2.05;color:var(--ink2);max-width:40em}
.swi-l{list-style:none;margin:52px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.swi-l li{background:#fff;padding:30px 28px 26px;display:flex;flex-direction:column}
.swi-l i{font-style:normal;font-family:"Nimbus Sans",sans-serif;font-size:12px;letter-spacing:.12em;color:var(--ink2)}
.swi-l h3{margin:14px 0 0;font-size:17px;font-weight:700;line-height:1.6;letter-spacing:-.02em}
.swi-l p{margin-top:14px;font-size:13px;line-height:2.05;color:var(--ink2)}
.swi-l p b{color:var(--ink)}
.swi-t{margin-top:auto;padding-top:20px;font-size:11px;color:var(--ink2);letter-spacing:.04em;line-height:1.8;border-top:1px solid var(--line)}
@media (max-width:900px){
  .swi{padding:72px 20px 0}
  .swi-l{grid-template-columns:1fr;margin-top:32px}
  .swi-l li{padding:24px 22px 22px}
  .swi-l h3{font-size:16px}
}

/* ============================================================
   Behind — なぜこの値段でやれるのか ／ Reallocate — 浮いた分
   ============================================================ */
.cheap{margin-top:88px}
.cheap h2{margin-top:16px;font-size:clamp(24px,2.6vw,34px);line-height:1.45;letter-spacing:-.03em;font-weight:700}
.cheap-lead{margin-top:16px;font-size:13.5px;line-height:2.05;color:var(--ink2);max-width:40em}
.rsn{margin-top:34px;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.rsn-row{background:#fff;padding:28px 28px 26px;display:block}
.rsn-row.mine{background:#fff}
.rsn-lb{padding-bottom:18px;border-bottom:1px solid var(--line)}
.rsn-lb span{display:block;font-size:15px;font-weight:700;letter-spacing:-.01em}
.rsn-lb em{display:block;font-style:normal;margin-top:7px;font-size:11.5px;color:var(--ink2);line-height:1.7}
.rsn-steps{display:grid;grid-template-columns:1fr;gap:0;margin-top:4px}
.rsn-s{min-width:0;padding:20px 0 4px}
.rsn-k{display:block;font-size:10.5px;letter-spacing:.1em;color:var(--ink2)}
.rsn-s b{display:block;margin-top:8px;font-family:"Nimbus Sans",sans-serif;font-size:23px;letter-spacing:-.02em;line-height:1.25}
.rsn-s b small{font-family:"Zen Kaku Gothic New",sans-serif;font-size:12px;font-weight:400;color:var(--ink2);margin-left:7px;letter-spacing:0}
.rsn-s em{display:block;font-style:normal;margin-top:10px;font-size:12px;color:var(--ink2);line-height:1.8}
.rsn-bar{margin-top:12px;height:9px;border-bottom:1px solid var(--line);position:relative}
.rsn-bar i{display:block;height:9px;width:var(--w);background:var(--ink);min-width:3px}

.rsn-dots{margin-top:12px;display:flex;flex-wrap:wrap;gap:4px}
.rsn-dots i{width:8px;height:8px;border-radius:50%;background:var(--ink);display:block}

.rsn-ar{justify-self:start;width:9px;height:9px;border-top:1px solid var(--ink2);border-right:1px solid var(--ink2);transform:rotate(135deg);margin:14px 0 0 6px}
.ad{margin-top:88px;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1fr);gap:56px;align-items:center;border-top:1px solid var(--ink);padding-top:44px}
.ad h2{margin-top:16px;font-size:clamp(23px,2.5vw,32px);line-height:1.45;letter-spacing:-.03em;font-weight:700}
.ad-calc{border:0;padding:0}
.ad-h{padding:0 0 12px;border-bottom:1px solid var(--ink);font-size:11px;letter-spacing:.1em;color:var(--ink2)}
.ad-row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--line);font-size:12.5px;color:var(--ink2)}
.ad-row b{font-family:"Nimbus Sans",sans-serif;font-size:15px;white-space:nowrap;color:var(--ink)}
.ad-row.tot{border-bottom:1px solid var(--ink);font-weight:700;padding-top:16px;color:var(--ink)}
.ad-row.tot b{font-size:22px}
.ad-row.zero{border-bottom:0;padding-bottom:16px;color:var(--ink);font-weight:700}
.ad-row.zero b{font-size:22px}
.ad-row.zero span,.ad-row.zero b{font-weight:700}

@media (max-width:900px){
  .cheap{margin-top:60px}
  .cheap-g{grid-template-columns:1fr;margin-top:26px}
  .cheap-c{padding:24px 22px 22px}
  .cheap-l li{grid-template-columns:1fr;gap:2px}
  .ad{margin-top:60px;grid-template-columns:1fr;gap:26px;padding-top:30px}
}

/* ============================================================
   是正：カードのロゴと読みがな（横並びで詰まって見えていた）
   ============================================================ */
.lc-nm,.cc-nm,.prc-h h3{display:block}
.lc-nm .pmark,.cc-nm .pmark,.prc-h h3 .pmark{display:block}
.lc-nm .yomi,.cc-nm .yomi,.prc-h h3 .yomi{display:block;margin:9px 0 0;font-size:10.5px;letter-spacing:.24em;color:var(--ink2)}
.lc-tg,.cc-tg{margin-top:16px}
.prc-h h3+p{margin-top:14px}
.detail .nm{display:block}
.detail .nm .pmark{display:block}
.detail .nm .yomi{display:block;margin-top:12px;letter-spacing:.24em}

/* ============================================================
   是正：末尾CTA。器を左端に揃え、列を広げすぎない
   ============================================================ */

/* ============================================================
   ヒーローのボタン：黒をやめて、透明なガラスの粒に
   ============================================================ */
.hero .txt a.pill.lg{
  position:relative;overflow:hidden;color:var(--ink);
  background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(255,255,255,.52));
  -webkit-backdrop-filter:blur(16px) saturate(180%);backdrop-filter:blur(16px) saturate(180%);
  border:1px solid rgba(17,17,17,.14);
  box-shadow:0 14px 34px rgba(17,17,17,.13),0 2px 6px rgba(17,17,17,.06),inset 0 1px 0 rgba(255,255,255,1),inset 0 -14px 26px rgba(255,255,255,.5);
  transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .35s ease;
}
.hero .txt a.pill.lg::before{content:"";position:absolute;left:8%;right:8%;top:3px;height:42%;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,0));pointer-events:none}
.hero .txt a.pill.lg:hover{transform:translateY(-2px);border-color:rgba(17,17,17,.26);box-shadow:0 20px 44px rgba(17,17,17,.18),inset 0 1px 0 rgba(255,255,255,1),inset 0 -14px 26px rgba(255,255,255,.55)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .hero .txt a.pill.lg{background:linear-gradient(180deg,#fff,rgba(255,255,255,.86))}
}
/* シャボン玉の縁：4つの製品色をうっすら回す */
.hero .txt a.pill.lg::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.2px;
 background:linear-gradient(115deg,rgba(221,86,65,.55),rgba(227,165,22,.45) 32%,rgba(76,137,62,.45) 62%,rgba(45,63,136,.55));
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
 mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
 opacity:.7;pointer-events:none;transition:opacity .35s ease}
.hero .txt a.pill.lg:hover::after{opacity:1}
.hero .txt a.pill.lg{box-shadow:0 16px 38px rgba(17,17,17,.16),0 2px 6px rgba(17,17,17,.07),inset 0 1px 0 rgba(255,255,255,1),inset 0 -14px 26px rgba(255,255,255,.5)}
.way em{white-space:nowrap}

/* Switch の下：関連する問い */
.swi-q{margin-top:30px;display:flex;align-items:baseline;gap:26px;flex-wrap:wrap}
.swi-qh{font-size:10.5px;letter-spacing:.12em;color:var(--ink2)}
.swi-q .ul{font-size:12.5px}
.mf-more{margin-top:18px}
@media (max-width:900px){.swi-q{gap:12px;margin-top:24px}.swi-q .ul{font-size:12px}}


/* ============================================================
   締めのCTA＝バナー（黒の箱）。全ページ共通・両サイト共通
   markup: section.cta > div.cta-in > (div.cta-t + div.cta-go)
   ============================================================ */
.cta{background:transparent;border:0;margin-top:0;padding-top:0;padding-bottom:96px}
.cta::before{display:none}
.cta-in{background:var(--ink);color:#fff;border-radius:18px;max-width:none;
  display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:44px;align-items:center;
  padding:38px 40px}
.cta-t{min-width:0}
.cta-in h2{color:#fff;font-size:clamp(20px,1.95vw,27px);line-height:1.5;letter-spacing:-.02em;font-weight:700;max-width:18em;margin:0}
.cta-in p{color:rgba(255,255,255,.68);font-size:12.5px;line-height:1.95;margin-top:11px;max-width:36em}
.cta-in .cta-fine{color:rgba(255,255,255,.5);font-size:11px;margin-top:10px}
.cta-go{display:flex;flex-direction:column;gap:9px;align-items:stretch;margin:0}
.cta-in .pill{background:#fff;color:var(--ink);border:1px solid #fff;box-shadow:none;height:50px;padding:0 26px;font-size:13.5px;white-space:nowrap;justify-content:center;margin:0}
.cta-in .pill:hover{opacity:.9;transform:none}
.cta-in .ul{color:#fff;border:1px solid rgba(255,255,255,.45);border-radius:999px;height:50px;padding:0 26px;
  display:inline-flex;align-items:center;justify-content:center;font-size:13.5px;white-space:nowrap;text-decoration:none;background:transparent;margin:0}
.cta-in .ul:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.cta-in .ul::after{content:none}
@media (max-width:900px){
  .cta{padding-bottom:60px}
  .cta-in{grid-template-columns:1fr;padding:26px 22px;border-radius:14px;row-gap:22px}
  .cta-in h2{font-size:20px}
  .cta-in p{font-size:12.5px}
}

/* ============================================================
   Reallocate — 浮く金額を、この節の主役にする
   ============================================================ */
.ad-note{margin-top:20px;font-size:13.5px;line-height:2.05;color:var(--ink2);max-width:30em}
.cheap-f{margin-top:26px;font-size:13px;line-height:2.05;color:var(--ink2);max-width:44em}
.ad-free{display:block;margin-top:6px;padding:26px 0 0;border-top:2px solid var(--ink)}
.ad-free-k{display:block;font-size:11.5px;letter-spacing:.14em;color:var(--ink2)}
.ad-free>b{display:block;margin-top:10px;font-family:"Nimbus Sans",sans-serif;font-size:clamp(44px,5.2vw,68px);letter-spacing:-.045em;line-height:1;font-weight:400}
.ad-free em{display:block;font-style:normal;margin-top:14px;font-size:13.5px;color:var(--ink2)}
.ad-free em .y{font-family:"Nimbus Sans",sans-serif;font-size:17px;color:var(--ink);margin:0 3px}
.ad-row{padding:11px 0;font-size:12.5px;color:var(--ink2)}
.ad-row b{font-size:15px;color:var(--ink)}
.ad-row.tot{padding-top:16px;color:var(--ink)}
.ad-row.tot b{font-size:22px}
.ad-row.zero{padding-bottom:16px;color:var(--ink);font-weight:700}
.ad-row.zero b{font-size:22px}
@media (max-width:900px){
  .ad-free>b{font-size:44px}
  .ad-note{max-width:none}
}

/* スマホ：比較の図と価格の節（CSS整理で落ちたぶんの復旧） */
@media (max-width:820px){
  .rsn{grid-template-columns:1fr}
  .rsn-row{padding:24px 22px}
  .rsn-s b{font-size:21px}
}
@media (max-width:900px){
  .cheap{margin-top:60px}
  .ad{margin-top:60px;grid-template-columns:1fr;gap:26px;padding-top:30px}
}

/* ---- 4本セットの価格（2026-08-26） ---- */
/* ヒーローの大きな数字の下に置く一行。セットと単品の関係を先に言っておく */
.hpr-sub{margin-top:12px;font-size:12.5px;line-height:1.9;color:var(--ink2)}
/* 価格ページ冒頭。左=セット価格、右=単品で揃えたときの合計 */
.bundle{margin-top:30px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:1px;background:var(--line);border:1px solid var(--line)}
.bundle>div{background:#fff;padding:24px 26px}
.bd-k{display:block;font-size:11px;letter-spacing:.1em;color:var(--ink2)}
.bundle b{display:block;margin-top:10px;font-family:"Nimbus Sans",sans-serif;
  font-size:clamp(30px,3.6vw,44px);line-height:1;letter-spacing:-.03em}
.bundle small{display:block;margin-top:10px;font-size:11.5px;color:var(--ink2)}
.bd-r{background:#FAFAF9}
.bd-was{color:var(--ink2);text-decoration:line-through;text-decoration-thickness:1px}
.bundle em{display:block;margin-top:10px;font-style:normal;font-size:12.5px;
  font-weight:700;padding:5px 11px;border:1px solid var(--ink);border-radius:999px;justify-self:start;width:fit-content}
@media (max-width:760px){.bundle{grid-template-columns:1fr}}
/* 単価が他と違う商品の理由（価格カード内） */
.prc-why{margin-top:12px;padding-top:12px;border-top:1px solid var(--line);
  font-size:12px;line-height:1.9;color:var(--ink2)}
/* 項目が奇数だと2列の右下に灰色の穴が空く。最後の1つを横いっぱいに伸ばす */
.opt-l li:last-child:nth-child(odd){grid-column:1/-1}

/* ---- ヒーローの文字の階層（2026-08-30） ----------------------------------
   価格をここから外したあと、見出し34px・リード15px・本文13.5px がほぼ同じ重さで
   並んでいて、どこから読むかが決まっていなかった。3段に開く。
   水面の位置は water.js 側で「画面写真の帯の上」に移してある（文字は白地に載る）。 */
@media (min-width:901px){
  .txt h1{font-size:clamp(34px,3.9vw,56px);line-height:1.36}
  /* 56px が2行に収まる上限。58px を超えると意味の切れ目でないところで3行に折れる */
  .txt .tag{font-size:18px;font-weight:700;margin-top:24px}
  .txt .ph{font-size:13.5px;margin-top:16px;max-width:36em}
  .kk-en{font-size:12px;letter-spacing:.3em}
  .price .kick .ja{font-size:22px;letter-spacing:-.01em}
  /* 22px 止まり。28px にすると左の見出しと張り合って主題が二つになる */
  .kick{gap:8px;margin-bottom:22px}
  /* 3列だと「Cloudflareに設置（契約代行）」だけ2行に折れる。2列にすると全部1行 */
  .app .price .inc{grid-template-columns:repeat(2,minmax(0,1fr))}
}