/* r9 お店への道のり。既存の食材路線図とは別に、アクセスとして案内する。 */
.drive-access{position:relative;background:#e9eedc;isolation:isolate;scroll-margin-top:90px}
.drive-banner{display:flex;justify-content:space-around;align-items:center;gap:24px;background:var(--ink);color:var(--cream);padding:15px 4%;font:900 clamp(16px,1.75vw,26px)/1.1 TownSans,'Arial Black',sans-serif;white-space:nowrap;overflow:hidden;letter-spacing:-.035em}
.drive-banner b{color:var(--brand-yellow);font-size:24px}
.drive-track{height:200svh;min-height:1260px;position:relative}
.drive-sticky{position:sticky;top:94px;width:min(1440px,91%);margin-inline:auto;padding:28px 0 22px;min-height:calc(100svh - 94px);display:flex;flex-direction:column;justify-content:center}
.drive-layout{display:grid;grid-template-columns:minmax(260px,.75fr) minmax(0,1.6fr);gap:1.5%;align-items:center}
.drive-kicker{display:block;font-size:16px;letter-spacing:.1em;font-weight:800;line-height:1.4;margin-bottom:18px}
.drive-word{position:relative;display:block;color:var(--brand-red);font:900 clamp(76px,8.3vw,126px)/.79 TownSans,'Arial Black',Arial,sans-serif;letter-spacing:-.08em;transform:rotate(-5deg);width:max-content;margin:16px 0 32px}
.drive-word>span{position:absolute;font-size:1.4em;font-weight:400;left:100%;bottom:-.14em;transform:rotate(-12deg)}
.town-lower .drive-copy h2{font-family:BurgerHeading,sans-serif;font-size:clamp(28px,2.75vw,44px);line-height:1.42;font-weight:900;letter-spacing:-.05em}
.town-lower .drive-intro{font-size:18px;line-height:1.7;margin-top:18px}
.drive-shop-link{display:inline-block;font-size:16px;font-weight:800;margin-top:20px;padding-bottom:6px;border-bottom:1px solid var(--ink)}
.drive-shop-link span{font-size:22px;margin-left:7px}
.drive-map{min-width:0;position:relative}
.drive-stage{height:clamp(350px,53svh,590px);position:relative;isolation:isolate}
.drive-map-label{position:absolute;right:4%;top:8%;font-weight:900;font-size:clamp(16px,1.5vw,22px);letter-spacing:-.03em;color:#153e2c5c;transform:rotate(6deg);z-index:2;pointer-events:none}
.drive-canvas{position:absolute;inset:0;touch-action:pan-y;opacity:0;transition:opacity .25s}
.drive-canvas canvas{display:block;width:100%;height:100%;touch-action:pan-y}
.drive-photo{position:absolute;inset:8% 4% 5%;display:flex;align-items:center;transform:rotate(-3deg)}
.drive-photo img{width:100%;height:auto;border:8px solid var(--cream);box-shadow:10px 16px 0 #153e2c1a}
.drive-access[data-access-state="ready"] .drive-canvas{opacity:1}
.drive-access[data-access-state="ready"] .drive-photo{visibility:hidden}
.drive-arrival{position:absolute;right:1%;bottom:6%;z-index:2;display:flex;gap:12px;align-items:center;padding:12px 17px;background:var(--brand-yellow);color:var(--brand-red);font:900 clamp(18px,2.1vw,30px)/1 TownSans,'Arial Black',sans-serif;transform:scale(.65) rotate(8deg);opacity:0;transition:opacity .15s,transform .25s;pointer-events:none;box-shadow:4px 5px 0 var(--brand-red)}
.drive-arrival span{font-size:1.2em}
.drive-access[data-arrived="true"] .drive-arrival{opacity:1;transform:scale(1) rotate(-5deg)}
.drive-stops{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;margin:0;padding:0;border-top:2px solid var(--ink);position:relative}
.drive-stops:before{content:'';position:absolute;top:-3px;left:0;height:5px;width:100%;transform:scaleX(var(--drive-progress,0));transform-origin:left;background:var(--brand-red);pointer-events:none}
.drive-stops li{min-width:0}
.drive-stops button{width:100%;text-align:left;display:flex;align-items:center;gap:10px;padding:14px 0;font-size:18px;white-space:nowrap}
.drive-stops button>span{font:900 24px/1 TownSans,'Arial Black',sans-serif;opacity:.42}
.drive-stops button>strong{font-size:18px;line-height:1.5;font-weight:900}
.drive-stops strong>span{display:inline-block}
.drive-stops button[aria-pressed="true"]{color:var(--brand-red)}
.drive-stops button[aria-pressed="true"]>span{opacity:1}
.drive-controls{display:flex;align-items:center;justify-content:space-between;gap:14px;border-top:1px solid #153e2c30;padding-top:12px}
.town-lower .drive-controls p{font-size:16px;line-height:1.5;max-width:210px}
.drive-play{display:flex;align-items:stretch;padding:0;background:var(--brand-red);color:var(--cream);min-height:54px;font-size:18px;font-weight:800;border-radius:0;white-space:nowrap}
.drive-play>span{padding:12px 17px;align-self:center}
.drive-play b{display:grid;place-items:center;width:48px;background:var(--brand-yellow);color:var(--brand-red);font-size:30px;line-height:1;font-weight:400}
.drive-play:hover{background:#a62b20}
.drive-bottom{border-top:1px solid #153e2c30;display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:30px;padding-top:16px}
.drive-bottom>span{font-weight:900;letter-spacing:.025em;font-size:16px}
.town-lower .drive-bottom p{font-size:16px;line-height:1.5}
.drive-access[data-access-state="fallback"] .drive-track,.drive-access[data-unpinned="true"] .drive-track{height:auto;min-height:0}
.drive-access[data-access-state="fallback"] .drive-sticky,.drive-access[data-unpinned="true"] .drive-sticky{position:relative;top:auto;min-height:0;padding-block:40px}
.drive-access[data-access-state="fallback"] .drive-stops,.drive-access[data-access-state="fallback"] .drive-controls{display:none}
@media(min-width:761px) and (max-height:760px){.drive-sticky{padding-block:18px}.drive-word{font-size:76px;margin-bottom:20px}.drive-kicker{margin-bottom:10px}.drive-intro{margin-top:10px!important}.drive-stage{height:350px}.drive-bottom{margin-top:15px;padding-top:10px}.drive-shop-link{margin-top:12px}.town-lower .drive-copy h2{font-size:28px}}
@media(max-width:1100px) and (min-width:761px){.drive-layout{grid-template-columns:minmax(235px,.65fr) minmax(0,1.5fr)}.drive-word{font-size:80px}.drive-stops button{gap:6px}.drive-stops button>strong{font-size:16px}.drive-controls{align-items:flex-start;flex-direction:column}.town-lower .drive-controls p{max-width:none}.drive-play{width:100%;justify-content:space-between}}
@media(max-width:760px){
 .drive-access{scroll-margin-top:75px}.drive-banner{justify-content:center;padding:13px 2%;font-size:16px}.drive-banner>span:nth-of-type(2),.drive-banner>span:nth-of-type(3),.drive-banner>b{display:none}
 .drive-track{height:210svh;min-height:1350px}.drive-sticky{top:78px;width:90%;min-height:calc(100svh - 78px);padding:14px 0 18px}
 .drive-layout{display:block}.drive-copy{position:relative}.drive-kicker{font-size:16px;letter-spacing:.045em;margin-bottom:12px}
 .drive-word{font-size:clamp(48px,14.2vw,70px);line-height:.8;transform:rotate(-3deg);margin:0 0 15px}.drive-word br{display:none}.drive-word>span{display:none}
 .town-lower .drive-copy h2{font-size:26px;line-height:1.3;letter-spacing:-.055em}.drive-copy h2 br{display:none}
 .town-lower .drive-intro{font-size:16px;line-height:1.55;margin-top:9px}.drive-intro br{display:none}.drive-intro br:after{content:' '}.drive-shop-link{display:none}
 .drive-stage{height:clamp(255px,36svh,345px);margin-top:0;margin-inline:-5.5%}.drive-map-label{top:4%;font-size:16px;right:3%}.drive-arrival{font-size:19px;right:5%;bottom:7%;padding:9px 12px}
 .drive-stops button{flex-direction:column;align-items:flex-start;gap:4px;padding:10px 0;white-space:normal}.drive-stops button>span{font-size:20px}.drive-stops button>strong{font-size:16px;line-height:1.4}
 .drive-controls{padding-top:10px;gap:8px;align-items:stretch;flex-direction:column}.town-lower .drive-controls p{font-size:16px;max-width:none;text-align:center}.drive-play{min-height:50px;width:100%;justify-content:space-between;font-size:18px}.drive-play>span{padding:10px 16px}
 .drive-bottom{margin-top:16px;padding-top:10px;display:block}.drive-bottom>span{display:none}.town-lower .drive-bottom p{text-align:center;font-size:16px}
}
@media(max-width:360px){.drive-kicker{font-size:16px;margin-bottom:10px}.drive-word{font-size:48px;margin-bottom:12px}.town-lower .drive-copy h2{font-size:24px}.town-lower .drive-intro{max-width:270px}.drive-stage{height:255px}.drive-stops{column-gap:12px}.drive-stops button>strong{font-size:16px}.drive-stops strong>span{display:block}.drive-stops button{gap:3px}.drive-bottom{margin-top:10px}}
@media(prefers-reduced-motion:reduce){.drive-track{height:auto;min-height:0}.drive-sticky{position:relative;top:auto;min-height:0;padding-block:40px}.drive-canvas,.drive-arrival{transition:none}}