@charset "UTF-8";

@import url('../css/fontStyle.css');
@import url('../css/remixicon.css');
@import url('../css/xeicon.css');
@import url('../css/animate.css');
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard-gov.min.css");
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400..900&display=swap');


/* ******************************************************* 
■ 지도공용
******************************************************* */
html, body, #wrap { height:100%; }
#wrap{position:relative; overflow:hidden; }
#wrap img { border:none; max-width:100%;}

.map{height:100%; width:100%;}
.map .root_daum_roughmap_landing{width:100%; height:100%;}
.map .root_daum_roughmap .wrap_map{height:100%;}
.map .root_daum_roughmap .wrap_controllers,
.map .root_daum_roughmap .map_border,
.map .root_daum_roughmap .wrap_btn_zoom{display:none;}

/* 주석처리 2025-09-10 ea
.map{width:100%; height:100%;}
.map > div{width:100% !important; height:100% !important; }
.map .root_daum_roughmap_landing{width:100% !important; height:100% !important;}
.map .root_daum_roughmap .wrap_map{height:100%  !important;}
.map .root_daum_roughmap .wrap_controllers,
.map .root_daum_roughmap .map_border,
.map .root_daum_roughmap .wrap_btn_zoom,
.map .root_daum_roughmap .cont{display:none;}
*/

:root{
	--gap16:clamp(1rem, 0.88rem + 0.375vw, 1.6rem);
	--gap24:clamp(1.5rem, 1.32rem + 0.563vw, 2.4rem);
}






/* ******************************************************* 
■ 검색영역
******************************************************* */
.map-search-tab{position:absolute;  z-index:15;}
.map-search-tab .search-head{position:relative; display:flex; justify-content: space-between; align-items: center; width:55rem;padding: clamp(1.5rem, 1.16rem + 1.063vw, 3.2rem) clamp(1.5rem, 1.32rem + 0.563vw, 2.4rem); border-radius: 0 0 2.4rem 0; background: #FFF; box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.20);}
.map-search-tab .search-head:after{content:""; position:absolute; left:0px; top:0px; width:calc(100% + 0.5rem); height:calc(100% + 0.5rem);border-radius: 0 0 3rem 0; background: #0067FF; box-shadow: 4px 4px 24px 0 rgba(0, 0, 0, 0.14); z-index:-1; transition: all 0.2s ease-out 0s;}
.map-search-tab .search-tab{display: flex; align-items: center; gap: var(--gap16);}
.map-search-tab .search-tab button{display: flex; align-items: center;  justify-content: center; width: 14rem; height: clamp(4rem, 3.8rem + 0.625vw, 5rem); border: 2px solid transparent;  border-radius: 1rem; background: #F4F4F4; color: #232323; font-family: Paperlogy; font-size: 1.6rem; font-weight: 700; transition:var(--krds-transition-base)}
.map-search-tab .search-tab button:focus{outline:none; box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16); transition:var(--krds-transition-base)}
.map-search-tab .search-tab [class^="icon_"]{display:inline-block; width:clamp(3rem, 2.92rem + 0.25vw, 3.4rem); aspect-ratio: 34 / 30; background-repeat:no-repeat; background-size:100%; margin-right:0.5rem; }
.map-search-tab .search-tab .icon_my{background-image:url('/resource/images/content/icon_my.png')}
.map-search-tab .search-tab .icon_myMap{background-image:url('/resource/images/content/icon_myMap.png')}
.map-search-tab .search-tab button.active{box-shadow: 0 0.2rem 1rem 0 rgba(0, 0, 0, 0.16); background:#fff;}
.map-search-tab .search-tab button.btn-my.active{border-color: #005EE8;}
.map-search-tab .search-tab button.btn-locel.active{border-color: #F8CC06;}
.map-search-tab .listBtn{display:none;}
.map-search-tab.open .search-head:after{opacity:0;}

.search-body{display:none; width:53rem;padding:clamp(1.5rem, 1.16rem + 1.063vw, 3.2rem) clamp(1.5rem, 1.32rem + 0.563vw, 2.4rem); border-radius: 0 0 4rem 0; border: 0.6rem solid #0067FF; border-top:none; border-left:none; background: #EFEFEF;}
.search-body .select-box{display:flex; flex-wrap:wrap; gap:var(--gap16);}
.search-body .select-box#locel{margin-bottom:var(--gap16);}
.search-body .select-box > div{flex:1 0 calc((100% - var(--gap16) * 2) / 3);}
.search-body .nice-select{width:100%; height:clamp(3.8rem, 3.6rem + 0.625vw, 4.8rem); line-height:clamp(3.8rem, 3.6rem + 0.625vw, 4.8rem); border-radius:clamp(0.4rem, 0.32rem + 0.25vw, 0.8rem); box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.10);border-color:#fff; padding:0 1.2rem; font-size:1.5rem; color:#404040;  font-weight: 700; outline:none;}
.search-body .nice-select:after{display:none;}
.search-body .nice-select:before{content:""; display: inline-flex; position:absolute; right:1rem; top:50%; margin-top:-0.8rem; width: 1.6rem;  aspect-ratio: 1; background-color: #33363D;  forced-color-adjust: none;  -webkit-mask-repeat: no-repeat;  -webkit-mask-position: center center; -webkit-mask-size: contain;  mask-repeat: no-repeat;  mask-position: center center; mask-size: contain; -webkit-mask-image: url(/resource/images/krds/ico_angle.svg); mask-image: url(/resource/images/krds/ico_angle.svg); transition: var(--krds-transition-base); transform: rotate(0deg);}
.search-body .nice-select:active{outline-color:0.1rem solid #fff !important;}
.search-body .nice-select:hover{border-color:#fff;}
.search-body .nice-select.open:before{transform: rotate(-180deg);}
.search-body.type1 .nice-select:active, 
.search-body.type1 .nice-select.open,
.search-body.type1 .nice-select:focus{ background:#0067FF; border-color: #fff; outline:0.1rem solid #fff;}
.search-body.type1 .nice-select:active:before, 
.search-body.type1 .nice-select.open:before,
.search-body.type1 .nice-select:focus:before{background-color:#fff;}
.search-body.type2 .nice-select:active, 
.search-body.type2 .nice-select.open,
.search-body.type2 .nice-select:focus{ background:#F8CC06; border-color: #fff; outline:1px solid #fff;}
.search-body.type1 .nice-select:active > span, 
.search-body.type1 .nice-select.open > span,
.search-body.type1 .nice-select:focus > span{color:#fff;}
.search-body .nice-select .list{width:100%; max-height: 50dvh; overflow-y: auto;}
.search-body .search-input{margin-top:var(--gap24); border-radius: 0.8rem; background: #F2F7FF; border: 0.2rem solid #0067FF; box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.10);}
.search-body .search-input div{display:flex; border: 0.2rem solid #F2F7FF; border-radius: 0.6rem; overflow:hidden;}
.search-body .search-input input[type="text"]{flex: 1; background: #F2F7FF; border:none; font-size:1.5rem; height:5rem; padding:0 var(--gap16);}
.search-body .search-input input[type="text"]:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px #F2F7FF inset;}
.search-body .search-input input[type="text"]:placeholder{color:#8A949E; font-weight: 700;}
.search-body .search-input .btn-submit{display: flex; align-items: center;  justify-content: center; width: 5rem; height: 5rem; border-radius: 0 0.6rem 0.6rem 0; background: linear-gradient(131deg, #0067FF 16.33%, #0054CF 66.11%, #0067FF 83.14%);}
.search-body .search-input .btn-submit .icon-search{display:block; width:2.4rem; aspect-ratio: 1; background-color:#fff; forced-color-adjust: none;  -webkit-mask-repeat: no-repeat;
 -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(/resource/images/content/icon_map_search.svg); mask-image: url(/resource/images/content/icon_map_search.svg);}
.search-body.type2 .search-input{border-color:#F8CC06; background-color: #FCFAF0;}
.search-body.type2 .search-input div{border-color: #FCFAF0;}
.search-body.type2 .search-input input[type="text"]{background-color: #FCFAF0;}
.search-body.type2 .search-input input[type="text"]:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px #FCFAF0 inset;}
.search-body.type2 .search-input .btn-submit{background: linear-gradient(131deg, #F8CC06 16.33%, #E8BE00 66.11%, #F8CC06 83.14%);}
.search-body.type2 .search-input .btn-submit .icon-search{background-color:#000;}

@media (max-width:768px){
	.map-search-tab .search-head .logo img{height:4.5rem;}
	.map-search-tab {width:calc(100% - 0.5rem);}
	.map-search-tab .search-head{gap: 1rem; width:100%; flex-direction: column; align-items: flex-start}
	.map-search-tab .search-tab{width:100%;}
	.map-search-tab .search-tab button{flex:1;}
	.search-body{width:calc(100% - 2rem);}
	.search-body .select-box > div{flex: 1 0 calc((100% - var(--gap16) * 1) / 2);}
	
	.map-search-tab .listBtn{position:absolute; right:1rem; top:1rem;display:block; width:4rem; height:4rem;  background:url(/resource/images/content/icon_map_menu.svg)no-repeat 50% 50%; background-size:3rem auto; }
}


/* ******************************************************* 
■ 리스트
******************************************************* */
.map-sideList{position:absolute; right:0; z-index:20; display: flex; flex-direction: column; gap:1rem; width:34rem; height:100%; background: #F0F2F3; transition: right 0.4s ease-out 0s; filter: drop-shadow(-1rem 0 1rem rgba(0,0,0,0.14));}
.map-sideList.close{right:-34rem;  filter: drop-shadow(-1rem 0 1rem rgba(0,0,0,0.0));}
.map-sideList .listBtn{position:absolute; left:-3.8rem; top:50%; display: flex; align-items: center; justify-content: center; transform:translateY(-50%); width:3.8rem; height:10.8rem; }
.map-sideList .listBtn:before,
.map-sideList .listBtn:after{content:""; position:absolute; left:0; top:0px; width:100%; height:100%; background-color:#fff;  forced-color-adjust: none;  -webkit-mask-repeat: no-repeat; z-index:-1;
 -webkit-mask-position: center center; -webkit-mask-size: contain; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; -webkit-mask-image: url(/resource/images/content/map_sideBtn.svg); mask-image: url(/resource/images/content/map_sideBtn.svg);}
.map-sideList .listBtn:after{background-color:#0050C6; top:-1rem; z-index:-2;}
.map-sideList .listBtn .icon_map_button{display:block; width:1.7rem;  aspect-ratio: 1; transform: scaleX(-1); background:url(/resource/images/content/icon_map_button.svg)no-repeat 50% 50%; background-size:100%; transition: all 0.2s ease-out 0s;}
.map-sideList .listBtn:focus{box-shadow:none; outline:none;}
.map-sideList.close .listBtn .icon_map_button{transform: scaleX(1);}
.map-sideList .side-head{display: flex; padding: 3.2rem 2.4rem; flex-direction: column; gap: 1rem; height:14rem; background: #2E88FF;}
.map-sideList .side-head h2{position: relative; padding-left: 3rem; font-family: Paperlogy; font-size: 1.9rem; font-weight: 700; color: #FFF;}
.map-sideList .side-head h2:before{content: ""; position: absolute; left: 0px; top: 0.2em; width: 1.6rem; height: 1.6rem; background: #fff;}
.map-sideList .side-head h2:after{content: ""; position: absolute; left: 0.5rem; top: 0.5em; width: 1.6rem; height: 1.6rem; background: #F8CC06; border-radius: 0 1rem 1rem 1rem;}
.map-sideList .side-head .side-result{padding: 0.8rem 2rem; font-size:1.5rem; border-radius: 1rem; background: rgba(0, 0, 0, 0.50); text-align:center; color:#fff; width:100%;}
.map-sideList .side-head .side-result b{color:#F8CC06;}
.map-sideList .sideList{flex:1; min-height:calc(100% - 15rem); background:#fff; box-shadow: 0 -3px 10px 0 rgba(0, 0, 0, 0.10);}
.map-sideList .sideList .no_data{display: flex; align-items: center;  justify-content: center; flex-direction: column; gap:1rem; height:calc(100dvh - 21rem); padding-left: 2rem; line-height:1.5; text-align:center; color:rgba(0, 0, 0, 0.75); font-size:1.5rem; }
.map-sideList .sideList .no_data b{display:block; font-size:1.7rem; font-weight:700;}
.map-sideList .sideList .item{padding:0 1rem 0 2rem}
.map-sideList .sideList .item a{display:block; padding:1.6rem 0; border-bottom:0.1rem solid #CDD1D5;}
.map-sideList .sideList .item .subject{position:relative; font-weight:700; font-size:1.7rem; color:#131416; padding-left:1.4rem; }
.map-sideList .sideList .item .subject:before{content:""; position:absolute; left:0px; top:0.5em;  aspect-ratio: 1; width:0.6rem; border-radius: 0.4rem; background: #F8CC06; transition: all 0.2s ease-out 0s;}
.map-sideList .sideList .item .addr{color:#6D7882; font-size:1.5rem;}
.map-sideList .sideList .item:hover  .subject{color:#17447f;}
.map-sideList .sideList .item:hover  .subject:before{background:#2e88ff;}
.map-sideList .sideList_con{padding:1rem 0; height:calc(100% - 4rem); }

.map-sideList .boardPageNav{height:4rem; display: flex; align-items: center; justify-content: center; padding-bottom: 1rem;}
.map-sideList .boardPageNav a{ display: inline-block; text-align:center; line-height:2.4rem; min-width:2.4rem; border-radius:0.6rem; font-size:1.5rem; background:rgba(0,0,0,0.1);}
.map-sideList .boardPageNav a:has(strong){background: #2E88FF; color:#fff;}
.map-sideList .sideList_con .mCSB_inside > .mCSB_container{margin-right:2rem;}
.map-sideList .sideList_con .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: rgba(46, 136, 255,1);  background-color: rgba(46, 136, 255,0.75);}
.map-sideList .sideList_con .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color: rgba(46, 136, 255,1);  background-color: rgba(46, 136, 255,0.85);}

@media (max-width:768px){
	.map-sideList {right:-100%; width:100%; filter: drop-shadow(-1rem 0 1rem rgba(0,0,0,0.0));}
	.map-sideList .listBtn{left:auto; right:1rem; top:1rem; transform: translateY(0%); width:4rem; height:4rem; }
	.map-sideList .listBtn:before,
	.map-sideList .listBtn:after{display:none;}
	.map-sideList .listBtn .icon_map_button{background-image:url(/resource/images/content/icon_map_close.svg);  background-size: 3rem auto;}
	
	.map-sideList.close{right:0; }
}

/* ******************************************************* 
■ 마크
******************************************************* */
.layer_view{position: absolute; min-width: 27rem; max-width: 29rem; background: #fff; border-radius: 1rem; z-index: 1; padding:1.6rem; filter: drop-shadow(0 1rem 1rem rgba(0, 0, 0, 0.4)); transform: translateX(-50%) translateY(-100%);}
.layer_view:after{content:""; position: absolute;  right:30%; bottom:-2.6rem; height:2.6rem; aspect-ratio: 32/26; background:url('/resource/images/content/map_layerArrow.svg')no-repeat right top; background-size:100%;}
.layer_view .close{position:absolute; right:0px; top:-4rem; width:3rem;  aspect-ratio: 1; border-radius:50%; font-size: 1px; background:#232323 url('/resource/images/content/icon_map_close.svg')no-repeat 50% 50%; background-size:1.2rem;}
.layer_view dt{position:relative; font-weight:700; font-size:1.7rem; color:#131416; padding-left:1.4rem; }
.layer_view dt:before{content:""; position:absolute; left:0px; top:0.5em;  aspect-ratio: 1; width:0.6rem; border-radius: 0.4rem; background: #F8CC06; transition: all 0.2s ease-out 0s;}
.layer_view dd{color:#6D7882; font-size:1.5rem;} 
.layer_view dd a{display:block; padding:0.8rem 0; text-align:center;  border-radius: var(--krds-radius-medium3); background: #0B50D0; color:#fff; font-weight: 700; text-align:center; margin-top:var(--krds-gap-4); }