/* AIOパートナープラン（/aio-partner/）のリニューアル版 v1（2026-10-11）
   手本は会社概要と無料診断 v2：章ごとに中身を形にし、トップと同じ登場人物の絵をこの章のために描いて線や台の上に立たせる。
   話の芯は「表に立つのは御社、AIMAは裏で支える」。表（お客様から見える側）＝カードの地、裏（AIMAの実務）＝淡い台の地で通す。
   色・書体・ボタンはトップ・サービスと同じ値。
   css/aio-business-services.css は研修・まるなげAIOと共有なので、このページはこのファイルだけを読む。 */
:root{
  color-scheme:light;
  --bg:#F3EFE6;--card:#FBF9F4;--tint:#ECE6DA;
  --ink:#2B2F3A;--ink-2:#444955;--ink-3:#5A5F6B;--faint:#60656F;
  --line:#E2DCCF;--rule:#D9D2C3;
  --teal:#5B6B86;--teal-deep:#4A5A75;
  --accent:#B05A3E;--accent-deep:#9A4E36;
  --jp:"Noto Sans JP","Hiragino Sans",system-ui,sans-serif;
  --num:"DM Sans","Noto Sans JP",sans-serif;
  --pad:clamp(20px,4vw,40px);
  --out:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--hd,76px) + 64px)}
body{background:var(--bg);color:var(--ink);font-family:var(--jp);font-size:16px;line-height:1.85;letter-spacing:.02em;-webkit-font-smoothing:antialiased;text-autospace:normal;font-variant-numeric:tabular-nums;overflow-x:clip}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
ol,ul{list-style:none}
::selection{background:var(--tint)}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
p,dd,li{text-wrap:pretty;word-break:auto-phrase}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--pad)}
.grain{position:fixed;inset:0;z-index:2000;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
br.sp{display:none}

/* ボタン（サービス・無料診断と同じ） */
.b{display:inline-flex;align-items:center;justify-content:center;gap:12px;height:40px;padding:0 18px;border:0;border-radius:4px;font-size:14px;font-weight:500;letter-spacing:.04em;white-space:nowrap;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.b-pri{background:var(--accent);color:#fff}
.b-pri:hover{background:var(--accent-deep)}
.b-ghost{border:1px solid var(--rule);color:var(--ink);background:transparent}
.b-ghost:hover{border-color:var(--ink)}
.b.lg{height:54px;padding:0 26px;font-size:15px}
.b .arr{display:inline-block;transition:translate .25s var(--out)}
.b:hover .arr{translate:3px 0}

/* 見出し・本文（会社概要と同じ「番号＋名前」。中身のある一文は .say で大きく） */
.lbl{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:500;line-height:1.6;letter-spacing:.08em;color:var(--teal)}
.lbl::before{content:"";width:28px;height:1px;background:currentColor}
.h2{display:flex;align-items:baseline;gap:.55em;font-size:clamp(28px,2.8vw,40px);font-weight:700;line-height:1.36;letter-spacing:-.005em;font-feature-settings:"palt";word-break:auto-phrase;text-wrap:balance}
.h2 .no{flex:none;font:500 max(13px,.4em)/1 var(--num);letter-spacing:.04em;color:var(--teal)}
.say{margin-top:clamp(18px,2vw,26px);font-size:clamp(22px,2.2vw,30px);font-weight:700;line-height:1.5;letter-spacing:-.005em;font-feature-settings:"palt"}
.lead{margin-top:18px;max-width:42em;font-size:16px;line-height:2;color:var(--ink-2)}
.note{margin-top:16px;font-size:13px;line-height:1.85;color:var(--ink-3)}
.sec{padding:clamp(80px,10vw,136px) 0}
.sec + .sec{border-top:1px solid var(--line)}
.sh{max-width:52em}

/* 最初の画面：左に文、右に主役の絵（看板の裏から猫）。絵は目次の帯の上の線に立つ */
.hero{padding-top:clamp(20px,3vh,32px)}
.crumb ol{display:flex;flex-wrap:wrap;gap:0 10px;font-size:12.5px;line-height:1.8;color:var(--ink-3)}
.crumb li + li::before{content:"/";margin-right:10px;color:var(--rule)}
.crumb a:hover{color:var(--ink)}
.hero-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:clamp(28px,4vw,64px);align-items:end}
.copy{max-width:600px;padding:clamp(28px,5vh,56px) 0 clamp(48px,7vh,80px)}
.catch{margin-top:clamp(16px,2.4vh,24px);font-size:clamp(38px,min(4.4vw,8vh),60px);font-weight:700;line-height:1.22;letter-spacing:-.01em;font-feature-settings:"palt"}
.catch .ln{display:block;white-space:nowrap}
.tag{margin-top:clamp(18px,2.6vh,24px);font-size:clamp(17px,1.4vw,20px);font-weight:700;line-height:1.6;color:var(--ink)}
.sub{margin-top:12px;max-width:34em;font-size:clamp(15px,1.1vw,16px);line-height:1.95;color:var(--ink-2)}
.ctas{margin-top:clamp(24px,3.6vh,32px);display:flex;flex-wrap:wrap;gap:10px}
.hero-art{justify-self:end;width:100%;max-width:680px;margin:0 0 -1px}
.hero-art img{width:100%}
.fade{transition:opacity 1.1s var(--out),translate 1.1s var(--out);opacity:1;translate:0 0}
@starting-style{.fade{opacity:0;translate:0 12px}}
.d2{transition-delay:.3s}

/* 目次の帯（会社概要と同じ） */
.pnav{position:sticky;top:var(--hd,76px);z-index:20;background:rgb(243 239 230 / .96);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.pnav-in{height:52px;display:flex;align-items:center;gap:clamp(14px,2vw,28px);overflow-x:auto;scrollbar-width:none}
.pnav-in::-webkit-scrollbar{display:none}
.pnav a{position:relative;display:inline-flex;align-items:center;gap:8px;height:52px;font-size:14px;font-weight:500;color:var(--ink-3);white-space:nowrap;transition:color .2s}
.pnav a i{font-style:normal;font-size:11.5px;letter-spacing:.04em;color:var(--faint)}
.pnav a:hover,.pnav a.on{color:var(--ink)}
.pnav a.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--teal)}
.pnav a.on i{color:var(--teal)}
.pnav .pnav-cta{margin-left:auto;color:var(--accent-deep)}
.pnav .pnav-cta::after{display:none}

/* 01 お悩み：横3列・大きな番号・縦の細線 */
.woes{margin-top:clamp(36px,4vw,56px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--ink)}
.woes li{padding:28px clamp(20px,2.6vw,40px) 4px 0}
.woes li + li{padding-left:clamp(20px,2.6vw,40px);border-left:1px solid var(--line)}
.woes .n{display:block;font:500 clamp(30px,2.8vw,40px)/1 var(--num);letter-spacing:-.02em;color:var(--teal)}
.woes h3{margin-top:20px;font-size:clamp(17px,1.4vw,19px);font-weight:700;line-height:1.6;font-feature-settings:"palt"}
.woes p{margin-top:10px;font-size:15px;line-height:1.95;color:var(--ink-2)}

/* 02 仕組み：表と裏の上下2段。01（お客様⇄御社）→ 02（御社から下へ）→ 03（裏でAIMAが実行）と U の字に回る */
.ou{--fig:clamp(150px,15vw,214px);--side:minmax(200px,0.9fr);margin-top:clamp(40px,4.4vw,64px);border:1px solid var(--line);border-radius:20px;overflow:hidden}
.ou-omote,.ou-ura{display:grid;grid-template-columns:var(--side) minmax(0,1.5fr) var(--side);column-gap:clamp(20px,3vw,48px);padding:0 clamp(24px,4vw,56px)}
.ou-omote{background:var(--card);padding-top:clamp(40px,4.4vw,64px);align-items:end}
.ou-omote img{width:auto;height:var(--fig);margin-bottom:-1px}
.ou-client{justify-self:center}
.ou-partner{justify-self:center}
.ou-step .n{display:block;font:600 13px/1 var(--num);letter-spacing:.06em;color:var(--teal)}
.ou-step h3{margin-top:10px;font-size:clamp(17px,1.4vw,19px);font-weight:700;line-height:1.55;font-feature-settings:"palt"}
.ou-step p{margin-top:8px;font-size:14.5px;line-height:1.9;color:var(--ink-2)}
.s1{position:relative;align-self:center;padding:0 0 calc(var(--fig) * .32);text-align:center}
.s1::after{content:"";position:absolute;left:-12px;right:-12px;bottom:calc(var(--fig) * .32 - 22px);height:1px;background:var(--ink-3)}
.s1::before{content:"";position:absolute;left:-16px;right:-16px;bottom:calc(var(--fig) * .32 - 25.5px);height:8px;background:radial-gradient(circle,var(--ink-3) 3.5px,transparent 4px) 0 50%/8px 8px no-repeat,radial-gradient(circle,var(--ink-3) 3.5px,transparent 4px) 100% 50%/8px 8px no-repeat}
.s1 p{max-width:26em;margin-inline:auto}
.ou-seam{grid-column:1 / 3;grid-row:1;align-self:start;padding:18px 0 0}
.ou-seam h3{font-size:16px;font-weight:700;line-height:1.6}
.ou-seam p{margin-top:4px;font-size:13.5px;line-height:1.85;color:var(--ink-3)}
.ou-ura{position:relative;background:var(--tint);border-top:2px solid var(--ink);grid-template-rows:auto auto;align-items:end}
.ou-cat{grid-column:1;grid-row:2;justify-self:center;width:auto;height:calc(var(--fig) * .92);margin-top:24px}
.s3{grid-column:2;grid-row:2;align-self:center;padding:28px 0 clamp(36px,4vw,56px)}
.s2{grid-column:3;grid-row:1 / 3;align-self:start;padding:0 0 clamp(36px,4vw,56px)}
.s2::before{content:"";display:block;width:2px;height:48px;margin:0 auto 14px;background:var(--ink)}
.s2 .n{text-align:center}
.s2 h3{text-align:center}
.eq{margin-top:clamp(28px,3vw,40px);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1.2fr);align-items:center;gap:0 clamp(12px,1.6vw,24px);border-top:1px solid var(--ink);border-bottom:1px solid var(--line);padding:20px 0}
.eq dt{font-size:12.5px;color:var(--ink-3)}
.eq dd{margin-top:2px;font-size:clamp(16px,1.4vw,19px);font-weight:700;line-height:1.5}
.eq .res dd{color:var(--teal-deep)}
.eq .op{font:400 24px/1 var(--num);color:var(--ink-3)}

/* 03 役割分担：1枚の台帳を縦に割る。左＝御社（表の地）、右＝AIMA（裏の地） */
.ledger{margin-top:clamp(36px,4vw,56px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.lg-col{padding:clamp(24px,2.6vw,36px) clamp(20px,3vw,44px) clamp(24px,2.6vw,36px)}
.lg-omote{background:var(--card)}
.lg-ura{background:var(--tint);border-left:2px solid var(--ink)}
.lg-col h3{padding-bottom:14px;border-bottom:1px solid var(--ink);font-size:clamp(17px,1.4vw,19px);font-weight:700;line-height:1.5}
.lg-col ol{counter-reset:r}
.lg-col li{counter-increment:r;display:grid;grid-template-columns:2.6em minmax(0,1fr);padding:13px 0;border-bottom:1px solid #DCD5C7;font-size:15.5px;line-height:1.75}
.lg-omote li{border-bottom-color:var(--line)}
.lg-col li:last-child{border-bottom:0}
.lg-col li::before{content:counter(r,decimal-leading-zero);font:500 12.5px/2.1 var(--num);letter-spacing:.04em;color:var(--teal)}

/* 04 ホワイトラベル：御社ロゴのレポートの表紙（HTMLの見本）が主役。手前で御社がお客様に手渡す */
.wl{margin-top:clamp(36px,4vw,56px);display:grid;grid-template-columns:minmax(0,5.6fr) minmax(0,6.4fr);gap:clamp(40px,5vw,88px);align-items:end}
.wl-art{display:flex;align-items:flex-end;border-bottom:1px solid var(--rule)}
.sheet{position:relative;display:flex;flex-direction:column;flex:0 1 360px;min-width:0;aspect-ratio:210 / 297;padding:9% 10% 8%;border-radius:3px;background:#fff;box-shadow:0 1px 0 rgb(43 47 58 / .05),0 30px 60px -36px rgb(43 47 58 / .45)}
.sheet-logo{align-self:flex-start;display:inline-flex;align-items:center;height:34px;padding:0 14px;border:1.5px dashed var(--teal);border-radius:6px;background:rgb(91 107 134 / .06);font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--teal-deep)}
.sheet-t{margin-top:20%;font-size:clamp(19px,1.9vw,25px);font-weight:700;line-height:1.42;font-feature-settings:"palt"}
.sheet-rule{display:block;margin-top:16px;height:1px;background:var(--ink)}
.sheet-lines{display:block;margin-top:6px}
.sheet-lines i{display:block;height:6px;margin-top:11px;border-radius:3px;background:#E7E2D8}
.sheet-lines i:nth-child(2){width:86%}.sheet-lines i:nth-child(3){width:92%}.sheet-lines i:nth-child(4){width:58%}
.sheet-bars{display:flex;align-items:flex-end;gap:8%;height:18%;margin-top:auto;padding:0 2%;border-bottom:1px solid var(--rule)}
.sheet-bars i{flex:1;height:calc(var(--v) * 100%);border-radius:2px 2px 0 0;background:var(--teal);opacity:.8}
.sheet-stamp{position:absolute;right:10%;top:9%;font:600 10.5px/1 var(--num);letter-spacing:.18em;color:var(--teal);padding:6px 8px;border:1px solid currentColor;border-radius:3px}
.wl-hand{flex:none;position:relative;margin:0 0 -1px -44px;width:auto;height:clamp(190px,19vw,262px)}
.wl-body{padding-bottom:clamp(8px,2vw,24px)}
.wl-body .say{margin-top:0}
.ticks{margin-top:24px;border-top:1px solid var(--ink)}
.ticks li{display:grid;grid-template-columns:1.8em minmax(0,1fr);padding:12px 0;border-bottom:1px solid var(--line);font-size:15.5px;line-height:1.75}
.ticks li::before{content:"";width:10px;height:6px;margin-top:.62em;border-left:1.5px solid var(--teal);border-bottom:1.5px solid var(--teal);transform:rotate(-45deg)}

/* 05 料金：筆算。数字の一の位をそろえ、答えの段は太い線の下 */
.price{margin-top:clamp(36px,4vw,56px);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,5vw,88px);align-items:start}
.hissan{max-width:560px;border-top:1px solid var(--ink)}
.hissan div{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:16px;padding:clamp(14px,1.6vw,20px) 0;border-bottom:1px solid var(--line)}
.hissan dt{font-size:15px;font-weight:700;color:var(--ink-2)}
.hissan dd{justify-self:end;display:flex;align-items:baseline;font-size:clamp(17px,1.5vw,20px);font-weight:700}
.hissan dd b{min-width:1.12em;margin-right:6px;text-align:right;font:500 clamp(56px,6.4vw,96px)/1 var(--num);letter-spacing:-.04em;color:var(--ink)}
.hissan .sg{margin-right:2px;font:400 clamp(28px,3vw,44px)/1 var(--num);color:var(--ink-3)}
.hissan .minus{border-bottom:2px solid var(--ink)}
.hissan .res{border-bottom:0}
.hissan .res dt{color:var(--teal-deep)}
.hissan .res dd b{color:var(--teal)}
.calc .note{max-width:560px}
.tag-card{display:flex;flex-direction:column;padding:clamp(24px,2.6vw,36px);border:1px solid var(--line);border-radius:16px;background:var(--card);box-shadow:0 1px 2px rgb(43 47 58 / .05)}
.tc-badge{font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--teal)}
.tag-card h3{margin-top:8px;font-size:clamp(19px,1.6vw,22px);font-weight:700;line-height:1.5}
.tc-unit{margin-top:18px;padding-top:16px;border-top:1px solid var(--line);font-size:13px;color:var(--ink-3)}
.tc-price{display:flex;align-items:baseline;gap:8px;margin-top:4px}
.tc-price b{font:500 clamp(40px,3.6vw,52px)/1.1 var(--num);letter-spacing:-.03em}
.tc-price small{font-size:14px;color:var(--ink-2)}
.tc-sum{margin-top:16px;font-size:14.5px;line-height:1.9;color:var(--ink-2)}
.tag-card .b{margin-top:24px;width:100%}

/* 06 始め方：01〜03 は1本の線を御社と猫が一緒に歩き、04 で線が一段下（裏の地）へ下りる */
.route{--walk:clamp(170px,15vw,220px);position:relative;margin-top:calc(var(--walk) + 24px)}
.route-walk{position:absolute;left:clamp(0px,1vw,16px);bottom:calc(100% - 1px);width:auto;height:var(--walk)}
.route-st{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.route-st li{position:relative;padding:30px clamp(16px,2vw,28px) 0 0;border-top:2px solid var(--ink)}
.route-st li::before{content:"";position:absolute;left:0;top:-7px;width:12px;height:12px;border-radius:50%;background:var(--ink)}
.route-st li + li{padding-left:clamp(16px,2vw,28px)}
.route-st li + li::before{left:clamp(16px,2vw,28px)}
.route-st .n{font:600 13px/1 var(--num);letter-spacing:.06em;color:var(--teal)}
.route-st h3{margin-top:10px;font-size:clamp(17px,1.4vw,20px);font-weight:700;line-height:1.5}
.route-st p{margin-top:8px;font-size:14.5px;line-height:1.9;color:var(--ink-2)}
.route-st li.down{margin-top:72px;padding-bottom:30px;background:var(--tint);border-radius:0 0 14px 0}
.route-st li.down::before{background:var(--accent)}
.route-st li.down::after{content:"";position:absolute;left:-2px;top:-74px;width:2px;height:72px;background:var(--ink)}

/* 07 向いている会社：2列の名簿。右（相性が良くない）は薄い灰。下に研修への案内 */
.fit{margin-top:clamp(36px,4vw,56px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,72px)}
.fit-col h3{padding-bottom:12px;border-bottom:1px solid var(--ink);font-size:clamp(17px,1.4vw,19px);font-weight:700;line-height:1.5}
.fit-col li{display:grid;grid-template-columns:1.9em minmax(0,1fr);padding:13px 0;border-bottom:1px solid var(--line);font-size:15.5px;line-height:1.75}
.is-good li::before{content:"";width:13px;height:13px;margin-top:.42em;border:2px solid var(--teal);border-radius:50%}
.is-not h3{color:var(--ink-3);border-bottom-color:var(--rule)}
.is-not li{color:var(--ink-3)}
.is-not li::before{content:"";width:13px;height:2px;margin-top:.86em;background:var(--faint)}
.train{margin-top:clamp(48px,5vw,72px);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:clamp(20px,2.4vw,28px) clamp(20px,3vw,36px);border-radius:12px;background:var(--tint)}
.train h3{font-size:clamp(16px,1.3vw,18px);font-weight:700;line-height:1.6}
.train p{margin-top:4px;font-size:14px;line-height:1.85;color:var(--ink-2)}

/* 08 よくある質問（無料診断と同じ開き方） */
.row2{display:grid;grid-template-columns:minmax(0,4.6fr) minmax(0,7.4fr);gap:clamp(40px,5vw,88px);align-items:start}
.faq-art{margin-top:clamp(28px,3vw,44px);width:min(100%,320px)}
.faq{border-top:1px solid var(--ink)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;display:grid;grid-template-columns:2.2em minmax(0,1fr) 20px;align-items:start;gap:0 8px;padding:20px 0;cursor:pointer;font-size:16px;font-weight:700;line-height:1.7}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q";font:600 15px/1.8 var(--num);color:var(--teal)}
.faq summary::after{content:"";width:12px;height:12px;margin-top:8px;justify-self:end;background:linear-gradient(currentColor,currentColor) 50% 50%/12px 1.5px no-repeat,linear-gradient(currentColor,currentColor) 50% 50%/1.5px 12px no-repeat;color:var(--ink-3);transition:transform .3s var(--out)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .ans{display:grid;grid-template-columns:2.2em minmax(0,1fr);gap:0 8px;padding:0 28px 24px 0}
.faq .ans::before{content:"A";font:600 15px/1.95 var(--num);color:var(--faint)}
.faq .ans p{font-size:16px;line-height:1.95;color:var(--ink-2)}

/* 締め：1枚の提案書をのぞき込む御社と猫が、枠の上の縁に立つ */
.sec-end{--close:clamp(200px,19vw,262px);padding-top:calc(var(--close) + 40px);padding-bottom:0}
.cta2{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px clamp(32px,4vw,64px);padding:clamp(32px,4vw,56px);border-radius:20px;background:var(--tint)}
.cta2-art{position:absolute;right:clamp(24px,5vw,80px);bottom:calc(100% - 2px);width:auto;height:var(--close)}
.cta2 .h2{font-size:clamp(26px,2.6vw,36px)}
.cta2 .d{margin-top:16px;max-width:36em;font-size:15.5px;line-height:1.95;color:var(--ink-2)}
.legal{margin-top:18px;font-size:12.5px;line-height:1.85;color:var(--ink-3)}

#site-footer{margin-top:clamp(80px,10vw,136px)}

@media (max-width:1060px){
  .row2{grid-template-columns:minmax(0,1fr);gap:20px}
  .price{grid-template-columns:minmax(0,1fr)}
  .tag-card{max-width:520px}
  .wl{grid-template-columns:minmax(0,1fr);align-items:start}
  .wl-art{max-width:560px}
}
@media (max-width:900px){
  .hero-in{grid-template-columns:minmax(0,1fr);gap:0}
  .copy{max-width:640px;padding-bottom:28px}
  .hero-art{justify-self:center;max-width:560px}
  .pnav .pnav-cta{display:none}
  .woes{grid-template-columns:minmax(0,1fr)}
  .woes li,.woes li + li{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:20px;padding:22px 0;border-left:0;border-bottom:1px solid var(--line)}
  .woes .n{grid-row:1 / 3;font-size:30px}
  .woes h3{margin-top:0}
  .ou{--fig:clamp(130px,36vw,180px)}
  .ou-omote{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:24px;padding-top:28px}
  .s1{grid-column:1 / -1;grid-row:1;padding:0;text-align:left}
  .s1::before,.s1::after{display:none}
  .s1 p{margin-inline:0}
  .ou-client{grid-column:1;grid-row:2}
  .ou-partner{grid-column:2;grid-row:2}
  .ou-ura{display:flex;flex-direction:column;padding-bottom:4px}
  .ou-seam{padding-top:18px}
  .s2{padding:20px 0 0}
  .s2::before{margin:0 0 14px;height:32px}
  .s2 .n,.s2 h3{text-align:left}
  .s3{padding:24px 0 0}
  .ou-cat{margin:20px 0 0 auto;height:calc(var(--fig) * .92)}
  .eq{grid-template-columns:minmax(0,1fr);gap:4px}
  .eq .op{padding-left:2px}
  .ledger{grid-template-columns:minmax(0,1fr)}
  .lg-ura{border-left:0;border-top:2px solid var(--ink)}
  .route{--walk:clamp(160px,40vw,200px)}
  .route-st{grid-template-columns:minmax(0,1fr);margin-left:5px;border-left:2px solid var(--ink)}
  .route-st li,.route-st li + li{padding:0 0 28px 28px;border-top:0}
  .route-st li::before,.route-st li + li::before{left:-7px;top:4px}
  .route-st li.down{margin:0 0 0 28px;padding:20px 20px 22px;border-radius:0 0 14px 14px;border-top:2px solid var(--ink)}
  .route-st li.down::before{left:-6px;top:-7px}
  .route-st li.down::after{left:-30px;top:-2px;width:30px;height:2px}
  .fit{grid-template-columns:minmax(0,1fr)}
  .train{flex-direction:column;align-items:flex-start}
}
@media (max-width:640px){
  br.sp{display:inline}
  br.pc{display:none}
  .catch{font-size:clamp(30px,9.4vw,42px)}
  .catch .ln{white-space:normal}
  .tag{font-size:17px}
  .sub{font-size:15px}
  .ctas{flex-direction:column}
  .ctas .b{width:100%}
  .say{font-size:21px}
  .ou{border-radius:16px}
  .ou-omote,.ou-ura{padding-left:18px;padding-right:18px}
  .lg-col{padding:20px 18px}
  .sheet{max-width:none}
  .sheet{flex-basis:64%;padding:10% 9% 8%}
  .sheet-stamp{display:none}
  .sheet-logo{height:28px;padding:0 10px;font-size:11.5px}
  .sheet-t{font-size:clamp(14px,4.4vw,19px);word-break:keep-all}
  .sheet-lines i{height:4px;margin-top:8px}
  .wl-hand{height:clamp(140px,40vw,190px);margin-left:-28px}
  .hissan dd b{font-size:clamp(48px,15vw,64px)}
  .hissan .sg{font-size:26px;margin-right:10px}
  .hissan dt{font-size:14px}
  .faq .ans{padding-right:0}
  .faq-art{width:240px}
  .sec-end{--close:clamp(170px,46vw,220px)}
  .cta2{grid-template-columns:minmax(0,1fr);padding:28px 18px;border-radius:16px}
  .cta2-art{right:auto;left:12px}
  .cta2 .b{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .fade,.b .arr,.faq summary::after{transition:none}
}
@media print{.grain{display:none}}