/* =====================================================================
   top_map.css
   - top_map.php 에서 분리한 <style> 블록 모음 (원본 순서 유지)
   - 추출 일자: 2026-05-31
   ===================================================================== */

/* ===== block 1 ===== */
/* =========================================================
   THE SHARE 파트너 랜딩 색감 변수(민트/티얼 톤)
   - 네가 올린 배경/그라데이션 색상과 맞춤
   - 기존 코드의 var(--primary) 등과 100% 호환
========================================================= */
:root{
  --primary: #20d1c2ff;        /* 메인 민트/티얼 */
  --primary-weak: rgba(13,148,136,.12);
  --primary-light: #ccfbf1;  /* 연민트(배경 그라데이션 상단) */
  --bg-mint: #f0fdfa;        /* 연한 민트 배경 */
  --bg-cyan: #ECFEFF;        /* 요약박스 배경 */
  --bg-gray: #f3f4f6;        /* 섹션 분리 배경 */
  --text-dark:#111827;       /* 제목/강조 */
  --text-gray:#4b5563;       /* 본문 */
  --border:#e5e7eb;
}

html, body {
  /* y축 오버스크롤(당겨서 새로고침)을 막음 */
  overscroll-behavior-y: none;
  overflow-anchor: none;
}

/* 지도 드래그 중 패널/마커 텍스트가 선택되어 드래그가 끊기는 현상 방지 */
html,
body,
.container,
.map-page,
.menu-content,
.left-panel,
.panel,
.map-area,
#map,
#daumMap,
#naverMap,
#googleMap,
.mk-apt,
.mk-subway,
.tspl-place-marker,
.tspl-anim-marker,
.iw-apt,
.iw-place,
.customoverlay,
.custom-marker,
.custom-marker2 {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

input,
textarea,
select,
[contenteditable="true"],
.allow-text-select {
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
  user-select: text !important;
}

table {
  border-collapse: collapse;
  width: 100%;
  margin: 1rem auto;
  background-color: white;
  font-size:14px;
}

thead{
  box-shadow: 4px 4px 10px rgba(0,0,0,0.1);
}

/* 테이블 행 */
td {
  padding: 4px;
  text-align: left;
  border: 1px solid #ddd;
  text-align: center;
  font-size:12px;
}

th {
  font-size:14px;
  padding: 4px;
  text-align: left;
  text-align: center;
  border: 1px solid #ddd;
  color: #000;
}

/* ===== block 2 ===== */
    @media screen and (orientation: portrait) {
        /* 세로 화면 스타일 */
    }
    .row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    }

    .col {
    flex: 1;
    padding-right: 15px;
    padding-left: 15px;
    }

    /* 12개의 그리드 시스템 */
    .col-1 { flex: 0 0 8.33%; max-width: 8.33%; }
    .col-2 { flex: 0 0 16.66%; max-width: 16.66%; }
    .col-3 { flex: 0 0 25%; max-width: 25%; }
    .col-4 { flex: 0 0 33.33%; max-width: 33.33%; }
    .col-5 { flex: 0 0 41.66%; max-width: 41.66%; }
    .col-6 { flex: 0 0 50%; max-width: 50%; }
    .col-7 { flex: 0 0 58.33%; max-width: 58.33%; }
    .col-8 { flex: 0 0 66.66%; max-width: 66.66%; }
    .col-9 { flex: 0 0 75%; max-width: 75%; }
    .col-10 { flex: 0 0 83.33%; max-width: 83.33%; }
    .col-11 { flex: 0 0 91.66%; max-width: 91.66%; }
    .col-12 { flex: 0 0 100%; max-width: 100%; }


    table {
    border-collapse: collapse;
    width: 100%;
    margin: 1rem auto;
    background-color: white;
    font-size:14px;
    }

    thead{
    box-shadow: 4px 4px 10px rgba(0,0,0,0.1);
    }

    /* 테이블 행 */
    td {
    padding: 4px;
    text-align: left;
    border: 1px solid #ddd;
    text-align: center;
    font-size:12px;
    }

    th {
    font-size:14px;
    padding: 4px;
    text-align: left;
    text-align: center;
    border: 1px solid #ddd;
    color: #000;
    }

/* ===== block 3 ===== */
    /* 기본 설정 */
    body {
        margin: 0;
    }

    /* 기본 레이아웃 */
    .container {
        display: flex;
        height: 100dvh;
        overflow: hidden; /* 스크롤 시 레이아웃 깨짐 방지 */
    }

    /* 왼쪽 메뉴 패널 (★2026-07-10 420→400px: 패널 내부 이중 좌우 여백 제거분만큼 축소) */
    .left-panel {
        width: 400px;
        background-color: #FFFFFF;
        position: relative;
        transition: all 0.3s ease-in-out;
        display: flex;
        flex-direction: column;
        z-index:3000;
    }

    /* 오른쪽 지도 패널 — 좌측(400px) 외 남은 영역 모두 차지 (PC 큰 모니터 우측 빈공간 방지) */
    .right-panel {
        flex: 1 1 auto;
        min-width: 0;
        position: relative;
        transition: all 0.3s ease-in-out;
    }

    #daumMap {
        width: 100%;
        height: 100%;
    }

    /* menu-content 영역에만 스크롤 생성 */
    .menu-content {
        --k1-panel-pad-x: 10px;
        --k1-panel-pad-top: 15px;
        --k1-panel-pad-bottom: 6px;
        flex-grow: 1;
        flex-basis: 0;
        min-height: 0;             /* ★ flex 자식이 overflow:auto 로 스크롤 되려면 필수 */
        overflow-y: auto;
        overflow-anchor: none;
        -webkit-overflow-scrolling: touch;
        padding: var(--k1-panel-pad-top) var(--k1-panel-pad-x) var(--k1-panel-pad-bottom);
        box-sizing: border-box;
    }
    #menuPage,
    .left-panel {
        overflow-anchor: none;
    }

    /* AJAX 패널 안에 예전 전체페이지 래퍼가 들어와도 상단 공백/고정 여백을 만들지 않게 고정 */
    .menu-content > #sh_container,
    .menu-content > #sh_container.mobile-style,
    .menu-content #sh_container_wrapper {
        margin-top: 0 !important;
        padding-top: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        box-sizing: border-box;
    }
    .menu-content > #sh_container {
        width: 100% !important;
        max-width: none !important;
        display: block !important;
        overflow: visible !important;
    }
    .menu-content #topMargin {
        display: none !important;
        height: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    /* 패널 내부 페이지 공통 여백 기준
       - 패널 자체 상단 여백은 15px 고정
       - 페이지별 카드/섹션 좌우 margin 이 패널 padding 과 중첩되지 않도록 0으로 정규화 */
    .menu-content .cg-app {
        width: 100%;
        max-width: none;
        margin: 0 !important;
        padding-top: 0 !important;
        box-sizing: border-box;
    }
    body.k1-page-map-home .menu-content,
    body.k1-page-estate .menu-content,
    body.k1-page-cg-app .menu-content,
    .menu-content:has(.cg-app),
    .menu-content:has(.hi-app) {
        /* ★.hi-app(잼잼-핫이슈) 추가 (2026-07-10) — 패널 10px + 페이지 12px 이중 좌우 여백 제거 */
        --k1-panel-pad-x: 0px;
        --k1-panel-pad-top: 0px;
        --k1-panel-pad-bottom: 6px;
    }
    body.k1-page-estate .menu-content {
        padding-top: 0 !important;
    }
    /* ★ 모바일 하단 탭바(#shTabMo) 여유 여백 (2026-07-12)
       — 폰 기종별(제스처바/브라우저 하단 UI)로 페이지 자체 여백만으론 마지막 컨텐츠가
         하단 메뉴에 가려지는 케이스가 있어, 패널 스크롤 컨테이너에 +30px 공통 추가.
         페이지별 기존 하단 여백(80px 등)에 더해지는 값. calc 로 페이지별 pad 변수 존중
         (100px → 30px, 2026-07-12 사용자 조정) */
    @media (max-width: 1023px) {
        .menu-content {
            padding-bottom: calc(var(--k1-panel-pad-bottom, 6px) + 30px) !important;
        }
    }
    body.k1-page-estate .menu-content .cg-app {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    body.k1-page-estate .menu-content .cg-app > .cg-promo {
        margin-top: 12px !important;
    }
    /* 왼쪽 패널 자체가 부모 높이를 채우도록 */
    .left-panel {
        overflow: hidden;          /* menu-content 가 스크롤하도록 부모는 hidden */
    }

    /* PC 전용: 왼쪽 패널 스크롤바 얇게 (모바일은 native overlay 스크롤 그대로) */
    @media (min-width: 769px) {
        .menu-content {
            scrollbar-width: thin;                       /* Firefox */
            scrollbar-color: rgba(110,71,209,0.45) transparent;
        }
        .menu-content::-webkit-scrollbar {
            width: 6px;
            height: 6px;
        }
        .menu-content::-webkit-scrollbar-track {
            background: transparent;
        }
        .menu-content::-webkit-scrollbar-thumb {
            background: rgba(110,71,209,0.35);
            border-radius: 3px;
        }
        .menu-content::-webkit-scrollbar-thumb:hover {
            background: rgba(110,71,209,0.65);
        }
    }

    /* 모바일 레이아웃 */
    @media (max-width: 768px) {
        .left-panel {
            width: 100%;
            height: 20%; /* 기본적으로 20%만 노출 */
            position: absolute;
            bottom: 0;
            z-index: 3000;
            transition: height 0.3s ease-in-out;
        }

        .left-panel.expanded {
            height: 100%; /* 확장 시 전체 화면 차지 */
        }

        /* menu-header를 상단에 고정 */
        .menu-header {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 160;
        }

        .menu-content {
            /* margin-top: 0px; 고정된 헤더 높이만큼 아래로 밀림 */
            overflow-y: auto;
        }

        .right-panel {
            width: 100%;
            height: 100%;
        }

        .left-panel.expanded {
            height: calc(100% + 100px) !important;
            z-index: 5000 !important;
        }
    }



    /* 메뉴 확장 시 전체 화면 */
    .left-panel.expanded {
        height: 100%;
    }

    /* 메뉴 헤더 스타일 */
    .menu-header {
        background-color: #fff;
        color: white;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-shrink: 0; /* 고정된 상단 메뉴 */
    }

    /* 화살표 버튼 스타일 */
    #expandMenu {
        display: none;
        width: 100%;
        height: 30px;
        background-color: #555;
        color: white;
        border: none;
        font-size: 18px;
        cursor: pointer;
    }
    /* 모바일에서만 화살표 버튼 표시 */
    @media (max-width: 768px) {
        #expandMenu {
            display: block; /* 모바일에서만 표시 */
        }
    }

/* ===== block 4 ===== */
    #map-level {
        text-align: center;
        padding: 10px;
    }
    .add-markers {
        position: absolute;
        top: 10px;
        right: 10px;
        padding: 10px 20px;
        background-color: #4CAF50;
        color: white;
        border: none;
        border-radius: 5px;
        cursor: pointer;
        z-index: 1000; /* 버튼을 지도 위에 배치 */
        margin-top: 10px;
    }

    #map_wrap {
        position: fixed; /* 고정된 위치에 배치 */
        right: 30px; /* 화면의 오른쪽에서 30px 위치 */
        top: 50%; /* 화면의 중앙에 위치 */
        transform: translateY(-50%); /* 세로 중앙 정렬 */
        z-index: 1001; /* 팝업과 닫기 버튼이 다른 요소 위에 나타나도록 설정 */
    }

    #roadview-popup {
        width: 600px;
        height: 400px;
        background: white;
        border: 1px solid black;
        display: none; /* 초기에는 숨김 처리 */
    }

    #close-btn {
        position: absolute; /* 상대적 위치 설정 */
        right: 0; /* 오른쪽 상단 모서리 바깥쪽 */
        top: -30px; /* 상단 모서리 */
        width: 30px;
        height: 30px;
        background-color: #fff;
        color: #333;
        font-size: 24px;
        border: 1px solid #ccc;
        cursor: pointer;
        line-height: 28px;
        text-align: center;
        display: none; /* 초기에는 숨김 처리 */
    }

    .map-controls {
        position: absolute;
        top: 10px;
        left: 10px;
        z-index: 1000; /* 지도 위에 버튼이 나타나도록 설정 */
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .map-controls button {
        padding: 10px 20px;
        background-color: #4CAF50;
        color: white;
        border: none;
        border-radius: 5px;
        cursor: pointer;
    }

    .map-controls button.inactive {
        background-color: #ccc;
        color: #666;
    }
    /* 레이어 스타일 */
    #controlLayer {
        position: absolute;
        top: 46px;
        right: 10px;
        width: 238px;
        background-color: rgba(255,255,255,0.95);
        border: 1px solid #ccc;
        padding: 10px;
        margin-top: 0 !important;
        z-index: 8;         /* InfoWindow (z-index:999999) 보다 아래 — 인포윈도우가 최상단 */
        transition: transform 0.3s ease;
    }
    /* 스크롤바 스타일 */
    #controlLayer::-webkit-scrollbar {
        width: 4px; /* 스크롤바 너비를 얇게 설정 */
    }

    #controlLayer::-webkit-scrollbar-thumb {
        background-color: #ccc; /* 스크롤바 색상 */
        border-radius: 10px; /* 스크롤바를 둥글게 */
    }

    #controlLayer::-webkit-scrollbar-thumb:hover {
        background-color: #aaa; /* 마우스 오버 시 스크롤바 색상 변경 */
    }
    /* 숨김 상태 */
    #controlLayer.hidden {
        transform: translateX(100%); /* 오른쪽으로 이동하여 숨김 */
    }

    /* 전체 토글 버튼 */
    #layerToggleButton {
        position: absolute;
        top: 10px;
        right: 10px;
        cursor: pointer;
        z-index: 9;         /* InfoWindow 보다 아래 */
        background-color: rgba(255,255,255,0.9);
        border: 1px solid #ccc;
        padding: 5px;
        border-radius: 5px;
        margin-top: 0 !important;
        transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
    }

    /* 숨김 상태의 토글 버튼 위치 조정 */
    #layerToggleButton.hidden {
        right: 10px;
    }

    /* 영역 스타일 */
    .button-container {
        margin-bottom: 10px;
    }

    .container-title {
        width: 100%;
        font-weight: bold;
        margin-bottom: 5px;
        font-size: 14px;
        position: relative;
        padding-right: 35px; /* 토글 버튼 공간 확보 */
    }

    .toggle-button {
        position: absolute;
        right: 20px; /* 오른쪽 끝에서 20px 떨어뜨림 */
        top: 0;
        cursor: pointer;
        font-size: 14px;
    }

    .button-group {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
    }

    /* 최고만 스타일 우측 지도 메뉴 */
    #controlLayer {
        width: 238px;
        z-index: 155 !important;   /* ★ 가장자리 마커(host z-index:150) 위로 — 마커가 메뉴를 덮지 않게 (2026-07-09) */
        padding: 7px !important;
        padding-bottom: 10px !important;
        border: 1px solid rgba(110,71,209,.14) !important;
        border-radius: 18px;
        background: rgba(255,255,255,.96);
        box-shadow: 0 16px 42px rgba(26,22,32,.16), 0 0 0 1px rgba(255,255,255,.70) inset;
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        scrollbar-width: thin;
        scrollbar-color: rgba(110,71,209,.32) transparent;
    }
    #controlLayer::-webkit-scrollbar { width: 5px; }
    #controlLayer::-webkit-scrollbar-track { background: transparent; }
    #controlLayer::-webkit-scrollbar-thumb {
        background: rgba(110,71,209,.32);
        border-radius: 999px;
    }
    #layerToggleButton {
        width: 34px;
        height: 34px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0 !important;
        border: 1px solid rgba(110,71,209,.18) !important;
        border-radius: 999px !important;
        background: rgba(255,255,255,.96) !important;
        box-shadow: 0 10px 28px rgba(26,22,32,.15), 0 0 0 1px rgba(255,255,255,.70) inset;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }
    #layerToggleButton img {
        width: 21px;
        height: 21px;
        object-fit: contain;
        filter: saturate(1.05);
    }
    .cg-map-level-dock {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 5px;
        margin: 0 0 6px;
        padding: 4px;
        border: 1px solid rgba(110,71,209,.10);
        border-radius: 14px;
        background: linear-gradient(135deg,#F7F3FF 0%,#FFF8F0 100%);
    }
    .cg-map-level-btn {
        min-width: 0;
        min-height: 40px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 7px;
        padding: 6px 5px;
        border: 1px solid rgba(110,71,209,.16);
        border-radius: 12px;
        background: rgba(255,255,255,.92);
        color: #241B39;
        cursor: pointer;
        box-shadow: 0 6px 16px rgba(26,22,32,.08);
        transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease;
        font-family: 'Pretendard Variable','Pretendard',-apple-system,BlinkMacSystemFont,'Malgun Gothic',sans-serif;
    }
    #controlLayer #map-level,
    #controlLayer #map-level2 {
        padding: 6px 5px;
        text-align: center;
    }
    .cg-map-level-btn:hover {
        transform: translateY(-1px);
        border-color: rgba(110,71,209,.38);
        box-shadow: 0 8px 18px rgba(110,71,209,.14);
    }
    .cg-map-level-btn.is-active {
        border-color: rgba(110,71,209,.55);
        background: #F7F3FF;
        box-shadow: 0 0 0 2px rgba(110,71,209,.10), 0 8px 18px rgba(110,71,209,.16);
    }
    .cg-map-level-btn__icon {
        width: 26px;
        height: 26px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 9px;
        font-size: 15px;
        font-weight: 950;
        color: #fff;
        line-height: 1;
    }
    .cg-map-level-btn--naver .cg-map-level-btn__icon { background:#03C75A; }
    .cg-map-level-btn--google .cg-map-level-btn__icon { background:linear-gradient(135deg,#4285F4 0%,#34A853 45%,#FBBC05 72%,#EA4335 100%); }
    .cg-map-level-btn__text {
        display:none !important;
        max-width: none;
        font-size: 11px;
        font-weight: 900;
        color: #6B6179;
        letter-spacing: -.05em;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .cg-map-level-btn__num {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 22px;
        height: 22px;
        padding: 0 6px;
        border-radius: 999px;
        background: #6E47D1;
        color: #fff;
        font-size: 12px;
        font-weight: 950;
        line-height: 1;
    }
    .cg-map-level-step {
        display: inline-flex;
        align-items: center;
        gap: 3px;
        margin-left: 1px;
    }
    .cg-map-level-step__btn {
        width: 18px;
        height: 18px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 6px;
        background: #F4EEFE;
        color: #5A37B8;
        font-size: 13px;
        font-weight: 950;
        line-height: 1;
        box-shadow: inset 0 0 0 1px rgba(110,71,209,.18);
        user-select: none;
    }
    .cg-map-level-step__btn:hover {
        background: #6E47D1;
        color: #fff;
    }
    #controlLayer .button-container {
        margin: 0 0 8px;
        padding: 4px;
        border: 1px solid rgba(26,22,32,.06);
        border-radius: 15px;
        background: rgba(255,255,255,.72);
        box-shadow: 0 6px 18px rgba(26,22,32,.06);
    }
    #controlLayer .container-title {
        display:flex;
        align-items:center;
        min-height: 28px;
        margin: 0 0 7px;
        padding: 0 36px 0 2px;
        color: #241B39;
        font-size: 12px;
        font-weight: 950;
        letter-spacing: -.03em;
    }
    #controlLayer .container-title::before {
        content: '';
        width: 5px;
        height: 16px;
        margin-right: 7px;
        border-radius: 999px;
        background: linear-gradient(180deg,#6E47D1,#FF8A1F);
    }
    #controlLayer .toggle-button {
        right: 4px;
        top: 2px;
        min-width: 26px;
        height: 24px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        border: 1px solid rgba(110,71,209,.16);
        border-radius: 999px;
        background: #F7F3FF;
        color: #6E47D1;
        padding: 0 !important;
    }
    #controlLayer .button-group {
        display: grid;
        grid-template-columns: repeat(5, 34px);
        gap: 5px;
        align-items: center;
        justify-content: center;
    }
    #controlLayer .button-container:not(#activeButtons2) .button-group > div,
    #controlLayer .button-container:not(#activeButtons2) .swiper-container {
        width: 34px;
        height: 34px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin: 0;
        border-radius: 10px;
        background: linear-gradient(135deg,#FFFFFF 0%,#F7F3FF 100%);
        border: 1px solid rgba(110,71,209,.22);
        box-shadow: 0 4px 12px rgba(26,22,32,.09);
        overflow: hidden;
    }
    #controlLayer .button-container:not(#activeButtons2) .button-group > div.active-wrap,
    #controlLayer .button-container:not(#activeButtons2) .swiper-container.active-wrap {
        border: 2px solid rgba(110,71,209,1) !important;
        box-shadow: none !important;
        background: linear-gradient(135deg,#F7F3FF 0%,#FFFFFF 100%);
        box-sizing: border-box;
    }
    #controlLayer .button-container:not(#activeButtons2) .button-group img.mapBtn {
        width: 30px !important;
        height: 30px !important;
        margin: 0 !important;
        border-radius: 8px !important;
        object-fit: cover;
    }
    #controlLayer .button-container:not(#activeButtons2) .button-group img.mapBtn.active {
        border: 0 !important;
        box-shadow: none !important;
    }
    #controlLayer .button-container#activeButtons2 {
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }
    #controlLayer #activeButtons2 .button-group {
        display:block;
        grid-template-columns: none;
        margin-bottom: 3px;
    }
    #controlLayer #activeButtons2 .cg-near-partner-shell {
        position: relative;
        margin-bottom: 5px;
    }
    .cg-near-partner-slider {
        position: relative;
        width: 100%;
        aspect-ratio: 2 / 1;
        overflow: hidden;
        border: 1px solid rgba(110,71,209,.28);
        border-radius: 0;
        background: transparent;
        box-shadow: none;
        touch-action: pan-y;
    }
    .cg-near-partner-slider .swiper,
    .cg-near-partner-swiper,
    .cg-near-partner-slider .swiper-wrapper,
    .cg-near-partner-slider .swiper-slide {
        width: 100%;
        height: 100%;
    }
    .cg-near-partner-slider .swiper-wrapper {
        display: flex;
    }
    .cg-near-partner-track {
        display: flex;
        width: 100%;
        height: 100%;
        transform: translate3d(0,0,0);
        transition: transform .34s ease;
    }
    .cg-near-partner-slide {
        position: relative;
        flex: 0 0 100%;
        display: block;
        width: 100%;
        height: 100%;
        min-height: 0;
        overflow: hidden;
        background: transparent;
        color: #fff;
        text-decoration: none;
        touch-action: pan-y;
    }
    .cg-near-partner-slide img {
        display: block;
        width: 100%;
        height: 100%;
        min-height: 0;
        object-fit: cover;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }
    .cg-near-partner-slide__fallback {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        width: 100%;
        height: 100%;
        min-height: 0;
        padding: 14px 16px;
        box-sizing: border-box;
        color: #fff;
    }
    .cg-near-partner-slide__name {
        font-size: 15px;
        font-weight: 950;
        letter-spacing: -.04em;
        line-height: 1.25;
        text-shadow: 0 1px 2px rgba(0,0,0,.18);
    }
    .cg-near-partner-slide__meta {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        margin-top: 6px;
        padding: 3px 8px;
        border-radius: 999px;
        background: rgba(255,255,255,.18);
        color: rgba(255,255,255,.94);
        font-size: 10.5px;
        font-weight: 850;
        line-height: 1.2;
        backdrop-filter: blur(4px);
    }
    .cg-near-partner-dots {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 5px;
        display: flex;
        justify-content: center;
        gap: 4px;
        pointer-events: auto;
        z-index: 4;
    }
    .cg-near-partner-dots.swiper-pagination {
        display: flex !important;
        align-items: center;
        justify-content: center;
        gap: 4px;
        bottom: 5px !important;
        pointer-events: auto;
    }
    .cg-near-partner-dots i {
        width: 14px;
        height: 3px;
        border-radius: 999px;
        background: rgba(255,255,255,.52);
        box-shadow: 0 1px 3px rgba(0,0,0,.18);
        cursor: pointer;
    }
    .cg-near-partner-dots i.is-on {
        background: #fff;
        width: 22px;
    }
    .cg-near-partner-dots .swiper-pagination-bullet {
        width: 14px;
        height: 3px;
        margin: 0 !important;
        border-radius: 999px;
        background: rgba(255,255,255,.52);
        box-shadow: 0 1px 3px rgba(0,0,0,.18);
        opacity: 1;
    }
    .cg-near-partner-dots .swiper-pagination-bullet-active {
        width: 22px;
        background: #fff;
    }
    .cg-near-partner-empty {
        height: 100%;
        min-height: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 12px;
        box-sizing: border-box;
        background: linear-gradient(135deg,#F7F3FF,#FFF8F0);
        color: #6E47D1;
        font-size: 12px;
        font-weight: 900;
        letter-spacing: -.03em;
    }
    .cg-map-level-btn.is-disabled {
        opacity: .72;
        filter: grayscale(.25);
    }
    #controlLayer #activeButtons2 img {
        border-radius: 0;
        box-shadow: none;
    }
    #controlLayer #activeButtons2 .cg-near-partner-slider img {
        margin: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }
    #controlLayer #activeButtons2 .cg-near-partner-slider a {
        margin: 0 !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    /* 버튼 스타일 */
    .cg-map-floating-tooltip {
        position: fixed;
        left: 0;
        top: 0;
        z-index: 1000000;
        max-width: 170px;
        padding: 6px 9px;
        border-radius: 7px;
        background: rgba(26, 22, 32, .94);
        color: #fff;
        box-shadow: 0 8px 18px rgba(0,0,0,.24);
        font-family: 'Pretendard Variable','Pretendard',-apple-system,BlinkMacSystemFont,'Malgun Gothic',sans-serif;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: -.03em;
        line-height: 1.2;
        white-space: nowrap;
        pointer-events: none;
        opacity: 0;
        transform: translate3d(-50%, -2px, 0);
        transition: opacity .12s ease, transform .12s ease;
    }
    .cg-map-floating-tooltip::before {
        content: '';
        position: absolute;
        left: 50%;
        top: -4px;
        width: 8px;
        height: 8px;
        transform: translateX(-50%) rotate(45deg);
        background: rgba(26, 22, 32, .94);
    }
    .cg-map-floating-tooltip.is-show {
        opacity: 1;
        transform: translate3d(-50%, 0, 0);
    }

    .button {
        display: inline-block;
        margin: 2px;
        padding: 5px;
        text-align: center;
        background-color: #eee;
        cursor: pointer;
        font-size: 12px;
        width: auto;
        min-width: 40px;
    }

    .button i {
        margin-right: 3px;
    }

    .button.active {
        background-color: #28A745;
        color: white;
    }

    .active3 {
        background-color: #ffc107;
        color: black;
    }



    .custom-marker {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 5px;
        border-radius: 15px;
        border: 1px solid red;
        background-color: white;
        color: red;
        font-size: 12px;
        width: 120px;
        box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
        position: relative;
        cursor: pointer;
        z-index: 1;
    }
    .custom-marker:after {
        content: '';
        position: absolute;
        bottom: -10px;
        left: 50%;
        margin-left: -5px;
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 10px solid red;
        z-index: 1;
    }

    .custom-marker-mini {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 5px;
        border-radius: 15px;
        border: 1px solid red;
        background-color: white;
        color: red;
        font-size: 12px;
        width: 30px;
        box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
        position: relative;
        cursor: pointer;
        z-index: 1;
    }
    .custom-marker-mini:after {
        content: '';
        position: absolute;
        bottom: -10px;
        left: 50%;
        margin-left: -5px;
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 10px solid red;
        z-index: 1;
    }

    .active2 {
        background-color: #ffc107;
        color: black;
    }
    .marker-overlay img {
        position: absolute;
        top: 9px;
        left: 15px;
        background-color: rgba(255, 255, 255, 0.7); /* 투명 배경 */
        border-radius: 50%; /* 둥근 배경 */
        border: 3px solid #fff;
        width: 40px; /* 써클 크기 */
        height: 40px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .button-group img{
        border: 1px solid #4CAF50; /* 예쁜 초록색 외곽선 */
        border-radius: 5px; /* 둥근 모서리 반지름 */
        box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1); /* 부드러운 그림자 */
        margin : 3px 4px;
        cursor: pointer;
    }
    #controlLayer .button-container:not(#activeButtons2) .button-group img.mapBtn:not(.active) {
        border: 0 !important;
        box-shadow: none !important;
    }
    #controlLayer .button-container:not(#activeButtons2) .button-group img.mapBtn.active {
        border: 0 !important;
        box-shadow: none !important;
    }
    #controlLayer .button-container:not(#activeButtons2) .button-group > div.active-wrap,
    #controlLayer .button-container:not(#activeButtons2) .swiper-container.active-wrap {
        border: 2px solid rgba(139,92,246,.95) !important;
        box-shadow: none !important;
        box-sizing: border-box;
    }




    /*인포박스*/
    .map-popup-wrap {
        display: block;
        width: 250px !important;
        position: relative;
        z-index: 1 !important;
    }

    .map-popup {
        display: block;
        width: 100%;
        position: relative;
        overflow: hidden;
    }

    .infoBox-close {
        position: absolute;
        width: 40px;
        height: 40px;
        line-height: 40px;
        font-size: 14px;
        top: 0;
        right: 0;
        color: #999;
        border-radius: 0 0 0 8px;
        z-index: 20;
        background: #fff;
        box-shadow: 0px 0px 0px 5px rgba(255, 255, 255, 0.3);
        cursor: pointer;
    }
    .listing-img-content {
        overflow: hidden;
    }
    .listing-img-content {
        border-radius: 10px;
    }
    .fl-wrap {
        float: left;
        width: 100%;
        position: relative;
    }
    .infobox-status {
        position: absolute;
        top: 20px;
        left: 20px;
        box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5);
        background: rgba(255, 255, 255, 0.3);
        z-index: 22;
        color: #fff;
        padding: 4px 20px;
        border-radius: 10px;
    }
    .listing-img-content:hover img {
        transform: scale(1.15);
    }
    .map-popup img {
        width: 100%;
        height: auto;
        transform: translateZ(0);
        transition: all 2000ms cubic-bezier(.19,1,.22,1) 0ms;
    }

    .gm-style img {
        max-width: none;
    }
    .listing-content {
        z-index: 21;
        position: relative;
        float: left;
        width: 100%;
        top: -10px;
        transition: all .2s ease-in-out;
    }
    .listing-title {
        padding: 15px 20px;
    }        
    .listing-title h4 {
        float: left;
        width: 100%;
        text-align: left;
        font-size: 14px;
        font-weight: 600;
        color: #566985;
    }        
    .listing-content-item {
        border-radius: 10px;
        box-shadow: 0 9px 26px rgba(58, 87, 135, 0.25);
        background: #fff;
    }
    .map-popup-location-info {
        float: left;
        width: 100%;
        color: #7d93b2;
        text-align: left;
        padding-top: 6px;
    }        
    .map-popup-footer {
        float: left;
        padding: 0 20px;
        width: 100%;
        height: 46px;
        border-top: 1px solid #eee;
        background: #fff;
        border-radius: 0 0 10px 10px;
    }
    .map-popup-footer .main-link {
        float: left;
        color: #7d93b2;
        height: 30px;
        line-height: 30px;
        border-radius: 2px;
        position: relative;
        top: 8px;
        font-size: 12px;
        font-weight: 600;
    }

    .infowindow_wishlist-btn {
        position: absolute;
        right: 0;
        bottom: 0;
        width: 60px;
        height: 46px;
        line-height: 46px;
        border-left: 1px solid #eee;
        font-size: 16px;
        z-index: 10;
    }

    .infowindow {
        width:250px;
        height:60px;
        padding:3px;
    }




    .links-list {
        margin-top: 40px;
    }

    .links-list a {
        display: block;
        margin-bottom: 10px;
        color: #007bff;
        text-decoration: none;
    }

    .links-list a:hover {
        text-decoration: underline;
    }



    /* 로딩 스피너 */
    .spinner {
        border: 3px solid #f3f3f3; /* 스피너 테두리 색상 */
        border-top: 3px solid #3498db; /* 상단 테두리 색상 */
        border-radius: 50%;
        width: 40px;
        height: 40px;
        animation: spin 0.4s linear infinite;
        position: fixed;
        top: 30%;
        left: 20%;
        transform: translate(-50%, -50%);
        z-index: 10001;
    }

    @keyframes spin {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }
    /* PC(데스크탑)에서는 shTabMo 완전 숨김 */
    @media (min-width: 1023) {
        #shTabMo {
            display: none !important;
            z-index:3500;
        }
    }
    
    :root {
        --primary: #0D9488; /* 고급스러운 틸 민트 */
        --primary-light: #E6FFFA;
        --accent: #F59E0B; /* 골드 포인트 (돈) */
        --text-dark: #111827;
        --text-gray: #4B5563;
        --bg-gray: #F3F4F6;
        --white: #FFFFFF;
    }

    /* 배너 2칸 */
    .container_banner {
        display: flex;
    }

    .box_banner {
        width: 50%;
        height: auto;
    }

/* ===== block 5 ===== */
/* ============================================================
   PC 전용 상단바 레이아웃 (min-width: 1024px)
   - 햄버거 + 로고 + 로또금액(카트) + 메뉴를 한 줄로 전체너비 배치
   - 모바일은 기존 레이아웃 그대로 유지 (변경 없음)
   - 상단바 높이만큼 .container 에 padding-top 추가
     → 자동으로 .left-panel / .right-panel(#daumMap) 영역 축소
   ============================================================ */
@media (min-width: 1024px) {

    /* ---- left-panel/right-panel transition 비활성 (초기 로딩 시 깜빡임 방지) ---- */
    .left-panel,
    .right-panel {
        transition: none !important;
    }

    /* ---- 상단바 본체: 전체너비, 고정 ---- */
    /* (실제 .menu-header 정의는 아래에 이어짐. 위 transition 비활성 위에
        loadingSpinner 표시 규칙을 미디어쿼리 밖으로 빼서 모바일도 동일 효과
        받도록 함 — 아래 별도 블록 참고) */
    body.has-pc-topbar .menu-header,
    .menu-header {
        position: fixed !important;
        top: 0;
        left: 0;
        right: 0;
        width: 100% !important;
        height: 56px;
        min-height: 56px;
        max-height: 56px;
        z-index: 5000;
        background: #fff;
        border-bottom: 1px solid #e1e1e1;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
        display: flex;
        align-items: center;
        flex-shrink: 0;
        transition: none !important;
        will-change: auto;
        contain: layout style;
    }

    .menu-header #sh_wrapper,
    .menu-header #sh_hd,
    .menu-header #shGnb {
        width: 100%;
        height: 56px;
    }

    .menu-header #shGnb {
        display: flex !important;
        align-items: center !important;
        border: none !important;
    }

    /* ---- 좌측 영역: 햄버거 + 로고 + 사용자 + 로또(카트) ---- */
    .menu-header #shGnbMo {
        display: flex !important;
        align-items: center;
        flex-shrink: 0;
        width: auto !important;
        max-width: none !important;   /* bot_map.php JS의 max-width:480px 무력화 */
        height: 56px !important;
        padding: 0 14px;
        background: transparent !important;
        z-index: auto !important;
    }

    .menu-header #shGnbMo .all_menu {
        flex-shrink: 0;
        margin-right: 14px;            /* 햄버거-로고 간격 */
    }

    .menu-header #shGnbMo .logo_m {
        position: static !important;
        left: auto !important;
        top: auto !important;
        transform: none !important;
        margin: 0 16px 0 4px;          /* 좌측은 햄버거가 14px 갖고 있으므로 4px만 */
        padding: 0;
        font-size: 16px;
        font-weight: 700;
        white-space: nowrap;
        line-height: 1.2;
    }

    .menu-header #shGnbMo > a {
        margin: 0 6px;
        line-height: 1;
        display: inline-flex;
        align-items: center;
    }

    /* (#number2 = 로또 금액. PC 에서는 항상 숨김 — 아이콘 옆에 안 붙음) */
    .menu-header #shGnbMo #number2 {
        display: none !important;
    }

    /* ★ PC 상단바 우상단 아이콘 (즐겨찾기 / 회원)
         #shGnbMo 안에 자연스럽게 들어 있지만, PC 에서는 position:fixed 로
         메뉴-헤더 맨 오른쪽에 고정 배치한다. */
    .menu-header #shGnbMo > a.nav-icon-btn {
        position: fixed !important;
        top: 0 !important;
        height: 56px;
        width: 36px;                        /* 44 → 36 으로 더 좁힘 */
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        margin: 0 !important;
        color: #6E47D1 !important;
        z-index: 5001;
        background: transparent;
        border-radius: 8px;
        transition: background 0.18s ease, color 0.18s ease;
    }
    .menu-header #shGnbMo > a.nav-icon-btn:hover {
        background: rgba(110, 71, 209, 0.10);
        color: #5A37B8 !important;
    }
    .menu-header #shGnbMo > a.nav-icon-btn i,
    .menu-header #shGnbMo > a.nav-icon-btn svg {
        font-size: 18px;
        width: 20px;
        height: 20px;
        line-height: 1;
        display: inline-block;
    }
    .menu-header #shGnbMo > a.nav-icon-wishlist { right: 88px !important; }   /* 36 → 56 (+20px) */
    .menu-header #shGnbMo > a.nav-icon-chatfav  { right: 56px !important; }
    .menu-header #shGnbMo > a.nav-icon-member   { right: 24px !important; }   /* 4 → 24 (+20px) */

    /* PC 메뉴 영역 우측이 아이콘 2개와 겹치지 않게 살짝 패딩 */
    .menu-header .sh_nav {
        padding-right: 108px !important;
    }

    /* ---- 우측 영역: 메뉴 (#scrollableUl 가로 스크롤) ---- */
    .menu-header .sh_nav {
        flex: 1 1 auto;
        max-width: none !important;
        width: auto !important;
        display: flex;
        align-items: center;
        border-top: none !important;
        border-left: 1px solid #ececec;
        margin-left: 4px;
        min-width: 0;       /* flex 자식이 가로 스크롤 가능하도록 */
        overflow: hidden;
    }

    /* 모바일 하단 탭바는 PC 상단바에서 숨김 */
    .menu-header #shTabMo {
        display: none !important;
    }

    /* nav_wrap_0605 = 메뉴 컨테이너 */
    .menu-header .nav_wrap_0605 {
        display: flex !important;
        align-items: center;
        flex: 1 1 auto;
        width: 100%;
        height: 56px !important;
        padding: 0 14px !important;
        margin: 0 !important;
        min-width: 0;
    }

    /* 별도 햄버거(#navBtn_0605)는 #shGnbMo 의 햄버거와 중복이라 숨김 */
    .menu-header #navBtn_0605 {
        display: none !important;
    }

    .menu-header .nav_wrap_0605 ul#scrollableUl {
        display: flex !important;
        align-items: center;
        gap: 18px;
        padding: 0 !important;
        margin: 0 !important;
        list-style: none;
        flex: 1 1 auto;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
        min-width: 0;
        /* ★ 스크롤바 숨김 (스크롤은 그대로 가능) */
        scrollbar-width: none;          /* Firefox */
        -ms-overflow-style: none;       /* IE/Edge */
    }
    .menu-header .nav_wrap_0605 ul#scrollableUl::-webkit-scrollbar {
        display: none;                  /* Chrome / Safari / Opera */
        width: 0;
        height: 0;
    }

    .menu-header .nav_wrap_0605 ul#scrollableUl li {
        margin: 0 !important;
        padding: 0 !important;
        flex-shrink: 0;
    }

    .menu-header .nav_wrap_0605 ul#scrollableUl li a {
        display: flex !important;
        align-items: center;
        font-size: 13px !important;
        color: #111;
        line-height: 1.2;
        text-decoration: none;
    }

    .menu-header .nav_wrap_0605 ul#scrollableUl li a img {
        width: 22px !important;
        margin-right: 4px !important;
    }

    /* ★ 서브라벨(.st / .st2) : 메인타이틀보다 약간 위에 뜨는 superscript 형태.
       - 이전 방식(position:relative + top:-4px) 은 #scrollableUl 의
         overflow-y:hidden 박스 위쪽으로 튀어나가 위가 잘리는 문제 발생.
       - 해결: margin-bottom 으로 flex 라인 높이 자체를 살짝 늘려서 .st 의
         박스(content + 하단 margin)를 align-self:flex-start 로 위에 정렬.
         그러면 .st 는 박스 안에서 위쪽에 자연스럽게 떠 보이고 잘림 없음. */
    .menu-header .nav_wrap_0605 ul#scrollableUl li a .st,
    .menu-header .nav_wrap_0605 ul#scrollableUl li a .st2 {
        margin: 0 0 8px 4px !important;       /* 하단 margin → flex line 높이 ↑ */
        font-size: 10px !important;
        font-weight: 700 !important;
        align-self: flex-start;                /* <a> 안에서 상단 정렬 */
        line-height: 1.2;
    }
    .menu-header .nav_wrap_0605 ul#scrollableUl li a .st  { color: #0066ff; }
    .menu-header .nav_wrap_0605 ul#scrollableUl li a .st2 { color: #fa3390; }

    /* ★ PC 전용 — 상단 메뉴 글자 키우기 (메인 + 서브타이틀) */
    @media (min-width: 1024px) {
        .menu-header .nav_wrap_0605 ul#scrollableUl li a {
            font-size: 16px !important;
        }
        .menu-header .nav_wrap_0605 ul#scrollableUl li a .st,
        .menu-header .nav_wrap_0605 ul#scrollableUl li a .st2 {
            font-size: 12px !important;
        }
    }

    /* ---- 본문(.container) 영역: 상단바 높이만큼 아래로 밀기 ---- */
    .container {
        padding-top: 56px;
        height: 100dvh;
        box-sizing: border-box;
    }

    /* #daumMap 은 .right-panel 100% 높이를 그대로 사용 (자동 축소됨) */

    /* ★ 우측 지도 컨트롤(viewport 기준 absolute) 들을 상단바 높이만큼 아래로 밀기.
       이 요소들은 .container 의 직접 자식이지만 .container 에 position:relative 가
       없어서 viewport 기준으로 위치가 잡힘 → 상단바(56px) 와 겹쳐 가려짐.
       JS(bot_map.php resize/ready) 에서 inline 으로 top:10/40/5 등을 박지만
       !important 로 우선순위 확보. */
    #layerToggleButton  { top: 66px !important; right: 10px !important; margin-top: 0 !important; }
    #controlLayer       { top: 102px !important; right: 10px !important; margin-top: 0 !important; }   /* 화살표 버튼 아래 */
    #toggleButtonMini,
    #currentLocationButton,
    #naverMapSwitchButton,
    #googleMapSwitchButton {
        top: 66px !important;
    }
    #miniMap            { top: 96px !important; }   /* 56 + 40 */
    #toggleSatellite,
    #toggleCadastral,
    #toggle-roadview    { top: 61px !important; }   /* 56 + 5 */

    /* ★ allCate 드롭다운: PC에서는 viewport 기준 fixed 로 띄움
       (기존 .sh_nav 안의 absolute 가 PC 상단바 layout 에서는 좁은 영역에
        갇혀 사실상 안 보이므로 fixed 로 전환) */
    #allCate {
        position: fixed !important;
        top: 56px !important;
        left: 0 !important;
        right: auto !important;
        width: 100% !important;
        max-width: 400px !important;          /* PC에서는 좌측 사이드 드로어 형태 (left-panel 과 동일 너비, 2026-07-10 420→400) */
        height: calc(100dvh - 56px) !important;
        max-height: calc(100dvh - 56px) !important;
        z-index: 4500 !important;             /* .menu-header(5000) 보다 낮게, 콘텐츠보다 높게 */
        overflow-y: auto !important;
        background: #fff;
        border-right: 1px solid #e1e1e1;
        box-shadow: 4px 0 10px rgba(0, 0, 0, 0.06);
    }
}

/* ★ 깜빡임 완화: 페이지가 .menu-content 를 AJAX 로 채우는 구조라
     초기 빈 상태 대신 #loadingSpinnerContainer 를 즉시 노출 */
.menu-content > #loadingSpinnerContainer {
    display: block !important;
}

#allCate .tMenu > button {
    border-radius: 7px !important;
    transition: background .16s ease, color .16s ease, box-shadow .16s ease;
}
#allCate .tMenu.on > button,
#allCate .tMenu > button:hover {
    background: #6E47D1 !important;
    color: #fff !important;
    box-shadow: 0 6px 14px rgba(110,71,209,.18) !important;
}
#allCate .tMenuSub:not(.k1-hamburger-ad-slot) > a {
    color: #4A386D !important;
    transition: background .14s ease, color .14s ease, border-color .14s ease;
}
#allCate .tMenuSub:not(.k1-hamburger-ad-slot) > a:hover,
#allCate .tMenuSub.on:not(.k1-hamburger-ad-slot) > a {
    color: #6E47D1 !important;
    background: #F7F3FF !important;
    border-color: #D8C7FF !important;
}

/* ===== block 6 ===== */
/* ─────────────────────────────────────────────────
   모바일 #menuPage half-expanded — panel 윗변을 viewport 위쪽에서 멀리, 100px 더 아래로
   (panel 높이 = 70vh - 100px → panel 윗변 = 30vh + 100px 위치)
   ───────────────────────────────────────────────── */
@media (max-width: 1023px) {
    #menuPage.half-expanded {
        height: calc(70vh - 100px) !important;
        transition: height 0.32s cubic-bezier(0.22, 1, 0.36, 1) !important;
    }
}

/* ─────────────────────────────────────────────────
   지도 마커 GPU 컴포지팅 (지도 pan/drag 시 깜빡임 차단)
   ───────────────────────────────────────────────── */
.tspl-anim-marker,
.tspl-anim-marker img,
.tspl-anim-marker .tspl-anim-label,
.tspl-place-marker,
.mk-apt,
#daumMap > div[style*="position: absolute"] img,
#daumMap div[style*="position: absolute"] > img[src*="ani_marker"],
#daumMap div[style*="position: absolute"] > img[src*="marker"] {
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transform: translateZ(0);
}

/* ═══════════════════════════════════════════════════════
   ★ 아파트 단지 마커 (mk-apt) — marker_design_preview.html 의 G+상단아이콘 디자인
   ═══════════════════════════════════════════════════════ */
.mk-apt {
    /* 거래 종류 (매물=활성/실거래=참고 톤 구분) */
    --deal-매매:        #E5604C;
    --deal-매매-soft:   #FFEDE9;
    --deal-전세:        #3D5AFE;
    --deal-전세-soft:   #EBF0FF;
    --deal-월세:        #DB8B00;
    --deal-월세-soft:   #FFF6E6;
    --deal-실거래:      #6B7280;
    --deal-실거래-soft: #F1F3F5;
    /* 건물 유형 */
    --type-apt:        #6E47D1;
    --type-officetel:  #0EA5E9;
    --type-villa:      #2DA89B;
    --type-building:   #DB8B00;

    position:relative; display:inline-flex; flex-direction:column; align-items:flex-start;
    padding:5px 7px 6px;                  /* 좌우 padding 축소 (11px → 7px) */
    background:#fff; border-radius:8px;
    box-shadow:0 4px 12px rgba(26,22,32,.12);
    border:1px solid rgba(26,22,32,.08); border-left:3px solid var(--type-apt);
    /* 너비는 내부 컨텐츠 길이만큼 자동조정 */
    width:max-content;
    margin-top:0;
    /* ★ 폴리곤보다 위에 노출 + 클릭 영역 확보. InfoWindow 보다는 낮게 (2026-05-31 z-index 낮춤 — 역/단지 인포윈도우 가려지지 않게) */
    z-index:100;
    pointer-events:auto !important;
    font-family:'Pretendard',-apple-system,BlinkMacSystemFont,'Malgun Gothic','맑은 고딕',sans-serif;
    line-height:1.2; letter-spacing:-0.02em; -webkit-font-smoothing:antialiased;
    cursor:pointer;
    transition:transform .18s, box-shadow .18s, filter .18s;
}
.mk-apt:hover { transform:translateY(-2px); filter:brightness(1.04); box-shadow:0 6px 18px rgba(26,22,32,.18); }
/* ★ 모든 인포윈도우 — 마커보다 항상 위 (2026-05-31)
   .iw-apt / .iw-station / .iw-place 같은 인포윈도우 컨텐츠 wrapper 강제 최상위 stacking context */
.iw-apt, .iw-station, .iw-place {
    position: relative !important;
    z-index: 999999 !important;
}
.mk-apt .mk-apt__ic-top {
    position:absolute; top:-18px; left:50%; transform:translateX(-50%);
    width:22px; height:22px; border-radius:50%;
    background:var(--type-apt); color:#fff;
    display:flex; align-items:center; justify-content:center;
    font-size:10.5px;
    border:2px solid #fff;
    box-shadow:0 3px 6px rgba(0,0,0,.2);
    z-index:2;
}
.mk-apt__name { font-size:10px; font-weight:700; color:#4A4458; line-height:1.2; max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-top:1px; }
/* ★ 가격 · 면적 · 거래방식 한 줄 (와이드 레이아웃) */
.mk-apt__price-row { display:flex; align-items:baseline; gap:6px; margin-top:2px; white-space:nowrap; }
.mk-apt__price { font-size:13px; font-weight:900; color:#1A1620; line-height:1.2; }
/* 실거래가 없는 단지 — 가격 자리 "-" 톤다운 (2026-05-31 실데이터 전환) */
.mk-apt__price.mk-apt__price--none { color:#94A3B8; font-weight:800; }
.mk-apt__area  { font-size:9px;  font-weight:600; color:#8B8696; }
.mk-apt__deal  { font-size:8px;  font-weight:800; padding:1px 4px; border-radius:3px; background:var(--deal-매매-soft); color:var(--deal-매매); letter-spacing:.02em; line-height:1.4; align-self:center; }
.mk-apt__deal.전세  { background:var(--deal-전세-soft); color:var(--deal-전세); }
.mk-apt__deal.월세  { background:var(--deal-월세-soft); color:var(--deal-월세); }
.mk-apt__deal.실거래 { background:var(--deal-실거래-soft); color:var(--deal-실거래); }
/* 유형별 색상 */
.mk-apt.officetel { border-left-color:var(--type-officetel); }
.mk-apt.officetel .mk-apt__ic-top { background:var(--type-officetel); }
.mk-apt.villa     { border-left-color:var(--type-villa); }
.mk-apt.villa     .mk-apt__ic-top { background:var(--type-villa); }
.mk-apt.building  { border-left-color:var(--type-building); }
.mk-apt.building  .mk-apt__ic-top { background:var(--type-building); }
/* 실거래 마커 — 매물 마커와 동일한 효과(solid border, 같은 그림자) + 왼쪽 선 색상만 회색 */
.mk-apt.real      { border-left-color:var(--deal-실거래); }
.mk-apt.real      .mk-apt__ic-top { background:var(--deal-실거래); }
.mk-apt.real:not(.officetel):not(.villa):not(.building) { border-left-color:var(--type-apt); }
.mk-apt.real:not(.officetel):not(.villa):not(.building) .mk-apt__ic-top { background:var(--type-apt); }
.mk-apt.real.officetel { border-left-color:var(--type-officetel); }
.mk-apt.real.officetel .mk-apt__ic-top { background:var(--type-officetel); }
/* 선택됨 — 다크 카드 + z-index 최상위 (다른 마커 위로 띄움) */
.mk-apt.selected {
    background:#1A1620; border-color:#1A1620; border-left-color:var(--type-apt);
    box-shadow:0 8px 24px rgba(26,22,32,.18), 0 0 0 3px rgba(110,71,209,.25);
    transform:translateY(-3px) scale(1.05);
    z-index:9999 !important;                /* ★ 다른 마커보다 항상 위에 노출 */
    position:relative;
}
.mk-apt.selected .mk-apt__ic-top { background:#fff; color:var(--type-apt); border-color:var(--type-apt); }
.mk-apt.selected.officetel { border-left-color:var(--type-officetel); }
.mk-apt.selected.officetel .mk-apt__ic-top { color:var(--type-officetel); border-color:var(--type-officetel); }
.mk-apt.selected .mk-apt__name  { color:rgba(255,255,255,.7); }
.mk-apt.selected .mk-apt__price { color:#fff; }
.mk-apt.selected .mk-apt__area  { color:rgba(255,255,255,.6); }

/* ═══════════════════════════════════════════════════════
   ★ 줌 17 컴팩트 모드 (2026-07-12) — 아파트/오피스텔만 「금액」 단독 표시
   - JS(bot_map_p3.js AptMarkerOverlay.draw)가 z<18 일 때 .mk-apt--z17 토글
   - 빌라/건물 마커는 기존 풀 카드 유지 (:not 으로 제외)
   - 테두리 전체를 유형색으로: 아파트=보라(--type-apt), 오피스텔=하늘(--type-officetel)
   ═══════════════════════════════════════════════════════ */
.mk-apt.mk-apt--z17:not(.villa):not(.building) {
    padding:3px 5px 2px;    /* 하단 4→2px, 좌우 9→5px (2026-07-12 사용자 조정) */
    border:1.5px solid var(--type-apt);
    border-left-width:3px;
    border-radius:12px;
}
.mk-apt.mk-apt--z17.officetel:not(.villa):not(.building) {
    border-color:var(--type-officetel);
}
.mk-apt.mk-apt--z17:not(.villa):not(.building) .mk-apt__name,
.mk-apt.mk-apt--z17:not(.villa):not(.building) .mk-apt__ic-top { display:none; }
/* 가격 1줄 + (면적·거래타입) 2줄 — block 스택 (2026-07-12)
   ★ flex-wrap 은 width:max-content 가 「줄바꿈 전 한 줄」 기준으로 계산돼 너비가 넓게 남음
     → block + inline 스택으로 바꿔 가장 긴 줄에 딱 맞게 */
.mk-apt.mk-apt--z17:not(.villa):not(.building) .mk-apt__price-row { margin-top:0; display:block; }
/* 금액 — 기존 13px 에서 살짝 축소, 단독 줄. 아랫줄(면적·거래타입)과의 간격 -5px (2026-07-12 사용자 조정) */
.mk-apt.mk-apt--z17:not(.villa):not(.building) .mk-apt__price { font-size:11.5px; display:block; margin-bottom:-5px; }
/* 면적·거래타입 — 작게, 글자색은 18레벨(기존 규칙) 그대로 상속 */
.mk-apt.mk-apt--z17:not(.villa):not(.building) .mk-apt__area { font-size:8px; margin-right:4px; }
.mk-apt.mk-apt--z17:not(.villa):not(.building) .mk-apt__deal { font-size:7.5px; padding:0.5px 3px; display:inline-block; }
/* 선택(다크 카드) 시에도 유형색 테두리 유지 */
.mk-apt.mk-apt--z17.selected:not(.villa):not(.building) { border-color:var(--type-apt); }
.mk-apt.mk-apt--z17.selected.officetel:not(.villa):not(.building) { border-color:var(--type-officetel); }

/* ═══════════════════════════════════════════════════════
   ★ 건물 마커 (mk-bld) — 상업업무용 실거래/매물 · 「금액만」 강렬 핀
   아파트 마커(흰 카드)와 완전히 다른 모양: 솔리드 그라데이션 알약 + 흰 테두리 + 꼬리
   ═══════════════════════════════════════════════════════ */
/* 컨테이너: 알약 + 꼬리를 세로로 쌓아 element 바닥(꼬리 끝)이 좌표점이 되게 (오버레이 translate -100%)
   ★ 흰 테두리는 개별 border 대신 컨테이너 drop-shadow 로 — 알약+꼬리(겹쳐 하나의 도형)의
     바깥 윤곽을 따라 흰선이 끊김 없이 이어진다(말풍선+포인터 한 덩어리). */
.mk-bld {
    position:absolute; display:flex; flex-direction:column; align-items:center;
    cursor:pointer; z-index:6; --bldc:#E03131;   /* 변형별 색 (기본 레드=통매매) */
    filter:
        drop-shadow( 1.6px 0 0 #fff) drop-shadow(-1.6px 0 0 #fff)
        drop-shadow(0  1.6px 0 #fff) drop-shadow(0 -1.6px 0 #fff)
        drop-shadow(0 3px 5px rgba(0,0,0,.30));
}
.mk-bld__price {
    padding:5px 12px; border-radius:16px; line-height:1; white-space:nowrap;
    background:var(--bldc); color:#fff; font-weight:900; font-size:14px; letter-spacing:.01em;
    -webkit-font-smoothing:antialiased;
}
.mk-bld__tail {   /* 알약 아래로 이어지는 꼬리(삼각형) — 알약 바닥과 겹쳐 한 도형, 끝이 좌표점 */
    width:0; height:0; margin-top:-2px;
    border-left:7px solid transparent; border-right:7px solid transparent;
    border-top:9px solid var(--bldc);
}
.mk-bld:hover .mk-bld__price, .mk-bld:hover .mk-bld__tail { filter:brightness(1.08); }
/* 색 구분: 실거래·통매매(whole) = 레드(기본) / 실거래·상가호수(unit) = 보라 / 매물 = 블루 */
.mk-bld.is-real.is-unit { --bldc:#7C3AED; }
.mk-bld.is-sale          { --bldc:#0EA5E9; }

/* ═══════════════════════════════════════════════════════
   ★ 겹친 단지 선택 레이어 (iw-aptsel) — 「이 위치의 단지 N곳」 (2026-07-02)
   같은 좌표에 아파트+오피스텔 등 복수 단지 마커 겹침 시 IW 전에 표시
   ═══════════════════════════════════════════════════════ */
.iw-apt.iw-aptsel {
    width:auto; min-width:232px; max-width:300px;
    padding:10px 10px 9px;
}
.iw-aptsel__head { display:flex; align-items:center; justify-content:space-between; padding:0 2px 8px; }
.iw-aptsel__title { font-size:13px; font-weight:800; color:#1A1620; }
.iw-aptsel__title i { color:#6E47D1; margin-right:4px; font-size:12px; }
.iw-aptsel__close {
    width:24px; height:24px; border:0; background:transparent; color:#8B8696;
    font-size:14px; cursor:pointer; border-radius:6px;
    display:flex; align-items:center; justify-content:center;
    pointer-events:auto !important; position:relative; z-index:1;
}
.iw-aptsel__close:hover { background:#F1F3F5; color:#1A1620; }
.iw-aptsel__list { display:flex; flex-direction:column; gap:4px; max-height:264px; overflow-y:auto; padding:4px 2px 3px; }
.iw-aptsel__row {
    display:flex; align-items:center; gap:8px;
    width:100%; text-align:left; border:1px solid rgba(26,22,32,.07);
    background:#FAFAFB; border-radius:9px; padding:8px 9px;
    cursor:pointer; transition:background .15s, border-color .15s, transform .15s;
    font-family:inherit; letter-spacing:inherit;
    pointer-events:auto !important; position:relative; z-index:1;
}
.iw-aptsel__row:hover { background:#F3EFFC; border-color:#6E47D1; transform:translateY(-1px); }
.iw-aptsel__kind {
    flex-shrink:0; font-size:10px; font-weight:800; padding:3px 7px; border-radius:6px;
    background:#EFE9FB; color:#6E47D1; line-height:1.3; white-space:nowrap;
}
.iw-aptsel__kind.officetel { background:#E3F4FD; color:#0284C7; }
.iw-aptsel__kind.villa     { background:#E2F5F2; color:#1E8578; }
.iw-aptsel__kind.building  { background:#FFF3DE; color:#B26F00; }
.iw-aptsel__kind.place     { background:#FDEBF3; color:#C44A85; }   /* ★ 플레이스·카테고리 업체 (통합 겹침 레이어, 2026-07-05) */
.iw-aptsel__body { flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; }
.iw-aptsel__name { font-size:12.5px; font-weight:700; color:#1A1620; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.iw-aptsel__meta { font-size:10.5px; font-weight:600; color:#8B8696; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.iw-aptsel__arrow { flex-shrink:0; font-size:10px; color:#C3BECE; }

/* ═══════════════════════════════════════════════════════
   ★ 아파트 인포윈도우 (iw-apt) — IW2 사진제거 + 화살표 + 3-btn CTA
   ═══════════════════════════════════════════════════════ */
.iw-apt {
    width:330px; position:relative; background:#fff;     /* 280px → 300px → 330px */
    border-radius:14px; overflow:visible;
    box-shadow:0 12px 32px rgba(26,22,32,.18);
    border:1px solid rgba(26,22,32,.08);
    font-family:'Pretendard',-apple-system,BlinkMacSystemFont,'Malgun Gothic','맑은 고딕',sans-serif;
    color:#1A1620; letter-spacing:-0.02em; -webkit-font-smoothing:antialiased;
    z-index:999999;                                       /* ★ 모든 마커 위 */
}

/* 네이버 InfoWindow 의 외부 래퍼(.iw-apt 의 직계 부모만) — 같은 floatPane 안의 마커와 충돌 방지
   ★ 주의: 전체 조상 (:has(.iw-apt)) 까지 매치하면 #mapPage, .container 등에도 z-index 가 박혀
            controlLayer/miniMap/search bar 가 스택컨텍스트 충돌로 시각적으로 가려짐 → 그래서 직계 부모만 매치 */
:has(> .iw-apt) { z-index:999999 !important; }
/* iw-apt 의 첫 자식(body) border-radius 보전을 위해 .iw-apt__body, .iw-apt__cta 직접 그리기 */

/* 끊김없이 이어지는 화살표 — 2겹 pseudo-element (외곽 border 색 + 안쪽 흰색) */
.iw-apt::before {
    content:''; position:absolute; left:50%; bottom:-11px; transform:translateX(-50%);
    width:0; height:0; border-style:solid; border-width:11px 11px 0 11px;
    border-color:rgba(26,22,32,.08) transparent transparent transparent;
    z-index:0;
}
.iw-apt::after {
    content:''; position:absolute; left:50%; bottom:-9.5px; transform:translateX(-50%);
    width:0; height:0; border-style:solid; border-width:10px 10px 0 10px;
    border-color:#fff transparent transparent transparent;
    z-index:1;
}
.iw-apt__body { padding:14px 16px; }
.iw-apt__body::after { content:''; display:block; clear:both; }
.iw-apt__name-row { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:3px; }
.iw-apt__name { flex:1; min-width:0; font-size:15px; font-weight:900; color:#1A1620; line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.iw-apt__area-inline { font-size:11px; font-weight:700; color:#8B8696; margin-left:4px; }
.iw-apt__wish-btn { background:none; border:none; padding:2px; cursor:pointer; color:#8B8696; font-size:17px; display:inline-flex; align-items:center; justify-content:center; transition:color .15s, transform .15s; flex-shrink:0; }
.iw-apt__wish-btn:hover { color:#E5604C; transform:scale(1.1); }
.iw-apt__wish-btn.is-on { color:#E5604C; }
.iw-apt__addr { font-size:10.5px; color:#8B8696; margin-bottom:10px; }
.iw-apt__price-row { display:flex; align-items:center; gap:8px; }
.iw-apt__price { font-size:20px; font-weight:900; color:#6E47D1; }
.iw-apt__type-tag { display:inline-flex; align-items:center; gap:3px; padding:1px 6px; background:#F4EEFE; color:#6E47D1; border-radius:4px; font-size:10px; font-weight:800; letter-spacing:.02em; line-height:1.45; }
.iw-apt__type-tag i { font-size:9px; }
.iw-apt__type-tag.officetel { background:#E0F2FE; color:#0EA5E9; }
.iw-apt__type-tag.villa     { background:#E6F7F5; color:#2DA89B; }
.iw-apt__type-tag.building  { background:#FFF6E6; color:#DB8B00; }
.iw-apt__type-tag.real      { background:#F1F3F5; color:#6B7280; }
.iw-apt__sub { font-size:11px; color:#4A4458; margin-top:3px; }
.iw-apt__sub--meta {
    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:wrap;
}
.iw-apt__sub--meta .iw-apt__type-tag {
    margin-left:0;
}
.iw-apt__pyung { color:#4A4458; font-weight:700; }
.iw-apt__no-deal { color:#94A3B8; }
.iw-apt__side-banner {
    float:right;
    width:116px;
    aspect-ratio:2 / 1;
    margin:8px 0 6px 10px;
    border:1px solid rgba(110,71,209,.18);
    border-radius:0;
    overflow:hidden;
    background:#F8F7FC;
    box-sizing:border-box;
}
.iw-apt__side-banner-link {
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:100%;
    color:#8B8696;
    font-size:10px;
    font-weight:800;
    text-decoration:none;
    background:#F8F7FC;
}
.iw-apt__side-banner-link img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    margin:0 !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
}
.iw-apt__deal-stats { clear:both; }

/* ★ 가격 옆 면적 (실거래가 기준) — 가격과 시각적 균형 (2026-05-31 실데이터 전환) */
.iw-apt__price-row .iw-apt__area-inline {
    font-size: 12.5px; font-weight: 800; color: #4A4458;
    margin-left: 0; padding: 2px 7px; background:#F4F1FA; border-radius:4px;
    letter-spacing:-.02em;
}

/* ★ 세대수 강조 칩 — 제목 행 바로 아래 (2026-06-01 인포윈도우 정리) */
.iw-apt__hhld-row { margin: 4px 0 8px; }
.iw-apt__hhld-chip {
    display:inline-flex; align-items:center; gap:5px;
    padding: 4px 10px; background: linear-gradient(135deg, #F5F3FF, #EDE9FE);
    border:1px solid #DDD6FE; border-radius:14px;
    font-size:11.5px; font-weight:700; color:#5B21B6; letter-spacing:-.02em;
}
.iw-apt__hhld-chip i { font-size:10px; color:#7C3AED; }
.iw-apt__hhld-chip b { font-size:13px; font-weight:900; color:#4C1D95; letter-spacing:-.03em; margin: 0 1px; }

/* ★ 건축물대장 정보 행 (2026-06-01 v3)
   - 각 칩을 inline-flex wrapper 로 감싸서 vertical-center 보장
   - 아이콘↔글자, 숫자↔단위 모두 최소 간격 (1px 이내) */
.iw-apt__bldg {
    display:flex; flex-wrap:wrap; align-items:center;
    gap:4px;                                       /* 칩 간 간격 (구분점 양옆 여유) */
    margin-top:8px; padding:7px 9px;
    background:#F8FAFC; border:1px solid #E5E7EB; border-radius:6px;
    font-size:11px; font-weight:700; color:#475569;
    line-height:1.3;
    letter-spacing:-.02em;
}

/* 한 개의 칩 (아이콘 + 글자) — inline-flex 로 수직 중앙 정렬 */
.iw-apt__bldg-item {
    display:inline-flex;
    align-items:center;                            /* ★ 아이콘 글자 같은 높이 */
    gap:0;                                         /* ★ 아이콘-글자 간격 0 */
    line-height:1.3;
    white-space:nowrap;
}
/* 아이콘 — 글자와 동일 폰트 사이즈로 sizing, 적절한 breathing */
.iw-apt__bldg-item i {
    color:#6E47D1;
    font-size:10.5px;
    line-height:1;
    margin:0 4px 0 0;                              /* ★ 아이콘 우측 4px (글자와 적절한 간격) */
    padding:0;
    width:auto;
    display:inline-flex;
    align-items:center;
}
/* 숫자 강조 (b) — 자체 letter-spacing 으로 더 압축, 단위(세대) 와 간격 0 */
.iw-apt__bldg-item b {
    font-weight:900;
    color:#5B21B6;
    letter-spacing:-.04em;
    margin:0;
    padding:0 0 0 0;
}
/* 단위 텍스트 (.t) — 기본은 아이콘 옆에 붙음 (아이콘 자체 margin-right 가 간격 처리) */
.iw-apt__bldg-item .t {
    letter-spacing:-.02em;
    margin-left:0;
}
/* ★ 숫자 b 직후 따라오는 .t (= "990세대" 의 "세대") 에만 2px 간격 */
.iw-apt__bldg-item b + .t {
    margin-left:2px;
}

/* 칩 사이 구분점 · — 별도 span 으로 분리해서 일관된 톤 */
.iw-apt__bldg-sep {
    color:#94A3B8;
    font-weight:600;
    margin:0 1px;
    line-height:1;
    user-select:none;
}

/* 거래 통계 칩 (실거래/매매/전세/월세) — 한 줄 유지 (nowrap) */
.iw-apt__deal-stats { display:flex; flex-wrap:nowrap; justify-content:space-between; gap:4px; padding-top:10px; margin-top:10px; border-top:1px solid rgba(26,22,32,.08); }
.iw-apt__deal-stat { display:inline-flex; align-items:baseline; gap:3px; padding:2px 7px; border-radius:999px; font-size:10px; font-weight:700; line-height:1.45; white-space:nowrap; flex-shrink:0; }
.iw-apt__deal-stat .lbl { font-weight:800; letter-spacing:-.02em; }
.iw-apt__deal-stat .num { font-weight:900; font-size:10.5px; }
/* 실거래 = 보라 강조(상세 헤더 태그와 통일) · 매매/전세/월세 = 색 구분 (2026-06-13) */
.iw-apt__deal-stat.real   { background:#6E47D1; color:#fff; }
.iw-apt__deal-stat.real .num { color:#fff; }
.iw-apt__deal-stat.sale   { background:#FFEDE9; color:#E5604C; }
.iw-apt__deal-stat.jeonse { background:#EBF0FF; color:#3D5AFE; }
.iw-apt__deal-stat.wolse  { background:#FFF6E6; color:#DB8B00; }

/* 파트너 추천 박스 4개 (2x2 그리드, 메인 CTA ↔ 보조 CTA 사이) */
.iw-apt__partners { display:grid; grid-template-columns:1fr 1fr; gap:6px; padding:0 16px 10px; }
/* ★ 버스 정류장 IW — 파트너 광고 「위」 여백 확보 (2026-07-09 사용자 요청):
   hover 시 translateY(-1px)+box-shadow 로 뜨는 광고 상단 외곽선이 윗 컨텐츠에 가려지던 문제 → 상단 패딩으로 분리 */
.k1-bus-iw .iw-apt__partners { padding-top:9px; overflow:visible; }
.iw-apt__partners.has-rotator {
    display:block;
    padding:0 16px 10px;
    overflow:hidden;
}
/* ★ 모바일 (2026-07-03): 미니배너 최종높이 = 1줄 로테이터(48px)인데 초기 placeholder 가
   2줄(102px)로 렌더 → 배너 로드 후 IW 가 54px 축소되며 네이버 IW top 고정 특성상
   말풍선+꼬리가 클릭점 위로 떠오름. 초기 placeholder 도 1줄로 예약해 시프트 자체를 제거. */
@media (max-width: 768px) {
    .iw-apt__partners:not(.has-rotator) > .iw-apt__partner:nth-child(n+3) { display: none; }
}
.iw-partner-rotator {
    position:relative;
    width:100%;
    overflow:hidden;
}
.iw-partner-rotator__track {
    display:flex;
    flex-direction:column;
    gap:6px;
    transform:translateY(0);
    will-change:transform;
}
.iw-partner-rotator__track.is-moving {
    transition:transform .56s cubic-bezier(.22, 1, .36, 1);
}
.iw-partner-row {
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
    gap:6px;
    min-height:48px;
}
.iw-partner-row .iw-apt__partner {
    min-width:0;
}
/* 2026-06-01 v3: vc-partner 후순위 CSS(estate_view_complex.php) 가 덮어쓰는 이슈 해결
   → compound selector (.iw-apt__partner.vc-partner) + !important 로 specificity 확보 */
.iw-apt__partner, .iw-apt__partner.vc-partner {
    min-width:0;
    display:flex !important;
    align-items:stretch !important;                       /* ★ 이미지가 박스 높이 가득 */
    gap:0 !important;                                     /* ★ 이미지-텍스트 사이 갭 제거 (이미지가 박스 끝까지) */
    padding:0 !important;                                 /* ★ 사방 패딩 제거 → 이미지가 모서리 4면 모두 끝까지 */
    background:#FAFBFC;
    border:1px solid rgba(26,22,32,.08);
    border-radius:8px;
    text-decoration:none; color:inherit;
    transition:all .15s;
    cursor:pointer;
    box-shadow:0 1px 2px rgba(26,22,32,.03) !important;
    overflow:hidden !important;                           /* 둥근 모서리 클립 */
    min-height:48px !important;                           /* 이미지 + 2줄 텍스트 최소 높이 */
}
.iw-apt__partner:hover, .iw-apt__partner.vc-partner:hover {
    background:#fff;
    border-color:rgba(110,71,209,.4);
    box-shadow:0 3px 8px rgba(110,71,209,.12) !important;
    transform:translateY(-1px);
}
.iw-apt__partner-img, .iw-apt__partner-img.vc-partner-img {
    width:48px !important;                                /* ★ 30/34 → 48 (50%+ 키움) */
    height:auto !important;                               /* 부모 stretch 따라 박스 가득 */
    flex-shrink:0;
    border-radius:0 !important;                           /* 박스 모서리에 정확히 맞춤 (overflow:hidden 으로 자연스럽게 둥글림) */
    background:linear-gradient(135deg,#6E47D1,#8260DF);
    color:#fff;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:14px;
    box-shadow:none !important;                           /* 박스 안 인라인이므로 그림자 X */
    overflow:hidden !important;
    padding:0 !important;                                 /* 인라인 style padding 도 덮어씀 */
}
/* loadPartnerBanners 가 inline style 박아도 img 가 부모 가득 차도록 강제 */
.iw-apt__partner-img > img,
.iw-apt__partner-img.vc-partner-img > img {
    width:100% !important; height:100% !important;
    object-fit:cover !important; display:block !important;
    border-radius:0 !important;
    margin:0 !important; padding:0 !important;
}
.iw-apt__partner-txt, .iw-apt__partner-txt.vc-partner-txt {
    flex:1 !important; min-width:0 !important;
    display:flex !important; flex-direction:column !important;
    gap:1px; justify-content:center !important;
    line-height:1.2;
    padding:6px 9px !important;                           /* 텍스트 영역만 좌우 9px + 위아래 6px */
}
.iw-apt__partner-cat {
    font-size:9px; font-weight:700; color:#8B8696;
    letter-spacing:-.01em;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.iw-apt__partner-name {
    font-size:11.5px; font-weight:900; color:#1A1620;
    letter-spacing:-.02em;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* CTA — 메인은 풀폭 primary, 보조는 자동너비 outline */
.iw-apt__cta { display:flex; gap:6px; padding:0 16px 14px; flex-wrap:wrap; }
.iw-apt__cta--nav { padding-top:0; gap:6px; }
.iw-apt__btn { padding:9px 14px; text-align:center; font-size:11.5px; font-weight:800; border-radius:8px; cursor:pointer; transition:all .15s; user-select:none; white-space:nowrap; text-decoration:none; display:inline-block; }
a.iw-apt__btn, a.iw-apt__btn:visited, a.iw-apt__btn:hover, a.iw-apt__btn:active { text-decoration:none; }
.iw-apt__btn.primary { flex:1; background:#6E47D1; color:#fff; border:1.5px solid #6E47D1; }
.iw-apt__btn.primary:hover { background:#5A37B8; }
.iw-apt__btn.outline { background:#fff; border:1.5px solid #6E47D1; color:#6E47D1; padding:5px 8px; font-size:10.5px; }
.iw-apt__btn.outline:hover { background:#F4EEFE; }
a.iw-apt__btn.outline, a.iw-apt__btn.outline:visited { color:#6E47D1; }

/* ═══════════════════════════════════════════════════════
   ★ 지하철역 인포윈도우 (.iw-station) — iw-apt 베이스 + 역 전용 확장
   ═══════════════════════════════════════════════════════ */
.iw-station .iw-apt__name { color:#1A1620; }
.iw-station .iw-apt__price { display:none; }   /* 가격 자리 → 호선/환승 칩으로 대체 */
.iw-station .iw-apt__type-tag { background:#E8F0FE; color:#1A6DFF; }

/* 호선 배지 (1~9호선/신분당 등) — 1호선 진청, 2호선 그린, 3호선 주황 등 색 매핑 */
.iw-station__lines { display:flex; flex-wrap:wrap; gap:4px; margin-top:2px; }
.iw-station__line-badge {
    display:inline-flex; align-items:center; justify-content:center;
    min-width:22px; height:22px; padding:0 7px;
    border-radius:999px;
    font-size:10.5px; font-weight:900; color:#fff;
    letter-spacing:-.02em; line-height:1;
    box-shadow:0 1px 2px rgba(0,0,0,.12);
}
.iw-station__line-badge.l1 { background:#0052A4; }   /* 1호선 진청 */
.iw-station__line-badge.l2 { background:#00A84D; }   /* 2호선 그린 */
.iw-station__line-badge.l3 { background:#EF7C1C; }   /* 3호선 주황 */
.iw-station__line-badge.l4 { background:#00A4E3; }   /* 4호선 하늘 */
.iw-station__line-badge.l5 { background:#996CAC; }   /* 5호선 보라 */
.iw-station__line-badge.l6 { background:#CD7C2F; }   /* 6호선 갈색 */
.iw-station__line-badge.l7 { background:#747F00; }   /* 7호선 올리브 */
.iw-station__line-badge.l8 { background:#E6186C; }   /* 8호선 핑크 */
.iw-station__line-badge.l9 { background:#BDB092; }   /* 9호선 황금 */
.iw-station__line-badge.bd { background:#D31145; }   /* 분당선 */
.iw-station__line-badge.sb { background:#D4003B; }   /* 신분당선 */
.iw-station__line-badge.gj { background:#0CB2A4; }   /* 경춘선 */
.iw-station__line-badge.gi { background:#77C4A3; }   /* 경의중앙 */
.iw-station__line-badge.ai { background:#0090D2; }   /* 공항철도 */
.iw-station__line-badge.gx { background:#9F00C5; }   /* GTX */
.iw-station__line-badge.etc{ background:#5B6975; }   /* 기타/미지정 */

/* 시설 가용성 칩 (환승/주차장/지하상가) */
.iw-station__facilities { display:flex; flex-wrap:wrap; gap:5px; margin-top:8px; padding-top:8px; border-top:1px dashed rgba(26,22,32,.10); }
.iw-station__fac {
    display:inline-flex; align-items:center; gap:4px;
    padding:3px 8px; border-radius:999px;
    font-size:10.5px; font-weight:800; line-height:1.45;
    border:1px solid;
}
.iw-station__fac i { font-size:9px; }
.iw-station__fac.on  { color:#0EA5E9; background:#E0F2FE; border-color:rgba(14,165,233,.25); }
.iw-station__fac.off { color:#9CA3AF; background:#F3F4F6; border-color:rgba(156,163,175,.25); }
.iw-station__fac.off i { opacity:.6; }

/* ═══════════════════════════════════════════════════════
   플레이스(a_place) 인포윈도우 (.iw-place) — 부동산 톤 재사용
   ═══════════════════════════════════════════════════════ */
.iw-place {
    width:350px; position:relative; background:#fff;
    border-radius:14px; overflow:visible;
    box-shadow:0 12px 32px rgba(26,22,32,.18);
    border:1px solid rgba(26,22,32,.08);
    font-family:'Pretendard',-apple-system,BlinkMacSystemFont,'Malgun Gothic','맑은 고딕',sans-serif;
    color:#1A1620; letter-spacing:-0.02em; -webkit-font-smoothing:antialiased;
    z-index:999999;
}
.iw-place::before {
    content:''; position:absolute; left:50%; bottom:-11px; transform:translateX(-50%);
    width:0; height:0; border-style:solid; border-width:11px 11px 0 11px;
    border-color:rgba(26,22,32,.08) transparent transparent transparent; z-index:0;
}
.iw-place::after {
    content:''; position:absolute; left:50%; bottom:-9.5px; transform:translateX(-50%);
    width:0; height:0; border-style:solid; border-width:10px 10px 0 10px;
    border-color:#fff transparent transparent transparent; z-index:1;
}
/* 사진 영역 제거됨 (사용자 요청) */
.iw-place__body { position:relative; min-height:152px; padding:14px 16px 8px; box-sizing:border-box; }
.iw-place__name-row { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; margin-bottom:6px; }
.iw-place__name { flex:1; min-width:0; font-size:16px; font-weight:900; color:#1A1620; line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.iw-place__title-main { flex:1; min-width:0; display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.iw-place__title-main .iw-place__name { flex:0 1 auto; max-width:180px; }
.iw-place__title-tags { display:flex; align-items:center; gap:3px; flex-wrap:wrap; min-width:0; }
.iw-place .iw-apt__side-banner {
    float:none;
    position:absolute;
    right:16px;
    top:82px;
    width:116px;
    margin:0;
}
.iw-place__wish-btn { background:none; border:none; padding:2px; cursor:pointer; color:#8B8696; font-size:17px; display:inline-flex; align-items:center; justify-content:center; transition:color .15s,transform .15s; flex-shrink:0; }
.iw-place__wish-btn:hover { color:#E5604C; transform:scale(1.1); }
.iw-place__wish-btn.is-on { color:#E5604C; }

/* chips (등급/타입/카테고리) + tags 한 줄 — 좌측 chips, 우측 tags */
.iw-place__row-chips-tags { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:7px; flex-wrap:wrap; }
.iw-place__chips { display:flex; flex-wrap:wrap; gap:4px; }
.iw-place__tags  { display:flex; flex-wrap:wrap; gap:3px; justify-content:flex-end; }

.iw-place__grade { display:inline-flex; align-items:center; padding:2px 8px; border-radius:999px; font-size:10px; font-weight:800; letter-spacing:.02em; line-height:1.5; border:1px solid; }
.iw-place__grade.best    { color:#fff;     background:#6E47D1; border-color:#6E47D1; }
.iw-place__grade.cand    { color:#6E47D1; background:#F4EEFE; border-color:rgba(110,71,209,.25); }
.iw-place__grade.partner { color:#fff;     background:#2DA89B; border-color:#2DA89B; }
.iw-place__grade.norm    { color:#4A4458; background:#fff;    border-color:rgba(26,22,32,.08); }
.iw-place__type { display:inline-flex; align-items:center; padding:2px 8px; border-radius:4px; font-size:10.5px; font-weight:800; background:#FFEDE9; color:#E5604C; }
.iw-place__cate { display:inline-flex; align-items:center; padding:2px 8px; border-radius:4px; font-size:10.5px; font-weight:700; background:#F1F3F5; color:#4A4458; }
.iw-place__addr { max-width:calc(100% - 132px); font-size:11px; color:#8B8696; margin-bottom:6px; line-height:1.4; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.iw-place__sub { max-width:calc(100% - 132px); font-size:12.5px; color:#4A4458; line-height:1.55; margin-bottom:8px; font-weight:600; }
.iw-place__why { padding:8px 10px; background:#FAFBFC; border-left:3px solid #6E47D1; border-radius:6px; font-size:11.5px; color:#4A4458; line-height:1.55; margin-bottom:8px; word-break:keep-all; }
.iw-place__why i.fa-quote-left { color:#6E47D1; opacity:.5; font-size:9px; margin-right:3px; }
.iw-place__tag { font-size:9.5px; font-weight:700; color:#6E47D1; background:#F4EEFE; padding:2px 7px; border-radius:999px; line-height:1.5; }

/* 메인 CTA 자리 → 얇은 보라 1px 라인 */
.iw-place__divider { height:1px; background:#6E47D1; margin:8px 16px 10px; }

/* 전화걸기 버튼 — outline 톤 + 코랄 강조 */
.iw-apt__btn--tel { color:#E5604C !important; border-color:#E5604C !important; text-decoration:none; }
.iw-apt__btn--tel:hover { background:#FFEDE9 !important; }
.iw-apt__btn--tel i { font-size:10px; margin-right:2px; }

/* 플레이스 마커 selected 상태 (색상반전 / 클릭 시 시각 피드백) */
.tspl-place-marker--selected { z-index:9998 !important; }
.tspl-place-marker--selected .tspl-place-marker__box {
    box-shadow:0 0 0 3px rgba(110,71,209,.35), 0 8px 20px rgba(26,22,32,.22) !important;
    transform:scale(1.05);
}

.tspl-place-marker--massage .tspl-place-marker__box,
.tspl-place-marker.is-active.tspl-place-marker--massage .tspl-place-marker__box {
    background:linear-gradient(135deg,#C43D7D 0%,#A91F62 100%) !important;
    border-color:#8E174F !important;
    color:#fff !important;
    box-shadow:0 8px 22px rgba(169,31,98,.34) !important;
}
.tspl-place-marker--massage .tspl-place-marker__type,
.tspl-place-marker.is-active.tspl-place-marker--massage .tspl-place-marker__type {
    color:rgba(255,255,255,.82) !important;
    background:rgba(255,255,255,.18) !important;
    border-radius:999px !important;
    padding:1px 5px !important;
}
.tspl-place-marker--massage .tspl-place-marker__title,
.tspl-place-marker.is-active.tspl-place-marker--massage .tspl-place-marker__title {
    color:#fff !important;
}
.tspl-place-marker--massage .tspl-place-marker__arrow,
.tspl-place-marker.is-active.tspl-place-marker--massage .tspl-place-marker__arrow {
    border-top-color:#8E174F !important;
}
.tspl-place-marker--massage .tspl-place-marker__arrow::after,
.tspl-place-marker.is-active.tspl-place-marker--massage .tspl-place-marker__arrow::after {
    display:none !important;
}

/* ★ 인포윈도우 안 버튼 클릭 보장 — 좌측 패널이 위에 떠도 클릭 정상 동작
   - position:relative + z-index 로 자체 stacking context 우선
   - pointer-events:auto !important — 부모에 none 적용된 케이스 차단 */
.iw-apt, .iw-place { pointer-events:auto !important; }
.iw-apt__cta, .iw-apt__cta--nav { position:relative; z-index:1; pointer-events:auto !important; }
.iw-apt__btn { position:relative; pointer-events:auto !important; }
button.iw-apt__btn { font-family:inherit; }   /* button 기본 폰트 ↦ Pretendard 통일 */

/* 보조 CTA 끝의 닫기(X) 버튼 — 작은 아이콘 버튼, 맨 오른쪽 정렬 */
.iw-apt__close {
    flex-shrink:0;
    margin-left:auto;                       /* ★ 맨 오른쪽으로 push */
    width:26px; height:26px;                /* 32 → 26 (다른 outline 버튼 padding:5px 8px 와 높이 맞춤) */
    padding:0;
    background:#fff;
    border:1.5px solid rgba(26,22,32,.15);
    border-radius:8px;
    color:#8B8696;
    font-size:11px;                          /* 13 → 11 */
    display:inline-flex; align-items:center; justify-content:center;
    cursor:pointer;
    transition:all .15s;
}
.iw-apt__close:hover {
    background:#FFEDE9;
    border-color:#E5604C;
    color:#E5604C;
}
.iw-apt__close i { font-size:11px; line-height:1; }

/* ═══════════════════════════════════════════════════════
   테마/필터 토글 버튼 + 테마 박스 (구 miniMap 교체)
   - 화살표 왼쪽에 "테마 | 필터" 라벨
   - 클릭 시 #miniMap (이제 theme-box) 토글
   - 테마 칩 그리드
   ═══════════════════════════════════════════════════════ */

/* 기존 위치 강제 override — JS 가 'top:10/90/115px' 같은 inline 을 박지만 우리 디자인에선 더 위쪽으로 */
#toggleButtonMini {
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    z-index: 200 !important;           /* InfoWindow (z-index:999999) 보다 아래 — 인포윈도우가 최상단 */
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    padding: 7px 12px !important;
    background: #fff !important;
    border: 1px solid #ECECEC !important;
    border-radius: 22px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.02) !important;
    cursor: pointer;
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 13px !important;
    color: #1A1620 !important;
    letter-spacing: -0.02em;
    white-space: nowrap;
    width: auto !important;
    height: auto !important;
}
/* 모바일: 오른쪽 메뉴 레이어 토글 화살표와 동일한 y 좌표
   - layerToggleButton 은 top:90 고정, controlLayer 는 그 아래에서 시작 */
@media (max-width: 1023px) {
    #layerToggleButton {
        top: 90px !important;
        right: 10px !important;
        margin-top: 0 !important;
    }
    #controlLayer {
        top: 126px !important;
        right: 10px !important;
        margin-top: 0 !important;
        max-height: calc(100dvh - 150px) !important;
        padding-bottom: 150px !important;
        scroll-padding-bottom: 150px;
    }
    #toggleButtonMini {
        top: 90px !important;
    }
}
#toggleButtonMini:hover { box-shadow: 0 4px 12px rgba(110, 71, 209, 0.15), 0 0 0 1px rgba(110, 71, 209, 0.10) !important; }

/* ═══ 재개발/재건축 토글 — 「테마|필터|맵관리」 바로 아래 좌측 정렬 (2026-07-06) ═══ */
#redevMapToggleBtn {
    position: absolute;
    top: 52px;                          /* 테마 버튼(top:10, h~34) 바로 아래 */
    left: 10px;
    z-index: 200;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    background: #fff;
    border: 1px solid #ECECEC;
    border-radius: 22px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.02);
    cursor: pointer;
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    color: #1A1620;
    letter-spacing: -0.02em;
    white-space: nowrap;
}
#redevMapToggleBtn i { font-size: 12px; color: #E85A24; }
#redevMapToggleBtn:hover { box-shadow: 0 4px 12px rgba(232,90,36,0.18), 0 0 0 1px rgba(232,90,36,0.12); }
#redevMapToggleBtn.active {
    background: linear-gradient(135deg, #E85A24 0%, #FF8A50 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 3px 12px rgba(232,90,36,0.35);
}
#redevMapToggleBtn.active i { color: #fff; }
@media (max-width: 1023px) {
    #redevMapToggleBtn {
        top: 132px;                     /* 모바일: 테마 버튼(top:90) 아래 */
        left: 10px;
        padding: 6px 10px;
        font-size: 11.5px;
    }
}

/* ═══ 개발지구 토글 — 재개발 버튼 바로 아래 (2026-07-12 사용자 재지정) ═══ */
#zoneMapToggleBtn {
    position: absolute;
    top: 88px;                          /* 재개발 버튼(top:52, h~32) 아래 */
    left: 10px;
    z-index: 200;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    background: #fff;
    border: 1px solid #ECECEC;
    border-radius: 22px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.02);
    cursor: pointer;
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    color: #1A1620;
    letter-spacing: -0.02em;
    white-space: nowrap;
}
#zoneMapToggleBtn i { font-size: 12px; color: #0E9488; }
#zoneMapToggleBtn:hover { box-shadow: 0 4px 12px rgba(14,148,136,0.18), 0 0 0 1px rgba(14,148,136,0.12); }
#zoneMapToggleBtn.active {
    background: linear-gradient(135deg, #0E9488 0%, #14B8A6 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 3px 12px rgba(14,148,136,0.35);
}
#zoneMapToggleBtn.active i { color: #fff; }
@media (max-width: 1023px) {
    #zoneMapToggleBtn {
        top: 132px;                     /* 모바일: 재개발 버튼과 같은 줄 — 실배치는 #k1RowRedev 래퍼(flex)가 담당 (2026-07-12) */
        left: 130px;                    /* (폴백) 래퍼 CSS 의 position:static !important 가 우선 적용됨 */
        padding: 6px 10px;
        font-size: 11.5px;
    }
}

/* ═══ 청약 토글 — 노후도/지적도/위성 줄 아래 (2026-07-12)
   ★ top:124 는 bot_building_age.js 가 주입하는 노후도 버튼(.cg-age-toggle) 자리 — 겹치면 청약/분양이 가려짐 */
#applyMapToggleBtn {
    position: absolute;
    top: 160px;                         /* 노후도 줄(top:124, h~32) 아래 */
    left: 10px;
    z-index: 200;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    background: #fff;
    border: 1px solid #ECECEC;
    border-radius: 22px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.02);
    cursor: pointer;
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    color: #1A1620;
    letter-spacing: -0.02em;
    white-space: nowrap;
}
#applyMapToggleBtn i { font-size: 12px; color: #6E47D1; }
#applyMapToggleBtn:hover { box-shadow: 0 4px 12px rgba(110,71,209,0.18), 0 0 0 1px rgba(110,71,209,0.12); }
#applyMapToggleBtn.active {
    background: linear-gradient(135deg, #6E47D1 0%, #9A6CF0 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 3px 12px rgba(110,71,209,0.35);
}
#applyMapToggleBtn.active i { color: #fff; }
@media (max-width: 1023px) {
    #applyMapToggleBtn {
        top: 198px;                     /* 모바일: 노후도 줄(top:165) 아래 (2026-07-12 한 칸 당김) */
        left: 10px;
        padding: 6px 10px;
        font-size: 11.5px;
    }
}

/* ═══ 분양 토글 — 청약 버튼 옆 (2026-07-12) ═══ */
#saleMapToggleBtn {
    position: absolute;
    top: 160px;                         /* 청약 버튼과 같은 줄 (노후도 줄 아래) */
    left: 88px;                         /* 청약 버튼(w~70) 우측 */
    z-index: 200;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    background: #fff;
    border: 1px solid #ECECEC;
    border-radius: 22px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.02);
    cursor: pointer;
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    color: #1A1620;
    letter-spacing: -0.02em;
    white-space: nowrap;
}
#saleMapToggleBtn i { font-size: 12px; color: #E5604C; }
#saleMapToggleBtn:hover { box-shadow: 0 4px 12px rgba(229,96,76,0.18), 0 0 0 1px rgba(229,96,76,0.12); }
#saleMapToggleBtn.active {
    background: linear-gradient(135deg, #E5604C 0%, #FF8A70 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 3px 12px rgba(229,96,76,0.35);
}
#saleMapToggleBtn.active i { color: #fff; }
@media (max-width: 1023px) {
    #saleMapToggleBtn {
        top: 198px;                     /* 모바일: 청약 버튼과 같은 줄 (노후도 줄 아래) */
        left: 79px;                     /* 청약 버튼(w~62) 우측 */
        padding: 6px 10px;
        font-size: 11.5px;
    }
}

/* ═══ 상권분석 토글 — 청약/분양 줄 아래 (2026-07-12, bot_storebiz.js)
   ★ .k1-map-lbtn 은 공통 CSS 없음 — ID absolute 포지셔닝 필수 (없으면 지도 밑에 깔려 안 보임) ═══ */
#storeBizToggleBtn {
    position: absolute;
    top: 196px;                         /* 청약/분양 줄(top:160, h~32) 아래 */
    left: 10px;
    z-index: 200;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    background: #fff;
    border: 1px solid #ECECEC;
    border-radius: 22px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.02);
    cursor: pointer;
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    color: #1A1620;
    letter-spacing: -0.02em;
    white-space: nowrap;
}
#storeBizToggleBtn i { font-size: 12px; color: #D97706; }
#storeBizToggleBtn:hover { box-shadow: 0 4px 12px rgba(217,119,6,0.18), 0 0 0 1px rgba(217,119,6,0.12); }
#storeBizToggleBtn.active {
    background: linear-gradient(135deg, #D97706 0%, #F59E0B 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 3px 12px rgba(217,119,6,0.35);
}
#storeBizToggleBtn.active i { color: #fff; }
@media (max-width: 1023px) {
    #storeBizToggleBtn {
        top: 231px;                     /* 모바일: 청약/분양 줄(top:198) 아래 */
        left: 10px;
        padding: 6px 10px;
        font-size: 11.5px;
    }
}

/* ═══ 주요상권 토글 — 상권분석 우측 같은 줄 (2026-07-12) ═══ */
#storeZoneToggleBtn {
    position: absolute;
    top: 196px;                         /* 상권분석과 같은 줄 */
    left: 104px;                        /* 상권분석(w~90) 우측 */
    z-index: 200;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    background: #fff;
    border: 1px solid #ECECEC;
    border-radius: 22px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.02);
    cursor: pointer;
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    color: #1A1620;
    letter-spacing: -0.02em;
    white-space: nowrap;
}
#storeZoneToggleBtn i { font-size: 12px; color: #D97706; }
#storeZoneToggleBtn:hover { box-shadow: 0 4px 12px rgba(217,119,6,0.18), 0 0 0 1px rgba(217,119,6,0.12); }
#storeZoneToggleBtn.active {
    background: linear-gradient(135deg, #D97706 0%, #F59E0B 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 3px 12px rgba(217,119,6,0.35);
}
#storeZoneToggleBtn.active i { color: #fff; }
@media (max-width: 1023px) {
    #storeZoneToggleBtn {
        top: 231px;
        left: 98px;                     /* 모바일: 상권분석(w~84) 우측 */
        padding: 6px 10px;
        font-size: 11.5px;
    }
}

/* ═══ 나의분석 토글 — 주요상권 우측 같은 줄 (2026-07-12) ═══ */
#myBizToggleBtn {
    position: absolute;
    top: 196px;
    left: 198px;                        /* 주요상권(w~88) 우측 */
    z-index: 200;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    background: #fff;
    border: 1px solid #ECECEC;
    border-radius: 22px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.02);
    cursor: pointer;
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    color: #1A1620;
    letter-spacing: -0.02em;
    white-space: nowrap;
}
#myBizToggleBtn i { font-size: 12px; color: #7A5AF8; }
#myBizToggleBtn:hover { box-shadow: 0 4px 12px rgba(122,90,248,0.18), 0 0 0 1px rgba(122,90,248,0.12); }
#myBizToggleBtn.active {
    background: linear-gradient(135deg, #7A5AF8 0%, #9F7FFF 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 3px 12px rgba(122,90,248,0.35);
}
#myBizToggleBtn.active i { color: #fff; }
@media (max-width: 1023px) {
    #myBizToggleBtn {
        top: 231px;
        left: 186px;                    /* 모바일: 주요상권(w~82) 우측 */
        padding: 6px 10px;
        font-size: 11.5px;
    }
}

/* ═══ 청약 마커 상태 필터 — 분양 버튼 우측 같은 줄, 청약 토글 ON 시에만 (2026-07-12) ═══ */
#applyStatusFilter {
    position: absolute;
    top: 160px;                         /* 청약/분양 버튼과 같은 줄 */
    left: 161px;                        /* 분양 버튼(~153) 우측 */
    z-index: 200;
    display: none;
    align-items: center;
    gap: 10px;
    padding: 7px 12px;
    background: #fff;
    border: 1px solid #ECECEC;
    border-radius: 22px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.02);
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 11.5px;
    font-weight: 700;
    color: #1A1620;
    letter-spacing: -0.02em;
    white-space: nowrap;
}
#applyStatusFilter.is-on { display: inline-flex; }
#applyStatusFilter label { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }
#applyStatusFilter input { accent-color: #6E47D1; width: 13px; height: 13px; margin: 0; cursor: pointer; }
#applyStatusFilter .dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
@media (max-width: 1023px) {
    #applyStatusFilter {
        top: 198px;                     /* 모바일: 청약/분양 줄 */
        left: 148px;                    /* 분양 버튼(~140) 우측 */
        gap: 7px;
        padding: 6px 9px;
        font-size: 10.5px;
    }
}

/* ✅ 실시간버스 토글 — 개발지구 버튼 바로 아래 (2026-07-08, 줌17+ 화면 내 버스 실시간) */
#busLiveToggleBtn {
    position: absolute;
    top: 124px;                         /* 개발지구 버튼(top:88, h~32) 아래 — 간격 축소 (2026-07-08) */
    left: 10px;
    z-index: 200;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 12px;
    background: #fff;
    border: 1px solid #ECECEC;
    border-radius: 22px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.02);
    cursor: pointer;
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    color: #1A1620;
    letter-spacing: -0.02em;
    white-space: nowrap;
}
#busLiveToggleBtn i { font-size: 12px; color: #DC2626; }
#busLiveToggleBtn:hover { box-shadow: 0 4px 12px rgba(220,38,38,0.18), 0 0 0 1px rgba(220,38,38,0.12); }
#busLiveToggleBtn.active {
    background: linear-gradient(135deg, #DC2626 0%, #F05252 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 3px 12px rgba(220,38,38,0.35);
}
#busLiveToggleBtn.active i { color: #fff; }

/* ✅ 가장자리 방향 광고 (디스코 스타일, 2026-07-09) — #k1EdgeAdHost(z-index:150) 안에서 transform 으로 이동 */
.k1-edge-ad {
    position: absolute; left: 0; top: 0;
    width: 52px; height: 52px; margin: -26px 0 0 -26px;
    pointer-events: auto; cursor: pointer;
    will-change: transform, opacity;
    opacity: 1; transition: opacity .18s ease;
}
/* ★ 풀링 숨김 상태 — 삭제/재생성 대신 페이드로 등장·퇴장(버벅임 방지, 2026-07-09) */
.k1-edge-ad.is-hidden { opacity: 0; pointer-events: none; }
.k1-edge-ad__img {
    position: absolute; inset: 3px; border-radius: 50%;
    background: #fff center/cover no-repeat;
    border: 2.5px solid #fff;
    box-shadow: 0 3px 12px rgba(0,0,0,.32), 0 0 0 1.5px rgba(37,99,235,.55);
}
.k1-edge-ad__img--txt {
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #6E47D1, #8C67E0);
    color: #fff; font-size: 18px; font-weight: 900;
}
.k1-edge-ad__arrow { position: absolute; inset: 0; pointer-events: none; }
.k1-edge-ad__arrow::after {
    content: ''; position: absolute; right: -8px; top: 50%; margin-top: -6px;
    width: 0; height: 0; border-style: solid;
    border-width: 6px 0 6px 10px;
    border-color: transparent transparent transparent #2563EB;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,.3));
}
.k1-edge-ad:hover .k1-edge-ad__img { box-shadow: 0 4px 16px rgba(0,0,0,.4), 0 0 0 2px #2563EB; }
@media (max-width: 1023px) {
    .k1-edge-ad { width: 44px; height: 44px; margin: -22px 0 0 -22px; }
    .k1-edge-ad__img--txt { font-size: 15px; }
}

/* ✅ 중개사 매물 포커스 모드 (디스코 스타일, 2026-07-09)
   — 지도 컨테이너(#daumMap)에 .k1-rf-mode 부여 시 다른 마커 전부 숨김+클릭 차단, 해당 중개사 매물만 표시 */
.k1-rf-mode .mk-apt,
.k1-rf-mode .mk-bld,
.k1-rf-mode .mk-subway,
.k1-rf-mode .tspl-place-marker,
.k1-rf-mode .k1-bus-mk,
.k1-rf-mode .k1-live-bus,
.k1-rf-mode .k1-edge-ad,
.k1-rf-mode .rm-label,
.k1-rf-mode .rm-circle,
.k1-rf-mode .rm-tail { display: none !important; pointer-events: none !important; }

/* 라이트박스 딤 + 핀 호스트 (v2, 2026-07-09 — 지도 위 밝은 베일, 매물 핀·중개사 배지는 그 위에서 뷰포트 추적) */
.k1-rf-dim {
    position: absolute; inset: 0; z-index: 155; pointer-events: none;
    background: rgba(243, 242, 249, .5);
}
.k1-rf-host {
    position: absolute; inset: 0; z-index: 165; pointer-events: none; overflow: hidden;
}
.k1-rf-host .k1-rf-prop,
.k1-rf-host .k1-rf-realtor {
    position: absolute; left: 0; top: 0;
    pointer-events: auto; will-change: transform;
}

/* 매물 가격 pill — 디스코풍 (거래유형 색 배지 + 가격) */
.k1-rf-prop {
    transform: translate(-50%, -100%);
    display: inline-flex; align-items: center; gap: 5px;
    background: #fff; border: 1.5px solid var(--rfc, #E5397F);
    border-radius: 999px; padding: 4px 10px 4px 4px;
    box-shadow: 0 3px 10px rgba(0,0,0,.22);
    white-space: nowrap; cursor: pointer; line-height: 1.3;
}
.k1-rf-prop:hover { box-shadow: 0 5px 16px rgba(0,0,0,.3); }
.k1-rf-prop__deal {
    background: var(--rfc, #E5397F); color: #fff;
    font-size: 9.5px; font-weight: 900; padding: 3px 7px; border-radius: 999px;
}
.k1-rf-prop__price { font-size: 12.5px; font-weight: 900; color: #241E38; letter-spacing: -0.02em; }
.k1-rf-prop__sub { font-size: 9.5px; font-weight: 700; color: #8B84A3; }

/* 중개사 강조 마커 + 「전체 매물 보기」 (마커 위) */
.k1-rf-realtor { position: relative; transform: translate(-50%, -100%); text-align: center; }
.k1-rf-realtor__img {
    width: 58px; height: 58px; margin: 0 auto; border-radius: 50%;
    background: #fff center/cover no-repeat;
    border: 3px solid #fff; box-shadow: 0 4px 14px rgba(0,0,0,.35), 0 0 0 2.5px #6E47D1;
}
.k1-rf-realtor__label {
    display: inline-block; margin-bottom: 5px;
    background: #6E47D1; color: #fff; font-size: 10.5px; font-weight: 900;
    padding: 4px 11px; border-radius: 999px; white-space: nowrap;
    box-shadow: 0 2px 8px rgba(110,71,209,.4);
}
.k1-rf-exit {
    display: block; margin: 0 auto 6px;
    border: 0; background: #241E38; color: #fff;
    font-size: 11px; font-weight: 900; padding: 7px 14px; border-radius: 999px;
    cursor: pointer; box-shadow: 0 3px 10px rgba(0,0,0,.35);
    pointer-events: auto !important; position: relative; z-index: 2;
    white-space: nowrap;
}
.k1-rf-exit:hover { background: #3B2A6E; }
@media (max-width: 1023px) {
    #busLiveToggleBtn {
        top: 198px;                     /* 모바일: 개발지구 버튼(top:165) 아래 — 간격 축소 (2026-07-08) */
        left: 10px;
        padding: 6px 10px;
        font-size: 11.5px;
    }
}

/* ★ 토글 버튼 자체 펄스 — 어느 탭이든 적용 chip 있으면 (테마/필터/맵관리 어디든) (2026-05-31) */
#toggleButtonMini.has-applied {
    border-color: #EC4899 !important;
    animation: toggleBtnAppliedPulse 1.6s ease-out infinite !important;
}
#toggleButtonMini.has-applied .theme-toggle-btn__label { color: #EC4899; }
@keyframes toggleBtnAppliedPulse {
    0%   { box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 0 rgba(236,72,153,0.50); }
    70%  { box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 8px rgba(236,72,153,0);   }
    100% { box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 0 rgba(236,72,153,0);   }
}
@media (prefers-reduced-motion: reduce) {
    #toggleButtonMini.has-applied { animation: none !important; box-shadow: 0 0 0 2px rgba(236,72,153,0.55) !important; }
}

#toggleButtonMini .theme-toggle-btn__label { font-weight: 700; color: #1A1620; }
#toggleButtonMini .theme-toggle-btn__sep   { color: #C7C2D2; margin: 0 1px; font-weight: 400; }
#toggleButtonMini .theme-toggle-btn__icon  { font-size: 11px; color: #EC4899; transition: transform 0.2s ease; margin-left: 2px; }
#toggleButtonMini .theme-toggle-btn__icon.fa-chevron-up { transform: rotate(0deg); }

/* 테마|필터|파트너 박스 (구 miniMap) */
#miniMap.theme-box {
    position: absolute !important;
    top: 56px !important;             /* 토글 버튼 아래 */
    left: 10px !important;
    transform: none !important;
    width: min(340px, calc(100vw - 20px)) !important;          /* 모바일 팝업 레이어 +60px */
    height: auto !important;
    max-height: calc(100vh - 130px) !important;
    overflow-y: auto !important;
    padding: 0 !important;
    background: #fff !important;
    border: 1px solid #ECECEC !important;
    border-radius: 14px !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.02) !important;
    z-index: 210 !important;           /* ★ 재개발/개발지구 버튼(200)보다 위 (2026-07-07) — InfoWindow(999999)보다는 아래 */
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
}
/* ★ 레이어 하단: 좌측 전국구 텍스트광고 + 우측 닫기 버튼 (2026-07-07) */
#miniMap.theme-box .theme-box__closebar {
    position: sticky; bottom: 0; z-index: 3;
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    padding: 8px 10px 10px;
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #fff 45%);
    pointer-events: none;
}
#miniMap.theme-box .theme-box__textad {
    pointer-events: auto;
    display: inline-flex; align-items: center; gap: 6px;
    min-width: 0;
    background: #6E47D1; color: #fff !important;
    border-radius: 999px; padding: 7px 13px;
    font-size: 11.5px; font-weight: 800; letter-spacing: -0.02em;
    text-decoration: none !important;
    box-shadow: 0 2px 8px rgba(110,71,209,.28);
}
#miniMap.theme-box .theme-box__textad i { font-size: 10px; color: #fff !important; }
#miniMap.theme-box .theme-box__textad .k1-textad-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#miniMap.theme-box .theme-box__textad:hover { background: #5B36B8; }
#miniMap.theme-box .theme-box__close-btn {
    pointer-events: auto;
    border: 1px solid #E5E1EF; background: #F7F5FC; color: #4A4066;
    border-radius: 999px; padding: 7px 16px;
    font-size: 12px; font-weight: 800; cursor: pointer;
    box-shadow: 0 2px 8px rgba(26,22,32,.10);
}
#miniMap.theme-box .theme-box__close-btn:hover { background: #EFEAFB; color: #6E47D1; border-color: #C9B8F0; }
/* PC 에서는 더 넓게 */
@media (min-width: 1024px) {
    #miniMap.theme-box {
        width: 400px !important;       /* ★ 320 → 400 PC 너비 확대 (2026-05-31) */
    }
}
/* 모바일에서는 toggle 버튼(top:90) 아래 + z-index 위로 */
@media (max-width: 1023px) {
    #miniMap.theme-box {
        top: 137px !important;        /* 버튼 top:90 + 버튼 높이 약 36 + 약간 여백 */
        z-index: 210 !important;      /* ★ 재개발/개발지구 버튼(200)보다 위 (2026-07-07) */
        /* ★ 맵관리 레이어가 하단 바텀시트(패널) 핸들 위에서만 보이게 (2026-07-09 사용자 요청).
           반-확장 시트 윗변(핸들) = 30vh + 100px 위치. 레이어 top:137 → 그 위에서 끝나도록 뷰포트 비례로 clamp.
           (해상도 무관하게 핸들 위 ~13px 여백 유지. 내용 길면 overflow-y:auto 로 스크롤) */
        max-height: calc(30vh - 50px) !important;
    }
}

/* 탭 헤더 */
#miniMap.theme-box .theme-box__tabs {
    display: flex;
    gap: 6px;
    border-bottom: 0;
    padding: 6px;
    background: #FDF2F8;
    border-radius: 14px 14px 0 0;
}
#miniMap.theme-box .theme-tab {
    flex: 1 1 0;
    min-height: 32px;
    padding: 7px 8px;
    border: 1px solid rgba(236,72,153,.18);
    border-radius: 10px;
    background: #FFFFFF;
    font-family: inherit;
    font-size: 13px;
    font-weight: 800;
    color: #DB2777;
    letter-spacing: -0.025em;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(26,22,32,.04);
    transition: color 0.15s ease, background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
#miniMap.theme-box .theme-tab:hover {
    color: #BE185D;
    background: #FFFFFF;
    border-color: rgba(236,72,153,.34);
    transform: translateY(-1px);
}
#miniMap.theme-box .theme-tab.is-active {
    color: #FFFFFF;
    border-color: transparent;
    background: linear-gradient(135deg,#EC4899 0%,#F472B6 100%);
    box-shadow: 0 6px 16px rgba(236,72,153,.26);
}
/* ★ 탭에 활성 chip 이 있으면 보라 펄스 외곽선 — 작동 중 알림 (2026-05-31) */
#miniMap.theme-box .theme-tab.has-applied {
    position: relative;
    color: #DB2777;
    animation: themeTabAppliedPulse 1.6s ease-out infinite;
    border-radius: 10px;
}
#miniMap.theme-box .theme-tab.is-active.has-applied { color: #FFFFFF; }
#miniMap.theme-box .theme-tab.has-applied::after {
    content: '●';
    position: absolute; top: 4px; right: 8px;
    font-size: 7px; color: #EC4899;
    line-height: 1;
}
#miniMap.theme-box .theme-tab.is-active.has-applied::after { color: rgba(255,255,255,.88); }
@keyframes themeTabAppliedPulse {
    0%   { box-shadow: inset 0 0 0 1.5px rgba(236,72,153,0.55), 0 0 0 0 rgba(236,72,153,0.45); }
    70%  { box-shadow: inset 0 0 0 1.5px rgba(236,72,153,0.55), 0 0 0 6px rgba(236,72,153,0);  }
    100% { box-shadow: inset 0 0 0 1.5px rgba(236,72,153,0.55), 0 0 0 0 rgba(236,72,153,0);   }
}
/* 모션 줄이기 환경 — 펄스 없이 외곽선만 유지 */
@media (prefers-reduced-motion: reduce) {
    #miniMap.theme-box .theme-tab.has-applied {
        animation: none;
        box-shadow: inset 0 0 0 1.5px rgba(236,72,153,0.55);
    }
}

/* 탭 본문 */
#miniMap.theme-box .theme-box__body {
    padding: 12px 14px 14px;
}
#miniMap.theme-box .theme-tab-pane { display: none; }
#miniMap.theme-box .theme-tab-pane.is-active { display: block; }

/* 칩 공통 */
#miniMap.theme-box .theme-pane__chips,
#miniMap.theme-box .filter-group__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
#miniMap.theme-box .theme-chip {
    display: inline-flex;
    align-items: center;
    padding: 6px 11px;
    height: 30px;
    border: 1px solid rgba(26, 22, 32, 0.10);
    border-radius: 15px;
    background: #FAFAF8;
    color: #4A4458;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.02em;
    cursor: pointer;
    transition: all 0.15s ease;
    font-family: inherit;
    white-space: nowrap;
}
#miniMap.theme-box .theme-chip:hover {
    border-color: #EC4899;
    color: #DB2777;
    background: #FDF2F8;
}
#miniMap.theme-box .theme-chip.is-active {
    border-color: #EC4899;
    color: #fff;
    background: #EC4899;
    box-shadow: 0 2px 8px rgba(236, 72, 153, 0.26);
}

/* 필터 그룹 */
#miniMap.theme-box .filter-group { margin-bottom: 14px; }
#miniMap.theme-box .filter-group:last-child { margin-bottom: 0; }
#miniMap.theme-box .filter-group__title {
    font-size: 11px;
    font-weight: 700;
    color: #8B8696;
    margin-bottom: 6px;
    letter-spacing: -0.02em;
}

/* 파트너 리스트 */
#miniMap.theme-box .partner-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
#miniMap.theme-box .partner-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
    border: 1px solid rgba(26, 22, 32, 0.08);
    border-radius: 10px;
    background: #FAFAF8;
    text-decoration: none;
    color: inherit;
    transition: all 0.15s ease;
}
#miniMap.theme-box .partner-item:hover {
    border-color: #EC4899;
    background: #fff;
    box-shadow: 0 2px 8px rgba(236, 72, 153, 0.12);
    transform: translateY(-1px);
}
#miniMap.theme-box .partner-item__img {
    flex: 0 0 44px;
    height: 44px;
    border-radius: 8px;
    color: #fff;
    font-weight: 800;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: -0.02em;
}
#miniMap.theme-box .partner-item__body { flex: 1; min-width: 0; }
#miniMap.theme-box .partner-item__title {
    font-size: 13px;
    font-weight: 700;
    color: #1A1620;
    letter-spacing: -0.025em;
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#miniMap.theme-box .partner-item__sub {
    font-size: 11px;
    font-weight: 500;
    color: #8B8696;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#miniMap.theme-box .partner-item--cta {
    justify-content: center;
    padding: 12px;
    border-style: dashed;
    border-color: rgba(110, 71, 209, 0.30);
    color: #6E47D1;
}
#miniMap.theme-box .partner-item__cta {
    font-size: 12px;
    font-weight: 700;
    color: #6E47D1;
    letter-spacing: -0.02em;
}

/* ═══════════════════════════════════════════════════════
   지도 상단 중앙 검색창 (#mapTopSearchBar)
   - 네이버/구글 지도 영역(#daumMap) 내부 상단 중앙에 띄움
   - PC/모바일 공통, 보라 포커스 톤
   ═══════════════════════════════════════════════════════ */
#daumMap {
    position: relative;       /* 검색창 absolute 의 기준 */
}
.tspl-iw-focus-backdrop {
    position: absolute;
    inset: 0;
    z-index: 999900;
    display: none !important;
    background: rgba(255,255,255,.16);
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    cursor: pointer;
    pointer-events: none !important;
}
#daumMap.tspl-iw-focus-on .tspl-iw-focus-backdrop {
    display: none !important;
}
.fav-center-pin {
    position: fixed !important;
    z-index: 300 !important;
    pointer-events: auto;
}
.fav-center-pin img {
    display: block;
    width: 40px;
    height: 40px;
    transform: translate(-50%, -100%);
    pointer-events: none;
}
.map-top-search {
    position: absolute;
    top: 14px;
    left: 50%;
    transform: translateX(-50%) translateZ(0);    /* translateZ(0) → 독립 GPU 레이어 (지도 repaint 시 깜빡임 차단) */
    z-index: 500;       /* InfoWindow (z-index:999999) 보다 아래 — 인포윈도우가 최상단 */
    width: min(440px, calc(100% - 32px));
    display: flex;
    align-items: center;
    height: 44px;
    padding: 0 40px 0 44px;     /* ★ 좌측 44 — 현위치 버튼 자리 (2026-05-31) */
    background: #fff;
    border: 1px solid rgba(26, 22, 32, 0.10);
    border-radius: 22px;
    box-shadow: 0 4px 16px rgba(26, 22, 32, 0.12), 0 1px 3px rgba(26, 22, 32, 0.06);
    transition: box-shadow 0.18s ease, border-color 0.18s ease;
    box-sizing: border-box;
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, 'Malgun Gothic', sans-serif;
    will-change: transform, opacity;              /* GPU 컴포지팅 힌트 */
    backface-visibility: hidden;
}
/* focus-within 효과 제거 — input 활성화 시 외곽선 안 바뀜 (사용자 요청)
.map-top-search:focus-within {
    border-color: #6E47D1;
    box-shadow: 0 4px 16px rgba(110, 71, 209, 0.20), 0 0 0 3px rgba(110, 71, 209, 0.12);
}
*/
.map-top-search__icon {
    position: absolute;
    right: 14px;                         /* 좌 → 우로 이동 */
    left: auto;
    top: 50%;
    transform: translateY(-50%);
    color: #6E47D1;
    font-size: 14px;
    pointer-events: none;
}
/* ★ 좌측 현위치 버튼 (2026-05-31 추가) — 검색 아이콘과 대칭 위치 */
.map-top-search__loc {
    position: absolute;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border: none;
    background: transparent;
    color: #6E47D1;
    font-size: 15px;
    cursor: pointer;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    flex-shrink: 0;
    transition: background 0.15s ease, color 0.15s ease;
    -webkit-tap-highlight-color: transparent;
}
.map-top-search__loc:hover { background: rgba(110, 71, 209, 0.10); }
.map-top-search__loc:active { background: rgba(110, 71, 209, 0.18); }
.map-top-search__loc.is-loading { pointer-events: none; opacity: 0.5; }
.map-top-search__loc.is-loading i { animation: mtsLocSpin 0.9s linear infinite; }
@keyframes mtsLocSpin { to { transform: rotate(360deg); } }
.map-top-search__input {
    flex: 1;
    min-width: 0;
    height: 100%;
    border: none !important;
    outline: none !important;
    -webkit-appearance: none;
    -webkit-tap-highlight-color: transparent;
    box-shadow: none !important;
    background: transparent;
    font-size: 14px;
    font-weight: 500;
    color: #1A1620;
    letter-spacing: -0.02em;
    padding: 0;
    font-family: inherit;
}
.map-top-search__input:focus,
.map-top-search__input:focus-visible,
.map-top-search__input:active {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
}
.map-top-search__input::placeholder {
    color: #8B8696;
    font-weight: 500;
}
.map-top-search__input::-webkit-search-cancel-button,
.map-top-search__input::-webkit-search-decoration {
    -webkit-appearance: none;
    appearance: none;
}
.map-top-search__clear {
    display: none;
    position: absolute;
    right: 10px;                       /* 우측 — 아이콘 자리와 겹치게 (입력 시 아이콘 숨김) */
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    border: none;
    background: rgba(26, 22, 32, 0.08);
    color: #4A4458;
    border-radius: 50%;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    margin: 0;
    flex-shrink: 0;
    padding: 0;
    transition: background 0.15s ease;
}
.map-top-search__clear:hover { background: rgba(26, 22, 32, 0.14); }
/* 값이 있을 때 — 클리어 버튼 보이고 돋보기 아이콘 숨김 (같은 우측 자리) */
.map-top-search.has-value .map-top-search__clear { display: inline-block; }
.map-top-search.has-value .map-top-search__icon  { display: none; }

/* 모바일 — 검색창 폭 60% + 위로 숨었다가 슬라이드 다운 애니메이션 */
@media (max-width: 1023px) {
    .map-top-search {
        /* 모바일: 화면 가운데 정렬, 좌측 toggleButtonMini(top:90, height~36) 보다 아래 */
        top: 135px;                              /* 버튼 바로 아래 */
        left: 50% !important;
        margin-left: 50px;                       /* ★ 센터 기준 +50px 우측 (2026-07-12 사용자 요청) — transform 은 표시/숨김 애니메이션용이라 margin 으로 이동 */
        right: auto !important;
        width: 180px !important;                 /* ★ 220 → 180 (-40px, 2026-07-12 사용자 요청) — 센터 정렬 유지 */
        max-width: 180px !important;
        height: 36px;
        padding: 0 30px 0 36px;     /* ★ 좌측 36 — 현위치 버튼 자리 */
        border-radius: 18px;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translate(-50%, -60px) translateZ(0);     /* 중앙 정렬 + 위쪽으로 숨김 */
        transition: opacity 0.32s ease,
                    transform 0.4s cubic-bezier(0.22, 1, 0.36, 1),
                    visibility 0.4s,
                    top 0.38s cubic-bezier(0.22, 1, 0.36, 1);   /* ★ 퀵토글 펼침 시 아래로 밀림 (2026-07-12) */
    }
    /* ★ 퀵토글 펼침(body.k1-qt-open) — 3줄(5개×3줄)이 된 토글바 아래로 검색창 자연스럽게 이동
       토글바 top:90 + 높이(3+23×3+2×2+3=79) ≈ 169 → +7px 여유 */
    body.k1-qt-open .map-top-search { top: 176px; }
    .map-top-search__icon { right: 13px; left: auto; font-size: 13px; }
    .map-top-search__loc  { left: 4px; width: 28px; height: 28px; font-size: 13px; }
    .map-top-search__input { font-size: 13px; }

    /* ★ 검색창 표시 조건:
         body.k1-search-on 클래스가 붙으면 노출 (=오른쪽 메뉴가 .hidden 이면서 왼쪽 패널이 .expanded 가 아닌 상태) */
    body.k1-search-on .map-top-search {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translate(-50%, 0) translateZ(0);    /* 중앙 정렬 유지 + 원래 자리로 */
    }
}

/* ═══════════════════════════════════════════════════════
   모바일·공통: 로또 금액(#number2) 숨김 + 새 우상단 아이콘 스타일
   (PC 미디어쿼리에서는 위에서 별도 position:fixed 처리됨)
   ═══════════════════════════════════════════════════════ */
#shGnbMo #number2 {
    display: none !important;       /* 모바일에서도 우선 비표시 (사용자 요청) */
}

@media (max-width: 1023px) {
    /* ▼▼▼ MARKER 260515-3 — 캐시 확인용. 아이콘이 보라색이면 새 CSS 적용됨 ▼▼▼ */

    /* ★ #shGnbMo 에 position:relative 강제 — 로고의 absolute 가
         .menu-header 전체(햄버거 row + 카테고리 row 합계)가 아니라
         row 1(햄버거 줄) 안에서만 세로중앙으로 잡히도록 한다.
         #shGnbMo 자체는 static 이면 그 height(=40px) 가 row 1 박스가 됨. */
    #shGnbMo {
        position: relative !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* 로고 = row 1(햄버거 줄) 의 세로중앙 정렬 */
    #shGnbMo .logo_m {
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
    }

    /* ★ 아이콘을 #shGnbMo 의 자식이 아니라 viewport 기준 fixed 로 배치
         → bot_map.php JS 가 #shGnbMo max-width 를 어떻게 바꾸든 영향 0.
         단 #shGnbMo 가 position:fixed; top:0 이라 같은 z-context 에서 작동 */
    a.nav-icon-btn {
        position: fixed !important;
        top: 0 !important;
        height: 40px !important;            /* 모바일 #shGnbMo (row 1) 높이와 동일 */
        width: 32px !important;             /* 40 → 32 로 더 좁힘 */
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        color: #6E47D1 !important;
        background: transparent !important;
        border-radius: 6px;
        padding: 0 !important;
        margin: 0 !important;
        z-index: 1000 !important;
        text-decoration: none !important;
    }
    a.nav-icon-btn:hover,
    a.nav-icon-btn:active {
        background: rgba(110, 71, 209, 0.10) !important;
        color: #5A37B8 !important;
    }
    a.nav-icon-btn i,
    a.nav-icon-btn svg {
        font-size: 20px !important;
        width: 22px !important;
        height: 22px !important;
        line-height: 1 !important;
        display: inline-block !important;
    }
    /* 즐겨찾기(우측 2번째) · 회원(맨 우측) — 거의 붙음 */
    a.nav-icon-wishlist { right: 80px !important; }   /* 멤버 + 20px 여백 + 멤버 너비 만큼 더 좌측 */
    a.nav-icon-chatfav  { right: 50px !important; }
    a.nav-icon-member   { right: 20px !important; }   /* 우측 가장자리에서 20px 여백 */

    /* ▲▲▲ MARKER 260515-2 ▲▲▲ */
}

/* ═══════════════════════════════════════════════════════════════
   ★ A안: 우측 pill 액션 버튼 + 카테고리 서브타이틀 제거
   - 로그인/로그아웃 상태에 따라 다른 메뉴명 노출
   - PC: 풀텍스트 라벨 / 모바일: 아이콘+짧은 라벨 (높이 유지)
   ═══════════════════════════════════════════════════════════════ */

/* (1) 카테고리 서브타이틀 — 모바일에서는 노출, PC에서만 숨김
   ※ 본문 라벨에 풀텍스트 백업 (data-full) 을 두고, PC 에선 풀텍스트, 모바일 에선 서브타이틀 노출 */
.menu-header .nav_wrap_0605 ul#scrollableUl li a {
    padding: 0 4px !important;
    font-weight: 700 !important;
}
@media (min-width: 1024px) {
    /* PC: data-pc-label 가 있으면 원본 텍스트 + .st 숨기고 풀라벨을 ::before 로 노출
       (JS 없이 CSS 만으로 처리 → 깜빡임/로딩순서 영향 없음) */
    .menu-header .nav_wrap_0605 ul#scrollableUl li a[data-pc-label] {
        font-size: 0 !important;       /* 원본 텍스트노드 숨김 */
    }
    .menu-header .nav_wrap_0605 ul#scrollableUl li a[data-pc-label]::before {
        content: attr(data-pc-label);
        display: inline-block;
        font-size: 14px;
        font-weight: 700;
        color: inherit;
        white-space: nowrap;
        line-height: 1.2;
    }
    .menu-header .nav_wrap_0605 ul#scrollableUl li a[data-pc-label] .st,
    .menu-header .nav_wrap_0605 ul#scrollableUl li a[data-pc-label] .st2 {
        display: none !important;
    }
}

/* (2) 우측 pill 액션 컨테이너 */
/* #shGnbMo 를 positioning context 로 — 모바일/PC 공통 */
#shGnbMo { position: relative; }

.nav-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    position: absolute;
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
    z-index: 5001;
    -webkit-tap-highlight-color: transparent;
}

.nav-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1.5px solid #6E47D1;
    background: #fff;
    color: #6E47D1;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.02em;
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s ease, color .15s ease, transform .15s ease, box-shadow .15s ease;
    cursor: pointer;
}
.nav-pill i {
    font-size: 11px;
    line-height: 1;
}
.nav-pill:hover {
    background: #F4EEFE;
    color: #5A37B8;
    border-color: #5A37B8;
}
.nav-pill:active { transform: scale(.96); }

/* primary (회원가입 등 강조) — 보라 채우기 */
.nav-pill--primary {
    background: linear-gradient(135deg, #7B5BE0 0%, #6E47D1 55%, #5A37B8 100%);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 2px 6px rgba(110,71,209,.28);
}
.nav-pill--primary:hover {
    background: linear-gradient(135deg, #6E47D1 0%, #5A37B8 100%);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 4px 10px rgba(110,71,209,.40);
}

/* logout — 코랄 톤 */
.nav-pill--logout {
    border-color: #E5604C;
    color: #E5604C;
    position: relative;
}
.nav-pill--logout:hover {
    background: #FFEDE9;
    color: #C2462E;
    border-color: #C2462E;
}
.nav-pill__dot {
    display: none !important;
}

/* me (마이페이지) — 살짝 톤 강조 */
.nav-pill__badge,
.nav-icon-badge {
    min-width: 16px;
    height: 16px;
    padding: 0 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #E5604C;
    color: #fff;
    font-size: 9px;
    font-weight: 950;
    line-height: 1;
}
.nav-pill__badge.is-zero {
    display: none;
}
.nav-icon-badge {
    position: absolute;
    top: 7px;
    right: 2px;
    border: 1px solid #fff;
    box-shadow: 0 1px 4px rgba(229,96,76,.28);
}
.nav-pill--chat {
    position: relative;
    border-color: #6E47D1;
    color: #6E47D1;
}
.nav-pill--chat:hover {
    background: #F4EEFE;
    color: #5A37B8;
}

.nav-admin-monitor-pill {
    max-width: 235px;
    border-color: #CBD5E1;
    background: #F8FAFC;
    color: #334155;
    white-space: nowrap;
}
.nav-admin-monitor-pill .nav-pill__t {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.nav-admin-monitor-pill.is-ok {
    border-color: rgba(34, 197, 94, .36);
    background: #F0FDF4;
    color: #15803D;
}
.nav-admin-monitor-pill.is-warn,
.nav-admin-monitor-pill.is-loading {
    border-color: rgba(245, 158, 11, .42);
    background: #FFFBEB;
    color: #B45309;
}
.nav-admin-monitor-pill.is-bad {
    border-color: rgba(239, 68, 68, .42);
    background: #FEF2F2;
    color: #B91C1C;
}
.nav-admin-monitor-pill:hover {
    background: #EEF2FF;
    border-color: rgba(110, 71, 209, .38);
    color: #5A37B8;
}

.nav-pill--me {
    background: #F4EEFE;
    color: #5A37B8;
    border-color: rgba(110,71,209,.4);
}
.nav-pill--me:hover {
    background: #ECE3FC;
    color: #5A37B8;
    border-color: #6E47D1;
}

/* ──── PC (>=1024px) — 풀텍스트 라벨 + viewport 우측 고정 ──── */
@media (min-width: 1024px) {
    .nav-actions {
        position: fixed !important;     /* PC: viewport 우측 (menu-header 가 fixed 라 동일 위치) */
        top: 50% !important;
        right: 18px !important;
        gap: 7px;
        height: 56px;
        display: flex;
        align-items: center;
        transform: translateY(-50%);
        z-index: 5002;
    }
    .nav-pill {
        height: 34px;
        padding: 0 14px;
        font-size: 13px;
        gap: 6px;
    }
    .nav-pill i { font-size: 12px; }

    /* PC: 카테고리 영역 우측에 pill 영역만큼 공간 확보 */
    .menu-header .sh_nav { padding-right: 0 !important; }
    .menu-header .nav_wrap_0605 {
        /* 로그아웃 상태(2개) ~210px / 로그인 상태(3개) ~360px → 안전치 360 */
        padding-right: 440px !important;
    }
    .menu-header:has(.nav-admin-monitor-pill) .nav_wrap_0605 {
        padding-right: 650px !important;
    }
}

@media (min-width: 1024px) and (max-width: 1320px) {
    .nav-admin-monitor-pill {
        max-width: 150px;
    }
}

/* ──── 모바일 (<1024px) — 원래 스타일 원복: 아이콘만, pill 숨김 ──── */
@media (max-width: 1023px) {
    /* PC 전용 pill 영역 숨김 */
    .nav-actions { display: none !important; }
    /* 원래 아이콘 정상 노출 (기존 a.nav-icon-btn 규칙 그대로 작동) */
}

/* ──── PC (>=1024px) — 원래 아이콘 숨김, pill 만 노출 ──── */
@media (min-width: 1024px) {
    #shGnbMo > a.nav-icon-btn { display: none !important; }
}

/* ════════════════════════════════════════════════════════════════
   ★ E안 — Soft Outline 활성 상태 (PC 전용) — 강화 버전
   ※ 다른 모든 규칙(!important 포함) 을 누르기 위해 specificity 최대화
   ════════════════════════════════════════════════════════════════ */
@media (min-width: 1024px) {
    /* 활성 메뉴 — 보라 테두리 + 파스텔 배경 + 굵은 글씨 */
    html body .menu-header .nav_wrap_0605 ul#scrollableUl li.is-active > a[data-pc-label] {
        position: relative !important;
        padding: 0 7px 7px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #1A1620 !important;
        transition: color .15s, opacity .15s !important;
        margin: 0 1px !important;
    }
    html body .menu-header .nav_wrap_0605 ul#scrollableUl li.is-active > a[data-pc-label]::before {
        color: #1A1620 !important;
        font-weight: 900 !important;
    }
    html body .menu-header .nav_wrap_0605 ul#scrollableUl li.is-active > a[data-pc-label]::after {
        content: '' !important;
        position: absolute !important;
        left: 8px !important;
        right: 8px !important;
        bottom: 0 !important;
        height: 3px !important;
        border-radius: 999px !important;
        background: linear-gradient(90deg, #6E47D1, #14B8A6) !important;
        box-shadow: none !important;
    }
    html body .menu-header .nav_wrap_0605 ul#scrollableUl li.is-active > a[data-pc-label]:hover {
        background: transparent !important;
        box-shadow: none !important;
    }
    /* 호버(비활성) — 살짝 보라 톤 (active 와 구분되는 hint) */
    html body .menu-header .nav_wrap_0605 ul#scrollableUl li:not(.is-active) > a[data-pc-label]:hover::before {
        color: #6E47D1 !important;
    }
}

/* ===== block 7 ===== */
/* ── 세련된 로그아웃 아이콘 버튼 ───────────────────────────── */
.nav-icon-logout {
    transition: transform .15s, color .15s, filter .15s;
}
.nav-icon-logout:hover {
    transform: scale(1.12);
    color: #C2462E !important;   /* 더 진한 코랄 */
    filter: drop-shadow(0 2px 4px rgba(229, 96, 76, .35));
}
.nav-icon-logout:active { transform: scale(.95); }

#style-1::-webkit-scrollbar-track
{
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  border-radius: 10px;
  background-color: #F5F5F5;
}

#style-1::-webkit-scrollbar
{
  width: 12px;
  background-color: #F5F5F5;
}

#style-1::-webkit-scrollbar-thumb
{
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
  background-color: #555;
}

/* ===== block 8 ===== */
                                    /* ===== #shTabMo 5-item 모바일 하단 탭바 (재디자인) ===== */
                                    #shTabMo{
                                        position:fixed !important;
                                        left:0 !important;
                                        right:0 !important;
                                        bottom:0 !important;
                                        height:50px !important;
                                        background:rgba(255,255,255,.97) !important;
                                        backdrop-filter:saturate(140%) blur(8px);
                                        -webkit-backdrop-filter:saturate(140%) blur(8px);
                                        border-top:1px solid rgba(110,71,209,.10);
                                        box-shadow:0 -4px 18px rgba(26,22,32,.06) !important;
                                        padding:0 4px;
                                        box-sizing:border-box;
                                        z-index:100060 !important;
                                    }
                                    body > #shTabMo{
                                        position:fixed !important;
                                        left:0 !important;
                                        right:0 !important;
                                        bottom:0 !important;
                                        z-index:100060 !important;
                                    }
                                    @media (min-width:1023px){
                                        body > #shTabMo{ display:none !important; }
                                    }
                                    #shTabMo ul{
                                        display:flex !important;
                                        align-items:center;
                                        justify-content:space-around;
                                        height:100%;
                                        width:100%;
                                        margin:0; padding:0;
                                        list-style:none;
                                    }
                                    #shTabMo ul li{
                                        width:20% !important;      /* 외부 CSS의 25% override */
                                        flex:1 1 20%;
                                        height:100%;
                                        position:relative;
                                    }
                                    #shTabMo button,
                                    #shTabMo a{
                                        display:flex !important;
                                        flex-flow:column nowrap;
                                        justify-content:center;
                                        align-items:center;
                                        gap:3px;
                                        width:100%;
                                        height:100%;
                                        font-family:'Pretendard',-apple-system,BlinkMacSystemFont,sans-serif;
                                        font-size:10.5px;
                                        font-weight:700;
                                        line-height:1;
                                        color:#4a4458;
                                        background:transparent;
                                        border:none;
                                        text-decoration:none;
                                        letter-spacing:-.02em;
                                        transition:color .18s ease, transform .18s ease;
                                        -webkit-tap-highlight-color:transparent;
                                    }
                                    #shTabMo button i,
                                    #shTabMo a i{
                                        font-size:18px;
                                        line-height:1;
                                        color:#6E47D1;
                                        transition:transform .2s ease, color .18s ease;
                                    }
                                    #shTabMo button:active i,
                                    #shTabMo a:active i{ transform:scale(.88); }
                                    #shTabMo button:active,
                                    #shTabMo a:active{ color:#6E47D1; }

                                    /* 가운데 지도토글 버튼 (.home) — 살짝 떠 있는 원형 강조 (라벨 가리지 않게 작게) */
                                    #shTabMo .home{
                                        flex-shrink:0;
                                        width:32px !important;       /* 46 → 32 : 라벨이 가려지지 않도록 축소 */
                                        height:32px !important;
                                        margin:0 auto !important;
                                        padding:0 !important;
                                        border-radius:50% !important;
                                        background:linear-gradient(135deg,#7B5BE0 0%,#6E47D1 55%,#5A37B8 100%) !important;
                                        color:#fff !important;
                                        font-size:14px !important;
                                        font-weight:800 !important;
                                        box-shadow:0 4px 10px rgba(110,71,209,.38), 0 1px 3px rgba(110,71,209,.18);
                                        position:absolute;            /* li 안에서 절대배치 → 라벨과 명확히 분리 */
                                        left:50%;
                                        top:-5px;                     /* ★ 라벨 안 가리도록 li 위로 살짝 띄움 (-10 → -5 로 5px 내림) */
                                        transform:translateX(-50%);
                                        display:flex !important;
                                        align-items:center;
                                        justify-content:center;
                                        gap:0 !important;
                                        transition:transform .2s ease, box-shadow .2s ease;
                                        z-index:100061;
                                    }
                                    #shTabMo .home i{
                                        color:#fff !important;
                                        font-size:14px !important;
                                        margin:0 !important;
                                    }
                                    #shTabMo .home:active{
                                        transform:translateX(-50%) scale(.94);
                                        box-shadow:0 2px 6px rgba(110,71,209,.32);
                                    }
                                    /* 가운데 라벨은 지도토글 버튼 아래에 또렷이 노출 */
                                    #shTabMo .home + .home-label{
                                        position:absolute;
                                        left:0; right:0; bottom:5px;
                                        text-align:center;
                                        font-size:10px;
                                        font-weight:800;
                                        color:#6E47D1;
                                        letter-spacing:-.02em;
                                        pointer-events:none;
                                        line-height:1;
                                    }

                                    /* 활성/호버 색감 */
                                    #shTabMo a.is-active,
                                    #shTabMo button.is-active{ color:#6E47D1; }
                                    #shTabMo a.is-active i,
                                    #shTabMo button.is-active i{ color:#6E47D1; }
                                

/* ===== block 9 ===== */
                                        .scrollable-ul {
                                            cursor: grab;
                                            user-select: none;
                                            /* 텍스트 선택 방지 */
                                        }

                                        .scrollable-ul.active {
                                            cursor: grabbing;
                                        }
                                    

/* ===== block 10 ===== */
/* =========================================================
   로그인/회원가입 모달(tsplAuthLayer) 색감 tspl 통일버전
   - 기존 tspl-auth-* 구조 유지
   - primary/primary-light 기반
========================================================= */

/* backdrop */
.tspl-auth-backdrop{
  position:fixed;
  inset:0;
  background: rgba(15, 23, 42, 0.55);
  display:none;
  align-items:center;
  justify-content:center;
  padding:16px;
  z-index:2147483002;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* box */
.tspl-auth-box{
  width:100%;
  max-width:420px;
  background:#fff;
  border-radius:20px;
  box-shadow:0 24px 60px rgba(15, 23, 42, 0.35);
  position:relative;
  overflow:hidden;
  font-family:inherit;
}

/* header */
.tspl-auth-head{
  padding:22px 22px 14px;
  border-bottom:1px solid var(--border);
  background: #ffffff;
}

.tspl-auth-title{
  margin:0;
  font-size:1.25rem;
  font-weight:900;
  color:var(--text-dark);
  letter-spacing:-0.03em;
}

.tspl-auth-desc{
  margin:8px 0 0 0;
  font-size:0.9rem;
  color:var(--text-gray);
  line-height:1.5;
}

/* close */
.tspl-auth-close{
  position:absolute;
  top:14px;
  right:16px;
  width:34px;
  height:34px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:22px;
  color:#9CA3AF;
  user-select:none;
}
.tspl-auth-close:hover{ background:rgba(0,0,0,.05); color:#6b7280; }

/* tabs */
.tspl-auth-tabs{
  display:flex;
  gap:10px;
  padding:12px 22px 0;
  background:#fff;
}

.tspl-auth-tab{
  flex:1;
  border:1px solid var(--border);
  background:#ffffff;
  padding:10px 0;
  border-radius:999px;
  cursor:pointer;
  font-size:0.92rem;
  font-weight:900;
  color:var(--text-dark);
}
.tspl-auth-tab.active{
  background: var(--primary);
  color:#fff;
  border-color: var(--primary);
  box-shadow: 0 10px 18px rgba(13,148,136,.18);
}

/* body */
.tspl-auth-body{
  padding:14px 22px 20px;
  background:#fff;
}

/* toast */
.tspl-auth-toast{
  display:none;
  margin:8px 0 6px;
  padding:10px 12px;
  border-radius:14px;
  background: #fff7ed;
  border:1px solid #fed7aa;
  color:#9a3412;
  font-size:0.85rem;
  line-height:1.4;
}
.tspl-auth-toast.show{ display:block; }

/* inputs */
.tspl-auth-row{ margin-top:10px; }
.tspl-auth-row label{
  display:block;
  font-size:0.85rem;
  color:var(--text-dark);
  font-weight:700;
  margin:0 0 4px 0;
}
.tspl-auth-row input{
  width:100%;
  box-sizing:border-box;
  height:44px;
  padding:0 12px;
  border:1px solid var(--border);
  border-radius:12px;
  outline:none;
  font-size:0.95rem;
  background:#fff;
}
.tspl-auth-row input:focus{
  border-color: var(--primary);
  box-shadow: 0 0 0 2px rgba(13,148,136,.20);
}

/* actions */
.tspl-auth-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:10px;
  gap:10px;
  flex-wrap:wrap;
}
.tspl-auth-check{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:0.82rem;
  color:var(--text-gray);
}
.tspl-auth-check input{ width:auto; height:auto; }

.tspl-auth-links{
  display:flex;
  gap:10px;
  font-size:0.82rem;
}
.tspl-auth-links a{
  color:var(--text-gray);
  text-decoration:none;
}
.tspl-auth-links a:hover{ text-decoration:underline; }

/* submit */
.tspl-auth-submit{
  width:100%;
  margin-top:12px;
  height:46px;
  border:none;
  border-radius:999px;
  background: var(--primary);
  color:#fff;
  font-size:0.96rem;
  font-weight:900;
  cursor:pointer;
}
.tspl-auth-submit:active{
  transform: scale(0.98);
  box-shadow: 0 10px 18px rgba(13,148,136,.20);
}

.tspl-auth-small{
  margin-top:10px;
  font-size:0.78rem;
  color:#9CA3AF;
  line-height:1.4;
}

/* PC에서 보정 */
@media (min-width: 769px) {
  .tspl-auth-box{
    border-left:1px solid var(--border);
    border-right:1px solid var(--border);
  }
}
#tsplAuthLayer .tspl-auth-form{
  display:none !important;
}
#tsplAuthLayer .tspl-auth-form.active{
  display:block !important;
}

/* 혹시 탭 버튼도 전역 .active가 덮는 경우 대비 */
#tsplAuthLayer .tspl-auth-tab{
  background:#ffffff !important;
  color:var(--text-dark) !important;
  border:1px solid var(--border) !important;
}
#tsplAuthLayer .tspl-auth-tab.active{
  background:var(--primary) !important;
  color:#ffffff !important;
  border-color:var(--primary) !important;
}

/* ─────────────────────────────────────────────────
   tspl 로그인 모달 — 최고만 보라 브랜드 톤 (#6E47D1 / #5A37B8)
   PWA theme-color / favicon 과 동일 색상
   ───────────────────────────────────────────────── */
#tsplAuthLayer{
  --tspl-purple:      #6E47D1;
  --tspl-purple-deep: #5A37B8;
  --tspl-purple-soft: rgba(110,71,209,.10);
}

/* 로그인/회원가입 활성 탭 */
#tsplAuthLayer .tspl-auth-tab.active{
  background: var(--tspl-purple) !important;
  color:#ffffff !important;
  border-color: var(--tspl-purple) !important;
}

/* input focus 라인도 보라 */
#tsplAuthLayer .tspl-auth-row input:focus{
  border-color: var(--tspl-purple);
  box-shadow:0 0 0 3px var(--tspl-purple-soft);
}

/* 찾기 / 약관 링크 hover */
#tsplAuthLayer .tspl-auth-links a:hover{ color: var(--tspl-purple); }

/* submit 버튼 — 보라 그라데이션 + 살짝 그림자 */
#tsplAuthLayer .tspl-auth-submit{
  background: linear-gradient(135deg, var(--tspl-purple) 0%, var(--tspl-purple-deep) 100%);
  color:#ffffff;
  border:none;
  border-radius:12px;
  height:48px;
  font-size:0.98rem;
  font-weight:900;
  letter-spacing:.02em;
  box-shadow:0 8px 20px rgba(110,71,209,.28);
  transition: filter .15s, transform .06s, box-shadow .15s;
}
#tsplAuthLayer .tspl-auth-submit:hover{
  filter: brightness(1.05);
  box-shadow:0 10px 24px rgba(110,71,209,.34);
}
#tsplAuthLayer .tspl-auth-submit:active{
  transform: scale(.98);
  box-shadow:0 5px 14px rgba(110,71,209,.30);
}

/* SNS divider */
#tsplAuthLayer .tspl-sns-divider{
  display:flex; align-items:center; gap:10px;
  margin:22px 0 14px;
  color:#9CA3AF;
  font-size:10.5px; letter-spacing:.06em;
}
#tsplAuthLayer .tspl-sns-divider::before,
#tsplAuthLayer .tspl-sns-divider::after{
  content:''; flex:1; height:1px; background:#E5E7EB;
}

/* SNS 4버튼 그리드 (2x2) — 외부 브랜드 색은 그대로 유지 */
#tsplAuthLayer .tspl-sns-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
#tsplAuthLayer .tspl-sns-grid a{
  display:flex; align-items:center; justify-content:center; gap:6px;
  padding:13px 10px;
  border:1.5px solid #E5E7EB;
  border-radius:10px;
  font-size:12.5px; font-weight:700;
  color:#374151;
  text-decoration:none;
  transition:transform .06s, filter .12s;
}
#tsplAuthLayer .tspl-sns-grid a:hover{ filter:brightness(.96); }
#tsplAuthLayer .tspl-sns-grid a:active{ transform:scale(.98); }
#tsplAuthLayer .tspl-sns-grid .tspl-sns-kakao{
  background:#FEE500; color:#3C1E1E; border-color:#FEE500;
}
#tsplAuthLayer .tspl-sns-grid .tspl-sns-kakao i{ color:#3C1E1E; }
#tsplAuthLayer .tspl-sns-grid .tspl-sns-naver{
  background:#03C75A; color:#fff; border-color:#03C75A;
}
#tsplAuthLayer .tspl-sns-grid .tspl-sns-naver b{
  background:#fff; color:#03C75A;
  width:18px; height:18px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:4px; font-weight:900; font-size:13px;
}
#tsplAuthLayer .tspl-sns-grid .tspl-sns-google{
  background:#fff; color:#3C4043; border-color:#DADCE0;
}
#tsplAuthLayer .tspl-sns-grid .tspl-sns-google i{ color:#4285F4; }
#tsplAuthLayer .tspl-sns-grid .tspl-sns-apple{
  background:#000; color:#fff; border-color:#000;
}
#tsplAuthLayer .tspl-sns-grid .tspl-sns-apple i{ color:#fff; }

/* ═══════════════════════════════════════════════════════
   ★ 지하철 역 HTML 마커 (mk-subway) — 2026-06-01
   - 좌측 호선 색 라인 (여러 호선 = 여러 줄, 낮은 호선부터 좌→우)
   - 우측 역이름 + info 아이콘
   - 아래 작은 꼬리(핀 느낌)
   ═══════════════════════════════════════════════════════ */
.mk-subway {
    position:relative; display:inline-flex; flex-direction:column; align-items:center;
    pointer-events:auto !important;
    font-family:'Pretendard',-apple-system,BlinkMacSystemFont,'Malgun Gothic','맑은 고딕',sans-serif;
    cursor:pointer; user-select:none; -webkit-user-select:none;
    z-index:100;
    transition:filter .12s;
    will-change:auto; backface-visibility:hidden;
}
.mk-subway:hover { filter:brightness(1.03); }
.mk-subway__box {
    display:inline-flex; align-items:stretch;
    background:#fff;
    border:1.5px solid rgba(26,22,32,.14);
    border-radius:8px;
    box-shadow:0 4px 14px rgba(26,22,32,.22);
    overflow:hidden;
    min-height:32px;
}
/* 좌측 호선 색 라인 컨테이너 */
.mk-subway__lines {
    display:flex; flex-direction:row;
    flex-shrink:0;
}
.mk-subway__line {
    /* ★ 색 라인 안에 호선 이름을 세로로 작게 표기 — width 살짝 확대 (2026-06-01) */
    width:14px; height:auto; align-self:stretch;
    background:#94A3B8;
    display:flex; align-items:center; justify-content:center;
    color:#fff;
    font-size:10px;
    font-weight:800;
    line-height:1.05;
    letter-spacing:-0.02em;
    writing-mode:vertical-rl;
    -webkit-writing-mode:vertical-rl;
    text-orientation:upright;
    -webkit-text-orientation:upright;
    padding:3px 0;
    white-space:nowrap;
    text-shadow:0 1px 1px rgba(0,0,0,.18);
    box-sizing:border-box;
}
.mk-subway__line + .mk-subway__line { margin-left:0; }
/* 우측 역이름 + info */
.mk-subway__name {
    display:inline-flex; align-items:center; gap:6px;
    padding:6px 12px 6px 10px;
    font-size:14px; font-weight:800;
    color:#1F2937; letter-spacing:-0.02em;
    white-space:nowrap;
    line-height:1.2;
}
.mk-subway__info {
    font-size:13px; color:#6E47D1;
}
.mk-subway:hover .mk-subway__info { color:#5B35C4; }
/* 꼬리(핀) — 박스 아래 삼각형 */
.mk-subway__tail {
    width:0; height:0;
    border-left:7px solid transparent;
    border-right:7px solid transparent;
    border-top:8px solid #fff;
    filter:drop-shadow(0 2px 2px rgba(26,22,32,.22));
    margin-top:-1px;
}
/* ★ 채팅 카운트 배지 — info 아이콘 위쪽 우상단 붉은색 (2026-06-01)
   진입 시점 이후 새 메시지만 카운트, 줌 16 이상에서만 표시 (bot_map.php 폴러가 갱신) */
.mk-subway__cnt {
    position: absolute;
    top: -9px;
    right: -8px;
    min-width: 18px; height: 16px;
    padding: 0 5px;
    background: #DC2626;
    color: #fff !important;
    border-radius: 999px;
    font-size: 9.5px;
    font-weight: 800;
    line-height: 16px;
    text-align: center;
    letter-spacing: 0;
    box-shadow: 0 2px 6px rgba(220,38,38,.5);
    border: 2px solid #fff;
    box-sizing: content-box;
    pointer-events: none;
    z-index: 1000;
    /* 박스 밖으로 살짝 튀어나오게 — info 아이콘 위쪽 우상단 */
}
/* 작은 마커(--sm)에서는 배지도 살짝 작게 */
.mk-subway--sm .mk-subway__cnt {
    top: -7px; right: -6px;
    min-width: 15px; height: 14px;
    padding: 0 4px;
    font-size: 8.5px;
    line-height: 14px;
    border-width: 1.5px;
}
/* 카운트 증가 시 펄스 (3초간 1회) */
@keyframes mkSubwayCntFlash {
    0%, 100% { transform: scale(1);    box-shadow: 0 1px 3px rgba(220,38,38,.35); }
    20%      { transform: scale(1.5);  box-shadow: 0 0 0 7px rgba(220,38,38,.45); }
    40%      { transform: scale(1.0);  box-shadow: 0 1px 3px rgba(220,38,38,.35); }
    60%      { transform: scale(1.3);  box-shadow: 0 0 0 5px rgba(220,38,38,.30); }
    80%      { transform: scale(1.0);  box-shadow: 0 1px 3px rgba(220,38,38,.35); }
}
.mk-subway__cnt.is-flash {
    animation: mkSubwayCntFlash 3s ease-in-out 1;
    transform-origin: center center;
}

/* ★ 줌 14~15 — 작게 (mk-subway--sm) 2026-06-01 */
.mk-subway--sm .mk-subway__box { min-height:22px; border-width:1px; border-radius:6px; box-shadow:0 3px 10px rgba(26,22,32,.18); }
.mk-subway--sm .mk-subway__line { width:11px; font-size:8.5px; padding:2px 0; }
.mk-subway--sm .mk-subway__name { font-size:11px; padding:3px 8px 3px 7px; gap:4px; }
.mk-subway--sm .mk-subway__info { font-size:10px; }
.mk-subway--sm .mk-subway__tail { border-left:5px solid transparent; border-right:5px solid transparent; border-top:6px solid #fff; }

@media (max-width: 768px) {
    .left-panel.expanded {
        height: calc(100% + 100px) !important;
        z-index: 100050 !important;
    }
}

/* ═══════════════════════════════════════════════════════
   ★ 지도 좌측 버튼 박스 (2026-07-12) — 데스크탑·모바일 공통
   #k1LbtnBox = 재개발~나의분석 4줄(#k1RowRedev/#k1RowAge/#k1RowApply/#k1RowBiz)을 담는 반투명 카드,
   #k1LbtnBoxToggle = 박스 위 좌/우 화살표 (박스 숨김/표시, body.k1-lbox-hidden)
   줄 배치: 재개발/재건축·개발지구 / 노후도·지적도·위성 / 청약·분양 / 상권분석·주요상권·나의분석
   데스크탑: 화살표 top:52(재개발 원위치) + 박스 top:84, 라벨 전체 표시
   모바일: 화살표 top:132 + 박스 top:164, 아이콘만(라벨 접힘) → 토글 ON(.active/.is-on) 시 라벨 확장
   ═══════════════════════════════════════════════════════ */
/* ── 화살표 토글 (박스 맨 위 왼쪽 = 재개발/재건축 원위치) ── */
#k1LbtnBoxToggle {
    display: flex;
    position: absolute;
    top: 52px;
    left: 10px;
    z-index: 201;
    width: 26px;
    height: 26px;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: #fff;
    border: 1px solid #ECECEC;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.02);
    color: #55496E;
    font-size: 11px;
    cursor: pointer;
    transition: opacity .25s ease;
}
#k1LbtnBoxToggle:hover { box-shadow: 0 4px 12px rgba(26,22,32,.16), 0 0 0 1px rgba(26,22,32,.08); }
/* ── 박스 (기본 표시) ── */
#k1LbtnBox {
    display: flex;
    position: absolute;
    top: 84px;                       /* 화살표(52, h26) 아래 */
    left: 10px;
    z-index: 200;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 8px;
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(26,22,32,.08);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(26,22,32,.14);
    backdrop-filter: blur(6px);
    max-width: calc(100vw - 20px);
    transition: transform .32s cubic-bezier(.22,1,.36,1), opacity .28s ease;
}
/* 숨김 — 왼쪽으로 슬라이드아웃 (화살표는 남음) */
body.k1-lbox-hidden #k1LbtnBox {
    transform: translateX(calc(-100% - 16px));
    opacity: 0;
    pointer-events: none;
}
/* ── 박스 내부 줄 — 버튼별 absolute 해제, 세로 순서 고정 ── */
.k1-lbtn-row {
    display: flex;
    position: static;
    gap: 5px;
    align-items: center;
    flex-wrap: wrap;                 /* 상태필터 등이 넘치면 다음 줄로 */
    max-width: calc(100vw - 40px);
}
#k1RowRedev { order: 1; }            /* 재개발/재건축·개발지구 */
#k1RowAge   { order: 2; }            /* 노후도·지적도·위성 (bot_building_age.js 주입) */
#k1RowApply { order: 3; }            /* 청약·분양·상태필터 */
#k1RowBiz   { order: 4; }            /* 상권분석·주요상권·나의분석 */
.k1-lbtn-row .k1-map-lbtn {
    position: static !important;     /* 버튼별 absolute 좌표 해제 → flex 흐름 */
    top: auto !important;
    left: auto !important;
    display: inline-flex;
}
/* 노후도 옆 지적도/위성 래퍼 — JS place() 인라인 top/left 무력화 (박스 flex 흐름) */
#k1RowAge #cgMapLayerToggles {
    position: static !important;
    top: auto !important;
    left: auto !important;
    display: flex;
    gap: 5px;
}
.k1-lbtn-row #applyStatusFilter {
    position: static !important;
    top: auto !important;
    left: auto !important;
}

@media (max-width: 1023px) {
    #k1LbtnBoxToggle { top: 132px; }     /* 모바일: 테마 버튼(top:90) 아래 */
    #k1LbtnBox { top: 164px; padding: 7px; }
    /* ★ 아파트/오피스텔·건물/토지 IW 열림(body.k1-iw-open, bot_map.php MutationObserver) —
       박스+화살표 모두 숨김, IW 닫히면 자동 복귀 (2026-07-12) */
    body.k1-iw-open #k1LbtnBox {
        transform: translateX(calc(-100% - 16px));
        opacity: 0;
        pointer-events: none;
    }
    body.k1-iw-open #k1LbtnBoxToggle {
        opacity: 0;
        pointer-events: none;
    }
    /* ── 모바일: 아이콘 전용(라벨 접힘) → 토글온 시 확장 ── */
    .k1-lbtn-row .k1-map-lbtn { padding: 6px 8px; }
    .k1-lbtn-row .k1-map-lbtn span {
        display: inline-block;
        max-width: 0;                    /* 접힘 — 아이콘만 */
        opacity: 0;
        margin-left: 0;
        overflow: hidden;
        white-space: nowrap;
        vertical-align: middle;
        transition: max-width .32s cubic-bezier(.4,0,.2,1), opacity .25s ease, margin-left .32s ease;
    }
    .k1-lbtn-row .k1-map-lbtn.active span,
    .k1-lbtn-row .k1-map-lbtn.is-on span {
        max-width: 96px;                 /* 토글온 → 라벨 확장, 옆 버튼 자연 밀림 (.is-on = 노후도/지적도/위성) */
        opacity: 1;
        margin-left: 4px;
    }
}