/* Googleマップ集客・MEO。主役は「画面の中を送るスマホの中のプロフィール」と「作業の札が集まるご案内の票」。
   冒頭は地図とプロフィールの札（現在地の波紋とピンの上下が続く）、本編はスマホの画面の中身が送られて各部が更新され、ご利用の節は作業の札が票に集まる。
   動きを止めたとき（スクリプトなし）は、すべて最後の状態（各部が更新済み、札が票に収まる）で表示する。 */
.mo{background:var(--paper)}
.mo .vs-nowrap{white-space:nowrap}
.mo-kicker{font:700 12px/1.4 var(--display);letter-spacing:.22em;color:var(--orange)}
/* 節の見出し（このページだけの形）。ピンの印＋小さな英字＋日本語の見出し＋経路の破線の下線。英字の大見出しは使わない */
.mo-h{position:relative;z-index:1;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:16px;max-width:1200px;margin:0 auto}
.mo-h__pin{grid-row:1/3;width:38px;aspect-ratio:1;border:2px solid var(--ink);border-radius:50% 50% 50% 0;background:var(--pink2);rotate:-45deg;box-shadow:-3px 3px 0 var(--ink)}
.mo-h__pin::after{content:"";display:block;width:40%;aspect-ratio:1;margin:30%;border-radius:50%;background:#fff}
.mo-h__en{font:800 12px/1.4 var(--display);letter-spacing:.2em;color:var(--orange)}
.mo-h__text{justify-self:start;padding-bottom:8px;font:900 clamp(24px,3.2vw,40px)/1.35 var(--jp);letter-spacing:-.01em;background:linear-gradient(90deg,var(--pink2) 0 60%,transparent 60%) 0 100%/18px 3px repeat-x}
.mo-h--light{color:#fff}
.mo-h--light .mo-h__en{color:var(--lemon)}
.mo-head{position:relative;z-index:1;max-width:1200px;margin:0 auto}

/* ピン（装飾）。上が丸く下がとがった形 */
.mo-pin{position:absolute;width:var(--p,5cqw);aspect-ratio:1;border:2px solid var(--ink);border-radius:50% 50% 50% 0;background:var(--c,#A7B4BD);rotate:-45deg;translate:-50% -100%}
.mo-pin::after{content:"";position:absolute;inset:30%;border-radius:50%;background:#fff}
.mo-pin--shop{--c:var(--pink2);--p:9cqw}

/* プロフィールの札（冒頭とスマホの画面で共通）。中の寸法は札の文字の大きさ（em）に対する割合 */
.mo-card{padding:1em;border:2px solid var(--ink);border-radius:1.2em;background:#fff;box-shadow:.5em .5em 0 var(--orange)}
.mo-card__photo{display:grid;grid-template-columns:1.4fr 1fr;gap:.4em;height:6em}
.mo-card__photo i{border-radius:.6em;background:linear-gradient(135deg,var(--lemon),var(--orange))}
.mo-card__photo i + i{background:linear-gradient(135deg,var(--aqua),var(--teal2))}
.mo-card__name{display:block;width:68%;height:.9em;margin-top:.9em;border-radius:9px;background:var(--ink)}
.mo-card__stars{display:flex;gap:.12em;margin-top:.6em;color:#F2A900;font-size:1.3em;line-height:1}
.mo-card__stars i{font-style:normal}
.mo-card__btns{display:flex;flex-wrap:wrap;gap:.4em;margin-top:.8em}
.mo-card__btns b{padding:.3em .8em;border:1.5px solid var(--ink);border-radius:999px;background:var(--sky);font:800 .82em/1.2 var(--jp)}
.mo-card__btns b:first-child{background:var(--teal2);color:#fff}

/* 1 冒頭 */
.mo-hero{position:relative;overflow:clip;padding:calc(var(--hh) + 64px) 6% clamp(72px,8vw,120px);background:var(--grain),radial-gradient(45% 45% at 100% 10%,rgba(247,137,74,.24),transparent 70%),radial-gradient(40% 40% at 0% 100%,rgba(62,214,220,.18),transparent 70%),var(--paper)}
.mo-hero__inner{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-title-text);max-width:1240px;margin:0 auto}
/* 文は白い札にのせる。スマホは地図が先、札が後 */
.mo-hero__text{position:relative;z-index:3;padding:clamp(24px,3vw,44px);border:2px solid var(--ink);border-radius:28px;background:#fff;box-shadow:10px 10px 0 var(--orange)}
/* スマホ・タブレットは見出しの札を先に、地図を後に（2026-11-02 右腕と同じ指摘。地図が先だと見出しが下に押される） */
.mo-hero__name{display:inline-block;margin-top:20px;padding-bottom:8px;border-bottom:3px solid var(--orange);font:800 clamp(16px,1.6vw,20px)/1.5 var(--jp);letter-spacing:.06em}
.mo-hero__catch{margin-top:24px;font:900 clamp(22px,6.8vw,72px)/1.24 var(--jp);letter-spacing:-.03em}
.mo-hero__lead{max-width:36em;margin-top:var(--s-title-text);font-size:16px;line-height:1.95}
.mo-hero__actions{margin-top:var(--s-text-action)}
/* 器（container）自身の余白には cqw を書かない（外側の幅で計算される）。余白は子の margin で取る */
.mo-stage-hero{position:relative;width:min(100%,560px);margin:0 auto;container-type:inline-size}
.mo-map{position:relative;overflow:hidden;width:78%;aspect-ratio:1/.82;margin:6cqw 0 20cqw auto;border:2px solid var(--ink);border-radius:4cqw;background:#FFF6E6;box-shadow:1.8cqw 1.8cqw 0 var(--ink)}
/* 区画・川・道は鮮やかに。道は太く、墨の縁取り */
.mo-map__river{position:absolute;left:-10%;top:66%;width:130%;height:9cqw;background:#8FD3F4;border-block:2px solid var(--ink);rotate:-16deg}
.mo-map__block{position:absolute;border:2px solid var(--ink);border-radius:2cqw;background:#9FE6E8}
.mo-map__block--1{left:5%;top:6%;width:34%;height:32%}
.mo-map__block--2{right:5%;top:6%;width:34%;height:26%;background:#FFE08A}
.mo-map__block--3{left:5%;bottom:30%;width:30%;height:14%;background:#FFC2D1}
.mo-map__block--4{right:6%;bottom:4%;width:30%;height:18%;background:#BDE7B4}
.mo-map__road{position:absolute;background:#fff;border:2px solid var(--ink)}
.mo-map__road--h{left:-2%;right:-2%;top:46%;height:4.4cqw}
.mo-map__road--v{top:-2%;bottom:-2%;left:46%;width:4.4cqw}
.mo-map__road--d{left:58%;top:58%;width:60%;height:3.2cqw;rotate:28deg;transform-origin:0 50%}
/* 店舗のピンの後ろで回り続ける光（常に動くもの） */
.mo-burst{position:absolute;left:66%;top:56%;width:44cqw;aspect-ratio:1;border-radius:50%;translate:-50% -50%;background:repeating-conic-gradient(rgba(245,207,107,.85) 0 9deg,transparent 9deg 22deg);-webkit-mask:radial-gradient(circle,#000 30%,transparent 70%);mask:radial-gradient(circle,#000 30%,transparent 70%);animation:mo-spin 22s linear infinite}
@keyframes mo-spin{to{rotate:360deg}}
/* 現在地から店舗までの経路。破線が流れ続ける（常に動くもの） */
.mo-route{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.mo-route path{fill:none;stroke:var(--pink2);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:3.2 2.6;animation:mo-route 1.2s linear infinite}
@keyframes mo-route{to{stroke-dashoffset:-5.8}}
.mo-pin--o1{left:22%;top:28%}
.mo-pin--o2{left:84%;top:26%;--c:#C3CDD4}
.mo-pin--o3{left:22%;top:66%;--c:#C3CDD4}
.mo-map .mo-pin--other{--p:6cqw}
.mo-map .mo-pin--shop{left:66%;top:62%;--p:13cqw;box-shadow:-.6cqw .6cqw 0 var(--ink);animation:mo-bob 2.4s ease-in-out infinite}
@keyframes mo-bob{50%{translate:-50% -114%}}
.mo-pulse{position:absolute;left:66%;top:60%;width:10cqw;aspect-ratio:1;border:.8cqw solid var(--orange);border-radius:50%;translate:-50% -50%;animation:mo-pulse 2.4s ease-out infinite}
.mo-pulse--2{animation-delay:1.2s}
@keyframes mo-pulse{from{transform:scale(.6);opacity:1}to{transform:scale(2.6);opacity:0}}
/* 現在地の青い点。波紋が広がり続ける（常に動くもの） */
.mo-here{position:absolute;left:48%;top:22%;width:5cqw;aspect-ratio:1;border:.8cqw solid #fff;border-radius:50%;translate:-50% -50%;background:#2F7BEA;box-shadow:0 0 0 2px var(--ink)}
.mo-here::after{content:"";position:absolute;inset:-.8cqw;border-radius:50%;background:rgba(47,123,234,.35);animation:mo-ring 2.2s ease-out infinite}
@keyframes mo-ring{from{transform:scale(1);opacity:.9}to{transform:scale(3.4);opacity:0}}
/* 店舗のまわりに浮かぶ札（営業中・口コミ・写真）。それぞれの速さで揺れ続ける（常に動くもの） */
.mo-chip{position:absolute;z-index:3;display:grid;place-items:center;border:2px solid var(--ink);box-shadow:.8cqw .8cqw 0 var(--ink);animation:mo-float var(--t,3s) ease-in-out infinite}
@keyframes mo-float{50%{translate:0 -1.6cqw}}
.mo-chip--open{left:9cqw;top:24cqw;padding:1.2cqw 3cqw;border-radius:999px;background:#2DBE6C;color:#fff;font:800 3.4cqw/1.2 var(--jp);--t:2.8s}
.mo-chip--review{right:0;top:34cqw;gap:1.2cqw;padding:2cqw 2.6cqw;border-radius:2.6cqw 2.6cqw 2.6cqw 0;background:#fff;--t:3.4s}
.mo-chip--review .mo-guide__stars{font-size:3.6cqw}
.mo-chip__line{width:100%;height:1.4cqw;border-radius:9px;background:#D7E4EE}
.mo-chip--photo{left:57cqw;top:58cqw;width:13cqw;aspect-ratio:1;border-radius:2.6cqw;background:linear-gradient(160deg,var(--aqua) 0 45%,var(--lemon) 45% 70%,var(--orange) 70%);--t:3.1s}
.mo-chip--photo i{width:4cqw;aspect-ratio:1;border-radius:50%;background:#fff;translate:2cqw -2.4cqw}
.mo-card--hero{position:absolute;left:0;bottom:4cqw;z-index:2;width:54cqw;font-size:3cqw;box-shadow:.5em .5em 0 var(--pink2)}
.mo-photo{z-index:3}
/* 写真は地図の左上の外に1枚、地図の右上の角に1枚（重ねる）、地図の右下の外に1枚 */
.mo-photo--pin{--d:18cqw;left:1%;top:0}
.mo-photo--stars{--d:17cqw;right:-1%;top:2cqw}
.mo-photo--shop{--d:17cqw;right:5%;bottom:0}
@media(min-width:1024px){
  .mo-hero{min-height:min(100svh,980px);display:flex;align-items:center}
  /* 文の札を地図の左側に重ね、地図は画面の右端まではみ出す */
  .mo-hero__inner{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;column-gap:0;width:100%}
  .mo-hero__text{order:0;margin-right:-6%}
  .mo-stage-hero{order:1;width:auto;margin-right:calc((min(1240px,88vw) - 100vw) / 2);margin-left:0}
  /* 札に隠れないよう、地図の上の部品は右寄りに置く */
  .mo-card--hero{left:auto;right:2cqw;bottom:2cqw}
  .mo-chip--open{left:27cqw;top:10cqw}
  .mo-chip--review{top:22cqw;right:5cqw}
  .mo-chip--photo{left:27cqw;top:48cqw}
  .mo-photo--pin{--d:16cqw;left:5cqw;top:0}
  .mo-photo--shop{right:auto;left:25cqw;bottom:-2cqw}
  /* 見出しの1行（10字）を文の札の内側に収める大きさ */
  .mo-hero__catch{font-size:clamp(30px,2.9vw,44px)}
  .mo-stage-hero{width:100%}
}

/* 1.5 相談の入口：ピンの印の付いた帯 */
.mo-intro{padding:clamp(28px,4vw,44px) 6%;background:#FFF1E6;border-block:2px solid var(--ink)}
.mo-intro__text{display:flex;align-items:center;gap:18px;max-width:1200px;margin:0 auto;font:700 clamp(16px,1.6vw,19px)/1.8 var(--jp)}
.mo-intro__pin{flex:none;width:30px;aspect-ratio:1;border:2px solid var(--ink);border-radius:50% 50% 50% 0;background:var(--orange);rotate:-45deg}

/* 2 支援すること：画面の中を送るスマホ */
.mo-support{position:relative;padding:var(--s-section) 6%;background:var(--grain),linear-gradient(180deg,#fff,#FFF6EE)}
.mo-flow{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-block);max-width:1200px;margin:var(--s-block) auto 0}
.mo-phone-col{display:grid;justify-items:center}
.mo-phone{width:min(78%,300px);padding:10px;border:2px solid var(--ink);border-radius:44px;background:var(--ink);box-shadow:10px 10px 0 var(--orange);container-type:inline-size}
.mo-screen{position:relative;overflow:hidden;aspect-ratio:9/17;border-radius:34px;background:var(--paper)}
.mo-feed{padding-bottom:8cqw}
.mo-feed__map{position:relative;height:40cqw;background:linear-gradient(90deg,transparent 46%,#fff 46% 54%,transparent 54%),linear-gradient(0deg,transparent 40%,#fff 40% 48%,transparent 48%),linear-gradient(135deg,#DCE9D5 0 40%,#EEF2EA 40% 70%,#CFE4F2 70%)}
.mo-feed__map .mo-pin--shop{left:50%;top:62%;--p:10cqw}
.mo-card--phone{position:relative;margin:-8cqw 4cqw 0;font-size:4.2cqw;box-shadow:.4em .4em 0 var(--orange)}
.mo-part{margin:7cqw 5cqw 0}
.mo-info{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:3cqw;align-items:center;padding:2.6cqw 0;border-bottom:1.5px solid rgba(19,32,43,.12)}
.mo-info b{font:800 4cqw/1.3 var(--jp)}
.mo-info span{height:2.4cqw;border-radius:9px;background:#D7E4EE}
.mo-info em{display:grid;place-items:center;width:6.4cqw;height:6.4cqw;border:1.5px solid var(--ink);border-radius:50%;background:var(--teal2);color:#fff;font:800 3.4cqw/1 var(--jp);font-style:normal}
.mo-part--photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.4cqw}
.mo-shot{aspect-ratio:1;border:1.5px solid var(--ink);border-radius:3cqw;background:linear-gradient(135deg,var(--lemon),var(--orange))}
.mo-shot--2{background:linear-gradient(135deg,var(--aqua),var(--teal2))}
.mo-shot--3{background:linear-gradient(135deg,var(--pink2),var(--orange))}
.mo-post{grid-column:1/-1;display:grid;gap:2cqw;padding:3.6cqw;border:1.5px solid var(--ink);border-radius:3.6cqw;background:#fff}
.mo-post b{justify-self:start;padding:.6cqw 3cqw;border-radius:999px;background:var(--lemon);font:800 3.4cqw/1.3 var(--jp)}
.mo-post span{height:2.2cqw;border-radius:9px;background:#D7E4EE}
.mo-post span:last-child{width:70%}
.mo-review{display:grid;gap:2cqw;padding:3.6cqw;border:1.5px solid var(--ink);border-radius:3.6cqw 3.6cqw 3.6cqw 0;background:#fff}
.mo-review__stars{display:flex;gap:.6cqw;color:#F2A900;font-size:4.6cqw;line-height:1}
.mo-review__stars i{font-style:normal}
.mo-review > span{height:2.2cqw;border-radius:9px;background:#D7E4EE}
.mo-review > span:last-child{width:64%}
.mo-reply{display:grid;gap:2cqw;width:84%;margin:3cqw 0 0 auto;padding:3.6cqw;border:1.5px solid var(--ink);border-radius:3.6cqw 3.6cqw 0 3.6cqw;background:#FFE7D6;transform-origin:100% 0}
.mo-reply b{font:800 3.2cqw/1.3 var(--jp)}
.mo-reply span{height:2.2cqw;border-radius:9px;background:#F4C5A6}
.mo-stat{display:grid;grid-template-columns:12cqw minmax(0,1fr);gap:3cqw;align-items:center;margin-top:3cqw}
.mo-stat b{font:800 3.6cqw/1.3 var(--jp)}
.mo-stat i{display:block;width:var(--w);height:4cqw;border-radius:9px;background:linear-gradient(90deg,var(--orange),var(--pink2));transform-origin:0 50%}
.mo-items{display:grid;gap:clamp(36px,4vw,48px);margin:0;padding:0;list-style:none}
.mo-item{display:grid;gap:10px;padding-top:clamp(20px,2vw,28px);border-top:2px dotted rgba(19,32,43,.3)}
.mo-item__no{font:800 clamp(36px,4vw,56px)/1 var(--display);letter-spacing:-.03em;color:transparent;background:linear-gradient(110deg,var(--orange),var(--pink2));-webkit-background-clip:text;background-clip:text}
.mo-item__text{font:800 clamp(17px,1.6vw,20px)/1.7 var(--jp);word-break:auto-phrase;text-wrap:pretty}
.mo-support__after{max-width:1200px;margin:var(--s-block) auto 0;font-size:16px;line-height:1.95}
.mo-support__after p + p{margin-top:12px}
@media(min-width:768px){
  .mo-flow{grid-template-columns:minmax(0,6fr) minmax(0,5fr);align-items:start;column-gap:clamp(40px,6vw,96px)}
  .mo-phone-col{grid-column:2;grid-row:1;position:sticky;top:calc(var(--hh) + 40px)}
  .mo-items{grid-column:1;grid-row:1}
  /* スマホが画面に収まる大きさにする（高さ＝幅×17/9＋枠） */
  .mo-phone{width:min(100%,320px,calc((100svh - var(--hh) - 100px) * 9 / 17))}
  /* 項目の間を空けすぎない（タブレットで1項目あたり約300px空いていた。2026-11-02 目視） */
  .mo-item{min-height:26svh;align-content:center}
}

/* 2.5 Revipo：何をする仕組みかを先に書き、4つの場面を線が順に通り抜ける */
.mo-rv{position:relative;padding:var(--s-section) 6%;background:var(--grain),linear-gradient(180deg,#FFF6EE,#FFFBEA 55%,#FFF1F4)}
.mo-rv__lead{margin-top:var(--s-title-text)}
.mo-rv__lead p{font-size:16px;line-height:1.95}
.mo-rv__lead p + p{margin-top:12px}
.mo-rv__track{position:relative;max-width:1200px;margin:var(--s-block) auto 0}
/* 線。PCは絵の高さの中央を横に、それより狭い画面は左端を縦に通る */
.mo-rv__line{position:absolute;left:11px;top:0;bottom:0;width:4px;border-radius:9px;background:linear-gradient(180deg,var(--orange),var(--pink2));transform-origin:50% 0}
.mo-rv__steps{position:relative;z-index:1;display:grid;gap:44px;margin:0;padding:0 0 0 40px;list-style:none}
.mo-rv__art{position:relative;height:170px;border:2px solid var(--ink);border-radius:24px;background:#fff;box-shadow:6px 6px 0 var(--ink);overflow:hidden}
.mo-rv__text{margin-top:20px;font:800 16px/1.8 var(--jp);word-break:auto-phrase;text-wrap:pretty}
/* 1 QRコードのPOPとアンケート */
.mo-pop{position:absolute;left:9%;top:20px;display:grid;justify-items:center;gap:6px;width:min(96px,36%);padding:10px 10px 8px;border:2px solid var(--ink);border-radius:12px;background:var(--lemon)}
.mo-qr{display:grid;grid-template-columns:repeat(5,1fr);gap:2px;width:min(62px,100%);padding:4px;border-radius:6px;background:#fff}
.mo-qr i{aspect-ratio:1;background:var(--ink)}
.mo-qr i:nth-child(3n+2),.mo-qr i:nth-child(7),.mo-qr i:nth-child(13),.mo-qr i:nth-child(19){background:transparent}
.mo-pop b{font:800 13px/1 var(--display);letter-spacing:.1em}
.mo-ask{position:absolute;right:9%;top:30px;display:grid;gap:10px;width:min(110px,38%);padding:14px 12px;border:2px solid var(--ink);border-radius:16px;background:var(--sky)}
.mo-ask i{display:block;height:14px;border:1.5px solid var(--ink);border-radius:9px;background:#fff}
.mo-ask i:first-child{background:var(--teal2)}
/* 2 お礼のクーポンと口コミの案内 */
.mo-coupon{position:absolute;left:8%;top:28px;display:grid;gap:8px;width:min(120px,52%);padding:12px 14px;border:2px solid var(--ink);border-radius:12px;background:var(--pink2);color:#fff;outline:2px dashed rgba(255,255,255,.7);outline-offset:-8px}
.mo-coupon b{font:800 14px/1 var(--display);letter-spacing:.08em}
.mo-coupon span{height:8px;border-radius:9px;background:rgba(255,255,255,.7)}
.mo-guide{position:absolute;right:8%;bottom:26px;display:grid;justify-items:start;gap:8px;padding:12px 14px;border:2px solid var(--ink);border-radius:16px 16px 16px 0;background:#fff}
.mo-guide__stars{display:flex;gap:2px;color:#F2A900;font-size:17px;line-height:1}
.mo-guide__stars i{font-style:normal}
.mo-guide b{padding:2px 10px;border:1.5px solid var(--ink);border-radius:999px;background:var(--sky);font:800 12px/1.4 var(--jp)}
/* 3 口コミと、AIが作成した返信の下書き */
.mo-msg{position:absolute;left:8%;top:22px;display:grid;gap:8px;width:min(130px,56%);padding:12px 14px;border:2px solid var(--ink);border-radius:16px 16px 16px 0;background:#fff}
.mo-msg > span:last-child{height:8px;border-radius:9px;background:#D7E4EE}
.mo-draft{position:absolute;right:8%;bottom:22px;display:grid;gap:8px;width:min(140px,60%);padding:12px 14px;border:2px solid var(--ink);border-radius:16px 16px 0 16px;background:#FFE7D6}
.mo-draft b{justify-self:start;padding:2px 10px;border:1.5px solid var(--ink);border-radius:8px;background:linear-gradient(135deg,var(--aqua),var(--lemon));font:800 12px/1.4 var(--display)}
.mo-draft span{height:8px;border-radius:9px;background:#F4C5A6}
.mo-draft span:last-child{width:70%}
/* 4 前の期間との比較（灰が前の期間、色が今回） */
.mo-compare{position:absolute;left:12%;right:12%;bottom:28px;top:30px;display:flex;align-items:flex-end;justify-content:space-around;border-bottom:2px solid var(--ink)}
.mo-compare__pair{display:flex;align-items:flex-end;gap:6px;height:100%}
.mo-compare__pair i{width:18px;height:var(--h);border:1.5px solid var(--ink);border-bottom:0;border-radius:6px 6px 0 0;background:#C9D3DA;transform-origin:50% 100%}
.mo-compare__pair i + i{background:linear-gradient(180deg,var(--orange),var(--pink2))}
.mo-rv__notes{max-width:1200px;margin:var(--s-block) auto 0}
.mo-rv__notes p{font-size:15px;line-height:1.9}
.mo-rv__notes p + p{margin-top:10px}
.mo-rv__link{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:var(--s-text-action)!important}
.mo-rv__link span{font:700 13px/1.6 var(--jp);color:var(--muted)}
/* 4列にするのは1200px以上（それより狭いと説明文が言葉の途中で折れる）。768〜1199pxは2列で、線は縦 */
@media(min-width:768px) and (max-width:1199px){.mo-rv__steps{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}}
@media(min-width:1200px){
  .mo-rv__line{left:0;right:0;top:83px;bottom:auto;width:auto;height:4px;background:linear-gradient(90deg,var(--orange),var(--pink2));transform-origin:0 50%}
  .mo-rv__steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding:0}
}

/* 3 ご利用について：作業の札が集まるご案内の票 */
.mo-plan{position:relative;overflow:clip;padding:var(--s-section) 6%;background:var(--grain),radial-gradient(50% 60% at 0% 100%,rgba(247,137,74,.2),transparent 70%),var(--ink);color:#fff}
.mo-plan__giant{position:absolute;left:0;top:clamp(24px,4vw,56px);z-index:0;font:800 clamp(80px,17vw,240px)/1 var(--display);letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.14);pointer-events:none}
.mo-plan__inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-block);max-width:1200px;margin:0 auto}
.mo-plan__lead{margin-top:var(--s-title-text);font-size:16px;line-height:1.95;color:rgba(255,255,255,.9)}
.mo-next{margin-top:var(--s-text-action)}
.mo-order{display:grid;gap:28px;justify-items:center}
.mo-sheet{display:grid;gap:12px;width:min(100%,400px);padding:clamp(22px,3vw,32px);border:2px solid var(--ink);border-radius:24px;background:#fff;color:var(--ink);box-shadow:10px 10px 0 var(--orange)}
.mo-sheet__head{display:flex;align-items:center;justify-content:space-between;padding-bottom:12px;border-bottom:2px solid var(--ink)}
.mo-sheet__head b{font:900 20px/1.3 var(--jp);letter-spacing:.06em}
.mo-sheet__ok{display:grid;place-items:center;width:40px;height:40px;border:2px solid var(--ink);border-radius:50%;background:var(--orange);font:800 18px/1 var(--jp);font-style:normal}
.mo-pick{padding:12px 18px;border:2px solid var(--ink);border-radius:14px;background:var(--sky);font:800 16px/1.4 var(--jp)}
.mo-pick--2{background:#FFF3D6}
.mo-pick--3{background:#FFE7D6}
.mo-pick--4{background:#E2F6F2}
.mo-extras{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;width:min(100%,440px)}
.mo-extras b{width:100%;text-align:center;font:800 13px/1.4 var(--jp);letter-spacing:.1em;color:rgba(255,255,255,.75)}
.mo-extra{padding:8px 16px;border:2px dashed rgba(255,255,255,.7);border-radius:12px;font:700 14px/1.4 var(--jp)}
@media(min-width:1024px){.mo-plan__inner{grid-template-columns:minmax(0,6fr) minmax(0,5fr);align-items:center;column-gap:clamp(40px,6vw,96px)}}

/* 共通の integration.css（body.coletlab-experience main p）が段落の最大幅を外すため、幅を決めた段落は #main から指定し直す。
   段落の幅は、上の並び（支援内容とスマホ）と同じ幅にそろえる */
#main .mo-hero__lead{max-width:36em}
#main .mo-support__after{max-width:1200px}
#main .mo-intro__text{max-width:1200px}
#main .mo-rv__lead p,#main .mo-rv__notes p{max-width:1200px}
/* 共通の段落の指定（word-break:normal）に負けて言葉の途中で折れるため、文節で折る指定を #main から書き直す */
#main .mo-rv__text,#main .mo-item__text{word-break:auto-phrase}

/* 2026-11-02 原稿P09の改稿で入った「更新や口コミ対応を、続けられる方法で」。2つの道の札（白い面＋墨の線＋ずらした影）と本文 */
.mo-keep{position:relative;padding:var(--s-section) 6%;background:var(--grain),linear-gradient(180deg,#fff,#FFF4EA)}
.mo-keep__inner{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-title-text);max-width:1200px;margin:var(--s-block) auto 0}
.mo-keep__ways{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.mo-way{display:grid;gap:8px;padding:22px 20px;border:2px solid var(--ink);border-radius:22px;background:#fff;box-shadow:6px 6px 0 var(--orange)}
.mo-way--2{box-shadow:6px 6px 0 var(--aqua)}
.mo-way b{font:900 clamp(17px,1.8vw,22px)/1.4 var(--jp)}
.mo-way span{font:600 14px/1.6 var(--jp);color:rgba(19,32,43,.7)}
.mo-keep__text p{font-size:16px;line-height:1.95}
.mo-keep__text p + p{margin-top:16px}
#main .mo-keep__text p{max-width:none}
@media(min-width:900px){.mo-keep__inner{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;column-gap:clamp(32px,4vw,64px)}}
@media(max-width:379px){.mo-keep__ways{grid-template-columns:minmax(0,1fr)}}
