@charset "utf-8";
/* CSS 초기화 */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;background:transparent;}
body{font-family:'notokr-medium','Nanum Gothic','Malgun Gothic',HelveticaNeue,DroidSans,Sans-serif,Helvetica}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{ display:block;}
nav ul, li{list-style:none;}
a{margin:0;padding:0;font-size:100%;text-decoration:none;vertical-align:baseline;background:transparent;}
img{vertical-align:top;}
table{border-collapse:collapse;border-spacing:0;}
input, select{margin:0;padding:0;box-sizing:content-box;vertical-align:top;border-radius:0;color:#555; font-family:'notokr-medium', 'Nanum Gothic','Malgun Gothic',HelveticaNeue,DroidSans,Sans-serif,Helvetica;}
textarea{margin:0;padding:0;}
img{border:none;vertical-align:middle;}
ol li{ list-style:decimal}
button,select{vertical-align:middle;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
hr, legend, caption {top:0; left:0; width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0;} /* For Screen Reader */
fieldset, button, frame, iframe {border:none;}
a:link {color:#555; text-decoration:none;}
a:visited {color:#555; text-decoration:none;}
a:hover, a:focus {color:#555; text-decoration:none;}
a:active {color:#555; text-decoration:none;}

/* 웹폰트 CSS */
@font-face{font-family:'Nanum Gothic'; src:url(../../common/fonts/NanumGothic.eot)}
@font-face{font-family:'Nanum Gothic'; src:url(../../common/fonts/NanumGothic.woff)}
@font-face {
    font-family:'notokr-black';
    src: url('../../common/fonts/notokr-black.eot');
    src: url('../../common/fonts/notokr-black.eot?#iefix') format('embedded-opentype'),
url('../../common/fonts/notokr-black.woff2') format('woff2'),
url('../../common/fonts/notokr-black.woff') format('woff'),
url('../../common/fonts/notokr-black.ttf') format('truetype'),
url('../../common/fonts/notokr-black.svg#notokr-black') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family:'notokr-bold';
    src: url('../../common/fonts/notokr-bold.eot');
    src: url('../../common/fonts/notokr-bold.eot?#iefix') format('embedded-opentype'),
url('../../common/fonts/notokr-bold.woff2') format('woff2'),
url('../../common/fonts/notokr-bold.woff') format('woff'),
url('../../common/fonts/notokr-bold.ttf') format('truetype'),
url('../../common/fonts/notokr-bold.svg#notokr-bold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family:'notokr-demilight';
    src: url('../../common/fonts/notokr-demilight.eot');
    src: url('../../common/fonts/notokr-demilight.eot?#iefix') format('embedded-opentype'),
url('../../common/fonts/notokr-demilight.woff2') format('woff2'),
url('../../common/fonts/notokr-demilight.woff') format('woff'),
url('../../common/fonts/notokr-demilight.ttf') format('truetype'),
url('../../common/fonts/notokr-demilight.svg#notokr-demilight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family:'notokr-light';
    src: url('../../common/fonts/notokr-light.eot');
    src: url('../../common/fonts/notokr-light.eot?#iefix') format('embedded-opentype'),
url('../../common/fonts/notokr-light.woff2') format('woff2'),
url('../../common/fonts/notokr-light.woff') format('woff'),
url('../../common/fonts/notokr-light.ttf') format('truetype'),
url('../../common/fonts/notokr-light.svg#notokr-light') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family:'notokr-medium';
    src: url('../../common/fonts/notokr-medium.eot');
    src: url('../../common/fonts/notokr-medium.eot?#iefix') format('embedded-opentype'),
url('../../common/fonts/notokr-medium.woff2') format('woff2'),
url('../../common/fonts/notokr-medium.woff') format('woff'),
url('../../common/fonts/notokr-medium.ttf') format('truetype'),
url('../../common/fonts/notokr-medium.svg#notokr-medium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family:'notokr-regular';
    src: url('../../common/fonts/notokr-regular.eot');
    src: url('../../common/fonts/notokr-regular.eot?#iefix') format('embedded-opentype'),
url('../../common/fonts/notokr-regular.woff2') format('woff2'),
url('../../common/fonts/notokr-regular.woff') format('woff'),
url('../../common/fonts/notokr-regular.ttf') format('truetype'),
url('../../common/fonts/notokr-regular.svg#notokr-regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family:'notokr-thin';
    src: url('../../common/fonts/notokr-thin.eot');
    src: url('../../common/fonts/notokr-thin.eot?#iefix') format('embedded-opentype'),
url('../../common/fonts/notokr-thin.woff2') format('woff2'),
url('../../common/fonts/notokr-thin.woff') format('woff'),
url('../../common/fonts/notokr-thin.ttf') format('truetype'),
url('../../common/fonts/notokr-thin.svg#notokr-thin') format('svg');
    font-weight: normal;
    font-style: normal;
}
/*layout*/
html, body {height: 100%; margin:0; padding:0; overflow:hidden}
/*header*/
#header {position:relative; height:50px; z-index:95; border-bottom:1px solid #7f7f7f}
#header h1 {position:absolute; top:17px; left:20px;}
#header div.search {position:absolute; top:10px; left:263px; width:435px;overflow:hidden; padding-left:2px; z-index:99}
#header div.search2 {position:absolute; top:10px; left:263px; width:435px;overflow:hidden; padding-left:2px; z-index:99}
#header ul.gnb {position: absolute;top: 10px;left: 702px;overflow-x: hidden;overflow-y: hidden;width: 480px;height: 32px;padding-left: 2px;z-index: 98;}
#header ul.gnb li {float:left; padding:0 2px}
#header div.search .input_slt{height:25px; padding:1px; border:1px solid #ccc; vertical-align:middle}
/*map contents*/
#container {height:100%; margin:-50px 0 0 0;} * html #container {height: 100%;}
#container #contents {height:calc(100% - 50px); position:relative; padding:50px 0 0 0;}
/*leftmenu*/
#lnb {height: calc(100% - 304px); min-height:260px; position:absolute; top:55px; left:5px; width:280px; padding:0 0 33px 0; border:1px solid #CBC5C5; background:#fff;  z-index:100}
#lnb > h2{width:280px; height:33px; line-height:33px; background:#8d807b; color:#fff; text-align:center; font-size:14px}
#lnb > h2.tab{width:50%; float: left; /* margin-bottom: 15px; */ cursor: pointer;}
#lnb > h2.on{background-color: #fff; color: #606060;}
#lnb > ul {height: 100%;min-height:260px; width:280px;overflow: hidden; overflow-y: auto;}
#lnb > ul > li {padding:7px 22px 0; font-size:14px;; line-height:30px; margin:1px 0}
#lnb > ul > li > a{font-size:14px; padding-left:24px}
#lnb > ul > li > a:hover{color:#ec7e1c;}

#lnb > ul > li > ul > li { position:relative; background:#edf3e7; line-height:30px; margin:1px 0; padding:0 7px; color:#7f7f7f; font-size:12px;}
#lnb > ul > li > ul > li.caption {
    color: #7b7b7b;
    line-height: 14px;
    background: #f1f1f1;
    padding: 5px 0 5px 5px;
 }
 #lnb > ul > li > ul > li > i.icon {
    color: #e49e00;
    padding-left: 10px;
    cursor: pointer;
    display: inline-block;
    line-height: 30px;
    right: 30px;
    position: absolute;
 }
 
 #lnb > ul > li > ul > li > span > i.icon {
    color: #e49e00;
    padding-left: 10px;
    cursor: pointer;
 }
#lnb > ul > li > ul > li > input { margin-top:9px; margin-right:3px}
#lnb > ul > li > ul > li > div { position:absolute; top:7px; right:5px; width:14px; height:14px; text-indent:-100000; font-size:0}
#lnb > ul > li > ul > li > a {color:#7f7f7f; font-size:12px;}
#lnb > ul > li > ul > li > a:hover{color:#849a42;}
#lnb > ul > li a.on {background:url(../../img/blt_on.png) no-repeat 0px 2px}
#lnb > ul > li a.off {background:url(../../img/blt_off.png) no-repeat 0px 2px}
.arrow_r {position:absolute; top:200px; left:0; width:11px; height:59x}
.arrow_l {position:absolute; top:200px; left:280px; width:11px; height:59px}
.control {position:absolute; margin-top:10px; border:1px solid #CBC5C5;width:280px; background:#fff; padding-bottom:5px; color:#555}
.control > ul {min-height:34px;max-height: 170px;overflow-y: auto;}
.control > h3 {width:100%; height:25px; line-height:25px; background:#8d807b; color:#fff; text-align:center; font-size:13px}
.control > ul >li > dl > dt { float:left; width:45px; padding-left:35px}
.control > ul >li > dl > dd {float:left;}
.control > ul >li { position:relative; font-size:13px; height:14px; padding:10px 0}
.control > ul >li > dl > dt > span { position:absolute; top:12px; left:14px; width:14px; height:14px; text-indent:-100000; font-size:0}
.control > ul >li > dl > dd > div{ display:inline-block; background:url(../../img/control_bg.png) no-repeat 0 5px; width:118px; margin-right:10px}
.control p.close {position:absolute; top:0; right:-20px}
.scale {position:absolute; top:100px; right:22px; width:25px; height:257px; background:url(../../img/scale_bg.png) no-repeat; z-index:98}
.scale p.scale_up {position:absolute; top:0; right:3px;}
.scale p.scale_down {position:absolute; top:238px; right:3px;}
.scale p.scale_arw {position:absolute; top:29px; right:4px; height:169px}
/*레이어*/
.layer1{position:absolute; top:50px; left:400px; border:1px solid #CBC5C5; background:#edf3e7; padding:5px; display:none}
.layer2{position:absolute; top:100px; left:500px; border:1px solid #CBC5C5; background:#edf3e7; padding:5px; display:none}
.layer3, .layer7 {position:absolute; top:55px; right:5px; max-height:700px; overflow:hidden; width:600px; border:1px solid #CBC5C5;font-size:13px; background:#fff; border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; display:none;}
.layer5{position:absolute; top:250px; left:300px; height:160px; overflow:hidden; width:350px; border:1px solid #CBC5C5;font-size:13px; background:#fff; /* border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; */ display:none;}
.layer6{position:absolute; top:55px; left:300px; height:350px; overflow:hidden; width:450px; border:1px solid #CBC5C5;font-size:13px; background:#fff; /* border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; */ display:none;}
.layer3 .grp, .layer4 .grp, .layer7 .grp{padding:10px; }
.layer4{position:absolute; top:55px; right:5px; width:300px; border:1px solid #CBC5C5;font-size:13px; background:#fff; display:none;}
.layer3 h3, .layer4 h3, .layer5 h3, .layer6 h3, .layer7 h3, .legend_box h3, .map_popup h3{width:100%; height:25px; line-height:25px; background:#8d807b; color:#fff; text-align:center; font-size:13px}
.layer1 p.close, .layer2 p.close, .legend_box p.close, .map_popup p.close {position:absolute; top:0; right:-20px}
.layer3 p.close, .layer4 p.close, .layer5 p.close, .layer6 p.close, .layer7 p.close {position:absolute; top:3px; right:5px}
.scale_box{position:absolute; bottom:10px; left:10px; width:100px; background:#8d807b; color:#fff; text-align:center; font-size:13px; line-height:24px }
.legend_box{position:absolute; bottom:10px; right:15px; width:200px; background: rgba(255,255,255,0.8); font-size:12px; line-height:24px; border:1px solid #CBC5C5; padding-bottom:5px; display:none; border-radius: 0.25rem;}
.legend_box ul{ margin-top:5px}
.legend_box li{ text-align:center; margin:2px 10px}
.legend_box .set_section{display:none; border-bottom:1px solid #efefef; line-height:30px;}
.legend_box .set_section .jscolor{width:20px; height:20px; float:left; border:2px solid #fff; margin-top:1px;}
.legend_box .set_section input{width:55px;}

.layer3 .capt{padding:10px 10px 0 10px; color: #1e7cbc}

/* 자료검색 메뉴 */
#nav_box, #nav_box3{ /*width:100%;*/ height:60px; padding:10px; }
#nav, #nav3 {height:24px; width:100%; font-size:12px;}
#nav > li, #nav3 > li { float:left; width:80px; position:relative; background:#f1eee1; text-align:center; margin-right:3px; line-height:28px; border:1px solid #ccc;}
#nav ul, #nav3 ul{position:absolute; display:none ; width:580px; top:29px; padding-top:5px; z-index:99; background:#fff;}
#nav ul.m1, #nav3 ul.m1{left:0; z-index:99;}
#nav ul.m2, #nav3 ul.m2{left:-85px; z-index:99}
#nav ul.m3, #nav3 ul.m3{left:-170px; z-index:99}
#nav ul.m3 li img, #nav3 ul.m3 li img{cursor: pointer;}
#nav ul.m3 li img, #nav3 ul.m3 li img{cursor: pointer;}
#nav ul.m3 li textarea, #nav3 ul.m3 li textarea{width: 495px; border-radius:0.25rem; height:50px; resize:none; padding:5px; overflow:hidden; background-color: #ecf0f1;  borde: 1px solid #808080; outline:none}

#nav li ul.on, #nav3 li ul.on{ display:block}
#nav ul li, #nav3 ul li{float:left; color:#555; margin: 0 4px 4px 0;}

#nav li a:link, #nav3 li a:link {background:#f1eee1; color:#333; display:block }
#nav li a:visited, #nav3 li a:visited {background:#ddd;}
#nav li a:hover, #nav li a:focus, #nav li a.on, #nav3 li a:hover, #nav3 li a:focus, #nav3 li a.on {background:#65554e; color:#fff!important;}
#nav li a:active, #nav3 li a:active {background:#000;}

#nav ul li a:link, #nav3 ul li a:link {background:#edf3e7; color:#333; display:block; padding:0 5px;}
#nav ul li a:visited, #nav3 ul li a:visited {background:#ddd;}
#nav ul li a:hover, #nav ul li a:focus, #nav ul li a.on, #nav3 ul li a:hover, #nav3 ul li a:focus, #nav3 ul li a.on {background:#ec7e1c; color:#fff!important;}
#nav ul li a:active, #nav3 ul li a:active {background:#000;}

/* 측정값 구간보기 */
#nav_box2{ width:100%; height:28px; padding:5px 10px 0 10px; }
#nav2 {height:24px; width:100%; font-size:12px;}
#nav2 > li{ float:left; width:137px; position:relative; background:#f1eee1; text-align:center; margin-right:3px; line-height:28px; border:1px solid #ccc;}
#nav2 ul{position:absolute; display:none ; width:580px; top:29px; padding-top:5px; z-index:99; background:#fff;}
#nav2 ul.m1{left:0; z-index:99;}
#nav2 ul.m2{left:-85px; z-index:99}

#nav2 li ul.on{ display:block}
#nav2 ul li{float:left; color:#555; margin: 0 4px 4px 0;}

#nav2 li a:link {background:#f1eee1; color:#333; display:block }
#nav2 li a:visited {background:#ddd;}
#nav2 li a:hover, #nav li a:focus, #nav2 li a.on {background:#65554e; color:#fff!important;}
#nav2 li a:active {background:#000;}

#nav2 ul li a:link {background:#edf3e7; color:#333; display:block; padding:0 5px;}
#nav2 ul li a:visited {background:#ddd;}
#nav2 ul li a:hover, #nav2 ul li a:focus, #nav2 ul li a.on {background:#ec7e1c; color:#fff!important;}
#nav2 ul li a:active {background:#000;}
/*검색*/
.sch{position:relative; border:1px solid #8d807b; padding:10px; margin-bottom:10px; color:#65554e; line-height:36px}
.sch .input_txt{height:26px; padding:0 6px; border:1px solid #ccc; color:#666; vertical-align:middle}
.sch .input_slt{height:25px; padding:1px; margin-bottom:3px; border:1px solid #ccc; vertical-align:middle; line-height:25px}
.btn_sch_off {display:inline-block;min-width:50px;padding:0px 10px;height:29px;line-height:29px;vertical-align:middle;text-align:center;font-size:14px;text-decoration:none;text-indent:0px;background:#757575;color:#fff!important;border:none; margin:0 0 3px 10px;border-radius:0.25rem;}
.btn_sch {display:inline-block;min-width:50px;padding:0px 10px;height:29px;line-height:29px;vertical-align:middle;text-align:center;font-size:14px;text-decoration:none;text-indent:0px;background:#849a42;color:#fff!important;cursor:pointer;border:none; margin:0 0 3px 10px;border-radius:0.25rem;}
.btn_sch:active {position:relative;}
.btn_sch:hover {background:#000; border:none}
.btn_sct1 {display:inline-block;min-width:50px;padding:0px 10px;height:29px;line-height:29px;vertical-align:middle;text-align:center;font-size:14px;text-decoration:none;text-indent:0px;background:#849a42;color:#fff!important;cursor:pointer;border:none; border-radius:0.25rem;}
.btn_sct2 {display:inline-block;min-width:50px;padding:0px 10px;height:29px;line-height:29px;vertical-align:middle;text-align:center;font-size:14px;text-decoration:none;text-indent:0px;background:#849a42;color:#fff!important;cursor:pointer;border:none; border-radius:0.25rem; float: right;}
.data_tbl {display:none}
.data_tbl2 {display:none}
/* table */
caption {visibility:hidden;overflow:hidden;width:1px;height:1px;font-size:0;line-height:0}
.tbl_header { position:relative; margin:7px 0}
.tbl_unit { position:absolute; top:0px; right:0px}
.tbl_01{width:100%;border-top:2px solid #65554e;border-right:1px solid #dcdcdc; border-collapse:separate;border-spacing:0;}
.tbl_01 th{padding:10px 0 9px;border-bottom:1px solid #dcdcdc;border-left:1px solid #dcdcdc;background-color:#edf3e7;vertical-align:middle}
.tbl_01 td {line-height:18px;border-bottom:1px solid #dcdcdc;border-left:1px solid #dcdcdc; padding:8px 0 7px 5px; vertical-align:middle}

.tbl_list,.tbl_list th,.tbl_list td{border:0}
.tbl_list a{color:#383838;text-decoration:none}
.tbl_list{width:100%;border-bottom:1px solid #dcdcdc; border-right:1px solid #dcdcdc;table-layout:fixed}
.tbl_list th{padding:5px;border-top:1px solid #65554e;border-bottom:1px solid #dcdcdc;border-left:1px solid #dcdcdc;background-color:#edf3e7;color:#333;font-weight:bold;line-height:18px;vertical-align:middle}
.tbl_list th span{display: block; width:50px; margin:0 auto;}
.tbl_list thead td{padding:6px 0 5px 0; border-top:solid 1px #dcdcdc; border-bottom:solid 1px #dcdcdc;border-left:1px solid #dcdcdc;text-align:center;vertical-align:middle; height:20px; text-indent:3px; font-weight:bold; background-color:#edf3e7;}
.tbl_list tbody td{position:relative; padding:6px 0 5px 0;border-bottom:solid 1px #dcdcdc;border-left:1px solid #dcdcdc;text-align:center;vertical-align:middle; height:20px; line-height:20px; text-indent:3px; font-size:12px}
.tbl_list th.none, .tbl_list td.none{border-left:none}
.tbl_list .title{text-align:left; padding-left:3px}
.tbl_list a{color:#5879c0;}
.tbl_list a:hover,.tbl_list .title a:focus,.tbl_list .title a:active {text-decoration:underline;}
.tbl_list a:visited {color:#4d3972;}
/*pagination*/
.pagination{width:100%; display:inline-block; margin:20px 0; text-align:center;}
.pagination a{display:inline-block; width:32px; height:32px; border:1px solid #ddd; color:#aaa; text-align:center; line-height:32px; font-weight:bold; text-decoration:none;}
.pagination a, .pagination img{vertical-align:middle;}
.pagination a.on, .pagination a:hover {border:1px solid #849a42; color:#849a42;}
/* 버튼 */
.btn_exl, .btn_exl2 { background:url(../../img/btn_exl.gif) no-repeat 0 5px; padding:3px 3px 3px 18px; font-size:12px}
a:hover.btn_exl, a:hover.btn_data { text-decoration:underline; color:#ec7e1c}
.btn_data{background:url(../../img/ico_file.png) no-repeat 0 5px; padding:3px 3px 3px 18px; font-size:12px}
/* 지도 */
.map {width: 100%;height: 100%;z-index: 0;}
/*추가레이어*/
.map_popup{width:300px; background: rgba(255,255,255,0.8); font-size:12px; line-height:24px; border:1px solid #CBC5C5; border-radius: 0.25rem; padding-bottom:5px}
.map_popup ul{ margin-top:5px}
.map_popup li{ clear:both; text-align:center; margin:3px 10px}
.map_popup dt { float:left; background:#65554e; color:#fff; width:100px; padding:0 3px; margin:2px}
.map_popup dd{float:left; background:#edf3e7; width:160px; padding:0 2px; margin:2px}
.map_popup .dt_block { width:260px; padding-left:10px;}
/* 주제도 툴팁 */
.layer_tooltip {position: absolute;
    top: 55px;
    left: 290px;
    z-index: 99;
    font-size: 12px;
    font-weight:bold;
    min-width: 300px;
    border-radius: 0.25rem;
    background: #cbcbcb;
    color: #ab0c2a;
    padding: 5px 10px;
    border: 2px solid #efefef;
    display: none;}
label.line{
	padding-left:5px;
	background:#efefef;
    border-bottom: 1px solid;
    border-top: 1px solid;
    line-height: 30px;
    width: 100%;
}
li.paging{
	text-align: center;
	background: #fff;
}