@import url("./gis.css");

/* ═══ realtor 3D 분석 모달 — CSS 변수 브리지 (yhgis 미정의 토큰) ═══ */
.scene-modal, #parcelActionBtn {
    --header-height: 56px;
    --radius: 4px;
    --surface: #FFFFFF;
    --text: #1F2937;
    --text-secondary: #4B5563;
    --text-muted: #6B7280;
    --bg: #F9FAFB;
    --border: #E5E7EB;
    --border-light: #F3F4F6;
    --primary: #1B3C6E;
    --primary-light: #4A6FA5;
    --accent: #D32F2F;
    --accent-light: #FCA5A5;
}

/* ═══ 3D Modal 스프라이트 리소스 변수 ═══ */
:root {
    /*--modal3d-resource-url: url(../img/gis/spr_3d.svg);*/
    --modal3d-resource-url: url(../../img/gis/spr_3d.svg);
    --modal3d-resource-size: 18.4rem auto;
}

/* ═══ 3D 모달 기본 구조 ═══ */
.esri-identity-modal { z-index: 2000000 !important; }
.scene-modal {position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.5); z-index:100000; display:flex; flex-direction:column;}
.scene-modal * {line-height:1.5;}
.scene-modal .esri-ui-inner-container {inset:2.5rem 2rem !important;}

.scene-modal-header {height:6rem; display:flex; justify-content:space-between; align-items:center; padding:0 2rem; gap:1.6rem; background:linear-gradient(135deg,#1B3C6E 0%,#2B5EA7 100%); color:white; box-shadow:0 .2rem .8rem rgba(0,0,0,.2); flex-shrink:0;}
.scene-modal-header h3 {display:flex; align-items:center; margin:0; font-size:1.8rem; font-weight:700; letter-spacing:-.03rem;}
.scene-modal-header h3 strong {display:block; width:25.3rem; height:2.8rem; background:url(../../img/gis/logo.png) no-repeat 0 0 / contain; text-indent:-999px; overflow:hidden; margin-right:1.5rem;}

.scene-close-btn {background:rgba(255,255,255,.15) url(../../img/gis/btn_modal_close.svg) no-repeat 50% 50% / contain; width:3.6rem; height:3.6rem; cursor:pointer; border-radius:9em; transition:all .2s; font-family:inherit; text-indent:-999px; overflow:hidden;}
.scene-close-btn:hover {background-color:rgba(255,255,255,.2);}

.scene-modal-body {display:flex; position:relative; overflow:hidden; flex-grow:1; padding-left:26rem; transition:.3s all; -webkit-transition:.3s all;}
.scene-modal-body .scene-toolbar-control {position:absolute; top:2.5rem; left:calc(26rem + 2rem); width:4.4rem; height:4.4rem; border-radius:100%; background:#fff url(../../img/gis/btn_pannel_close.svg) no-repeat 50% 50% / contain; text-indent:-999px; overflow:hidden; transition:.3s all; -webkit-transition:.3s all; z-index:100;}
.scene-modal-body.panel-close {padding-left:0;}
.scene-modal-body.panel-close .scene-toolbar {transform:translateX(-100%); -webkit-transform:translateX(-100%);}
.scene-modal-body.panel-close .scene-toolbar-control {left:2rem; transform:rotate(180deg); -webkit-transform:rotate(180deg);}
@media all and (max-width:1024px) {.scene-modal-body {padding-left:0;}}

/* ═══ 사이드 툴바 ═══ */
.scene-toolbar {display:block; position:absolute; top:0; left:0; bottom:0; width:26rem; background:#FFFFFF; color:#1F2937; padding:2rem; overflow-y:auto; box-shadow:.2rem 0 .8rem rgba(0,0,0,.04); transition:.3s all; -webkit-transition:.3s all; z-index:99;}
.scene-tool-group {margin-bottom:1.8rem;}
.scene-tool-group h4 {font-size:2rem; color:#0077B3; font-weight:800; margin-bottom:1.5rem;}

.scene-tool-btn {display:block; width:100%; padding:1.2rem 4rem 1.2rem 2rem; margin-bottom:.6rem; background:#fff url(../../img/gis/ico_3d_menu_off.svg) no-repeat top 50% right 1.6rem / 2.3rem auto; border:1px solid #DCE5EA; border-radius:1rem; color:#555; font-size:1.6rem; text-align:left; transition:all .15s; font-family:inherit; cursor:pointer;}
.scene-tool-btn:hover:not(:disabled):not(.active) {background-color:#F0F2F5;}
.scene-tool-btn:disabled {opacity:.4; cursor:not-allowed;}
.scene-tool-btn.active {background-color:#0077B3; color:#fff; border-color:#0077B3; font-weight:600; background-image:url(../../img/gis/ico_3d_menu_on.svg);}
.scene-toolbar-btn:before {content:""; display:block; width:2.4rem; height:2.4rem; margin:0 auto; background-image:var(--modal3d-resource-url); background-repeat:no-repeat; background-size:var(--modal3d-resource-size); background-position:-9rem -5rem;}
/* [R12] 아이콘 키를 title → data-tool-name으로 이전 (R11에서 title이 설명 툴팁으로 바뀌며 매칭 유실).
   선택자 이름은 우리 도구명(직선·치수)을 따른다 — 벤더 원본은 거리·치수표시. */
.scene-toolbar-btn[data-tool-name="면적"]:before {background-position-y:-14.6rem;}
.scene-toolbar-btn[data-tool-name="직선"]:before {background-position-y:-5rem;}
.scene-toolbar-btn[data-tool-name="가시선"]:before {background-position-y:-7.4rem;}
.scene-toolbar-btn[data-tool-name="가시권"]:before {background-position-y:-17rem;}
.scene-toolbar-btn[data-tool-name="치수"]:before {background-position-y:-9.8rem;}
.scene-toolbar-btn[data-tool-name="단면"]:before {background-position-y:-12.2rem;}
.scene-toolbar-btn.active:before {background-position-x:-13rem;}

.scene-clear-btn {text-align:center; margin-top:4rem; background:#002950; border-color:#002950; color:#fff; padding:1.2rem 2rem; font-weight:700;}
.scene-clear-btn:hover:not(:disabled):not(.active) {background:#00203f !important;}

.scene-util-btn {color:#0077B3; border-color:#DCE5EA;}
.scene-util-btn:hover:not(:disabled) {background:#EEF5FA; color:#0077B3; border-color:#0077B3;}
.scene-util-btn.active {background:#EEF5FA; color:#0077B3; border-color:#0077B3;}

/* ═══ 미니맵 ═══ */
.scene-minimap-container {position:absolute; top:1rem; right:1rem; width:26rem; height:23.3rem; border:.7rem solid #fff; border-bottom-width:0; border-radius:1.5rem; z-index:50; background:#fff; box-shadow:0 .2rem .8rem rgba(0,0,0,.3); overflow:hidden;}
.scene-minimap-view {width:100%; height:18rem; background:rgba(0,0,0,.5); border-radius:1rem;}
.scene-minimap-label {position:absolute; top:1rem; left:1rem; background:#0077B3; color:white; padding:.4rem .7rem; font-size:1.2rem; border-radius:.5rem; z-index:51; pointer-events:none;}
.scene-minimap-toggle {position:absolute; bottom:0; left:0; right:0; height:4.6rem; display:flex; align-items:center; justify-content:center; gap:1.5rem; z-index:52; padding:0; font-size:1.6rem; color:#555; font-weight:600;}
.minimap-toggle-label {color:inherit; font-size:inherit; font-weight:inherit;}
.minimap-switch {position:relative; display:inline-block; width:5rem; height:2.6rem;}
.minimap-switch input {opacity:0; width:0; height:0;}
.minimap-switch-slider {position:absolute; cursor:pointer; top:0; left:0; right:0; bottom:0; background-color:#777777; border-radius:1.8rem; transition:.3s;}
.minimap-switch-slider:before {content:""; position:absolute; height:2rem; width:2rem; left:.3rem; bottom:.3rem; background-color:white; border-radius:50%; transition:.3s;}
.minimap-switch input:checked + .minimap-switch-slider {background-color:#0077B3;}
.minimap-switch input:checked + .minimap-switch-slider:before {transform:translateX(2.5rem);}

/* ═══ 도구모음 패널 ═══ */
.scene-toolbar-panel {position:absolute; top:1rem; left:8rem; width:28rem; background:#FFFFFF; border-radius:1.5rem; padding:2rem; z-index:50; box-shadow:0 .2rem .8rem rgba(0,0,0,.15);}
.scene-toolbar-panel h4 {margin:0 0 1.8rem 0; font-size:2rem; color:#222; font-weight:700;}
.scene-toolbar-actions {display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; margin-bottom:1.8rem;}
.scene-toolbar-btn {padding:1.6rem .4rem; font-size:1.5rem; background:#EEF5FA; border:none; border-radius:1rem; cursor:pointer; transition:all .15s; text-align:center;}
.scene-toolbar-btn:hover {background:#e6edf1;}
.scene-toolbar-btn.active {background:#002950; color:white;}
.scene-toolbar-btn-label {display:block; font-size:1.5rem; margin-top:.8rem; color:#222;}
.scene-toolbar-btn.active .scene-toolbar-btn-label {color:white;}
.scene-toolbar-prompt {font-size:1.4rem; color:#555; padding:1rem 0 0; border-top:.1rem solid #DCE5EA; white-space:pre-line;}   /* [R11] 하단 힌트 2줄 표시 */
.scene-toolbar-buttons {display:flex; gap:.5rem; margin-top:2rem;}
.scene-toolbar-buttons button {flex:1; padding:.8rem; font-size:1.6rem; border-radius:1rem; cursor:pointer;}
.toolbar-btn-clear {color:#0077B3; border:.1rem solid rgba(0,119,179,0.7);}
.toolbar-btn-clear:hover {background:#EEF5FA;}
.toolbar-btn-done {background:#0077B3; color:white; border:none;}
.toolbar-btn-done:hover {background:#006CA2;}

/* ═══ 높이 강조 패널 ═══ */
.scene-highlight-panel {background:#EEF5FA; border-radius:1rem; padding:1.5rem 1.2rem; margin:1rem 0;}
.scene-highlight-panel label {font-size:1.5rem; color:#555;}
.scene-highlight-panel label span {font-weight:800; color:#0077B3;}
.scene-highlight-panel input[type="range"] {width:100%;}
.highlight-legend {margin-top:1rem; display:flex; gap:1.5rem; flex-wrap:wrap;}
.highlight-legend .legend-item {display:flex; align-items:center; gap:.5rem; font-size:1.5rem; color:#555;}
.highlight-legend .legend-color {display:inline-block; width:1rem; height:1rem; border-radius:9em;}

/* ═══ 영역 필터 패널 ═══ */
.scene-filter-panel {background:#EEF5FA; border-radius:1rem; padding:1.5rem 1.2rem; margin:1rem 0;}
.filter-mode-toggle {display:flex; gap:.5rem; margin-bottom:1rem;}
.filter-mode-btn {flex:1; padding:.4rem .5rem; background:#FFFFFF; border:1px solid rgba(171,197,210,0.7); border-radius:1rem; font-size:1.5rem; cursor:pointer; color:#456787; transition:all .15s;}
.filter-mode-btn:hover {background:#F3F4F6;}
.filter-mode-btn.active {background:#002950; color:white; border-color:#002950;}
.filter-draw-btn {display:flex; align-items:center; justify-content:center; gap:1rem; width:100%; height:5rem; border-radius:1rem; background:#0077B3; color:#fff; font-size:1.8rem; border:none; cursor:pointer;}
.filter-draw-btn:before {content:""; display:block; position:relative; width:2.2rem; height:2.2rem; background-image:var(--modal3d-resource-url); background-repeat:no-repeat; background-size:var(--modal3d-resource-size); background-position:-13rem 0;}
.filter-draw-btn:hover {background:#006CA2;}
.filter-draw-btn.active {background:#002950;}
.filter-info {display:block; margin-top:.5rem; font-size:1.5rem; color:#555;}
.filter-info span {font-weight:700; color:#0077B3;}
.filter-clear-btn {width:100%; border-radius:1rem; margin-top:1.5rem; background:#222; color:#fff; text-align:center; padding:.7rem; font-size:1.6rem; border:none; cursor:pointer;}
.filter-clear-btn:hover {background:#000;}

/* ═══ 신축건물 시뮬 패널 ═══ */
.scene-building-panel {background:#EEF5FA; border-radius:1rem; padding:1.5rem 1.2rem; margin:1rem 0;}
.scene-building-panel label {font-size:1.5rem; color:#555;}
.scene-building-panel label span {font-weight:800; color:#0077B3;}
.scene-building-panel label span + span {font-weight:inherit; color:inherit;}
.scene-building-panel input[type="range"] {width:100%;}

.scene-clear-sub-btn {background:#D93025 !important; color:#fff !important; border:none !important; text-align:center; padding:.7rem; font-size:1.6rem; margin:0;} /* [R22] 위험 동작 빨간색 */
.scene-clear-sub-btn:hover {background:#B3271E !important;}

/* ═══ 시뮬 단위 토글 ═══ */
.sim-unit-toggle {display:flex; gap:.5rem; margin-bottom:1rem;}
.sim-unit-btn {flex:1; padding:.4rem .5rem; background:#FFFFFF; border:1px solid rgba(171,197,210,0.7); border-radius:1rem; font-size:1.5rem; cursor:pointer; color:#456787; transition:all .15s;}
.sim-unit-btn:hover {background:#F3F4F6;}
.sim-unit-btn.active {background:#002950; color:white; border-color:#002950;}
.sim-unit-panel {display:block; position:relative; padding:1rem; border-radius:.5rem; background:#fff; margin:1rem 0 1.5rem;}

/* ═══ 시뮬 건물 목록 ═══ */
.sim-list-header {font-size:1.4rem; font-weight:700; color:#002950; margin-bottom:.7rem;}
.sim-list-container {max-height:20rem; overflow-y:auto;}
.sim-list-empty {color:#9CA3AF; font-size:1.4rem; text-align:center; padding:1.2rem .4rem; word-break:keep-all;}
.sim-list-item {display:flex; align-items:center; padding:.6rem .8rem; gap:.8rem; border-radius:.5rem; cursor:pointer; font-size:1.5rem; color:#333; transition:background .1s;}
.sim-list-item:hover {background:#F3F4F6;}
.sim-list-item em {display:flex; width:1.6rem; height:1.6rem; border-radius:9em; font-size:1.2rem; font-weight:700; justify-content:center; align-items:center; background:#555; color:#fff;}
.sim-list-item.selected {background:#FFF4E6;}
.sim-list-item.selected em {background:#FF7F00;}
.sim-list-label {color:#1B3C6E; font-weight:500;}
.sim-list-size {color:#6B7280; font-weight:400; margin-left:.4rem;}
.sim-list-actions {display:flex; align-items:center; gap:.5rem; margin-left:auto; flex-shrink:0;}
.sim-list-btn {display:block; width:2.4rem; height:2.4rem; border-radius:.6rem; background-image:var(--modal3d-resource-url); background-repeat:no-repeat; background-size:27.6rem auto; background-position:-13.5rem 0; transition:background-color .15s; border:none; cursor:pointer; text-indent:-999px; overflow:hidden;}
.sim-list-btn:hover {background-color:#EEF5FA;}
/* [R22] 위험 동작 빨간색 — 스프라이트 대신 흰 ✕ + 빨간 배경 */
.sim-list-btn-danger { margin-left:0; background-image:none; background-color:#D93025; text-indent:0; color:#fff; font-size:1.4rem; font-weight:700; line-height:2.4rem; text-align:center; }
.sim-list-btn-danger:hover { background-color:#B3271E; }

.sim-draw-toggle {display:block; width:100%; margin:1rem 0 0; padding:.8rem; border-radius:1rem; font-size:1.5rem; font-weight:700; background:#0077B3; color:#fff; border:1px solid #0077B3; transition:all .15s; cursor:pointer;}
.sim-draw-toggle:hover {background:#006CA2;}
.sim-draw-toggle:not(.drawing) {background:#fff; color:#0077B3; border-color:rgba(0,119,179,.7);}
.sim-draw-toggle:not(.drawing):hover {background:#EEF5FA;}

/* ═══ 기타 ═══ */
.scene-info {margin-top:1.4rem; padding:1rem 1.2rem; background:#F9FAFB; color:#6B7280; border:.1rem solid #F3F4F6; border-radius:.4rem; font-size:1.1rem; line-height:1.6;}
.scene-view-container {flex:1; position:relative;}

/* ═══ 디버그 패널 ═══ */
.scene-debug-panel {display:none; max-height:30vh; background:#F9FAFB; color:#4B5563; font-size:1.1rem; padding:.6rem 1.4rem; overflow-y:auto; border-top:.1rem solid #E5E7EB; flex-shrink:0;}
.scene-debug-panel.debug-enabled {display:block;}
.scene-debug-panel details summary {cursor:pointer; color:#4B5563; font-weight:500; padding:.4rem 0; user-select:none;}
.scene-debug-panel details[open] summary {border-bottom:.1rem solid #F3F4F6; margin-bottom:.4rem;}
.scene-debug-panel pre {margin:0; font-family:'Consolas',monospace; color:#1F2937; white-space:pre-wrap; word-break:break-all; line-height:1.5; user-select:text; -webkit-user-select:text;}
.scene-debug-copy-btn {margin-left:1rem; padding:.2rem .8rem; background:#FFFFFF; color:#1B3C6E; border:.1rem solid #E5E7EB; border-radius:.4rem; font-size:1.1rem; cursor:pointer; font-family:inherit; transition:all .15s;}
.scene-debug-copy-btn:hover {background:#EEF4FA; border-color:#4A6FA5;}
.scene-debug-copy-btn:active {background:#1B3C6E; color:white;}
.scene-log-info {color:#1F2937;}
.scene-log-warn {color:#B45309;}
.scene-log-error {color:#D32F2F; font-weight:500;}
.debug-only {display:none !important;}
body.debug-mode .debug-only {display:revert !important;}

/* ═══ esri attribution 숨김 ═══ */
.esri-ui-manual-container > .esri-component,
.esri-attribution .esri-attribution__sources {z-index:-9999; opacity:0;}

/* ═══ 필지 플로팅 버튼 ═══ */
#parcelActionBtn {
    position: fixed;
    z-index: 10000;
    background: white;
    border: 2px solid #1B3C6E;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    padding: 4px;
    display: flex; gap: 4px; align-items: center;
    pointer-events: auto;
}
#parcelActionBtn .parcel-3d-btn {
    background: #1B3C6E; color: white; border: none;
    padding: 6px 12px; border-radius: 4px;
    font-size: 12px; font-weight: 600;
    cursor: pointer; white-space: nowrap;
}
#parcelActionBtn .parcel-3d-btn:hover {background: #163253;}
#parcelActionBtn .parcel-close-btn {
    background: #F3F4F6; border: 1px solid #E5E7EB;
    border-radius: 4px; width: 24px; height: 24px;
    font-size: 12px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    padding: 0;
}
#parcelActionBtn .parcel-close-btn:hover {background: #FEE2E2; color: #DC2626;}

/*********************************************************
    3D GIS Widget Custom
*********************************************************/

.scene-modal .esri-ui-top-left {display:block; top:6rem; padding:0 .5rem;}
.scene-modal .esri-ui-top-left .esri-component {display:flex; flex-direction:column; border-radius:1.7em; background:#fff; overflow:hidden; margin-bottom:.8rem;}
.scene-modal .esri-ui-top-left .esri-widget--button {width:3.4rem; height:3.4rem;}
.scene-modal .esri-ui-top-left .esri-component .esri-widget--button {background-image:var(--modal3d-resource-url); background-repeat:no-repeat; background-size:var(--modal3d-resource-size); background-position:0 0; border-bottom:1px solid #DFE4EF; text-indent:-999px; overflow:hidden;}
.scene-modal .esri-ui-top-left .esri-component .esri-widget--button:hover,
.scene-modal .esri-ui-top-left .esri-component .esri-widget--button:focus {background-color:#EEF5FA;}
.scene-modal .esri-ui-top-left .esri-component .esri-widget--button.active {background-position-x:-4rem; background-color:#0077B3;}
.scene-modal .esri-ui-top-left .esri-component .esri-widget--button:last-child {border-bottom-width:0; border-top-width:0;}
.scene-modal .esri-ui-top-left .esri-component .esri-widget--button.zoom-in {background-position-y:-6.8rem;}
.scene-modal .esri-ui-top-left .esri-component .esri-widget--button.zoom-out {background-position-y:-10rem;}
.scene-modal .esri-ui-top-left .esri-component .esri-widget--button.move {background-position-y:-13.2rem;}
.scene-modal .esri-ui-top-left .esri-component .esri-widget--button.rotate {background-position-y:-16.6rem;}
.scene-modal .esri-ui-top-left .esri-component .esri-widget--button.compass {background-position-y:-20rem;}
.scene-modal .esri-ui-top-left .esri-component .esri-widget--button.home {background-position-y:-23.4rem;}
.scene-modal .esri-ui-top-left .esri-component .esri-widget--button.fullscreen {background-position-y:-26.8rem;}

.scene-modal .esri-basemap-gallery {width:28rem;} /* [R16] 2항목 리스트에 맞게 축소 */
.scene-modal .esri-basemap-gallery:focus-within {outline:none;}
.scene-modal .esri-expand {display:flex; flex-direction:row-reverse; background:transparent; box-shadow:none !important; gap:2rem;}
.scene-modal .esri-expand .esri-widget--button,
.scene-modal .esri-expand .esri-widget--button button {width:3.4rem; height:3.4rem; border-radius:100%; overflow:hidden;}
.scene-modal .esri-expand .esri-widget--button {background-image:var(--modal3d-resource-url); background-repeat:no-repeat; background-size:var(--modal3d-resource-size); background-position:0 -3.4rem; background-color:#fff;}
.scene-modal .esri-expand .esri-widget--button button {display:block; position:relative; white-space:nowrap; opacity:0;}
.scene-modal .esri-expand__popover-content {display:block; position:relative; background:#fff; padding:.7rem; border-radius:1.5rem;}
.scene-modal .esri-expand__content-container,
.scene-modal .esri-view-height-medium .esri-expand__popover-content .esri-widget--panel {height:auto; max-height:50rem;} /* [R16] 고정 70vh → 항목 수에 맞는 자동 높이 */
.scene-modal .esri-basemap-gallery__item-container {gap:0;}
.scene-modal .esri-basemap-gallery__item {padding:.5rem; border-radius:1rem; border:none; font-size:1.6rem;}
.scene-modal .esri-basemap-gallery__item img {border-radius:.5rem; overflow:hidden;}
.scene-modal .esri-basemap-gallery__item-content {display:block;}
.scene-modal .esri-basemap-gallery__item-content > * {display:inline-block; vertical-align:middle;}
.scene-modal .esri-basemap-gallery__item-title {display:inline; width:auto; font-size:1em; color:#222;}
.scene-modal .esri-basemap-gallery__item-title span {display:inline; font-size:1em; width:auto;}
.scene-modal .esri-basemap-gallery__item-tags-container {font-size:1.5rem; padding:.3rem 1.5rem; border-radius:9em; background:rgba(0,119,179,0.08); color:#0077B3;}
.scene-modal .esri-basemap-gallery__item--selected,
.scene-modal .esri-basemap-gallery__item.esri-basemap-gallery__item--selected:hover,
.scene-modal .esri-basemap-gallery__item.esri-basemap-gallery__item--selected:focus {background:#EEF5FA; color:#0077B3;}
.scene-modal .esri-basemap-gallery__item.esri-basemap-gallery__item--selected .esri-basemap-gallery__item-title {color:#0077B3; font-weight:800;}

.scene-modal .esri-ui-corner .esri-widget-custom {display:flex; flex-direction:column; position:relative; width:43rem; max-width:80vw; max-height:80vh !important; gap:1.8rem; border-radius:1.5rem; padding:2rem; background:#fff;}
.esri-widget-custom h3 {font-size:2rem; font-weight:700; line-height:1.5;}
.esri-widget-custom .esri-widget-section {display:flex; flex-direction:column; gap:1.2rem;}

/* [R12] 신축건물 시연 그리기 중 하단 안내 토스트 */
#simDrawHint {
  position: absolute; left: 50%; bottom: 24px; transform: translateX(-50%);
  z-index: 50; padding: 9px 22px; border-radius: 22px;
  background: rgba(13, 43, 82, .88); color: #fff; font-size: 14px;
  pointer-events: none; display: none;
}

/* [R21] 우측 상단 화면 저장 — 베이스맵 버튼과 동일 원형 톤 */
.scene-modal .esri-ui-top-right .scene-shot-btn {width:3.4rem; height:3.4rem; border:none; border-radius:100%; background:#fff; cursor:pointer; padding:0; display:flex; align-items:center; justify-content:center;}
.scene-modal .esri-ui-top-right .scene-shot-btn:hover {background:#EEF5FA;}
.scene-modal .esri-ui-top-right .scene-shot-btn svg {width:1.8rem; height:1.8rem;}

/* [R21] 호버 슬라이드 라벨 (베이스맵·화면 저장) — 왼쪽으로 페이드+슬라이드 */
.rt-btn {position:relative;}
.rt-btn .rt-label {
  position:absolute; right:calc(100% + 8px); top:50%;
  transform:translateY(-50%) translateX(6px);
  background:rgba(13,43,82,.9); color:#fff; font-size:12.5px;
  padding:5px 10px; border-radius:14px; white-space:nowrap;
  opacity:0; pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
  z-index:60;
}
.rt-btn:hover .rt-label {opacity:1; transform:translateY(-50%) translateX(0);}
.scene-modal .esri-expand--expanded .rt-label {display:none;} /* 갤러리 펼친 상태에선 라벨 숨김 */

/* [R17] 중개사무소 카드 팝업 — 남색 헤더 + 흰 카드 */
#brkPopup {position:absolute; z-index:120; width:30rem; max-width:80vw; background:#fff; border-radius:1.2rem; box-shadow:0 .4rem 1.6rem rgba(0,0,0,.25); overflow:hidden; display:none;}
#brkPopup .brk-head {display:flex; align-items:center; justify-content:space-between; background:#002950; color:#fff; padding:1rem 1.4rem; font-size:1.5rem; font-weight:700;}
#brkPopup .brk-head button {background:none; border:none; color:#fff; font-size:2.2rem; line-height:1; cursor:pointer; padding:0 .2rem;}
#brkPopup .brk-list {max-height:36rem; overflow-y:auto; padding:.4rem 0;}
#brkPopup .brk-item {padding:1rem 1.4rem; border-bottom:1px solid #EFF2F6;}
#brkPopup .brk-item:last-child {border-bottom:none;}
#brkPopup .brk-title {font-size:1.5rem; font-weight:700; color:#222; line-height:1.4;}
#brkPopup .brk-ceo {font-weight:400; color:#556; font-size:1.3rem; margin-left:.4rem;}
#brkPopup .brk-badge {display:inline-block; margin-left:.4rem; padding:.15rem .8rem; border-radius:9em; font-size:1.1rem; font-weight:600; vertical-align:middle;}
#brkPopup .brk-badge-ex {background:#E8F1FB; color:#0B5CAB;}
#brkPopup .brk-addr {font-size:1.3rem; color:#555; margin-top:.3rem; line-height:1.4;}
#brkPopup .brk-tel {font-size:1.3rem; color:#0B5CAB; margin-top:.3rem;}

/* [R10] 가시권 보기 패널 안내문 */
.esri-widget-custom .vs-prompt {font-size:1.4rem; color:#556; text-align:center; line-height:1.5;}

/* [R13] 일조권 보기 사용 안내 박스 — sdrBox 톤 */
.esri-widget-custom #dlGuideBox {padding:1.2rem 1.4rem; border:1px solid #DFE4EF; border-radius:1rem; background:#F7FAFD; font-size:1.4rem; color:#556; line-height:1.5; text-align:center;}

/* [R14] 패널 공통 닫기(X) 버튼 */
.panel-close-btn {
  position: absolute; top: 8px; right: 8px;
  width: 34px; height: 34px; line-height: 1;
  border: none; border-radius: 50%; cursor: pointer;
  background: #EEF2F7; color: #334; font-size: 22px; font-weight: 700;
  padding: 0; z-index: 60;
}
.panel-close-btn:hover { background: #DDE5EE; color: #000; }

/* [R13] 건물간섭 시연 사용 안내 박스 */
#simGuideBox {padding:.8rem 1rem; border:1px solid #DFE4EF; border-radius:1rem; background:#F7FAFD; margin-bottom:.8rem;}
#simGuideBox ol {margin:0; padding-left:1.7rem;}
#simGuideBox li {font-size:1.25rem; color:#556; line-height:1.45; list-style:decimal;}
.esri-widget-custom .box {display:flex; flex-wrap:wrap; border:1px solid #DFE4EF; border-radius:1rem; overflow:hidden;}
.esri-widget-custom .box > * {flex-grow:1;}
.esri-widget-custom .box h4 {width:100%; text-align:center; padding:1.7rem 2rem 0; color:#0077B3; font-weight:700;}
.esri-widget-custom .box .ani-plays {flex-shrink:0; width:3.4rem; flex-grow:0;}
.esri-widget-custom .box .ani-plays button {display:block; position:relative; width:100%; height:100%; background:#002950; text-indent:-999px;}
.esri-widget-custom .box .ani-plays button:before {content:""; display:block; position:absolute; top:50%; left:50%; width:1.4rem; height:1.4rem; background-image:var(--modal3d-resource-url); background-repeat:no-repeat; background-size:var(--modal3d-resource-size); background-position:0 0; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);}
.esri-widget-custom .box .ani-plays button.play:before {background-position:-16rem -12rem;}
.esri-widget-custom .box .ani-plays button.stop:before {background-position:-16rem -14.4rem;}
.esri-widget-custom .box .esri-shadow-cast__time-range {width:100%; text-align:center; margin-top:1.7rem; font-weight:700; color:#0077B3;}
.esri-widget-custom .box .sliderBar {flex:1 1 0; min-width:0;}
.esri-widget-custom .box .calendar {flex:1 1 0; min-width:0;}

/* [KGeo R5] 그림자 지점 결과 박스 */
.esri-widget-custom #sdrBox {padding:1.2rem 1.4rem; border:1px solid #DFE4EF; border-radius:1rem; background:#F7FAFD; text-align:center;}
.esri-widget-custom #sdrGuide,
.esri-widget-custom .sdr-label {font-size:1.4rem; color:#556;}
.esri-widget-custom .sdr-time {font-size:3rem; font-weight:700; color:#E8650A; line-height:1.2;}

/* [KGeo R8] 고도 위젯 래퍼 (R9: 내장 힌트 자리에서 문구 교체) */
.ep-wrap {display:flex; flex-direction:column; gap:.8rem; min-width:32rem; max-width:80vw;}

/* [KGeo R8-b] 지도 하단 중앙 플로팅 [새로 생성] 버튼 */
#epNewBtn {
  position:absolute; left:50%; bottom:24px; transform:translateX(-50%);
  z-index:50; padding:10px 26px; border:none; border-radius:24px;
  background:#0077B3; color:#fff; font-size:15px; font-weight:600;
  cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.25); display:none;
}
#epNewBtn:hover {background:#005f8f;}

.esri-widget-custom .btns {display:flex; gap:.5rem; flex-wrap:wrap;}
.esri-widget-custom .btns button {display:flex; flex-grow:1; align-items:center; justify-content:center; height:4rem; border:1px solid rgba(0,119,179,0.7); border-radius:1rem; font-size:1.6rem; color:#0077B3;}
.esri-widget-custom .btns button.active {border-color:#0077B3; background-color:#0077B3; color:#fff;}

.esri-widget-custom .color-pick {display:flex; align-items:center; gap:1rem; color:#222; font-size:1.8rem;}
.esri-widget-custom .color-pick .btn-color-pick {width:1.6rem; height:1.6rem; border-radius:.4rem; background:#555; text-indent:-999px; overflow:hidden;}

.esri-widget-custom .switch-check {position:relative; overflow:hidden;}
.esri-widget-custom .switch-check input[type="checkbox"],
.esri-widget-custom .switch-check input[type="radio"] {position:absolute; left:-100px; top:-100px; opacity:0; z-index:-999;}
.esri-widget-custom .switch-check label {display:block; width:100%; position:relative; font-size:1.8rem; font-weight:700;}
.esri-widget-custom .switch-check label:before {content:""; display:block; position:absolute; top:50%; right:0; width:5rem; height:2.6rem; border-radius:1.3rem; background:#D9D9D9; transform:translateY(-50%); transition:background .25s ease;}
.esri-widget-custom .switch-check label:after {content:""; display:block; position:absolute; top:50%; right:2.7rem; width:2rem; height:2rem; border-radius:50%; background:#fff; transform:translateY(-50%); transition:right .25s ease;}
.esri-widget-custom .switch-check input:checked + label:before {background:#0077B3;}
.esri-widget-custom .switch-check input:checked + label:after {right:.3rem;}

.esri-widget-custom .sliderBar {padding:2rem;}
.esri-widget-custom .esri-slider.esri-slider--horizontal {padding:3.5rem 1rem 6rem;}
.esri-widget-custom .sliderBar .esri-slider__label {top:-3.5rem !important; font-size:1.4rem !important; color:#0077B3; font-weight:700; margin:0 0 0 -.3rem !important;}
.esri-widget-custom .esri-slider--horizontal .esri-slider__track {height:.6rem; border-radius:9em; background:#DFE4EF;}
.esri-widget-custom .esri-slider.esri-slider--horizontal .esri-slider__ticks {margin-top:.8rem;}
.esri-widget-custom .esri-slider.esri-slider--horizontal .esri-slider__tick.primary-tick:after {height:1.2rem; background:#DFE4EF;}
.esri-widget-custom .esri-slider.esri-slider--horizontal .esri-slider__tick {height:.6rem; background:#DFE4EF;}
.esri-widget-custom .esri-slider.esri-slider--horizontal .esri-slider__tick-label {margin-top:2.3rem; color:#555; font-size:1.4rem;}
.esri-widget-custom .esri-slider.esri-slider--horizontal .esri-slider__thumb {top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%);}

.esri-widget-custom input[type="text"],
.esri-widget-custom input[type="number"],
.esri-widget-custom select {display:block; position:relative; width:100%; border:none; height:5rem; padding:0 2rem; font-size:1.8rem; color:#222; z-index:0;}
.esri-widget-custom select {appearance:none; -webkit-appearance:none; -moz-appearance:none; background-image:url(../../img/gis/ico_select_arrow.svg); background-repeat:no-repeat; background-size:1.4rem 1.4rem; background-position:right 1.5rem top 50%;}
.esri-widget-custom select::-ms-expand {display:none;}

.esri-widget-custom .calendar {display:block; position:relative;}
.esri-widget-custom .calendar:before {content:""; display:block; position:absolute; top:50%; margin-top:-1.1rem; left:1.5rem; width:2.2rem; height:2.2rem; background-image:var(--modal3d-resource-url); background-repeat:no-repeat; background-size:var(--modal3d-resource-size); background-position:-13rem -21rem; z-index:1;}
.esri-widget-custom .calendar input[type="text"] {padding-left:5rem;}
.esri-widget-custom input[type="date"] {display:block; position:relative; width:100%; border:none; height:5rem; padding:0 2rem 0 5rem; font-size:1.8rem; color:#222; background:#fff; z-index:0;}
.esri-widget-custom .calendar input[type="date"]::-webkit-calendar-picker-indicator {opacity:0; position:absolute; inset:0; width:100%; height:100%; cursor:pointer;}

.esri-widget-custom .esri-check-list {display:flex; flex-direction:column; gap:.8rem; position:relative; overflow:hidden;}
.esri-widget-custom .esri-check-list input[type="checkbox"],
.esri-widget-custom .esri-check-list input[type="radio"] {position:absolute; left:-100px; top:-100px; opacity:0; z-index:-999;}
.esri-widget-custom .esri-check-list label {display:flex; align-items:center; width:100%; gap:1rem; font-size:1.8rem; color:#222;}
.esri-widget-custom .esri-check-list label:before {content:""; display:block; width:1.6rem; height:1.6rem; background-image:var(--modal3d-resource-url); background-repeat:no-repeat; background-size:var(--modal3d-resource-size); background-position:-16rem -9.6rem;}
.esri-widget-custom .esri-check-list input:checked + label:before {background-position-y:-7rem;}

/* ═══ 일광/그림자 위젯 ═══ */
.esri-widget-custom .esri-daylight {width:100%; background:transparent; box-shadow:none;}
.esri-widget-custom .esri-daylight__container {padding:0;}
.esri-widget-custom .esri-slider-with-dropdown__box {border:none; box-shadow:none;}
.esri-widget-custom .esri-shadow-cast {width:100%; background:transparent; box-shadow:none; padding:0;}
.esri-widget-custom .esri-shadow-cast .esri-slider {font-weight:400;}
.esri-widget-custom .esri-shadow-cast .esri-slider__tick-label {color:#555;}
.scene-modal .esri-shadow-cast .esri-slider__segment-1 {background:#0077B3;}

/* ═══ 고도 프로파일 위젯 ═══ */
.scene-modal .esri-elevation-profile.esri-widget--panel {width:46rem; max-width:84vw; border-radius:1.5rem; padding:1.6rem 1.6rem 1.2rem; box-shadow:0 .2rem .8rem rgba(0,0,0,.15); font-size:1.6rem; zoom:1.2;}
.scene-modal .esri-elevation-profile .esri-elevation-profile__chart-container {border-radius:1rem; overflow:hidden;}
.scene-modal .esri-elevation-profile .esri-elevation-profile-legend-item {border-radius:1rem; overflow:hidden;}
.scene-modal .esri-elevation-profile .esri-elevation-profile__footer calcite-button {display:block; width:100%; margin-top:1.2rem; --calcite-button-corner-radius:1rem; --calcite-button-background-color:#0077B3; --calcite-button-border-color:#0077B3; --calcite-button-text-color:#fff;}
.scene-modal .esri-elevation-profile .esri-elevation-profile__footer calcite-button:hover {--calcite-button-background-color:#006CA2;}
.scene-modal .esri-elevation-profile,
.scene-modal .esri-elevation-profile * {font-size:1.6rem !important;}
/* 범례 라벨·설정(톱니) 팝오버 텍스트는 calcite 컴포넌트(Shadow DOM) — font-size 미적용, zoom으로 확대 */
.scene-modal .esri-elevation-profile-legend-item__label,
.scene-modal .esri-elevation-profile-settings__popover-content {zoom:1.45;}

/* ═══ [디자인 v2 - STEP1] 4.34 calcite 대응 ═══ */
.scene-modal .esri-ui-top-left .esri-component {position:relative;}
.scene-modal .esri-ui-top-left .esri-component calcite-button {display:block; width:3.4rem; height:3.4rem; opacity:0;}

.scene-modal .esri-ui-top-left .esri-compass::before,
.scene-modal .esri-ui-top-left .esri-home::before,
.scene-modal .esri-ui-top-left .esri-fullscreen::before {content:""; position:absolute; inset:0; background-image:var(--modal3d-resource-url); background-repeat:no-repeat; background-size:var(--modal3d-resource-size); background-position:0 0; pointer-events:none;}
.scene-modal .esri-ui-top-left .esri-compass::before {background-position:0 -20rem;}
.scene-modal .esri-ui-top-left .esri-home::before {background-position:0 -23.4rem;}
.scene-modal .esri-ui-top-left .esri-fullscreen::before {background-position:0 -26.8rem;}

.scene-modal .esri-ui-top-left .esri-zoom::before,
.scene-modal .esri-ui-top-left .esri-zoom::after,
.scene-modal .esri-ui-top-left .esri-navigation-toggle::before,
.scene-modal .esri-ui-top-left .esri-navigation-toggle::after {content:""; position:absolute; left:0; width:3.4rem; height:3.4rem; background-image:var(--modal3d-resource-url); background-repeat:no-repeat; background-size:var(--modal3d-resource-size); background-position:0 0; pointer-events:none;}
.scene-modal .esri-ui-top-left .esri-zoom::before,
.scene-modal .esri-ui-top-left .esri-navigation-toggle::before {top:0;}
.scene-modal .esri-ui-top-left .esri-zoom::after,
.scene-modal .esri-ui-top-left .esri-navigation-toggle::after {top:3.4rem; box-shadow:inset 0 1px 0 #DFE4EF;}
.scene-modal .esri-ui-top-left .esri-zoom::before {background-position:0 -6.8rem;}
.scene-modal .esri-ui-top-left .esri-zoom::after {background-position:0 -10rem;}
.scene-modal .esri-ui-top-left .esri-navigation-toggle::before {background-position:0 -13.2rem;}
.scene-modal .esri-ui-top-left .esri-navigation-toggle::after {background-position:0 -16.6rem;}

.scene-modal .esri-ui-top-left .esri-compass:has(calcite-button:hover)::before,
.scene-modal .esri-ui-top-left .esri-home:has(calcite-button:hover)::before,
.scene-modal .esri-ui-top-left .esri-fullscreen:has(calcite-button:hover)::before,
.scene-modal .esri-ui-top-left .esri-zoom:has(calcite-button:first-of-type:hover)::before,
.scene-modal .esri-ui-top-left .esri-zoom:has(calcite-button:last-of-type:hover)::after,
.scene-modal .esri-ui-top-left .esri-navigation-toggle:has(calcite-button:first-of-type:hover)::before,
.scene-modal .esri-ui-top-left .esri-navigation-toggle:has(calcite-button:last-of-type:hover)::after {background-color:#EEF5FA;}

.scene-modal .esri-ui-top-left .esri-navigation-toggle:has(calcite-button:first-of-type[appearance="solid"])::before,
.scene-modal .esri-ui-top-left .esri-navigation-toggle:has(calcite-button:last-of-type[appearance="solid"])::after {background-position-x:-4rem; background-color:#0077B3;}

.scene-modal .esri-expand {position:relative;}
.scene-modal .esri-expand calcite-action {display:block; width:3.4rem; height:3.4rem; opacity:0;}
.scene-modal .esri-expand::before {content:""; position:absolute; top:0; right:0; width:3.4rem; height:3.4rem; border-radius:100%; background-image:var(--modal3d-resource-url); background-repeat:no-repeat; background-size:var(--modal3d-resource-size); background-position:0 -3.4rem; background-color:#fff; pointer-events:none;}
.scene-modal .esri-expand:has(calcite-action:hover)::before {background-color:#EEF5FA;}

/* ═══ 헤더 지번/도로명 세로 정렬 ═══ */
.mapSearchPannel .mapResult .top .bdg-txt {width:100%;}

/* ═══ mapTypeChecked 기본 스타일 ═══ */
.mapSearchWrap .mapTypeChecked {
    display: flex;
    position: absolute;
    align-items: center;
    width: 42rem;
    justify-content: space-between;
    height: 5rem;
    background: #fff;
    border-radius: 9em;
    padding: 0 3rem;
    z-index: 9;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    box-shadow: var(--shadow-box-shadow);
}
/* ═══ mapTypeChecked 패널 열림 보정 ═══ */
.mapSearchWrap.open-pannel .mapTypeChecked {
    left: calc(50% + (var(--pannel_width) / 2));
    transition: left .3s; -webkit-transition: left .3s;
}
.mapSearchWrap.open-pannel .mapSearchPannel.open-detail ~ .mapTypeChecked {
    left: calc(50% + var(--pannel_width));
}
@media all and (max-width:930px) {
    .mapSearchWrap.open-pannel .mapTypeChecked,
    .mapSearchWrap.open-pannel .mapSearchPannel.open-detail ~ .mapTypeChecked {left:50%;}
}

/* ═══ 현재 위치 버튼 ═══ */
.btn-current-location {
    position: absolute; bottom: 40px; right: 16px; z-index: 10;
    display: flex; align-items: center; gap: 6px;
    padding: 8px 14px; background: #fff; border: 1px solid #ddd;
    border-radius: 20px; box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    font-size: 13px; color: #333; cursor: pointer;
    transition: background 0.15s, box-shadow 0.15s;
}
.btn-current-location:hover {background: #f5f8ff; box-shadow: 0 3px 10px rgba(0,0,0,0.25);}
.btn-current-location:disabled,
.btn-current-location.loading {opacity: 0.6; cursor: wait;}
.btn-current-location.loading span::after {content: "...";}

/* ═══ 초기 안내 ═══ */
.initial-guide {
    display: flex; flex-direction: column; align-items: center;
    justify-content: center; padding: 40px 20px; gap: 20px; text-align: center;
}
.initial-guide .guide-msg {font-size: 14px; color: #555; line-height: 1.8;}
.initial-guide .guide-icon {display: block; font-size: 32px; margin-bottom: 8px;}
.btn-request-anls {
    display: inline-block; padding: 10px 24px; background: #40539B;
    color: #fff; border: none; border-radius: 6px; font-size: 14px;
    font-weight: bold; cursor: pointer; transition: background 0.15s;
}
.btn-request-anls:hover {background: #2e3d7a;}

#item-list .list > li.detail-open {background: #eef6fc; border-radius: 12px;}

/* ═══ 검색 자동완성 ═══ */
.mapSearchPannel .search-input-wrap {position: relative;}
.yh-search-results {
    display: none; position: absolute; top: calc(100% + 0.4rem); left: 0; right: 0;
    background: #fff; border: 1px solid #DFE4EF; border-radius: 1.4rem;
    box-shadow: 0 0.4rem 1.6rem rgba(0,41,80,.10);
    max-height: 36rem; overflow-y: auto; z-index: 50;
}
.yh-sr-item {
    display: flex; align-items: flex-start; gap: 1rem;
    padding: 0.9rem 1.6rem; border-bottom: 1px solid #DFE4EF; cursor: pointer;
}
.yh-sr-item:last-child {border-bottom: none;}
.yh-sr-item:hover, .yh-sr-item.yh-sr-active {background: rgba(0,119,179,.08);}
.yh-sr-pinwrap {flex: 0 0 auto; padding-top: 0.2rem;}
.yh-sr-pin {display: block;}
.yh-sr-text {flex: 1 1 auto; min-width: 0;}
.yh-sr-title {
    display: block; color: #002950; font-weight: 500;
    font-size: 1.5rem; line-height: 1.35;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.yh-sr-sub {
    display: block; color: #777; font-size: 1.2rem; margin-top: 0.1rem;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.yh-sr-hl {color: #0077B3; font-weight: 700;}
.yh-sr-label {
    flex: 0 0 auto; align-self: center;
    background: #EEF5FA; color: #456787;
    font-size: 1.1rem; padding: 0.2rem 0.7rem; border-radius: 1rem; white-space: nowrap;
}
/* 안전전세지킴이(사무소) 검색 결과 — 주소 검색 결과와 구분 */
.yh-sr-label-broker {background: #E7EDF8; color: #1F4E9C; font-weight: 600;}
.yh-sr-state {
    padding: 2.4rem 1.6rem; text-align: center;
    display: flex; flex-direction: column; align-items: center;
}
.yh-sr-spinner {
    width: 2rem; height: 2rem;
    border: .25rem solid #DFE4EF; border-top-color: #0077B3;
    border-radius: 50%; animation: yh-sr-spin .7s linear infinite; margin-bottom: .8rem;
}
@keyframes yh-sr-spin {to {transform: rotate(360deg);}}
.kgeo-loading{display:inline-flex;align-items:center;gap:6px;color:#888;font-size:13px;vertical-align:middle}
.kgeo-loading::before{content:"";width:12px;height:12px;border:2px solid #c9d4de;border-top-color:#0078ff;border-radius:50%;animation:kgeoSpin .8s linear infinite;flex:none}
.kgeo-loading.kgeo-sm::before{width:9px;height:9px;border-width:1.5px}
@keyframes kgeoSpin{to{transform:rotate(360deg)}}
.yh-sr-stateic {margin-bottom: .7rem;}
.yh-sr-msg {font-size: 1.3rem; color: #555;}
.yh-sr-submsg {font-size: 1.1rem; color: #999; margin-top: .3rem;}

#searchInput:focus {outline: none !important;}
.mapSearchPannel .search-input-wrap:focus-within {box-shadow: 0 0 0 .2rem rgba(0,119,179,.25);}

.agentItem.brokerItem {
    position: relative;
    padding-top: 3.6rem;
}

.agentItem.brokerItem .guardLabel {
    position: absolute;
    top: 1.2rem;
    left: 2rem;
    z-index: 2;
}

.agentItem.brokerItem .thumb.guardAgent {
    position: relative;
}

.agentItem.brokerItem .thumb.guardAgent .certMark {
    position: absolute;
    left: -0.6rem;
    bottom: -0.6rem;
    z-index: 3;
}

/* ═══ 축척 표시/드롭다운 (2D·3D 공용) ═══ */
.scale-display {
    position: absolute;
    bottom: 1.2rem;
    right: 1.2rem;
    z-index: 50;
    background: transparent;
    padding: 0;
    font-size: 1.5rem;
    font-weight: 700;
    color: #222;
    text-shadow: 0 0 .3rem rgba(255,255,255,.9), 0 .1rem .2rem rgba(255,255,255,.8);
    cursor: pointer;
    pointer-events: auto;
    user-select: none;
}
.scale-display:hover {text-decoration: underline;}

/* 포털 2D 지도: 좌측 하단에 [줌 위젯][축척]을 가로로 나란히
   - JS에서 .scale-box 래퍼를 esri-ui-bottom-left 코너에 주입(DOM: scale-box, zoom)
   - row-reverse로 줌 위젯이 왼쪽, 축척이 오른쪽
   - align-items:flex-end 로 축척 하단 라인을 줌 위젯 하단에 맞춤 */
#kgeoMapView .esri-ui-bottom-left {
    flex-direction: row-reverse;
    align-items: flex-end;
    gap: .8rem;
}
.esri-ui-bottom-left .scale-box {
    position: relative;
    pointer-events: auto;
}
.esri-ui-bottom-left .scale-box .scale-display {
    position: static;           /* 코너 흐름을 따르도록 절대배치 해제 */
    left: auto; right: auto; bottom: auto;
}
.esri-ui-bottom-left .scale-box .scale-menu {
    left: 0; right: auto;
    bottom: 2.4rem;             /* scale-box 기준 위쪽으로 열림 */
}

.map-filter { left: 1.6rem; }
.gis-portal .btn-current-location { bottom: 16px; }

.scale-menu {
    position: absolute;
    bottom: 3.6rem;
    right: 1.2rem;
    z-index: 51;
    background: #fff;
    border: 1px solid #bbb;
    border-radius: .4rem;
    box-shadow: 0 .2rem .8rem rgba(0,0,0,.25);
    overflow: hidden;
    display: none;
    min-width: 12rem;
}
.scale-menu.open {display: block;}
.scale-menu div {
    padding: .7rem 1.3rem;
    font-size: 1.4rem;
    color: #333;
    cursor: pointer;
    white-space: nowrap;
}
.scale-menu div:hover {background: #eaf3fb;}
.scale-menu div.current {background: #d6e9f8; font-weight: 700;}

/* ═══ 안전전세지킴이(BROKER) 집계 마커 hover 목록 팝업 ═══
   - DOM은 JS(drawBrokerTot 인접 _ensureBrokerPopup)에서 body에 1회 생성한다.
   - z-index: .mapSearchWrap(9999)·.map-filter(10000) 위, .scene-modal(100000) 아래. */
#brokerClusterPopup {
    display: none; position: fixed; z-index: 10001;
    width: 34rem;
    background: #fff;
    border-radius: 1.2rem;
    box-shadow: 0 .8rem 2.4rem rgba(0,41,80,.25);
    overflow: hidden;
}
#brokerClusterPopup .bcp-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 1rem 1.4rem;
    background: #06377E; color: #fff;
    font-size: 1.4rem; font-weight: 700;
}
#brokerClusterPopup .bcp-count {margin-left: .6rem; color: #7FD6A4;}
#brokerClusterPopup .bcp-close {
    padding: 0; border: 0; background: none;
    color: #fff; font-size: 1.6rem; line-height: 1; cursor: pointer; opacity: .8;
}
#brokerClusterPopup .bcp-close:hover {opacity: 1;}
/* overscroll-behavior: 목록 끝까지 스크롤해도 그 아래 지도/문서로 스크롤이 이어지지 않게 한다 */
#brokerClusterPopup .bcp-list {max-height: 33rem; overflow-y: auto; overscroll-behavior: contain;}
#brokerClusterPopup .bcp-empty {padding: 1.6rem 1.4rem; font-size: 1.3rem; color: #5B667B; text-align: center;}
#brokerClusterPopup .bcp-loading {padding: 1.2rem 1.4rem; font-size: 1.2rem; color: #7C8698; text-align: center;}
#brokerClusterPopup .bcp-item {padding: 1rem 1.4rem; border-bottom: 1px solid #EEF1F6; cursor: pointer;}
#brokerClusterPopup .bcp-item:last-child {border-bottom: 0;}
#brokerClusterPopup .bcp-item:hover {background: #F2F7FF;}
#brokerClusterPopup .bcp-name {font-size: 1.3rem; font-weight: 700; color: #17233D; line-height: 1.4;}
#brokerClusterPopup .bcp-ceo {margin-left: .4rem; font-size: 1.1rem; font-weight: 400; color: #7C8698;}
#brokerClusterPopup .bcp-badge {
    display: inline-block; margin-left: .6rem; padding: .1rem .6rem;
    border-radius: .8rem; background: #E3F6EC; color: #1E9E5A;
    font-size: 1rem; font-weight: 600; vertical-align: .1rem;
}
#brokerClusterPopup .bcp-addr {margin-top: .3rem; font-size: 1.1rem; color: #4D5A72; line-height: 1.4;}

/* 사무소 전화번호 — 좌측 목록 카드(.agentItem .prod)와 동일하게 기호(📞)는 보통 굵기, 번호(b)만 굵게.
   번호가 없을 때의 안내문도 같은 굵기/색으로 진하게 보여준다 */
#brokerClusterPopup .bcp-telno {margin-top: .3rem; font-size: 1.1rem; color: #17233D; line-height: 1.4;}
#brokerClusterPopup .bcp-telno b {font-weight: 800;}
/* 📞 는 컬러 이모지라 grayscale 로 흑백(검정·회색)만 남긴다 — 폰트 색상(color)으로는 바뀌지 않는다 */
#brokerClusterPopup .bcp-telno .ico {display: inline-block; filter: grayscale(1);}

/* 매물 종류(아파트·오피스텔·다세대·연립·단독·다가구·상가주택·도시형) — 폭이 좁으므로 줄바꿈시킨다 */
#brokerClusterPopup .bcp-prod {
    display: flex; flex-wrap: wrap; gap: .2rem .8rem;
    margin-top: .5rem; font-size: 1.1rem; color: #43506B;
}
#brokerClusterPopup .bcp-prod span {white-space: nowrap;}
#brokerClusterPopup .bcp-prod b {color: #17233D; font-weight: 600;}

#brokerClusterPopup .bcp-stats {margin-top: .5rem; font-size: 1.1rem; color: #43506B;}
#brokerClusterPopup .bcp-stats span {margin-right: .8rem; white-space: nowrap;}
#brokerClusterPopup .bcp-stats b {color: #1266D8;}
#brokerClusterPopup .bcp-footer {padding: .8rem 1.4rem; background: #F7F9FC; text-align: center;}
#brokerClusterPopup .bcp-footer button {
    padding: .5rem 1.4rem;
    border: 1px solid #1266D8; border-radius: .6rem;
    background: #fff; color: #1266D8;
    font-size: 1.2rem; cursor: pointer;
}
#brokerClusterPopup .bcp-footer button:hover {background: #EAF3FF;}

/* 관련지번 — 대표 지번 확인 안내 (확인설명서 #modalReports 소재지 위) */
.rell-jibn-notice {
    margin: 0 0 1rem; padding: .9rem 1.1rem;
    border: 1px solid #FFD79A; border-left: 3px solid #F59A23; border-radius: .6rem;
    background: #FFF8EC; color: #8A5A00;
    /* 실패 문구와 동일하게 1.6rem으로 통일 */
    font-size: 1.6rem; line-height: 1.6;
}
.rell-jibn-notice p {margin: 0;}
.rell-jibn-notice .rell-jibn-title strong {color: #B45309; font-weight: 700;}
.rell-jibn-notice .rell-jibn-list {margin-top: .35rem;}
.rell-jibn-notice .rell-jibn-hint {margin-top: .35rem; color: #A97D3A; font-size: 1.6rem;}

/*
 * 지번 자체의 색은 안내박스 본문색보다 우선해야 한다.
 * 예전엔 `.rell-jibn-notice span`(0,1,1)이 `.rell-jibn-link`(0,1,0)를 이겨서
 * 링크·취소선이 전부 본문색으로 그려졌다 — 링크인지 아닌지 구분이 안 됐다.
 * 그래서 바깥에 span 태그 선택자를 두지 않고, 지번은 전용 클래스로만 칠한다.
 */
.rell-jibn-link,
.rell-jibn-notice .rell-jibn-link {
    color: #1266D8; text-decoration: underline; cursor: pointer;
}
.rell-jibn-link:hover,
.rell-jibn-notice .rell-jibn-link:hover {color: #0B4CA6;}
.rell-jibn-link:focus-visible {outline: 2px solid #1266D8; outline-offset: 2px; border-radius: .2rem;}

/* 폐쇄지번 — 이동할 수 없으므로 링크처럼 보이면 안 된다 */
.rell-jibn-closed,
.rell-jibn-notice .rell-jibn-closed {
    color: #9AA3AD; text-decoration: line-through; cursor: default;
}
/*
 * 개별(공동)주택가격 정보 (가격정보 탭) — [2026-08-05]
 *
 * 바로 위 「토지가격 정보」 목록과 제목이 붙어 보여 구분이 안 된다는 지적이 있었다.
 * 다만 한 탭 안의 같은 계열 정보라 문단처럼 크게 띄우면 오히려 떨어져 보인다 — 붙어 있지만
 * 경계는 보이는 정도로 최소한만 준다.
 */
.kgeoHousePriceBlock {margin-top: 1.2rem;}
.kgeoHousePriceBlock > .kgeoHousePriceTitle {margin-bottom: .6rem;}
/* select 3개가 한 줄에 안 들어가면 다음 줄로 넘어가되 위아래로 붙지 않게 */
.kgeoHousePriceBlock > .kgeoHousePriceSelect {margin-bottom: .6rem;}