.hp-cs__map{border-radius:var(--cs-r,24px);isolation:isolate;perspective:900px;perspective-origin:50% 20%;background:#ece8e0;display:block;position:relative;overflow:clip}.hp-cs__plane{--pw:360%;--cx:50%;--cy:60%;left:var(--cx);top:var(--cy);width:var(--pw);aspect-ratio:1200/700;transform-origin:62% 46%;transform-style:preserve-3d;pointer-events:none;position:absolute;transform:translate(-62%,-46%)rotateX(52deg)rotate(-16deg)}.hp-cs__plane>svg{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.hp-cs__bake{max-width:none;display:block;position:absolute}.hp-cs__map:after{content:"";pointer-events:none;z-index:1;background:linear-gradient(#ece8e0 0%,#ece8e0bf 12%,#ece8e000 34%);position:absolute;inset:0}.hp-cs__landmark{--lw:clamp(96px, 9vw, 128px);z-index:2;left:var(--px,60%);top:var(--py,50%);pointer-events:none;width:0;height:0;position:absolute}.hp-cs__hq{left:calc(var(--lw) * -.5);top:calc(var(--lw) * -.7275);width:var(--lw);max-width:none;height:auto;display:block;position:absolute}.hp-cs__tip{filter:blur(1.5px);background:#281c0e6b;border-radius:50%;width:18px;height:6px;position:absolute;top:-3px;left:-9px}.hp-cs__pin{z-index:1;filter:drop-shadow(0 6px 5px #281c0e52);width:32px;height:41px;position:absolute;bottom:0;left:0;transform:translate(-50%)}.hp-cs__pin svg{width:100%;height:100%;display:block}.hp-cs__pin path{fill:#8d6b43;stroke:#fff;stroke-width:2.4px;stroke-linejoin:round}.hp-cs__pin circle{fill:#fff}.hp-cs__pinmark{background:#6e5232;width:9px;height:14px;position:absolute;top:37.5%;left:50%;transform:translate(-50%,-50%);-webkit-mask:url(/images/brand/sp-mark.svg) 50%/contain no-repeat;mask:url(/images/brand/sp-mark.svg) 50%/contain no-repeat}.hp-cs__map .m-land{fill:#ece8e0}.hp-cs__map .m-sea{fill:#d7dfdf}.hp-cs__map .m-shore{fill:none;stroke:#c6d1d1;stroke-width:2px;stroke-linejoin:round}.hp-cs__map .m-park{fill:#dfe4d4}.hp-cs__map .m-water{fill:#d7dfdf}.hp-cs__map .m-bld{fill:#e2dcd1;stroke:#d8d1c4;stroke-width:.6px}.hp-cs__map :is(.m-lane,.m-minor,.m-major,.m-lane-case,.m-minor-case,.m-major-case){fill:none;stroke-linecap:round;stroke-linejoin:round}.hp-cs__map .m-lane-case{stroke:#ddd6ca;stroke-width:5.4px}.hp-cs__map .m-lane{stroke:#faf8f4;stroke-width:3.6px}.hp-cs__map .m-minor-case{stroke:#d6cfc2;stroke-width:9px}.hp-cs__map .m-minor{stroke:#fbfaf7;stroke-width:7px}.hp-cs__map .m-major-case{stroke:#d2c3a6;stroke-width:15px}.hp-cs__map .m-major{stroke:#fbf6ea;stroke-width:12px}.hp-cs__map .m-lanchor{fill:#0000}.hp-cs__roads{z-index:2;pointer-events:none;position:absolute;inset:0}.hp-cs__road{color:#7d7263;white-space:nowrap;opacity:0;background:#fbfaf7eb;border-radius:999px;padding:3px 9px;font-size:12px;font-weight:600;transition:opacity .3s;position:absolute;top:0;left:0;transform:translate(-50%,-50%);box-shadow:0 2px 8px -4px #281e0f4d}.hp-cs__road[data-on]{opacity:1}.hp-cs__ring{width:var(--ring,24px);height:var(--ring,24px);border:calc(var(--ring,24px) * .0727) solid #a08860;opacity:0;will-change:transform, opacity;border-radius:50%;position:absolute;top:0;left:0;transform:translate(-50%,-50%)}.hp-cs__map .m-anchor{fill:#0000}.hp-cs__map .m-core{fill:#fff}.hp-cs__pinlabel{z-index:3;color:var(--hp-mute,#6b6760);white-space:nowrap;background:#fff;border-radius:12px;gap:1px;padding:8px 12px;font-size:12.5px;line-height:1.35;display:grid;position:absolute;top:41%;left:64%;transform:translate(calc(-100% - clamp(96px,9vw,128px)/2 - 10px),-135%);box-shadow:0 10px 24px -14px #14100a66}.hp-cs__pinlabel strong{color:var(--hp-ink,#151412);font-size:14px;font-weight:600}.hp-cs__pinlabel[data-flip]{transform:translate(calc(clamp(96px,9vw,128px)/2 + 10px),-135%)}.hp-cs__open{z-index:3;min-height:36px;color:var(--hp-ink,#151412);background:#fff;border-radius:999px;align-items:center;gap:6px;padding:0 14px;font-size:13px;font-weight:600;display:inline-flex;position:absolute;bottom:14px;right:14px;box-shadow:0 8px 20px -14px #14100a66}.hp-cs__open svg{width:15px;height:15px}.hp-cs__osm{z-index:3;color:#8f8778;pointer-events:none;font-size:10.5px;position:absolute;bottom:8px;left:12px}@media (min-width:768px){.hp-cs__plane{--pw:175%;--cx:64%;--cy:50%}.hp-cs__pinlabel{font-size:13.5px}.hp-cs__pinlabel strong{font-size:15px}}@media (max-width:767px){.hp-cs__pinlabel,.hp-cs__pinlabel[data-flip]{text-align:center;transform:translate(-50%,14px)}.hp-cs__open{top:12px;bottom:auto;right:12px}}