/* ★ 2026-10-06 사장님 — 지도 위 '가격 미리 보기' 단추는 뺐다. 대신 지도 바로 아래 초록 띠(pxm-bn, 마트 페이지 C안 디자인) */
@keyframes pxbn{0%{background-position:0% 50%}100%{background-position:300% 50%}}
.pxm-bn{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:2px 0 22px;padding:13px 14px 13px 16px;border-radius:14px;color:#fff;text-decoration:none;
 background:linear-gradient(110deg,#0B7A4B 0%,#169A57 17%,#0B7A4B 33%,#169A57 50%,#0B7A4B 67%,#169A57 83%,#0B7A4B 100%);background-size:300% 100%;animation:pxbn 18s linear infinite}
.pxm-bn small{display:block;font-size:12.5px;font-weight:600;opacity:.85}.pxm-bn b{display:block;font-size:16px;font-weight:800;margin-top:2px;letter-spacing:-.3px}
.pxm-bn i{flex:none;font-style:normal;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:18px;font-weight:800;background:rgba(255,255,255,.2);color:#fff}
@media (prefers-reduced-motion:reduce){.pxm-bn{animation:none}}
@media (min-width:640px){.pxm-bn small{font-size:14px}.pxm-bn b{font-size:18px}}
/* 지도 길게 누르기 (2026-10-06 사장님 — 마트 한 곳과 같은 방식). 평소엔 잠가서 페이지가 내려가고, 길게 누르면 지도를 움직인다 */
.pxm-km{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.pxm-km.lock,.pxm-km.lock *{touch-action:pan-y!important}
.pxm-lp{position:absolute;right:8px;bottom:8px;z-index:45;background:rgba(17,24,39,.82);color:#fff;font-size:12px;font-weight:700;border-radius:999px;padding:6px 11px;pointer-events:none;opacity:0;transition:opacity .2s}
.pxm-km.touching:not(.live) .pxm-lp{opacity:1}

.pxm-tip{position:absolute;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;background:rgba(17,24,39,.35);color:#fff;font-size:16px;font-weight:700;opacity:0;transition:opacity .25s;pointer-events:none;text-align:center;padding:0 20px}.pxm-tip.on{opacity:1}.pxm-tip span{background:rgba(17,24,39,.88);border-radius:999px;padding:11px 18px;box-shadow:0 4px 16px rgba(0,0,0,.25)}
.pxm-km.guard,.pxm-km.guard *,.mmap,.mmap *{touch-action:pan-y!important}   /* 한 손가락 세로 밀기는 브라우저 몫 (문지기를 켤 때만) */
/* 영외마트 목록 지도 — 영외마트지도_만들기.py 가 굽는다. 이름은 전부 pxm- 으로 시작(s.css 와 안 겹치게) */
.pxm{position:relative;margin:14px -16px 6px;background:#EEF1F4}
.pxm-km{height:62vh;min-height:380px;max-height:560px;position:relative}.pxm-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#9CA3AF;font-size:14px}
.pxm-back{display:none;position:absolute;left:12px;top:12px;z-index:30;background:#111827;color:#fff;font-size:14px;font-weight:700;border:0;border-radius:99px;padding:9px 14px;cursor:pointer}
.pxm.zoom .pxm-back{display:block}
.pxm-leg{font-size:12.5px;color:#6B7280;margin:6px 0 14px;line-height:1.6}.pxm-leg i{display:inline-block;width:10px;height:10px;border-radius:50%;margin:0 3px 0 8px;vertical-align:-1px}
/* 시도 숫자 딱지 (전국 크기) — 우리 초록 (2026-10-02 사장님 "시그니처 컬러로") */
.pxm-rb{transform:translate(-50%,-50%);cursor:pointer;display:flex;align-items:center;gap:6px;background:#11974B;color:#fff;border:2px solid #fff;border-radius:99px;padding:4px 11px 4px 4px;box-shadow:0 3px 10px rgba(11,122,75,.45);white-space:nowrap;font-size:13px;font-weight:800;letter-spacing:.2px}
.pxm-rb em{font-style:normal;background:#fff;color:#0B7A4B;border-radius:99px;min-width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;padding:0 7px}
.pxm-rb.sm{padding:3px 9px 3px 3px;font-size:12px;gap:5px}.pxm-rb.sm em{min-width:21px;height:21px;font-size:12.5px}
/* 마트 점 · 이름표 — 늘 초록. 영업 상태는 이름 앞 작은 불빛(연두 영업 중 · 노랑 곧 닫음·점심 · 회색 영업 전·끝) */
.pxm-pin{transform:translate(-50%,-50%);cursor:pointer;display:flex;flex-direction:column;align-items:center}
.pxm-pin u{display:block;width:20px;height:20px;border-radius:50%;background:#11974B;border:3px solid #fff;box-shadow:0 1px 6px rgba(11,122,75,.5)}
.pxm-pin.cl u,.pxm-pin.na u{opacity:.55}
.pxm-pin b{display:none;position:relative;align-items:center;gap:6px;background:#11974B;color:#fff;font-size:14px;font-weight:800;letter-spacing:.3px;padding:6px 11px 6px 9px;border-radius:10px;white-space:nowrap;box-shadow:0 3px 10px rgba(11,122,75,.45);border:2px solid #fff}
.pxm-pin b:after{content:"";position:absolute;left:50%;bottom:-8px;margin-left:-6px;border:6px solid transparent;border-top-color:#11974B}
.pxm-pin s{display:inline-block;width:9px;height:9px;border-radius:50%;background:#86EFAC;box-shadow:0 0 0 2px rgba(255,255,255,.35)}
.pxm-pin.soon s,.pxm-pin.lu s{background:#FCD34D}.pxm-pin.cl s,.pxm-pin.na s{background:#D1D5DB}
.pxm-pin.lab b,.pxm-pin.sel b{display:flex}.pxm-pin.lab u,.pxm-pin.sel u{display:none}.pxm-pin.lab.off u{display:none}.pxm-pin.hid{display:none}.pxm-pin b em{margin-left:3px;padding:1px 7px;border-radius:10px;background:#fff;color:#0b7a4b;font-style:normal;font-size:.8em;font-weight:800;line-height:1.35;cursor:pointer}.pxm-pin.lab.off b{position:absolute;left:50%;top:50%;transform:translate(-50%,calc(-50% + var(--dy,0px)))}.pxm-pin.lab.off b:after{display:none}.rgl{margin:4px 0 14px;padding:12px 14px 6px;border-radius:14px;background:#E8F4EE}.rgl b{display:block;font-size:13.5px;color:#0B5E3A;margin-bottom:8px}.rgl .jump{margin:0}.rgl .jump a{background:#fff;border-color:#CFE6D8;margin-bottom:6px}.pxm-km.sm .pxm-pin b{font-size:12px;padding:3px 8px 3px 6px;border-radius:8px;gap:4px;border-width:1.5px;letter-spacing:0}.pxm-km.sm .pxm-pin b:after{bottom:-6px;margin-left:-5px;border-width:5px}.pxm-km.sm .pxm-pin s{width:7px;height:7px}
/* 누른 마트 — 더 진한 초록 · 흰 굵은 테두리 · 초록 빛 번짐 */
.pxm-pin.sel b{background:#0B5E3A;border:3px solid #fff;box-shadow:0 0 0 5px rgba(17,151,75,.35),0 6px 16px rgba(0,0,0,.3);transform:scale(1.12);transform-origin:center bottom}
.pxm-pin.sel b:after{border-top-color:#0B5E3A}
.pxm-km.nat .pxm-pin{display:none}.pxm-km:not(.nat) .pxm-rb{display:none}
.pxm-you{width:18px;height:18px;border-radius:50%;background:#2563EB;border:3px solid #fff;box-shadow:0 0 0 6px rgba(37,99,235,.25);transform:translate(-50%,-50%)}
/* 점을 누르면 아래 카드 */
.pxm-pop{display:none;position:absolute;left:12px;right:12px;bottom:12px;z-index:40;background:#fff;border-radius:16px;padding:15px 17px;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.pxm-pop.on{display:block}.pxm-pop{border-top:5px solid #11974B}.pxm-pop .x{position:absolute;right:10px;top:6px;border:0;background:none;font-size:24px;color:#9CA3AF;cursor:pointer}
.pxm-pop b{font-size:18px}.pxm-pop .s{font-size:14px;color:#4B5563;margin:6px 0 12px;line-height:1.6}
.pxm-pop .bt{display:flex;gap:8px}.pxm-pop .bt a{flex:1;text-align:center;border-radius:11px;padding:11px 6px;font-size:14px;font-weight:700;background:#F3F4F6;color:#111827;text-decoration:none}
.pxm-pop .bt a.go{background:#11974B;color:#fff}
/* 영업 표시 (카드 · 목록 줄 공통) */
.pxst{display:inline-block;font-style:normal;font-size:12px;font-weight:800;border-radius:7px;padding:3px 8px;white-space:nowrap;margin-left:6px}
.pxst.op{color:#0B7A4B;background:#E8F5EE}.pxst.soon,.pxst.lu{color:#B45309;background:#FEF3C7}.pxst.cl{color:#6B7280;background:#F3F4F6}
.pxst.off{color:#B91C1C;background:#FEE2E2}.pxst.na{color:#9CA3AF;background:#F9FAFB}
ul.mk li{flex-wrap:wrap;border:0;border-bottom:1px solid #E9ECEF;border-radius:0;background:none;box-shadow:none;margin:0;padding:12px 2px}   /* 상자 말고 가는 줄로 (2026-10-02 사장님) */ul.mk li .pxw{flex-basis:100%;margin-top:6px}ul.mk li .pxst{margin:0}   /* 영업 표시는 줄 아래로 — 옆에 두면 시군 이름이 꺾였다 */
.pxm-now{font-size:12px;color:#9CA3AF;margin:-4px 0 10px}
/* 내 근처 마트 (2026-10-02 사장님) — 단추를 눌러야 위치를 묻는다. 위치는 폰 안에서만 쓴다 */
.pxm-me{position:absolute;right:12px;top:12px;z-index:30;background:#fff;color:#111827;font-size:14px;font-weight:800;border:0;border-radius:99px;padding:9px 14px;box-shadow:0 2px 10px rgba(0,0,0,.25);cursor:pointer}

.pxm-near{list-style:none;margin:8px 0 0;padding:0}.pxm-near li{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:11px 0;margin:0;border:0;border-top:1px solid #F1F3F5;border-radius:0;background:none;box-shadow:none;font-size:14px}
.pxm-near li:first-child{border-top:0}.pxm-near b{font-size:15.5px;cursor:pointer}.pxm-near small{display:block;color:#6B7280;font-size:12.5px;margin-top:2px}
.pxm-near a{flex:none;font-size:13px;font-weight:700;color:#11974B;text-decoration:none;border:1.5px solid #11974B;border-radius:9px;padding:6px 10px}
/* PC 는 훨씬 크게 (2026-10-02 사장님 "PC 에서 거의 안 보인다") */
@media (min-width:720px){
 .pxm{margin:14px 0 8px;border-radius:16px;overflow:hidden}.pxm-km{height:640px;max-height:none}
 .pxm-rb{font-size:17px;padding:6px 15px 6px 6px;gap:9px}.pxm-rb em{min-width:36px;height:36px;font-size:18px}
 .pxm-rb.sm{font-size:15px}.pxm-rb.sm em{min-width:28px;height:28px;font-size:15px}
 .pxm-pin u{width:24px;height:24px}.pxm-pin b{font-size:16.5px;padding:8px 14px 8px 11px}.pxm-pin s{width:11px;height:11px}
 .pxm-pop{left:auto;right:16px;bottom:16px;width:420px;padding:18px 20px}.pxm-pop b{font-size:21px}.pxm-pop .s{font-size:16px}.pxm-pop .bt a{font-size:16px;padding:13px 8px}
 .pxm-back,.pxm-me{font-size:16px;padding:11px 18px}.pxm-near li{font-size:16px}.pxm-near b{font-size:17.5px}.pxm-near small{font-size:14px}.pxm-near a{font-size:15px}.pxm-leg{font-size:14.5px}.pxst{font-size:14px;padding:4px 10px}.pxm-now{font-size:14px}
}
/* ── 지역 탭 안 목록은 2열 (2026-10-02 사장님 "1열로 쭈루룩은 아니다") — 상자 말고 가는 줄 그대로, 칸만 둘로. PC 는 3열 */
.rgs ul.mk{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px;margin:2px 0 18px}
.rgs ul.mk li{display:block;padding:12px 2px}
.rgs ul.mk li a{display:block}.rgs ul.mk li a b{display:block;font-size:15.5px;line-height:1.3}
.rgs ul.mk li a span{display:block;margin:3px 0 0;font-size:12.5px}
.rgs ul.mk li>i{display:block;margin-top:5px}.rgs ul.mk li:has(.pxw)>i{display:none}   /* 오늘 영업 알약이 있으면 평일 시간은 알약이 대신 말한다 */
.rgs ul.mk li .pxw{display:block;margin-top:7px}.rgs ul.mk li .pxst{white-space:normal}
@media (min-width:640px){.rgs ul.mk{grid-template-columns:repeat(3,minmax(0,1fr))}.rgs ul.mk li a b{font-size:17px}.rgs ul.mk li a span{font-size:14px}}
/* ── 마트 목록 장 (2026-10-02 사장님) — 지도를 머리에 붙이고, 지역별 전체 목록은 맨 아래 */
.pxm.top{margin-top:0!important}
.mh1{margin:18px 0 6px}
.mall{margin-top:36px;padding-top:22px;border-top:1px solid #E9ECEF}.mall.up{margin-top:0;padding-top:0;border-top:0}.mall.up+.note{margin-bottom:28px}
.rtop{margin:0 0 26px}.rtop .rgl{margin:10px 0 0}.rtop .jump a.on{background:#0B5E3A;border-color:#0B5E3A;color:#fff}
.mall h2{margin:0 0 4px}
.mall section.rg h3{margin:18px 0 6px;font-size:16px}
.rgs ul.mk[hidden]{display:none}
.jump.sj{margin:4px 0 6px}.jump.sj a{background:#F2F4F7;border-color:#F2F4F7}
.jump.sj a.on{background:#0B5E3A;border-color:#0B5E3A;color:#fff}
/* 낱말 중간에서 꺾이지 않게 (2026-10-02 사장님 — `전/화로` `있/어요`) */
.pxm-leg,.pxm-now,.mh1+.sub,.mall .note,.pxm-near{word-break:keep-all}
/* 근처 목록 — 마트 정보·길찾기 둘 (2026-10-02) */
.pxm-near .go2{flex:none;display:flex;flex-direction:column;align-items:stretch;gap:6px;width:92px}.pxm-near .go2 a{display:block;white-space:nowrap;text-align:center;background:#fff;color:#11974B;padding-left:4px;padding-right:4px}.pxm-near .go2 a+a{background:#11974B;color:#fff}   /* 마트 정보는 흰 바탕 · 길찾기는 초록 바탕, 폭은 같게 (2026-10-02 사장님) */
@media (min-width:640px){.pxm-near .go2{width:108px}}