/* 2026-10-04 試作：下層ページへ展開する。トップと同じ線画・開いた円・道・丘の波線・深緑のフッターを使う。
   atmosphere.css の後に読む。色・動きの決まりは画風シート（/style-sheet/）と同じ。 */

/* ---- 見出しとアニメアイコンを横並びのまとまりとして全幅で中央へ ---- */
.ar-page-hero{padding:36px 0 0;background:#fff}
.ar-page-hero__inner{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:12px;text-align:center;padding-bottom:12px}
.ar-page-hero__copy{min-width:0;width:100%;max-width:100%}
.ar-page-hero h1{position:relative;z-index:0;margin:0;font-size:28px;line-height:1.6;letter-spacing:.05em}
.ar-page-hero .hand-underline:after{bottom:.15em;height:.22em}
.ar-heading-art{display:flex;align-items:flex-end;justify-content:center;flex:none;width:auto;max-width:70px;height:40px}
.ar-heading-art .ar-page-scene{display:block;width:auto;height:100%;max-width:100%;margin:0;stroke-width:2.3}
.ar-heading-art .pale{stroke:var(--ink);fill:none}
.ar-page-ground{display:block;width:100%;height:14px;margin-top:-7px}
.ar-page-ground .ln{stroke-width:2.4}
.ar-page-hero__media{display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center}
.ar-page-hero__media:not(:empty){padding-top:18px}
.ar-page-hero__art{display:flex;align-items:center;justify-content:center;width:min(100%,220px);aspect-ratio:3/2}
.ar-page-hero__lead{max-width:42em;margin:0;font-size:16px;line-height:2.1}
.ar-svg .trail{stroke:var(--sage);stroke-width:3;stroke-dasharray:2 7;fill:none}
@media(max-width:359px){.ar-page-hero h1{font-size:25px}.ar-page-hero--thanks h1{font-size:24px;letter-spacing:.02em}}
/* 2行の長い方（11字）が収まる最大の大きさ。ほかのページのh1と同じ28pxになる（375pxでも） */
@media(min-width:360px) and (max-width:599px){.ar-page-hero--thanks h1{font-size:min(28px,calc((100vw - 44px) / 11.4));letter-spacing:.02em}}
@media(min-width:600px){
 .ar-page-hero{padding-top:48px}
 .ar-page-hero h1{font-size:34px}
 .ar-page-hero__inner{gap:20px;padding-bottom:16px}
 .ar-page-hero__copy{min-width:0;width:100%;max-width:100%}
 .ar-heading-art{max-width:110px;height:50px}
 .ar-page-hero__art{width:240px}
 .ar-page-hero__media{gap:20px}
}
@media(min-width:1000px){
 .ar-page-hero{padding-top:56px}
 .ar-page-hero__inner{gap:24px;padding-bottom:18px}
 .ar-page-hero__copy{min-width:0;width:100%;max-width:100%}
 .ar-page-hero h1{font-size:40px}
 .ar-heading-art{max-width:150px;height:60px}
 .ar-page-hero__art{width:260px}
 .ar-page-hero__media{gap:24px}
 .ar-page-hero__media:not(:empty){padding-top:24px}
 .ar-page-hero__lead{font-size:17px}
}
/* 読み込み後：文字は上から順に、地面線と場面が描かれ、灯りがともり、扉が開く。木は5秒以内で止まる */
@media(prefers-reduced-motion:no-preference){
 /* r12：トップのヒーローと同じテンポ。見出し→地面の線→人物→説明文の順に、待たせず約0.2〜0.3秒間隔で */
 .ar-page-hero h1{animation:ar-rise-soft 1.1s var(--gentle) .1s both}
 .ar-page-hero .hand-underline:after{animation:underline-in .9s var(--gentle) .75s both}
 .ar-page-ground .ar-dr{animation:ar-draw 1.5s var(--gentle) .3s both}
 .ar-page-hero .ar-human--hero img{animation:ar-float-in 1.3s var(--gentle) .4s both}
 .ar-page-hero__lead{animation:ar-rise-soft 1.1s var(--gentle) .65s both}
 .ar-page-scene .ar-dr{animation:ar-draw 1.5s var(--ease-out) .55s both}
 .ar-page-scene .wash,.ar-page-scene .sage,.ar-page-scene .awning{animation:ar-fade 1s ease 1.1s both}
 .ar-page-scene .lt,.ar-page-scene .lts,.ar-page-scene .trail{animation:ar-fade .7s ease 1.5s both}
 .ar-page-scene .lamp{animation:ar-light .5s ease 1.8s both}
 .ar-page-scene .lamp-2{animation-delay:2.1s}
 .ar-page-scene .lamp-3{animation-delay:2.4s}
 .ar-page-scene .glow{animation:ar-light .8s ease 1.6s both}
 .ar-page-scene .leaf{animation:ar-door-open 1.2s var(--ease-out) 1.5s both}
 .ar-page-scene .leaf-face,.ar-page-scene .leaf .ln{animation:ar-fade .8s ease .6s both}
 .ar-page-scene .float{animation:ar-rise 1.1s var(--ease-out) 1.3s both}
 .ar-page-scene .sway{animation:ar-sway 2.2s ease-in-out 2s 2}
}

/* ---- 本文 ---- */
.ar-page-body{padding-top:56px}
.ar-sec-title{margin:0 0 32px;font-size:22px;line-height:1.75;letter-spacing:.05em;text-align:center}
.ar-sec-title--lg{font-size:24px;line-height:1.8}
@media(max-width:359px){.ar-sec-title--lg{font-size:20px}}
@media(min-width:600px){.ar-sec-title{font-size:26px}.ar-sec-title--lg{font-size:30px}}
@media(min-width:1000px){.ar-page-body{padding-top:72px}.ar-sec-title{font-size:30px;margin-bottom:44px}.ar-sec-title--lg{font-size:37px}}

/* 丘の波線で区切る淡い緑の帯（トップの強みと同じ） */
.ar-band{position:relative;background:#eef4ed;margin-top:96px;padding:56px 0 64px}
@media(min-width:820px){.ar-band{margin-top:136px;padding:72px 0 88px}}

/* 相談帯（トップと同じ部品）の上の余白 */
.ar-sub .contact-home{margin-top:96px}
@media(min-width:820px){.ar-sub .contact-home{margin-top:128px}}

/* ---- サービス：小さな用件アイコンを見出しの左へ、本文は中央の列に ---- */
.biz-item{max-width:720px;margin:0 auto}
.biz-item+.biz-item{margin-top:88px}
.biz-heading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;margin-bottom:24px}
.biz-service-icon{flex:none;width:76px;margin:0}
.biz-service-icon .service-icon{display:block;width:100%;height:auto}
.ar-scene{display:block;width:min(100%,250px);height:auto;margin:0 auto 12px}
.biz-item h2{min-width:0;margin:0;font-size:22px;line-height:1.7;letter-spacing:.05em;text-align:left}
.biz-text{max-width:38em;margin-inline:auto}
.biz-text p{font-size:14px;line-height:2.1}
.biz-text p+p{margin-top:12px}
.biz-text .page-list{margin:16px 0 0;font-size:14px;line-height:2}
.biz-text .biz-links{display:flex;flex-direction:column;align-items:flex-start;margin-top:18px}
.biz-consult{display:block;width:fit-content;padding-block:11px;font-size:14px;font-weight:600;text-decoration:underline;text-decoration-color:#b6c9b9;text-underline-offset:6px}
.biz-consult>span{display:inline-block;transition:transform .25s var(--ease-out)}
.biz-consult:hover>span,.biz-consult:focus-visible>span{transform:translateX(4px)}
.atmos .biz-flow{font-size:12px;font-weight:500;color:var(--muted)}
@media(min-width:600px){.biz-service-icon{width:88px}.biz-item h2{font-size:26px}.biz-text p,.biz-text .page-list{font-size:15px}}
@media(min-width:1000px){.biz-item+.biz-item{margin-top:120px}.biz-service-icon{width:100px}.ar-scene{width:280px}.biz-item h2{font-size:30px}}
.ar-scene.ar-wait .glow{opacity:0}
.ar-scene.ar-wait.is-drawn .glow{animation:ar-light .6s ease .8s both}
.ar-scene.ar-wait.is-drawn .road.ar-dr{animation-duration:1.2s;animation-delay:.45s}
.ar-scene.ar-wait.is-drawn .lamp-1{animation-delay:.8s}
.ar-scene.ar-wait.is-drawn .lamp-2{animation-delay:1.1s}
.ar-scene.ar-wait.is-drawn .lamp-3{animation-delay:1.4s}
.ar-scene.ar-wait.is-drawn .sway{animation:ar-sway 2.2s ease-in-out 1.2s 2}

/* ---- ご相談の流れ：ページ内の目次（開いた円の印） ---- */
.ar-jump ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px;max-width:760px;margin:0 auto;padding:0;list-style:none}
.ar-jump a{display:flex;flex-direction:column;align-items:center;gap:10px;padding:10px 4px;color:var(--teal);font-size:13px;font-weight:600;line-height:1.6;text-align:center}
.ar-jump__label{max-width:100%}
.ar-jump .ar-node{width:64px;height:64px;transition:transform .3s var(--ease-out)}
.ar-jump .ar-node .ar-svg{width:40px;height:36px;margin:0}
.ar-jump a:hover .ar-node,.ar-jump a:focus-visible .ar-node{transform:translateY(-3px)}
@media(min-width:600px){.ar-jump ul{grid-template-columns:repeat(4,minmax(0,1fr))}.ar-jump a{font-size:14px}.ar-jump .ar-node{width:72px;height:72px}.ar-jump .ar-node .ar-svg{width:46px;height:41px}}

/* ---- ご相談の流れ：用件の印から道がのび、工程を開いた円でつなぎ、相談で終わる ---- */
.flow-block{max-width:720px;margin:88px auto 0}
.flow-block h2{margin:0 0 32px;font-size:22px;line-height:1.75;letter-spacing:.05em;text-align:center}
.ar-flow{position:relative}
.ar-flow__road{position:absolute;left:20px;top:28px;width:24px;height:calc(100% - 53px)}
.ar-flow__start{position:relative;display:grid;place-items:center;width:56px;height:56px;margin:0 0 24px 4px}
.ar-flow__start .ar-svg{width:36px;height:32px}
.ar-flow .flow-list li{margin-left:0;padding:0 0 32px 76px;border-left:0}
.ar-flow .flow-list li:last-child{padding-bottom:24px}
.ar-flow .flow-step{left:12px;top:-1px;width:40px;height:40px;border:0;background:radial-gradient(farthest-side,#fff calc(100% - 2px),transparent calc(100% - 1.5px)),var(--ring);font-size:14px;font-weight:700}
.ar-flow__end{position:relative;padding-left:76px}
.ar-flow__end:before{content:"";position:absolute;left:26px;top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50%;background:var(--lime)}
.ar-flow__end a{display:inline-block;padding-block:11px;font-size:14px;font-weight:600;text-decoration:underline;text-decoration-color:#b6c9b9;text-underline-offset:6px}
.ar-flow__end a>span{display:inline-block;transition:transform .25s var(--ease-out)}
.ar-flow__end a:hover>span,.ar-flow__end a:focus-visible>span{transform:translateX(4px)}
@media(max-width:599px){
 .ar-flow__road{left:12px;top:24px;height:calc(100% - 49px)}
 .ar-flow__start{width:48px;height:48px;margin-left:0}
 .ar-flow__start .ar-svg{width:32px;height:28px}
 .ar-flow .flow-list li{padding-left:56px}
 .ar-flow .flow-step{left:6px;width:36px;height:36px;font-size:13px}
 .ar-flow__end{padding-left:56px}
 .ar-flow__end:before{left:18px}
}
@media(min-width:600px){.flow-block h2{font-size:26px}}
@media(min-width:1000px){.flow-block{margin-top:112px}.flow-block h2{font-size:30px;margin-bottom:40px}}
.ar-flow.ar-wait.is-drawn .road.ar-dr{animation-duration:2.2s}
.ar-flow.ar-wait.is-drawn .ar-node{animation:ar-pop .5s var(--ease-out) both}

/* よくあるご質問：淡い緑の帯。開閉の印はロゴの開いた円 */
.faq-band .faq-list{max-width:760px;margin-inline:auto;border-top-color:#cbdccc}
.faq-band .faq-item{border-bottom-color:#cbdccc}
.atmos .faq-item summary{padding-right:50px}
.atmos .faq-item summary:after{width:32px;height:32px;border:0;background:radial-gradient(farthest-side,#fff calc(100% - 2px),transparent calc(100% - 1.5px)),var(--ring);color:var(--teal);font-size:18px}
.atmos .faq-item[open] summary:after{border:0}

/* ---- 会社案内：提案する人物→白地の支給ロゴ→理念（帯）→会社概要（表と地図） ---- */
/* 支給ロゴの左端のマークだけを、会社概要の中で小さく表示。原本の比率は維持。 */
.co-logo-mark{display:block;width:68px;height:68px;overflow:hidden;margin:0 auto 20px}
.co-logo-mark img{display:block;width:auto;max-width:none;height:100%}
@media(min-width:600px){.co-logo-mark{width:80px;height:80px;margin-bottom:24px}}
.co-outline{margin-top:64px}
.co-outline__grid{display:grid;gap:36px}
.co-outline .info-list{border-top:1px solid var(--line)}
.ar-sub .co-outline .ar-map-figure{width:100%;max-width:360px;margin:0 auto}
@media(min-width:820px){.co-outline{margin-top:88px}}
@media(min-width:1000px){
 .co-outline__grid{grid-template-columns:minmax(300px,1fr) 2.2fr;column-gap:70px;align-items:start}
 .ar-sub .co-outline .ar-map-figure{order:-1;margin:0;position:sticky;top:124px}
}

/* ---- お問い合わせ：トップの相談帯と同じボタン ---- */
.ar-contact-page{max-width:360px;margin:0 auto;text-align:center}
.ar-contact-page .contact-options>.button{width:100%;max-width:none;min-width:0}
.ar-contact-page__caption{margin-top:12px;font-size:13px;color:var(--muted)}
.ar-contact-page .page-note{margin-top:28px}

/* ---- プライバシーポリシー・お問い合わせ完了 ---- */
.ar-sub .policy{max-width:720px;margin-inline:auto}
.ar-thanks-back{text-align:center}

/* 番号の列は第1工程から始める。 */
.ar-flow__road{top:18px;height:calc(100% - 43px)}
@media(max-width:599px){.ar-flow__road{top:17px;height:calc(100% - 42px)}}

/* ---- サービスの説明と図（2026-10-08 クライアント依頼：説明はパンフを引用し、図はパンフの構成をサイトの画風で） ---- */
.biz-checks{list-style:none;margin:0 0 4px;padding:0;display:grid;gap:12px}
.biz-checks li{position:relative;padding-left:34px;font-size:15px;font-weight:600;line-height:1.9;color:var(--teal)}
.biz-checks li:before{content:"";position:absolute;left:0;top:.3em;width:23px;height:23px;border-radius:50%;background:var(--lime)}
.biz-checks li:after{content:"";position:absolute;left:8px;top:calc(.3em + 5px);width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.biz-sub{position:relative;margin:30px 0 10px;padding-left:16px;font-size:18px;line-height:1.7;letter-spacing:.04em;color:var(--teal)}
.biz-text>.biz-sub:first-child{margin-top:0}
.biz-sub:before{content:"";position:absolute;left:0;top:.3em;width:6px;height:1.1em;border-radius:3px;background:var(--lime)}
.biz-route .ar-node,.biz-compare .ar-node{flex:none;width:56px;height:56px}
.biz-route .ar-node .ar-svg,.biz-compare .ar-node .ar-svg{width:34px;height:30px;margin:0}
.ar-node--logo img{display:block;width:38px;height:38px;border-radius:50%}
.ar-node--muted{background:radial-gradient(farthest-side,#fff calc(100% - 2px),transparent calc(100% - 1.5px)),#bcc6c3}
.ar-node--muted .ar-svg .ln{stroke:#8d9b97}
.ar-node--muted .ar-svg .wash{fill:#eef1f0}
.biz-step__name{margin:0;font-size:13px;font-weight:600;line-height:1.5;color:var(--teal)}
/* 売りたい：PCはパンフと同じ横並び（売主―アセットルーム → 扇状に3つのルート）。スマホは上から下へ。2026-10-08 */
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.biz-route{margin:28px 0;padding:20px 12px 16px;border-radius:16px;background:#f2f7ee}
/* 売主はアセットルームの上に縦に積む（2026-10-08 社長指示） */
.biz-route__src{display:flex;flex-direction:column;align-items:center}
.biz-route__seller{position:relative;display:flex;flex-direction:column;align-items:center}
.biz-route__seller>.biz-step__name{position:absolute;right:100%;top:28px;margin-right:10px;transform:translateY(-50%);white-space:nowrap}
.biz-route__road{display:block;width:6px;height:22px;background:var(--sage)}
.biz-route__fan{display:block;overflow:visible}
.biz-route__fan .fan{fill:none;stroke:var(--sage);stroke-width:5;stroke-linecap:round;vector-effect:non-scaling-stroke}
.biz-route__fan--sp{width:100%;height:34px}
.biz-route__fan--pc{display:none}
.biz-route__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:4px;row-gap:10px}
.biz-route__list li{display:contents}
.biz-route__dest{grid-row:1;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;margin-bottom:6px}
.biz-route__list li:nth-child(1) .biz-route__dest{grid-column:1}
.biz-route__list li:nth-child(2) .biz-route__dest{grid-column:2}
.biz-route__list li:nth-child(3) .biz-route__dest{grid-column:3}
.biz-route__box{grid-column:1/-1;padding:10px 14px 12px;border-radius:12px;background:#fff}
.biz-route__list li:nth-child(1) .biz-route__box{grid-row:2}
.biz-route__list li:nth-child(2) .biz-route__box{grid-row:3}
.biz-route__list li:nth-child(3) .biz-route__box{grid-row:4}
.biz-text .biz-route__box p{margin:0;font-size:13px;line-height:1.85}
.biz-text .biz-route__box .biz-step__name{margin-bottom:2px;font-size:14px}
@media(min-width:820px){
 .biz-route{--w:min(760px,calc(100vw - 72px));width:var(--w);margin-inline:calc((100% - var(--w)) / 2);display:grid;grid-template-columns:auto 100px minmax(0,1fr);align-items:center;padding:28px 28px 28px 24px}
 /* PCは全部横並び：売主 › アセットルーム › 3本の道 › 説明（縦積みはスマホだけ。2026-10-08 社長指示） */
 .biz-route__src{flex-direction:row;align-items:center;align-self:center}
 .biz-route__seller{flex-direction:row;align-items:center}
 .biz-route__seller>.biz-step__name{right:auto;left:28px;top:auto;bottom:100%;margin:0 0 4px;transform:translateX(-50%)}
 .biz-route__road{width:32px;height:6px}
 .biz-route__fan--sp{display:none}
 .biz-route__fan--pc{display:block;align-self:stretch;width:100px;height:100%}
 .biz-route__list{grid-template-columns:auto minmax(0,1fr);grid-auto-rows:1fr;column-gap:14px;row-gap:12px}
 .biz-route__list li:nth-child(n) .biz-route__dest{grid-column:1;grid-row:auto;margin:0;align-self:center}
 .biz-route__list li:nth-child(n) .biz-route__box{grid-column:2;grid-row:auto;align-self:stretch;display:flex;flex-direction:column;justify-content:flex-start}
 .biz-route__dest>.biz-step__name{display:none}
 .biz-text .biz-route__box p{font-size:14px}
}
/* 買いたい：直接の取引と通常の取引 */
.biz-compare{display:grid;gap:18px;margin:28px 0}
.biz-compare__row{padding:14px 10px 16px;border-radius:14px;background:#f2f7ee}
.biz-compare__row.is-normal{background:#f4f6f5}
.biz-text .biz-compare__tag{display:inline-block;margin:0 0 12px 4px;padding:1px 12px;border-radius:99px;font-size:13px;font-weight:600;line-height:1.8;color:#fff;background:var(--lime)}
.biz-text .is-normal .biz-compare__tag{background:#97a3a0}
.biz-compare ol{position:relative;list-style:none;margin:0;padding:0;display:flex;justify-content:space-between;gap:4px}
.biz-compare ol:before{content:"";position:absolute;left:12%;right:12%;top:25px;height:6px;border-radius:3px;background:var(--sage)}
.biz-compare .is-normal ol:before{left:8%;right:8%;top:21px;background:#dde3e1}
.biz-compare .biz-step{position:relative;flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.biz-compare .biz-step__name{font-size:12px}
.biz-compare .is-normal .biz-step__name{color:var(--muted);font-weight:500}
.biz-compare .is-normal .ar-node{width:48px;height:48px}
.biz-compare .is-normal .ar-node .ar-svg{width:29px;height:26px}
.biz-text .biz-compare__note{margin:10px 0 0;text-align:center;font-size:12px;line-height:1.6;color:var(--muted)}
.biz-compare__note:before,.biz-compare__note:after{content:"";display:inline-block;width:2em;border-top:2px dotted #b9c3c0;vertical-align:middle;margin:0 .6em}
@media(max-width:359px){
 .biz-route{padding-inline:8px}
 .biz-route .ar-node{width:50px;height:50px}
 .biz-route__box{padding:8px 12px 10px}
 .biz-route__dest .biz-step__name{font-size:11px;letter-spacing:0;white-space:nowrap}
}
}
@media(min-width:600px){
 .biz-checks li{font-size:16px}
 .biz-compare__row{padding:16px 18px 18px}
 .biz-compare .biz-step__name{font-size:13px}
}
/* 動き：丸いマークが道の順に現れる（動きを減らす設定では最初から表示） */
@media(prefers-reduced-motion:no-preference){
 .biz-route.ar-wait.is-drawn .ar-node,.biz-compare.ar-wait.is-drawn .ar-node{animation:ar-pop-soft .8s var(--gentle) both}
 .biz-route.ar-wait .fan,.biz-route.ar-wait .biz-route__road{opacity:0}
 .biz-route.ar-wait.is-drawn .biz-route__road{animation:ar-fade .5s ease .2s both}
 .biz-route.ar-wait.is-drawn .fan{animation:ar-fade .7s ease .5s both}
 .biz-route.ar-wait.is-drawn .biz-route__ar .ar-node{animation-delay:.25s}
 .biz-route.ar-wait.is-drawn li:nth-child(1) .ar-node{animation-delay:.7s}
 .biz-route.ar-wait.is-drawn li:nth-child(2) .ar-node{animation-delay:.82s}
 .biz-route.ar-wait.is-drawn li:nth-child(3) .ar-node{animation-delay:.94s}
 .biz-compare.ar-wait.is-drawn .is-direct li:nth-child(2) .ar-node{animation-delay:.15s}
 .biz-compare.ar-wait.is-drawn .is-direct li:nth-child(3) .ar-node{animation-delay:.3s}
 .biz-compare.ar-wait.is-drawn .is-normal li:nth-child(1) .ar-node{animation-delay:.5s}
 .biz-compare.ar-wait.is-drawn .is-normal li:nth-child(2) .ar-node{animation-delay:.6s}
 .biz-compare.ar-wait.is-drawn .is-normal li:nth-child(3) .ar-node{animation-delay:.7s}
 .biz-compare.ar-wait.is-drawn .is-normal li:nth-child(4) .ar-node{animation-delay:.8s}
 .biz-compare.ar-wait.is-drawn .is-normal li:nth-child(5) .ar-node{animation-delay:.9s}
}

/* ご相談の流れの目次（4つのアイコン）：画面に入ったら順にふわっと現れ、その後はゆらゆら揺れ続ける（2026-10-09 社長指示）
   揺れは内側の絵だけに付け、丸（ホバーで少し浮く）とは分ける。4つは揺れの位相をずらす。動きを減らす設定では止まる。 */
@keyframes ar-rock{0%,100%{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(5deg) translateY(-2px)}}
@media(prefers-reduced-motion:no-preference){
 .ar-jump.ar-wait li{opacity:0}
 .ar-jump.ar-wait .ar-node{opacity:1}
 .ar-jump.ar-wait.is-drawn li{animation:ar-float-in 1.1s var(--gentle) both}
 .ar-jump.ar-wait.is-drawn li:nth-child(2){animation-delay:.15s}
 .ar-jump.ar-wait.is-drawn li:nth-child(3){animation-delay:.3s}
 .ar-jump.ar-wait.is-drawn li:nth-child(4){animation-delay:.45s}
 .ar-jump .ar-node .ar-svg{transform-origin:50% 75%;animation:ar-rock 3.6s ease-in-out infinite}
 .ar-jump li:nth-child(2) .ar-node .ar-svg{animation-delay:-.9s}
 .ar-jump li:nth-child(3) .ar-node .ar-svg{animation-delay:-1.8s}
 .ar-jump li:nth-child(4) .ar-node .ar-svg{animation-delay:-2.7s}
}

/* r15：ARから3方向へ。売りたい・買いたいの図は同じ外寸にする（2026-10-09） */
html body.atmos:not(#_) .biz-route,html body.atmos:not(#_) .biz-compare{width:100%;margin-inline:0}
html body.atmos:not(#_) .biz-route__ar{--nd:80px}
html body.atmos:not(#_) .biz-route__dest .biz-step__name{font-size:14px;letter-spacing:0;white-space:nowrap}
html body.atmos:not(#_) .biz-compare .biz-step__name,html body.atmos:not(#_) .biz-compare .is-normal .biz-step__name{font-size:14px;letter-spacing:0;overflow-wrap:normal;white-space:nowrap}
@media(min-width:820px){
 html body.atmos:not(#_) .biz-route,html body.atmos:not(#_) .biz-compare{--w:min(760px,calc(100vw - 72px));width:var(--w);margin-inline:calc((100% - var(--w)) / 2)}
 html body.atmos:not(#_) .biz-route__ar{--nd:88px}
 html body.atmos:not(#_) .biz-compare .biz-step__name,html body.atmos:not(#_) .biz-compare .is-normal .biz-step__name{font-size:15px}
}
/* r16：通常の5つの丸を等間隔にし、320pxでも4字ラベルを14pxで保つ。見出しの左端は直接の取引とそろえる。 */
@media(max-width:399px){
 html body.atmos:not(#_) .biz-compare__row.is-normal{padding-inline:0}
 html body.atmos:not(#_) .biz-compare .is-normal .biz-compare__tag{margin-left:14px}
 html body.atmos:not(#_) .biz-compare .is-normal ol{gap:0}
 html body.atmos:not(#_) .biz-compare .is-normal .biz-step{flex:0 0 var(--nd)}
}
/* r17：通常列の丸は枠から12px内側へ。359px以下は32pxの丸で14pxラベルの間隔も残す。タグ位置と色は保持。 */
@media(max-width:399px){
 html body.atmos:not(#_) .biz-compare .is-normal ol{padding-inline:12px}
}
@media(max-width:359px){
 html body.atmos:not(#_) .biz-compare .is-normal{--nd:32px}
}

/* r19：389px以下は通常列の業者名を語の境目で2行にし、44pxの丸とラベル間の余白を保つ。 */
@media(max-width:389px){
 html body.atmos:not(#_) .biz-compare .is-normal{--nd:44px}
 html body.atmos:not(#_) .biz-compare .is-normal .biz-step__name>span{display:block}
}
/* r19：ARから道を描き、行先・説明へ。購入は直接の列から通常の列へ、左から線を伸ばす。 */
@keyframes ar-biz-connect{from{transform:scaleX(0)}to{transform:scaleX(1)}}
/* r24：non-scaling-strokeの表示上の線長をJSで測り、長さ方向へ線形に描く。
   最後は破線を解除し、丸端を含む元の実線と完全に同じ描画へ戻す。 */
@keyframes ar-biz-fan-draw{
 from{stroke-dasharray:var(--ar-path-length) calc(var(--ar-path-length) + 20px);stroke-dashoffset:var(--ar-path-length)}
 99.999%{stroke-dasharray:var(--ar-path-length) calc(var(--ar-path-length) + 20px);stroke-dashoffset:0}
 to{stroke-dasharray:none;stroke-dashoffset:0}
}
.biz-route.ar-drawing .ar-node{will-change:transform,opacity}
.biz-route.ar-drawing .biz-route__box{will-change:opacity}
.biz-route .fan{stroke-dasharray:none;stroke-dashoffset:0}
.biz-route__fan{clip-path:none}
.biz-compare ol:before{transform:scaleX(1);transform-origin:left center}
@media(prefers-reduced-motion:no-preference){
 .biz-route.ar-wait .fan{opacity:0;stroke-dashoffset:0}

 .biz-route.ar-wait .biz-route__box{opacity:0}
 .biz-route.ar-wait.is-drawn .ar-node{animation:ar-pop-soft .35s var(--gentle) both}
 .biz-route.ar-wait.is-drawn .biz-route__seller .ar-node,.biz-route.ar-wait.is-drawn .biz-route__ar .ar-node{animation-duration:.25s;animation-delay:0s}
 .biz-route.ar-wait.is-drawn .biz-route__road{animation:ar-fade .25s ease .1s both}
 .biz-route.ar-wait.is-drawn .fan{opacity:1;animation:ar-biz-fan-draw .65s linear .25s both}

 .biz-route.ar-wait.is-drawn li:nth-child(1) .ar-node{animation-delay:.9s}
 .biz-route.ar-wait.is-drawn li:nth-child(2) .ar-node{animation-delay:1.02s}
 .biz-route.ar-wait.is-drawn li:nth-child(3) .ar-node{animation-delay:1.14s}
 .biz-route.ar-wait.is-drawn .biz-route__box{animation:ar-fade .4s ease 1.5s both}
 .biz-compare.ar-wait ol:before{transform:scaleX(0)}
 .biz-compare.ar-wait.is-drawn .ar-node{animation:ar-pop-soft .14s var(--gentle) both}
 .biz-compare.ar-wait.is-drawn .is-direct li:nth-child(1) .ar-node{animation-duration:.2s;animation-delay:0s}
 .biz-compare.ar-wait.is-drawn .is-direct ol:before{animation:ar-biz-connect .55s linear .25s both}
 .biz-compare.ar-wait.is-drawn .is-direct li:nth-child(2) .ar-node{animation-delay:.26s}
 .biz-compare.ar-wait.is-drawn .is-direct li:nth-child(3) .ar-node{animation-delay:.5s}
 .biz-compare.ar-wait.is-drawn .is-normal li:nth-child(1) .ar-node{animation-duration:.2s;animation-delay:.9s}
 .biz-compare.ar-wait.is-drawn .is-normal ol:before{animation:ar-biz-connect .75s linear 1.12s both}
 .biz-compare.ar-wait.is-drawn .is-normal li:nth-child(2) .ar-node{animation-duration:.11s;animation-delay:1.13s}
 .biz-compare.ar-wait.is-drawn .is-normal li:nth-child(3) .ar-node{animation-duration:.11s;animation-delay:1.31s}
 .biz-compare.ar-wait.is-drawn .is-normal li:nth-child(4) .ar-node{animation-duration:.11s;animation-delay:1.45s}
 .biz-compare.ar-wait.is-drawn .is-normal li:nth-child(5) .ar-node{animation-duration:.11s;animation-delay:1.63s}
}
@media(prefers-reduced-motion:reduce){
 .biz-route .fan{animation:none!important;opacity:1!important;stroke-dasharray:none!important;stroke-dashoffset:0!important}
 .biz-route__fan{animation:none!important;clip-path:none!important}
 .biz-route .ar-node,.biz-route .biz-route__box,.biz-compare .ar-node{animation:none!important;opacity:1!important;transform:none!important}
 .biz-compare ol:before{animation:none!important;transform:scaleX(1)!important}
}