@charset "utf-8";
/* 시스템 사이트의 경우 :  메인+서브에 공통 적용되는 common.css 파일 추가해 메인+서브 공통부분, 서브에 적용되는 css 기재 / 메인에만 적용되는 main.css 추가해 메인 css 기재 */
/* 일반 사이트의 경우 : 메인+서브에 공통 적용되는 common.css 파일 추가해 메인+서브 공통부분 css / 메인에만 적용되는 main.css 추가해 메인 css 기재 / 서브에만 적용되는 sub.css 추가해 서브 css 기재 */
/* 시스템, 일반 사이트 공통 : 멤버십, 에러 등이 필요한 경우 퍼블 가이드 UI 요소에서 원하는 부분만 복사해서 common.css에 기재 */
/* basic.css, board.css에서 수정해서 사용할 것들은 common.css에 수정 css 적기 (basic, board 수정 X) */
body{font-size: 1.6rem;}

:root {
    --primary : #273C9D;
    --dark: #333333;
    --btn-bdr: #D5D5D5;
    --blue : #415ADE;
    --btn-blue-hover : #233fc7;
    --btn-primary-hover : #1d2c72;

    --tbl-th: #F2F4F9;
    --tbl-bdr: #D5D5D5;

    --map-c01: #2768FF;
    --map-c02: #01BF87;
    --map-c03: #FF7A36;

    --badge-blue: #65A5E5;
    --badge-gray: #BDBDBD;
    --badge-orange: #E59565;
    --badge-blue02: #6F8FDB;
}

/*** basic reset ***/
body {letter-spacing: -0.05em;}

/*map css*/
#mapWrapper {width:100%;height:100%;z-index:1;}

/* title**/
.lg_tit {font-size: 1.7rem;font-weight: 600; color: #111;}
.md_tit {font-size: 1.8rem;font-weight: 700; color: #111;}
.sm_tit {font-size: 1.6rem; font-weight: 400; color: #111;}
.sm_tit::before{content: '·'; margin-right: 0.5rem;}

/* input */
.chk .cbx label::before{border-color: #707070;}
select,
input:not([type="checkbox"], [type="radio"], [type="hidden"]),
textarea {height: 3.5rem; background-color: #F6F6F6; border: 1px solid #ddd; border-radius: 0.5rem; width: 100%; font-size: 1.6rem;}
select {background: #F6F6F6 url(/images/gis/icon/ico_sel.svg) no-repeat right 1.2rem center / 1.2rem;}
.chk.round{gap: 0.8rem;}
.chk.round .cbx label{padding: 0.4rem 1rem; min-width: 5.5rem; text-align: center; border-radius: 0.4rem;}
.chk.round .cbx input:checked ~ label{background-color: var(--primary); color: #fff;}
.chk.round .cbx input:checked ~ label::before{display: none;}
#ui-datepicker-div.ui-widget.ui-widget-content{z-index: 9990 !important;}


/* button */
.btn {border:1px solid #ccc;gap: 0.4rem;min-width: auto;padding: 0 1rem;border-radius: 0.3rem; letter-spacing: -0.03em;}
.btn:not(:where(.primary, .secondary, .blue, .red, .green, .yellow, .gray, .black)) {color: #111;}
.btn.blue {border-color: #415ADE;background-color: #415ADE;}
.btn.blue:where(:hover, :focus) {border-color: #3A51C7;background-color: #3A51C7;}
.btn.gray.light {border-color: #E2E2E2;background-color: #F5F5F5;}
.btn.gray.light:where(:hover, :focus) {border-color: #D7D7D7;background-color: #E9E9E9;}
.btn.sml {height: 3rem;font-size: 1.4rem;}
.btn.dkblue{background-color: var(--primary); border-color: var(--primary); color: #fff;}
.btn.dkblue:where(:hover, :focus){background-color: var(--btn-primary-hover); border-color: var(--btn-primary-hover);}

/* badge */
.badge {display: inline-flex;align-items: center;min-width: 4.4rem;height: 3rem;padding: 0 1.4rem;font-size: 1.5rem;line-height: normal;}
.badge.blue02 {background-color: var(--badge-blue02);}
.badge.orange {background-color: var(--badge-orange);}

/** tab **/
.tab > .tab_menu li {font-size: 1.6rem;}
.tab > .tab_cont {margin-top: 1.6rem;}
/* basic */
.tab.basic > .tab_menu {gap: 0.5rem;border-bottom: 0.1rem solid #D8D8D8;}
.tab.basic > .tab_menu li {position: relative;min-width: 10rem;border-radius: 0.5rem 0.5rem 0 0;color: #A9A9A9;background: #E8E8E8;}
.tab.basic > .tab_menu li:has(.on) {color: #fff;background: var(--primary);}
.tab.basic > .tab_menu li button {display: flex;justify-content: center;align-items: center;height: 3.6rem;padding: 0 0.8rem;}
.tab.basic > .tab_menu li a {display: flex;justify-content: center;align-items: center;height: 3.6rem;padding: 0 0.8rem;}


/* paging */
.paging_wrap {margin-top: 1.6rem;}
.paging li {min-width: 3rem;height: 3rem;margin: 0 0.2rem;font-size: 1.4rem;line-height: 3rem;}
.paging li.btn_page a::before {font-size: 1.6rem;}

/* table, board */
.data_tbl {border-top: 1px solid #0E3192;}
.data_tbl > * > tr > th,
.data_tbl > * > tr > td {height: 4.2rem;padding: 0.4rem 0.8rem;font-size: 1.5rem;word-break: break-all;border-right: 0 !important;border-left: 0 !important;}
.data_tbl > * > tr > th {font-weight: 600;color: #000000;}
/* .data_tbl > * > tr > *:not(:last-child) {border-right: 0;} */
.data_tbl > * > tr[onclick] {cursor: pointer;}

.board_list {border-top: 1px solid #0E3192;}
.board_list > thead > tr > th,
.board_list > tbody > tr > td {height: 4.2rem;padding: 0.4rem 0.8rem;font-size: 1.5rem;word-break: break-all;border-right: 0 !important;border-left: 0 !important;}
.board_list > * > tr > th {font-weight: 600;color: #000000;}
.board_list > * > tr[onclick] {cursor: pointer;}

/* simplebar */
.simplebar-scrollable-x {padding-bottom: 0;}
.tbl_scroll .simplebar-scrollable-y .simplebar-offset,
.simplebar-scrollable-y .simplebar-offset {padding-right: 0.4rem;}
.tbl_scroll .simplebar-scrollable-y.simplebar-scrollable-x .simplebar-offset,
.simplebar-scrollable-y.simplebar-scrollable-x .simplebar-offset {padding-bottom: 0.4rem !important;}
.tbl_scroll .simplebar-scrollable-y.simplebar-scrollable-x .simplebar-track.simplebar-horizontal,
.simplebar-scrollable-y.simplebar-scrollable-x .simplebar-track.simplebar-horizontal {right: 0.4rem;}
.tbl_scroll .simplebar-track,
.simplebar-track {opacity: 1;}
.tbl_scroll .simplebar-track.simplebar-vertical,
.simplebar-track.simplebar-vertical {right: 0;width: 0.4rem !important;background: #F1F1F1;}
.tbl_scroll .simplebar-track.simplebar-vertical .simplebar-scrollbar::before,
.simplebar-track.simplebar-vertical .simplebar-scrollbar::before {opacity: 1;left: 0;right: 0;top: 0;bottom: 0;width: 0.4rem !important;background: #BBBBBB;}
.tbl_scroll .simplebar-track.simplebar-horizontal,
.simplebar-track.simplebar-horizontal {height: 0.4rem !important;background: #F1F1F1;}
.tbl_scroll .simplebar-track.simplebar-horizontal .simplebar-scrollbar::before,
.simplebar-track.simplebar-horizontal .simplebar-scrollbar::before {opacity: 1;background: #BBBBBB;}
/*** //basic reset ***/



/** layout **/
#container {display: flex;}
.main_content {position: relative;width: 100%; height: 100dvh;}
.map {position: fixed;left: 0;top: 0;width: 100%;height: 100dvh;}
/* map 퍼블용 이미지*/
.map img {width: 100%;height: 100%;object-fit: cover;}


.highlight > td{font-weight: bold !important; background-color:#DAF6FF !important;}

/** panel **/
.panel {position: absolute;z-index: 99;left: 0;top: 0;transition: all 0.6s cubic-bezier(0.22, 1, 0.36, 1);box-shadow: 0 -0.3rem 1rem rgba(0,0,0,0.16);}
.panelhide .panel{left: -43rem;}
.panel_inner{overflow: auto; min-width: 38rem;width: 43rem;height: 100dvh;background: #fff; position: relative; z-index: 9;}
.panel .btn_panel_toggle{display: block; width: 3rem; height: 5rem; border-radius: 0 1rem 1rem 0; box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.16); font-size:0; background: #fff; position: absolute; right: -3rem; top: 50%; transform: translateY(-50%);}
.panel .btn_panel_toggle::before{content: '\EA64'; font-family: 'remixicon'; font-size: 2.5rem; color: #6B6B6B; transition: all 0.2s; display: inline-block;}
.panel .btn_panel_toggle.active::before{transform: rotate(180deg);}

/* panel_head */
.panel_head {display: flex;align-items: center;height: 5rem;padding: 0.8rem 1.6rem;background: #0B277B;}
.panel_head .logo {display: block;height: 100%;}
.panel_head .logo img {display: block;max-width: 100%;max-height: 100%;}

/* panel_top */
.panel_top {position: relative;padding: 1.6rem;background: linear-gradient(225deg,#283B9C 0%, #125EB4 100%);}
.rows {display: flex;justify-content: space-between;align-items: center;}
.panel_top .lg_tit {margin-bottom: 1rem;color: #fff;}
.panel_top .box {display: flex;flex-direction: column;gap: 0.8rem;padding: 1.4rem 1.6rem 1.2rem;border-radius: 1rem;background: #fff;box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);}
.panel_top .box li {display: flex;align-items: center;gap: 1.4rem;font-size: 1.5rem;color: #686868;word-break: break-all;}
.panel_top .box li + li {margin-top: 0.4rem;}
.panel_top .box li .btn {position: relative;border: 0;border-radius: 0.5rem;font-size: 1.7rem;font-weight: 600;color: #fff;background: #18327E; flex-shrink: 0;}
.panel_top .box li .btn::before {content: '\f0d1';font-family: 'remixicon';font-weight: 400;}
/*.panel_top .box li:nth-of-type(2) div{width: calc(100% - 12rem);}*/
/*.panel_top .box li:nth-of-type(2) div p{display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; white-space: normal;  }*/
.panel_top .box .btn_reset {position: relative;height: 3rem;margin-left: auto;padding: 0 0.6rem;border: 0;font-weight: 600;color: #6E6E6E;}
.panel_top .box .btn_reset::before {content: '\f544';font-family: 'remixicon';font-weight: 400;color: #7E7E7E;transform: rotate(80deg);}

/* panel_btm */
.panel_btm {position: relative;padding: 1.6rem;}
.panel .rows {margin-bottom: 1rem;}
.panel .sm_txt {font-size: 1.4rem;font-weight: 400;vertical-align: 0.1rem;margin-left: 0.5rem;}
.panel .utils {display: flex;align-items: center;gap: 0.8rem;}
.panel .utils .js_tglBtn {gap: 0.4rem;}
.panel .utils .js_tglBtn::after {content: '\ea4e';font-family: 'remixicon';color: #6B6B6B;}
.panel .utils .js_tglBtn.open::after {transform: rotate(180deg);}
.panel .btn_filter {border: 0;border-radius: 0.4rem;font-size: 2rem;color: #000;background: transparent;}
.panel .btn_filter:where(:focus, :focus-visible) {outline: 0.2rem solid var(--primary);outline-offset: 0.2rem;}

/* count_box */
.panel .count_box {display: flex;gap: 2.4rem;margin-bottom: 1.5rem;}
.panel .count_box dl {flex: 1;position: relative;}
.panel .count_box dl:not(:last-child)::after {content: '';position: absolute;right: -1.2rem;top: 0;width: 1px;height: 100%;background: #E2E2E2;}
.panel .count_box dt {font-size: 1.5rem;font-weight: 600;color: #000;}
.panel .count_box dd {display: flex;justify-content: space-between;align-items: baseline;gap: 0.4rem;font-size: 1.3rem;color: #000;}
.panel .count_box dd strong {font-size: 2.5rem;font-weight: 600;color: #2551B7;}

/* panel board */
.panel .all_num {display: flex;align-items: center;gap: 0.4rem;position: relative;font-size: 1.5rem;color: #2F2F2F;}
.panel .all_num::before {content: '';display: inline-block;width: 0.3rem;height: 0.3rem;background: #A1A8B3;}
.panel .all_num .num {margin: 0;font-weight: 700;color: #2F2F2F;}
.panel .legend {display: flex;align-items: center;gap: 2rem;justify-content: flex-end;}
.panel .legend li {position: relative;font-size: 1.5rem;}
.panel .legend li::before {content: '';display: inline-block;width: 1.2rem;height: 1.2rem;margin-right: 0.4rem;border-radius: 100%;vertical-align: -0.1rem;}
.panel .legend li.c01 {color: var(--map-c01);}
.panel .legend li.c01::before {background: var(--map-c01);}
.panel .legend li.c02 {color: var(--map-c02);}
.panel .legend li.c02::before {background: var(--map-c02);}
.panel .legend li.c03 {color: var(--map-c03);}
.panel .legend li.c03::before {background: var(--map-c03);}

.panel [class*='lg_c'] {position: relative;}
.panel [class*='lg_c']::before {content: '';display: inline-block;width: 0.9rem;height: 0.9rem;margin-right: 0.4rem;border-radius: 100%;}
.panel .lg_c01::before {background: var(--map-c01);}
.panel .lg_c02::before {background: var(--map-c02);}
.panel .lg_c03::before {background: var(--map-c03);}
.panel .board_list > * > tr > th,
.panel .board_list > * > tr > td{font-size: 1.4rem;height: 3.5rem;white-space: nowrap;}
.panel .board_list .badge{font-size: 1.3rem; padding: 0 0.5rem; justify-content: center; height: 2.4rem;}

.panel_btm,
.panel_btm .tab,
.panel_btm .tab > .tab_cont {display: flex;flex-direction: column;min-height: 0;}
.panel_btm .scr_box {max-height: calc(4.5rem * 10);}

/** map overlay **/
/* map_ctrl_wrap */
.map_ctrl_wrap {z-index: 99;position: absolute; left: calc(45rem + 3rem);top: 3rem;background: #fff;padding: 0.5rem;border-radius: 0.4rem;border: 1px solid #ddd;box-shadow: 0 0 0.6rem rgba(0,0,0,0.16);padding-right: 1.5rem;transition: all 0.6s cubic-bezier(0.22, 1, 0.36, 1);}
.map_ctrl_wrap b{display: inline-block; font-size: 1.4rem; padding: 0.8rem 1.3rem; color: #fff; background: #6E6E6E; border-radius: 0.4rem; font-weight: 400; margin-right: 1rem;}
.panelhide .map_ctrl_wrap{left: 3rem;}

/* map_info_bottom */
.map_info_bottom{position: absolute;left: calc(38rem + 3rem);bottom: 3rem;transition: all 0.6s cubic-bezier(0.22, 1, 0.36, 1); z-index: 99;}
.map_info_bottom .btn i{width: 1.8rem; height: 1.8rem; background-color: #fff;}
.map_info_bottom  dl{background: #fff; margin-top: 1rem; display: flex; box-shadow: 0 0 0.6rem rgba(0,0,0,0.2); border-radius: 0.3rem; overflow: hidden;}
.map_info_bottom  dl dt,
.map_info_bottom  dl dd{padding: 1rem 2rem;}
.map_info_bottom  dl dt{width: 6rem; padding:1rem 0; text-align: center; background-color: #F2F2F2;}
.panelhide .map_info_bottom{left: 3rem;}

/* marker */
.map_maker{position: absolute; display: flex; flex-direction: column; background: rgba(11,39, 123, 0.7); border-radius: 100rem; color: #fff; align-items: center; justify-content: center; gap: 1rem 0; z-index: 99;}
.map_maker span{font-size: 1.7rem; line-height: 1;}
.map_maker strong{font-size: 2.4rem; font-weight: 700; line-height: 1;}
.map_maker.sml{width: 8rem; height: 8rem; gap: 0.5rem 0;}
.map_maker.mdl{width: 9rem; height: 9rem;}
.map_maker.lg{width: 11rem; height: 11rem;}

.btn_marker{display: block; position: absolute; width: 4rem; height: 6rem; z-index: 99; transition: all 0.2s;}
.btn_marker span{font-size: 1.7rem; font-weight: 500; position: relative; top: -1rem;}
.btn_marker.typeA{background: url(/images/gis/common/img_maker_A.svg) no-repeat center / 4rem;}
.btn_marker.typeB{background: url(/images/gis/common/img_maker_B.svg) no-repeat center / 4rem;}
.btn_marker.typeC{background: url(/images/gis/common/img_maker_C.svg) no-repeat center / 4rem;}
.btn_marker.typeD{background: url(/images/gis/common/img_maker_D.svg) no-repeat center / 4rem;}
.btn_marker.typeE{background: url(/images/gis/common/img_maker_E.svg) no-repeat center / 4rem;}

/* 기반시설 마커 - 큰 사이즈 */
.infra_marker{display: block; position: absolute; width: 8rem; height: 8rem; z-index: 99; transition: all 0.2s;}
.infra_marker.DAM{background: url(/images/gis/icon/img_marker_dam.svg) no-repeat center / 8rem;}
.infra_marker.HYDRO{background: url(/images/gis/icon/img_marker_hydro.svg) no-repeat center / 8rem;}
.infra_marker.PUMP{background: url(/images/gis/icon/img_marker_pump.svg) no-repeat center / 8rem;}
.infra_marker.GATE{background: url(/images/gis/icon/img_marker_gate.svg) no-repeat center / 8rem;}


.marker_info_popup{
    display: none;
    position: absolute;
    top: -40px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid #ccc;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 12px;
    color: #333;
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    z-index: 4000;
    min-width: 150px;
    max-width: 250px;
}

/* 타입별 커스터마이징 */
.marker_info_popup.DAM {top: -70px;}
.marker_info_popup.PUMP {top: -30px;}
.marker_info_popup.HYDRO {top: -30px;}
.marker_info_popup.GATE {top: -30px;}

.marker_address{
    display: none;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 4px 8px;
    font-size: 12px;
    color: #333;
    text-align: center;
    white-space: nowrap;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 5px;
    z-index: 10;
}

.marker_cityMarker {
    background : rgba(11,39, 123, 0.7);
    border-radius: 50%;
    color: #FFF;
    text-align: center;
    font-weight: bold;
    box-shadow: 0 3px 6px rgba(0,0,0,0.3);
    cursor: pointer;
    user-select: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    line-height: 1.2;
}

.btn_marker.active{width: 6.5rem; height: 10rem; background-size: 6.5rem; margin-left: -1rem; margin-top: -4rem;}
.btn_marker.active span{font-size: 2.4rem; font-weight: 600; top: -1.8rem;}

/** right_pop **/
.right_pop{position: fixed;top: 0;right: 0;width: 58rem;background: #fff;height: 100dvh;padding: 2rem 2.5rem;display: none;box-shadow: 0 0.3rem 1rem rgba(0,0,0,0.16);}
.right_pop .pop_header{display: flex;justify-content: space-between;margin-bottom: 2rem;position: relative;}
.right_pop .pop_header h2{font-size: 2rem;font-weight: 600;}
.right_pop .pop_header .pop_close{background: transparent; font-size: 2rem;}
.right_pop .pop_content{max-height: calc(100dvh - 10rem);}

/** map_det_pop **/
.map_det_pop {padding: 0;}
.map_det_pop .pop_content {font-size: 1.7rem; padding-bottom: 2rem;}
.map_det_pop .pop_footer {display: flex;justify-content: flex-end;align-items: center;gap: 1rem;padding: 1rem 2.5rem;background: transparent; position: absolute; bottom: 0; left: 0; background: #fff; width: 100%;}
.map_det_pop .pop_header{padding: 2rem 2.5rem 0;}
.map_det_pop .pop_header .pop_close{position: absolute; right: 2.5rem; top: 2.3rem;}
.map_det_pop .pop_header h2{ max-width: 42rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-size: 2rem;}
.map_det_pop .pop_header h2 img{vertical-align: -0.4rem; margin-right: 0.8rem;}

/* panel_top_map */
.panel_inner:has(.panel_top_map){padding: 0;}
.panel_top_map{position: relative; height: 30rem; overflow: hidden; transition: all 0.2s;}
.panel_top_map .btn{position: absolute; left: 2rem; top: 2rem; display: inline-flex; gap: 0.4rem;}
.panel_top_map .btn::after {content: '\ea4e';font-family: 'remixicon';color: #6B6B6B; transform: rotate(180deg);}
.panel_top_map .btn.hide::after {transform: rotate(0deg);}
.panel_top_map:has(.panel_map.hide){height: 7rem;}
.map_det .panel_inner{padding-bottom: 6rem;}
.panel_map.small{position: absolute;right: 1rem;bottom: 1rem;width: 16rem;height: 14rem;z-index: 99;overflow: hidden; border-radius: 0.8rem;}
#subview{height:300px;}

/* scroll */
.map_det_pop .pop_content .tab:not(.sm){padding: 0 2.5rem 2rem;}
.map_det_pop .pop_inner,
.map_det_pop .pop_content,
.map_det_pop .pop_content .tab {display: flex;flex-direction: column;min-height: 0;}
.map_det_pop .simplebar-scrollable-y .simplebar-offset{padding-right: 1.5rem;}
.map_det_pop .simplebar-track.simplebar-vertical{right: 0.5rem;}
.region_anlyz_pop .simplebar-track.simplebar-vertical{right: -2rem;}

/* space */
.map_det_pop .pop_content .tab_menu {border-bottom: 0;}
.region_anlyz_pop .pop_content .tab_cont,
.map_det_pop .pop_content .tab_cont {margin-top: 0;}
.md_tit {margin-bottom: 0.8rem;}
.tbl_wrap + .md_tit,
.md_tit ~ .md_tit {margin-top: 3rem;}
.sidebyside:has(.md_tit) ~ .sidebyside:has(.md_tit),
.sidebyside:has(.md_tit) ~ .md_tit{margin-top: 3rem;}
.pop_content .tab_cont .md_tit:first-child,
.pop_content .tab_cont .sidebyside:first-child{margin-top: 1.5rem;}
.sidebyside:has(.md_tit){margin-bottom: 0.8rem;}
.sidebyside .md_tit{margin-bottom: 0; margin-top: 0 !important;}

.sm_tit {margin-bottom: 0.8rem;}
.tbl_wrap + .sm_tit,
.sm_tit ~ .sm_tit {margin-top: 2rem;}
.sidebyside:has(.sm_tit) ~ .sidebyside:has(.sm_tit),
.sidebyside:has(.sm_tit) ~ .sm_tit{margin-top: 2rem;}
.sidebyside:has(.sm_tit){margin-bottom: 0.8rem;}
.sidebyside .sm_tit{margin-bottom: 0; margin-top: 0 !important;}

/* button */
.map_det_pop .pop_footer .btn {height: 3.8rem;font-size: 1.6rem;padding: 0 1.5rem;}
.map_det_pop .pop_footer .btn i{background-color: #6B6B6B; width: 1.8rem; height: 1.8rem;}

/* mdp_info */
.mdp_info {width: 100%; display: block; padding: 2rem 2.5rem;position: relative;}
.mdp_info .info01 {padding-right: 1rem; word-break: break-all;}
.mdp_info .info01 .num {display: flex;align-items: center;gap: 0.8rem;font-size: 1.7rem;font-weight: 500;}
.mdp_info .info01 .num .badge {min-width: auto; height: 2.3rem; padding: 0 0.8rem; border-color: var(--bdr); font-size: 1.4rem; font-weight: 500; color: #949494; letter-spacing: -0.025em;}
.mdp_info .info01 .addr {display: flex;align-items: center;margin-top: 0.4rem;font-size: 2rem;font-weight: 500;line-height: 1.3;}
.mdp_info .info01 .addr02 {font-size: 1.5rem; color: #111 !important; margin-top: 0;}
.mdp_info .info01 .addr02 span {display: inline-block; font-size: 1.3rem; line-height: 1; border: 1px solid #ddd; border-right: 0; padding: 0.3rem 0.5rem 0.3rem 1rem; position: relative; margin-right: 1.5rem;}
.mdp_info .info01 .addr02 span::before {content: ''; display: block; height: 1.35rem; border-right: 1px solid #ddd; position: absolute; transform: rotate(-45deg); top: -0.2rem; right: -0.5rem;}
.mdp_info .info01 .addr02 span::after {content: ''; display: block; height: 1.35rem; border-right: 1px solid #ddd; position: absolute; transform: rotate(45deg); bottom: -0.2rem; right: -0.5rem;}
.mdp_info .info01 li.deadline {display: flex;gap: 0 1.5rem;text-align: left;justify-content: flex-start;align-items: center;margin-top: 0;}
.mdp_info .info01 li:nth-of-type(3) {color: #888; font-size: 1.5rem; margin-top: 0.4rem;}
.mdp_info .info02 {word-break: break-all; padding-top: 0.3rem;}
.mdp_info .info02 li {display: flex; gap: 0 1.5rem; text-align: right; justify-content: flex-start; align-items: center; color: #111 !important;}
.mdp_info .info02 li:nth-of-type(2) {margin-top: 0.5rem;}
.mdp_info .info02 li:last-of-type {font-size: 1.5rem; margin-top: 0; color: #111 !important;}
.mdp_info .info02 li .price {font-size: 3rem; font-weight: 600; line-height: 1; margin-right: -1rem; letter-spacing: -0.05em;}
.mdp_info .deadline {position: absolute; right: 2rem; top: 2rem;}
.mdp_info .date span {font-weight: 700; margin-right: 1rem;}

/* content */
.map_det_pop .detail_loc{display: inline-flex; font-size: 1.5rem; align-items: center; gap: 0 0.5rem;}
.map_det_pop .detail_loc::before{content: ''; display: inline-block; width: 1.8rem; height: 2.5rem; background: url(/images/gis/icon/ico_loc.svg) no-repeat center / 1.8rem;}

.flexbox{display: flex; justify-content: space-between;}
.chart_wrap{border: 1px solid #ddd; border-radius: 0.8rem; height: 25rem;}
.chart_wrap .chart{margin: 0 auto;}

.detail_category{display: inline-flex;border-radius: 0.5rem;border: 1px solid #ddd;overflow: hidden;}
.detail_category button{display: inline-block; width: 5rem; font-size: 1.5rem; border: 0; padding: 0.5rem 0; height: 100%; vertical-align: top; background: #fff;}
.detail_category button.on{background: #4A4A4A; color: #fff;}

.map_det_pop .tab:not(.sm) > .tab_menu{position: absolute;}
.map_det_pop .tab:not(.sm) > .tab_menu.fixed{position: fixed;top: 6rem;width: 55rem;z-index: 9;background: #fff;right: 3rem;padding: 0 2.5rem;}
.tab.sm .tab_menu{ display: flex; gap: 0 0.8rem;}
.tab.sm .tab_menu li{border: 1px solid #ddd; border-radius: 0.5rem 0.5rem 0 0; border-bottom: 0; position: relative; color: #A9A9A9; min-width: 8rem;}
.tab.sm .tab_menu li button{display: block; padding: 0.8rem 1rem; line-height: 1; font-size: 1.6rem; text-align: center;}
.tab.sm .tab_menu li:has(.on){border-color: #0E3192; color: #0E3192;}
.tab.sm .tab_menu li:has(.on)::after{content: ''; display: block; width: 100%; height: 0.2rem; background: #fff; position: absolute; left: 0; bottom: -0.1rem; z-index: 9;}
.map_det_pop .tab:not(.sm) > .tab_menu ~ .tab_cont{padding-top: 3.6rem;}

.map_det_pop .tbl_wrap p.no_data{font-size: 1.5rem; color: #888; padding: 0.5rem; }

/** layer popup **/
.layer_pop .pop_header{border: 0; padding: 2.4rem 2.4rem 0; height: auto;}
.layer_pop .pop_header h2{font-size: 2rem; font-weight: 700;}
.layer_pop .pop_close i{color: #000;}
.popup_bg{background: rgba(0, 0, 0, 0.4);}

/* photo_slider */
.photo_slider{overflow: hidden;}
.photo_slider .swiper-wrapper{}
.photo_slider .swiper-slide{width: 100% !important; border-radius: 1rem; overflow: hidden; height: 30rem;}
.photo_slider .swiper-slide img{width: 100%; display: block; object-fit: cover; height: 100%;}
.photo_slider .utils{display: flex; align-items: center; justify-content: center; gap: 0 1rem; margin-top: 1rem;}
.photo_slider .utils .swiper-pagination{position: static; width: auto;}
.photo_slider button[class^="btn_photo"]{font-size: 0; width: 2.4rem; height: 2.4rem; background: transparent; display: inline-block; line-height: 1;}
.photo_slider button[class^="btn_photo"]::before{content: ''; font-family: 'remixicon'; font-size: 2rem; vertical-align: top;}
.photo_slider .btn_photo_prev::before{content: '\EA64' !important;}
.photo_slider .btn_photo_next::before{content: '\EA6E' !important;}

/*search_pop*/
.search_pop{position: absolute; top: 10rem; left: 80rem; z-index: 999; background: #fff; width: 33rem; border-radius: 0.8rem; border: 1px solid #ddd; box-shadow: 0 0 1rem rgba(0,0,0,0.16); display: none;}
.search_pop::before{content: '';position: absolute;width: 1.5rem;height: 1.5rem;border: 1px solid #ddd;top: 3rem;left: -0.5rem;background: #fff;transform: rotate(45deg);z-index: 0;}
.search_pop dt{font-size: 1.7rem; font-weight: 600; margin-bottom: 0.8rem; display: flex; align-items: center; justify-content: space-between; align-items: center;}
.search_pop dl ~ dl{margin-top: 1.8rem;}
.search_pop .btns{display: flex; justify-content: flex-end; gap: 0 0.8rem; padding: 0.5rem 1.6rem 1.6rem;}
.search_pop dt strong{font-weight: 400;}
.search_pop dt span{font-weight: 400; color: #ACACAC; margin-left: 2rem; font-size: 1.5rem;}
.search_pop dt:has(span){justify-content: flex-start;}
.search_pop dt:has(.detail_category){margin-bottom: 1.5rem;}
.search_pop dt .detail_category{position: absolute;left: 5rem;}
.search_pop dt .detail_category button{width: 4rem;}
.search_pop dd b{font-size: 1.5rem; font-weight: 500; display: block; margin-bottom: 0.3rem;}
.search_pop dd b ~ b{margin-top: 1.5rem;}
.search_pop .flexbox{display: flex; align-items: center; gap: 0 1rem;}
.search_pop .flexbox input{padding: 0 1rem;}


/** filter_pop **/
.filter_pop{position: absolute; top: 10rem; left: 80rem; z-index: 999; background: #fff; width: 33rem; border-radius: 0.8rem; border: 1px solid #ddd; box-shadow: 0 0 1rem rgba(0,0,0,0.16); display: none;}
.filter_pop::before{content: '';position: absolute;width: 1.5rem;height: 1.5rem;border: 1px solid #ddd;top: 3rem;left: -0.5rem;background: #fff;transform: rotate(45deg);z-index: 0;}
.form_wrap{position: relative; z-index: 99; padding: 1.6rem; background-color: #fff; border-radius: 0.8rem;}
.filter_pop dt{font-size: 1.7rem; font-weight: 600; margin-bottom: 0.8rem; display: flex; align-items: center; justify-content: space-between; align-items: center;}
.filter_pop dl ~ dl{margin-top: 1.8rem;}
.filter_pop .btns{display: flex; justify-content: flex-end; gap: 0 0.8rem; padding: 0.5rem 1.6rem 1.6rem;}
.filter_pop dt strong{font-weight: 400;}
.filter_pop dt span{font-weight: 400; color: #ACACAC; margin-left: 2rem; font-size: 1.5rem;}
.filter_pop dt:has(span){justify-content: flex-start;}
.filter_pop dt:has(.detail_category){margin-bottom: 1.5rem;}
.filter_pop dt .detail_category{position: absolute;left: 5rem;}
.filter_pop dt .detail_category button{width: 4rem;}
.filter_pop dd b{font-size: 1.5rem; font-weight: 500; display: block; margin-bottom: 0.3rem;}
.filter_pop dd b ~ b{margin-top: 1.5rem;}
.filter_pop .flexbox{display: flex; align-items: center; gap: 0 1rem;}
.filter_pop .flexbox input{padding: 0 1rem;}

/* slider */
.filter_pop .noUi-base{margin-top: 1rem;}
.filter_pop .noUi-target{border: 0; background: transparent; box-shadow: none; height: 0.6rem;}
.filter_pop .noUi-base, .noUi-connects,
.filter_pop .noUi-connects{height: 0.6rem; background: #ECECEC; border-radius: 100rem;}
.filter_pop .noUi-horizontal .noUi-handle{width: 1.8rem; height: 1.8rem; border-radius: 100rem; background: #fff; border: 0.2rem solid var(--primary); padding: 0;}
.filter_pop .noUi-handle::before,
.filter_pop .noUi-handle::after{display: none;}
.filter_pop .noUi-connect{background: var(--primary);}
.filter_pop .noUi-handle-lower{right: -1.7rem !important;}
.filter_pop .noUi-handle-upper{right: 0 !important;}
.filter_pop .unit{display: flex; justify-content: space-between; margin-top: 1rem;}
.filter_pop .unit span{font-size: 1.4rem; color: #ACACAC;}

/* etc */
.tbl_info {margin-top: 1.2rem;font-size: 1.5rem;text-align: right;color: #888;}


.MapWalker {position:absolute;margin:-26px 0 0 -51px}
.MapWalker .figure {position:absolute;width:25px;left:38px;top:-2px; height:39px;background:url(/images/gis/kakao/roadview_minimap_wk_2018.png) -298px -114px no-repeat}
.MapWalker .angleBack {width:102px;height:52px;background: url(/images/gis/kakao/roadview_minimap_wk_2018.png) -834px -2px no-repeat;}
.MapWalker.m0 .figure {background-position: -298px -114px;}
.MapWalker.m1 .figure {background-position: -335px -114px;}
.MapWalker.m2 .figure {background-position: -372px -114px;}
.MapWalker.m3 .figure {background-position: -409px -114px;}
.MapWalker.m4 .figure {background-position: -446px -114px;}
.MapWalker.m5 .figure {background-position: -483px -114px;}
.MapWalker.m6 .figure {background-position: -520px -114px;}
.MapWalker.m7 .figure {background-position: -557px -114px;}
.MapWalker.m8 .figure {background-position: -2px -114px;}
.MapWalker.m9 .figure {background-position: -39px -114px;}
.MapWalker.m10 .figure {background-position: -76px -114px;}
.MapWalker.m11 .figure {background-position: -113px -114px;}
.MapWalker.m12 .figure {background-position: -150px -114px;}
.MapWalker.m13 .figure {background-position: -187px -114px;}
.MapWalker.m14 .figure {background-position: -224px -114px;}
.MapWalker.m15 .figure {background-position: -261px -114px;}
.MapWalker.m0 .angleBack {background-position: -834px -2px;}
.MapWalker.m1 .angleBack {background-position: -938px -2px;}
.MapWalker.m2 .angleBack {background-position: -1042px -2px;}
.MapWalker.m3 .angleBack {background-position: -1146px -2px;}
.MapWalker.m4 .angleBack {background-position: -1250px -2px;}
.MapWalker.m5 .angleBack {background-position: -1354px -2px;}
.MapWalker.m6 .angleBack {background-position: -1458px -2px;}
.MapWalker.m7 .angleBack {background-position: -1562px -2px;}
.MapWalker.m8 .angleBack {background-position: -2px -2px;}
.MapWalker.m9 .angleBack {background-position: -106px -2px;}
.MapWalker.m10 .angleBack {background-position: -210px -2px;}
.MapWalker.m11 .angleBack {background-position: -314px -2px;}
.MapWalker.m12 .angleBack {background-position: -418px -2px;}
.MapWalker.m13 .angleBack {background-position: -522px -2px;}
.MapWalker.m14 .angleBack {background-position: -626px -2px;}
.MapWalker.m15 .angleBack {background-position: -730px -2px;}

.MapControlView {
    position: absolute;
    top: 5rem;
    right: 0.5rem;
    z-index: 420;
    width: 38px;
}


.sideBox.popupActive{
    right :60rem;
}

/*거리측정도구 css*/
.toolInfo {position: absolute;width: 100px;left: 87%;top: 86%;}
.distanceInfo {background-color: #FFFFFF;width: 135%;padding: 10%;border-radius: 5px;font-size: 14px;box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);}
.info{background-color: #FFFFFF;padding: 3% 10%;border-radius: 5px;font-size: 14px;width: 130%;box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);}

.MapControlView .tools {
    width: 35px;
    height: 92px;
    padding: 1px 7px 5px;
    margin-top: 11px;
    background: url(/images/gis/kakao/img_search.png) no-repeat 0 -170px;
}

.MapControlView .tools a {
    display: block;
    position: relative;
    width: 24px;
    height: 24px;
    background: url(/images/gis/kakao/img_search.png) no-repeat;
}
.MapControlView .tools .distance {
    margin-top: 6px;
    background-position: -80px -170px;
}
.MapControlView .tools .coach_distance {
    top: -4px;
    background-position: 0 -70px;
}


.MapControlView .tools .area {
    margin-top: 4px;
    background-position: -80px -200px;
}

.MapControlView .tools .coach_area {
    top: -2px;
    background-position: -70px -70px;
}

.MapControlView .tools .radius {
    margin-top: 4px;
    background-position: -80px -230px;
}
.MapControlView .tools .coach_radius {
    top: -1px;
    background-position: -140px -70px;
}

.MapControlView .tools .clear {
    display: none;
    margin-top: 11px;
    background-position: -80px -260px;
}

.MapControlView .tools .coach_clear {
    top: 0;
    right: 33px;
    width: 52px;
    background-position: -60px -40px;
}

.MapControlView .tools a span {
    display: none;
    overflow: hidden;
    position: absolute;
    right: 32px;
    width: 63px;
    height: 28px;
    font-size: 0;
    line-height: 0;
    background: url(/images/gis/kakao/img_coachMark.png) no-repeat;
    text-indent: -9999px;
}

.MapControlView .tools .distance-ACTIVE, .MapControlView .tools .distance-ACTIVE:hover {
    background-position: -140px -170px;
}

.MapControlView .tools .area-ACTIVE, .MapControlView .tools .area-ACTIVE:hover {
    background-position: -140px -200px;
}

.MapControlView .tools .radius-ACTIVE, .MapControlView .tools .radius-ACTIVE:hover {
    background-position: -140px -230px;
}
.MapControlView .tools-CLEAR {
    height: 125px;
    background-position: -40px -170px;
}

.input_border{
    border: solid 3px;
    width: 250px;
    height: 45px;
    border-radius: 9px;
    padding: 10px;
    cursor: pointer;
    text-align: center;
}

/*로딩바*/
/* 로딩 스피너 애니메이션 */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* 로딩 오버레이 스타일 */
#mapLoadingOverlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: Arial, sans-serif;
}

.loading-content {
    text-align: center;
    background: white;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    border: 2px solid #e0e0e0;
}

.loading-spinner {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #3498db;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin: 0 auto 15px auto;
}

.loading-text {
    color: #666;
    font-size: 16px;
    font-weight: bold;
}

.loading-subtext {
    color: #999;
    font-size: 12px;
    margin-top: 8px;
}

/* 숨김 상태 */
.hidden {display: none !important;}
.displayNone{display: none;}

/* map_ctrl_right */
.map_ctrl_right{position: absolute;right: 1rem;top: 20rem;z-index: 99;background-color: #fff;border-radius: 0.4rem;display: flex;flex-direction: column;box-shadow: 0 0 0.6rem rgba(0,0,0,0.16);}
.map_ctrl_right [class*='btn']:first-of-type{border-radius: 0.4rem 0.4rem 0 0;}
.map_ctrl_right [class*='btn']:last-of-type{border-radius:  0 0 0.4rem 0.4rem;}
.map_ctrl_right [class*='btn']{width: 4.2rem;height: 2.8rem;position: relative;background-color: #fff;background-repeat: no-repeat;background-position: center;background-size: 2.4rem;line-height: 2.8rem;text-align: center;font-size: 1.3rem;}
.map_ctrl_right [class*='btn'] + [class*='btn']{border-top: 1px solid rgba(0, 0, 0, 0.10);}
.map_ctrl_right [class*='btn'].active{background-color: var(--primary);color: #fff;}
/*.map_ctrl_right .btn_r_f{background-image: url(/images/gis/icon/ico_btn_r_f.svg);}*/
/*.map_ctrl_right .btn_rent{background-image: url(/images/gis/icon/ico_btn_rent.svg);}*/
/*.map_ctrl_right .btn_ift{background-image: url(/images/gis/icon/ico_btn_ift.svg);}*/
/*.map_ctrl_right .btn_r_f.active{background-image: url(/images/gis/icon/ico_btn_r_f_active.svg);}*/
/*.map_ctrl_right .btn_rent.active{background-image: url(/images/gis/icon/ico_btn_rent_active.svg);}*/
/*.map_ctrl_right .btn_ift.active{background-image: url(/images/gis/icon/ico_btn_ift_active.svg);}*/
/*.map_ctrl_right [class*='btn'] span{display:block; position: absolute; left: -7rem; top:50%; margin-top:-1.4rem; width: 6.2rem; height: 2.8rem; background: url(/images/gis/common/bg_btn_tooltip.svg) no-repeat center / 6.2rem; font-size: 1.2rem; color: #fff; text-align: center; line-height: 2.8rem; text-indent: -0.5rem; display: none;}*/
/*.map_ctrl_right [class*='btn']:hover span{display: block;}*/

/*오버레이 지도 버튼 css*/
.lv-accessibility {
    position: absolute;
    top: 0.5%;
    right: 15rem;
    z-index: 99;
}
.lv-accessibility a {
    font-size: 13px;
    line-height: 16px;
    color: #666;
    text-align: center;
    white-space: nowrap;
}

.lv-accessibility a i {
    display: block;
    overflow: hidden;
    width: 40px;
    height: 40px;
    margin: 0 auto 10px;
    background: url(/images/gis/kakao/img_search.png) no-repeat;
}

.lv-accessibility a span{display:block; position: absolute; left: -7rem; top:50%; margin-top:-1.4rem; width: 6.2rem; height: 2.8rem; background: url(/images/gis/common/bg_btn_tooltip.svg) no-repeat center / 6.2rem; font-size: 1.2rem; color: #fff; text-align: center; line-height: 2.8rem; text-indent: -0.5rem; display: none;}
.lv-accessibility a:hover span{display: block;}

/*지적편집도 css */
.usedistrict.off{background-position: -50px -400px !important;}
.usedistrict.on{background-position: -50px -350px !important;}

/*색깔 관련 css*/
.red{color: red}
.off{background-color: gray;}

.form_wrap .unit2 {
    position: absolute;
    top: 7px;
    right: 92px;
}

/*이전 농지가기 버튼*/
.backFlndBtn.on{display: block;}
.backFlndBtn.off{display: none;}
.backFlndBtn{display: none;position: absolute;right: 7rem;top: 2.4rem;z-index: 500;font-size: 1.4rem;cursor: pointer;border-radius: 0.5rem;padding: 0.5rem 1rem;border: 1px solid var(--bdr); background-color: #fff;}
.backFlndBtn i{margin-right: 0.5rem;}

.green_bg{
    background-color: #01BF87;
}

.orange_bg{
    background-color: #FF7A36;
}

.blue_bg{
    background-color: #007aff;
}

#roadviewControl {position:absolute;top:5px;left:5px;width:42px;height:42px;z-index: 1;cursor: pointer; background: url(/images/gis/kakao/img_search.png) 0 -450px no-repeat;}
#roadviewControl.active {background-position:0 -350px;}

#close {position: absolute;padding: 4px;top: 5px;left: 5px;cursor: pointer;font-size: 20px}
.map_det_pop {z-index: 430}

/* 스크롤 컨테이너 설정 */
.tbl_scroll {
    position: relative;
}

/* 셀 기준 상대 위치 툴팁 */
td[data-full-text] {
    position: relative;
}

/* 툴팁 컨테이너 */
.custom-tooltip {
    position: fixed;
    background: rgba(0, 0, 0, 0.9);
    color: white;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 12px;
    white-space: nowrap;
    z-index: 999999;
    pointer-events: none;
    max-width: 300px;
    display: none;
}

/* 화살표 */
.custom-tooltip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid rgba(0, 0, 0, 0.9);
}