.tp-map{background:var(--color-bg-alt);padding:var(--space-9) 0}
.tp-map__head{max-width:calc(1200px + var(--gutter) * 2);margin-bottom:var(--space-5)}
.tp-map__stage{position:relative;width:calc(100% - var(--gutter) * 2);max-width:1200px;margin-inline:auto;aspect-ratio:1671/941;overflow:hidden}
.tp-map__bg{display:block;width:100%;height:100%;object-fit:cover}
.tp-mk{--mk:var(--color-accent);--d:calc(var(--i) * 160ms);position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;display:grid;place-items:center;opacity:0;transform:scale(.4);transition:opacity var(--motion-slow) var(--ease-out) var(--d),transform var(--motion-slow) var(--ease-out) var(--d);-webkit-tap-highlight-color:transparent}
.tp-map__stage.is-in .tp-mk{opacity:1;transform:scale(1)}
.tp-mk > span{grid-area:1/1}
.tp-mk__dot{width:10px;height:10px;border-radius:50%;background:var(--mk);transition:transform var(--motion-base) var(--ease-out)}
.tp-mk__ring{width:22px;height:22px;border-radius:50%;border:1px solid var(--mk);transition:transform var(--motion-base) var(--ease-out)}
.tp-mk__pulse{width:22px;height:22px;border-radius:50%;border:1px solid var(--mk);opacity:0}
.tp-map__stage.is-in .tp-mk__pulse{animation:tp-mk-pulse 3.2s var(--ease-out) infinite;animation-delay:calc(var(--d) + 1000ms + var(--i) * 400ms)}
@keyframes tp-mk-pulse{0%{transform:scale(1);opacity:var(--pulse-o,.55)}70%,100%{transform:scale(var(--pulse-s,2.6));opacity:0}}
.tp-mk__label{position:absolute;bottom:calc(100% - 4px);left:50%;transform:translate(-50%,4px);background:var(--color-bg);color:var(--color-ink);font-family:var(--font-jp);font-weight:700;font-size:12px;line-height:1.4;letter-spacing:.04em;padding:6px 10px;border-radius:2px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--motion-fast) var(--ease-out),transform var(--motion-fast) var(--ease-out)}
.tp-mk--r .tp-mk__label{left:auto;right:6px;transform:translate(0,4px)}
.tp-mk--l .tp-mk__label{left:6px;transform:translate(0,4px)}
.tp-mk.is-on,.tp-mk:focus-visible{z-index:2;--pulse-o:.85;--pulse-s:3}
.tp-mk.is-on .tp-mk__dot,.tp-mk:focus-visible .tp-mk__dot{transform:scale(1.25)}
.tp-mk.is-on .tp-mk__ring,.tp-mk:focus-visible .tp-mk__ring{transform:scale(1.15)}
.tp-mk.is-on .tp-mk__label,.tp-mk:focus-visible .tp-mk__label{opacity:1;transform:translate(-50%,0)}
.tp-mk--r.is-on .tp-mk__label,.tp-mk--r:focus-visible .tp-mk__label,.tp-mk--l.is-on .tp-mk__label,.tp-mk--l:focus-visible .tp-mk__label{transform:none}
@media (hover:hover){
.tp-mk:hover{z-index:2;--pulse-o:.85;--pulse-s:3}
.tp-mk:hover .tp-mk__dot{transform:scale(1.25)}
.tp-mk:hover .tp-mk__ring{transform:scale(1.15)}
.tp-mk:hover .tp-mk__label{opacity:1;transform:translate(-50%,0)}
.tp-mk--r:hover .tp-mk__label,.tp-mk--l:hover .tp-mk__label{transform:none}
}
.tp-mk:focus-visible{outline:2px solid var(--color-focus);outline-offset:-6px;border-radius:50%}
@media (max-width:600px){.tp-mk__label{font-size:11px;padding:5px 8px;white-space:normal;width:max-content;max-width:min(62vw,240px)}}
@media (prefers-reduced-motion:reduce){
.tp-mk{transition:none;transform:none;opacity:1}
.tp-map__stage.is-in .tp-mk__pulse{animation:none}
.tp-mk__dot,.tp-mk__ring,.tp-mk__label{transition:none}
}
