/* PC 디자인 정리 (2026-09-29 GS 확정 — 상품권 나머지 페이지 2차) — 매입처 지도 /map * PC(768px 이상)에서만 읽힙니다: Base.astro 가 로 붙입니다. 모바일에는 영향 없음. * 시안을 CSS 덧씌우기로 만든 그대로 옮겨서 !important 가 많습니다(원래 스타일을 이기려고). * 방향: 순위/라벨 칩은 회색 글자 · 장식 상자·칩 줄·목록은 구분선으로 평평하게. 주요 카드·로고 카드 그리드·시세 숫자 색·H1 부제는 그대로. */ /* ===== /map/ PC 시안 — 상품권 매입처 지도 (2026-09-29) ===== * 남긴 주요 카드(원래 모양 그대로, 규칙 없음): 지도 캔버스(#map), '내 위치에서 가까운 매입처 찾기' 큰 버튼, * 지역별 매입처 카드 그리드(.rl-grid/.rl-item — 지역 이름+곳 수 작은 카드, 카드 그리드는 카드 그대로가 GS 취향) * H1 둘째 줄 주황 '내 근처에서 찾기' 는 그대로. */ /* 지역 바로가기 칩 줄 → 상자 없는 글자 줄 (개수는 회색 작은 글자) */ #main-content .region-chips { gap: 4px 18px !important; } #main-content .region-chip { background: none !important; border: 0 !important; border-radius: 0 !important; padding: 5px 0 !important; font-size: 14px !important; font-weight: 500 !important; color: var(--ink) !important; } #main-content .region-chip:hover { background: none !important; text-decoration: underline; text-underline-offset: 4px; } #main-content .region-chip.active { background: none !important; color: var(--accent-dark) !important; font-weight: 700 !important; text-decoration: underline; text-underline-offset: 4px; } #main-content .region-chip .rc-count, #main-content .region-chip.active .rc-count { font-weight: 500 !important; color: var(--ink-faint) !important; } #main-content .region-chip.region-all { border: 0 !important; color: var(--ink-soft) !important; } #main-content .region-chips-label { font-weight: 500 !important; margin-right: 4px !important; } /* 매입처 목록 — 매장마다 상자 → 구분선 목록 */ #main-content .shop-ul { gap: 0 !important; border-top: 1px solid var(--line) !important; } #main-content .shop-item, #main-content .shop-item-extra { background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--line-soft) !important; border-radius: 0 !important; box-shadow: none !important; padding: 14px 4px 10px !important; } #main-content .area-group-title { margin-bottom: 8px !important; } /* 영업 종료/영업 중·위치⁠·⁠연락처 배지 → 회색 작은 글자 */ #main-content .open-badge[data-state], #main-content .loc-badge { background: none !important; border: 0 !important; padding: 0 !important; margin-left: 8px !important; font-size: 12px !important; font-weight: 500 !important; color: var(--ink-faint) !important; } /* 상품권별 시세 알약 → 상자 없는 글자 (시세 % 주황은 유지) */ #main-content .shop-rates { gap: 2px 16px !important; } #main-content .sr-chip, #main-content .sr-chip-link { background: none !important; border: 0 !important; border-radius: 0 !important; padding: 2px 0 !important; font-size: 13px !important; } #main-content .sr-chip-link:hover { background: none !important; text-decoration: underline; text-underline-offset: 3px; } /* '지도' 버튼(주황 테두리) → 글자 링크 */ #main-content .shop-map-btn { background: none !important; border: 0 !important; border-radius: 0 !important; padding: 4px 2px !important; color: var(--ink-soft) !important; font-weight: 600 !important; } #main-content .shop-map-btn:hover { background: none !important; color: var(--ink) !important; text-decoration: underline; text-underline-offset: 3px; } /* 위치만 있는 매장 — 점선 구분 → 가는 선 */ #main-content .extra-block { border-top: 1px solid var(--line) !important; } /* 내 근처 목록(위치 켰을 때) 주황 상자 → 평평하게 */ #main-content .near-list { background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; } /* 전체 목록 보기 버튼 상자 → 가는 선 사이 글자 줄 */ #main-content .shop-more-btn { background: transparent !important; border: 0 !important; border-top: 1px solid var(--line) !important; border-bottom: 1px solid var(--line-soft) !important; border-radius: 0 !important; color: var(--ink) !important; font-weight: 600 !important; } #main-content .shop-more-btn:hover { background: var(--surface-2) !important; color: var(--ink) !important; } /* 매입처 목록 전체를 감싼 웜크림 바탕(전역 시트 규칙) → 바탕 없음 (목록은 구분선으로 이미 정리) */ .container #main-content .shop-list { background: transparent !important; box-shadow: none !important; border: 0 !important; }