/**/
html{*overflow:hidden;height:100%;font-size:12px;line-height:140%;letter-spacing:-0.03em;}
body{*overflow:hidden;height:100%;margin:0;overflow-x:hidden;} 

/* block */
h1, h2, h3, h4, h5, h6{margin:0;font-size:1em;font-weight:normal;}
blockquote, p{margin:0;}

/* list */
dd, dl, ol, ul {margin:0;padding:0;}
li {list-style-type:none;}

/* form */
fieldset {margin:0;padding:0;border:0 none;}
input {vertical-align:middle;font-size:12px;}

/* basic */
a {color:#666; text-decoration:none;}

/* align */
.ml-5{margin-left:5px !important;}
.mt-5{margin-top:5px !important;}
.mt-110{padding-left: 15px; margin-bottom: 8px; margin-top: 8px;}

/* clear */
.clear:after{content:".";height:0;font-size:0;visibility:hidden;display:block;clear:both;}
.clear{display:inline-block;}

.clear2:after{content:".";height:0;font-size:0;visibility:hidden;display:block;clear:both;}
.clear2 {display:block;*display:inline-block;}

#go-area{overflow:hidden;position:absolute;top:0;right:0;width:100%;height:40px;background:#fff;border-bottom:1px solid #888888;z-index:1000}
.go-list{height:100%;}


/**/
#mapContent{overflow:hidden;position:relative;height:100%;zoom:1;}
#map{overflow:hidden;position:relative;height:100%;zoom:1;}
#map02{overflow:hidden;position:fixed;height:100%;zoom:1;border: 1px solid black; display:none; top:0px; bottom:0px; right:0px;}
.l_bar {width:1px;height:100%;position:absolute;left:0;top:0;background:#888888;z-index:9999;}
.controll_btn {position:absolute;top:50%;z-index:1000;margin-top:-33.5px}
.bt_nav_close {display:inline-block;width:19px;height:67px;background: url(../images/gis/btn_close.png) no-repeat;}
.bt_nav_open{display:inline-block;width:19px;height:67px;background: url(../images/gis/btn_open.png) no-repeat;}
.bt_nav_open{display:none}
.nav_close .bt_nav_close{display:none}
.nav_close .bt_nav_open{display:inline-block}
.nav_close #Navside{display:none;}

.controll_btn02 {position:absolute;right:50%;top:0px;z-index:1000;margin-top:-33.5px}
.bt_nav_close2 {display:inline-block;width:67px;height:15px;background: url(../images/gis/btn_close02.png) no-repeat; position:absolute;top:73px;}
.bt_nav_open2{display:inline-block;width:67px;height:15px;background: url(../images/gis/btn_open02.png) no-repeat;position:absolute;top:34px;}
.bt_nav_open2{display:none}
.nav_close2 .bt_nav_close2{display:none}
.nav_close2 .bt_nav_open2{display:inline-block}
.nav_close2 #go-area{display:none;}

/*gis */
#mapWrap{position:relative;height:100%;min-width:1000px;min-height:700px;}

#mapContainer{position:absolute;*position:static; top: 0px;bottom:0px;width:100%;height:auto;height:100% ;    overflow: hidden;}
#Navside {position:relative;float:left;width:338px;height:100%; }
.sidecont {height:100%;position:relative; overflow-y: hidden; overflow-x: hidden;}
.left_inside{height:100%;}
#mapContent{overflow:hidden;position:relative;height:100%;zoom:1;}
.l_bar {width:1px;height:100%;position:absolute;left:0;top:0;background:#888888;}
.controll_btn {position:absolute;top:50%;z-index:1000;margin-top:-33.5px}
.bt_nav_close {display:inline-block;width:15px;height:67px;background: url(../images/gis/btn_close.png) no-repeat;}
.bt_nav_open{display:inline-block;width:15px;height:67px;background: url(../images/gis/btn_open.png) no-repeat;}
.bt_nav_open{display:none}
.nav_close .bt_nav_close{display:none}
.nav_close .bt_nav_open{display:inline-block}
.nav_close #Navside{margin-left:-271px;}

#jtMap{position:relative;width:100%;height:100%;margin:0 auto;overflow:hidden;}
.map-layer {width:100%;height:100%;position:relative;}
.inside-left{position: absolute; left:0px; /*top:52px;*/bottom:0;height:100%;background-color: #373d51; }
.selbox-title01{float: left;}
.map-title2{width:74px; height: 40px;background: #f4f4f4 url(../images/gis/area-spot.png) no-repeat; background-position: 8px 13px;  color: #0265cb; padding-left:20px;padding-top: 14px;box-sizing: border-box; font-size: 13px; border: none; border-right: 1px solid #dedede;letter-spacing:-0.08em;border-left:1px solid #a9a9a9;}
.l-boder{ height: 40px;padding-right: 5px;box-sizing: border-box;}
.selbox-title01 p{float: left;}
.tmenu{width: 65px; height: 100%; float: left; }
.tmenu li{width:65px; height: 95px; overflow: hidden; background-color: #373d51; border-bottom: 1px solid #35babc; text-align: center; position: relative;}
.tmenu li a{font-size: 12px;}
.tmenu li.active .left-icon01{ font-weight: 700;background: #0265cb url(../images/left-icon01on.png) no-repeat; display: block; width: 65px; height:20px;  padding-top: 55px; background-position: center 15px; color: #fff;  }
.tab-rightbox_title{ position: absolute; left: 66px; top: 0px;height:100%; background-color: #f4f4f4;}
.tab-rightbox{ position: absolute; left: 66px; top: 0px;height:100%; background-color: #f4f4f4;}
.tab-area{width:273px;}
.left-icon01{background: url(../images/vwis_web/m_icon1.png) no-repeat;background-position: center 22px;display: block; width: 65px; height:28px;  padding-top: 65px;color: #ffffff;}
.left-icon01:hover,.tmenu li.active .left-icon02{ font-weight: 700;background:#35babc url(../images/vwis_web/m_icon1.png) no-repeat;background-position: center 22px;display: block; width: 65px; height:48px;  padding-top: 65px; color: #ffffff;}
.left-icon02{background: url(../images/vwis_web/m_icon2.png) no-repeat;background-position: center 22px;display: block; width: 65px; height:20px;  padding-top: 65px; color: #ffffff;}
.left-icon02:hover,.tmenu li.active .left-icon07{font-weight: 700;background:#35babc url(../images/vwis_web/m_icon2.png) no-repeat;background-position: center 22px;display: block; width: 65px; height:48px; padding-top: 65px; color: #ffffff;}
.left-icon03{background: url(../images/vwis_web/m_icon3.png) no-repeat;background-position: center 22px;display: block; width: 65px; height:20px;  padding-top: 65px; color: #ffffff;}
.left-icon03:hover,.tmenu li.active .left-icon07{font-weight: 700;background:#35babc url(../images/vwis_web/m_icon3.png) no-repeat;background-position: center 22px;display: block; width: 65px; height:48px; padding-top: 65px; color: #ffffff;}
.left-icon04{background: url(../images/vwis_web/m_icon4.png) no-repeat;background-position: center 22px;display: block; width: 65px; height:20px;  padding-top: 65px; color: #ffffff;}
.left-icon04:hover,.tmenu li.active .left-icon07{font-weight: 700;background:#35babc url(../images/vwis_web/m_icon4.png) no-repeat;background-position: center 22px;display: block; width: 65px; height:48px; padding-top: 65px; color: #ffffff;}
.tmenuMain{width: 65px; height: 100%; background-color: #d9e8f2; border-right: 1px solid #0082c8;line-height:100%;position:relative;}

.right-title{width:273px; height:35px; background-color:#0054a6;  color: #fff; text-align: center;line-height:35px;font-weight:bold;font-size:14px;}
.mapsearch2{width: 272px;}
.mapsearch2:after{content:"";display:block;*display:inline-block;clear:both;}
.mapsearch2 li{ width: 100%;  height: 35px; float: left;background:#e0e0e0 url(../images/vwis_web/bg_tabline.gif) no-repeat right center;}
.mapsearch2 li a.last{}
.mapsearch2 li a{font-size:13px;font-family: 'NanumGothic';line-height:33px;color:#888888;display:block;width:99%;padding-right:1px; height: 35px;text-align:center;background:url(../images/tab_btmline.gif) repeat-x 0 bottom;outline:0;}
.mapsearch2 li.active{ width: 50%;  height: 35px; float: left;background:#f4f4f4 url(../images/bg_tabline.gif) no-repeat right center;}
.mapsearch2 li.active a{line-height:33px;color:#009d66;display:block;width:99%;padding-right:1px; height: 35px;text-align:center;background:none;}

.map-searchTopDiv {padding: 5px 0; display: inline-block;}
.map-searchTopDiv p {margin-left: 5px;}

.searchbox{background:#f4f4f4;padding:4px 10px;}
.search-tit2{float:left;width:85px;line-height:24px;letter-spacing:-1px; color: #555555;}
.search-tit2_mb{margin-top:8px;font-weight:600;font-size:25px;float:left;width:120px;line-height:24px;letter-spacing:-0.13em; color: #555555;}
.search-select{cursor: pointer; text-align:center; margin-left:25px; float:left;width:142px !important; border:1px solid #cdcdcd;height:24px !important; border-radius: 3px;color:#555555;}
.search-select_mb{font-weight:600;font-size:20px;cursor: pointer; text-align:center; margin-left:20px; float:left;width:141px !important; border:1px solid #cdcdcd;height:35px !important; border-radius: 3px;color:#555555;}
.search-select2{cursor: pointer; text-align:center; margin-left:25px; float:left;width:140px !important; border:1px solid #cdcdcd;height:24px !important; border-radius: 3px;color:#555555;}
.search-select2_mb{cursor: pointer; text-align:center; margin-left:20px; float:left;width:140px !important; border:1px solid #cdcdcd;height:35px !important; border-radius: 10px;color:#555555;}
.search-select4{width:20px !important;cursor: pointer; border:1px solid #cdcdcd;height:22px !important; border-radius: 3px;color:#555555; padding-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px;margin-left: 70px;}
.search-select6{float:left;width:100px !important; border:1px solid #cdcdcd;height:30px !important; border-radius: 3px;color:#555555;}

.search-result-tit{color:#555;text-align:center;font-size:13px;background:#d2d2d2;padding:10px 0;font-weight:700;}
.search-result-tit2{color:white;text-align:center;font-size:13px;line-height:100%;font-weight:700;background:#35babc;padding:10px 0;border-top:1px solid #cdcdcd;border-bottom:1px solid #cdcdcd;}
.search-result-tit3{line-height:100%;font-weight:700;background:#35babc;border-top:1px solid #cdcdcd;border-bottom:1px solid #cdcdcd;}

.btn-search {margin-left:25px; width:120px;display:block;display:inline-block;background:#8f8f8f url(../images/gis/btn_search.png) no-repeat 54px center;border-radius:3px;color:#fff;border:1px solid #373d51;padding:7px 0 7px 75px;font-size:13px;line-height:100%; font-weight:700;}
.btn-top-search {width:40px;display:block;border-radius:3px;color:#fff;font-size:13px;line-height:100%;background:#727272;border:1px solid #3e3e3e;padding:7px 15px;text-align:center;}

.ol-popup {
        position: absolute;
        background-color: white;
        -webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
        filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
        padding: 10px;
        padding-top:20px;
        border-radius: 10px;
        border: 1px solid #cccccc;
        bottom: 12px;
        left: -50px;
        min-width: 10px;
        width: 140px;
      }
      .ol-popup:after, .ol-popup:before {
        top: 100%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
      }
      .ol-popup:after {
        border-top-color: white;
        border-width: 10px;
        left: 48px;
        margin-left: -10px;
      }
      .ol-popup:before {
        border-top-color: #cccccc;
        border-width: 11px;
        left: 48px;
        margin-left: -11px;
      }
      .ol-popup-closer {
        text-decoration: none;
        position: absolute;
        top: 2px;
        right: 8px;
      }
      .ol-popup-closer:after {
        content: "X";
      }

input.range {
  -webkit-appearance: none;
  bottom: -10px;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
input.range:focus {
  outline: 0;
}
input.range::-moz-focus-outer {
  border: 0;
}

input.range::-webkit-slider-thumb {
  box-shadow: 1px 1px 1px black, 0px 0px 1px black;
  border: 0;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: white;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -7.5px;
}

input.range::-moz-range-thumb {
  box-shadow: 1px 1px 1px black, 0px 0px 1px black;
  border: 0;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: white;
  cursor: pointer;
}

input.range::-webkit-slider-runnable-track {
  width: 100%;
  height: 10px;
  cursor: pointer;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0px 0px 1px rgba(13, 13, 13, 0);
  background: indigo;
  border-radius: 20px;
  border: 0;
}

input.range::-moz-range-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0px 0px 1px rgba(13, 13, 13, 0);
  background: indigo;
  border-radius: 20px;
  border: 0;
}

input.range::-ms-track {
  width: 100%;
  height: 5px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}

input.range::-ms-thumb {
  box-shadow: 1px 1px 1px black, 0px 0px 1px black;
  border: 0;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: white;
  cursor: pointer;
  height: 5px;
}

input.range::-ms-fill-lower,
input.range::-ms-fill-upper {
  background: indigo;
  border: 0;
  border-radius: 40px;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0px 0px 1px rgba(13, 13, 13, 0);
}

.range__tick {
  fill: #a0a0a0;
}
.range__tick:first-child {
  -webkit-transform: translateX(2px);
  -moz-transform: translateX(2px);
  -ms-transform: translateX(2px);
  -o-transform: translateX(2px);
  transform: translateX(2px);
}
.range__tick:last-child {
  -webkit-transform: translateX(-3px);
  -moz-transform: translateX(-3px);
  -ms-transform: translateX(-3px);
  -o-transform: translateX(-3px);
  transform: translateX(-3px);
}

.range__field {
  border: 0;
}

.legend_box{
	cursor: default;
    display: block;
    position: fixed;
    width: auto;
    height: auto;
    bottom: 50px;
    left: 360px;
    border-radius: 3px;
    transition: all 0.8s ease 0s;
    box-shadow : rgba(102, 102, 102, 0.1) 0px 0px 3px;
}
.legend_info{
	text-align: left;
	vertical-align: bottom;
	border-bottom: 1px solid black;
	font-weight:bold;
}

.legend_info2{
	text-align: center;
	vertical-align: bottom;
	border-bottom: 1px solid black;
	font-weight:bold;
}

.model_time_list_button{
	width:100%;
	color: #000000;
	border-width:0px;
    border-bottom: #000000 solid 1px;
    padding: 10px;
    background-color: transparent;
}

.model_time_list_button:hover {
    color: #000000;
    background-color: #ffffff;
}

.parent {
  display: flex;
  border: 1px solid black;
  font-size:13px;line-height:100%;
}

.btn-top-search {width:40px;display:block;border-radius:3px;color:#fff;font-size:13px;line-height:100%;background:#727272;border:1px solid #3e3e3e;padding:7px 15px;text-align:center;}

.button1_off{
	font-weight:bold; color: white; text-align:center; width:50%; height:80%; margin-left:2px; margin-top:2px; left:0px; background-color: #a0a0a0; position: absolute; border-radius:7px;
}
.button1_on{
	font-weight:bold; color: white; text-align:center; width:50%; height:80%; margin-left:2px; margin-top:2px; right:0px; background-color: #0583ff; position: absolute; border-radius:7px;
}

.button2_off{
	font-weight:bold; color: white; text-align:center; width:50%; height:80%; margin-left:2px; margin-top:2px; left:0px; background-color: #a0a0a0; position: absolute; border-radius:7px;
}
.button2_on{
	font-weight:bold; color: white; text-align:center; width:50%; height:80%; margin-left:2px; margin-top:2px; right:0px; background-color: #0583ff; position: absolute; border-radius:7px;
}

.button3_off{
	font-weight:bold; color: white; text-align:center; width:50%; height:80%; margin-left:2px; margin-top:2px; left:0px; background-color: #a0a0a0; position: absolute; border-radius:7px;
}
.button3_on{
	font-weight:bold; color: white; text-align:center; width:50%; height:80%; margin-left:2px; margin-top:2px; right:0px; background-color: #0583ff; position: absolute; border-radius:7px;
}


.ol-zoom-in{position:fixed; top:315px; right:30px; margin: 0; text-decoration: none; display: block; float: left; width: 35px; height:35px;margin-bottom: 5px; color: #555555; font-size: 20px;border: 1px solid #dfdfdf; border-radius: 5px; text-align: center; background: #ffffff; box-sizing: border-box; box-shadow:3px 3px 3px rgba(0,0,0,.2);}
.ol-zoom-in:hover{position:fixed; top:315px; right:30px; margin: 0; text-decoration: none; display: block; float: left; width: 35px; height:35px; margin-bottom: 5px; color: #ffffff; font-size: 20px;border: 1px solid #dfdfdf; border-radius: 5px; text-align: center; background: #373d51; box-sizing: border-box; box-shadow:3px 3px 3px rgba(0,0,0,.2);}
.ol-zoom-out{position:fixed; top:350px; right:30px; margin: 0; text-decoration: none; display: block; float: left; width: 35px; height:35px; margin-bottom: 5px; color: #555555; font-size: 20px;border: 1px solid #dfdfdf; border-radius: 5px; text-align: center; background: #ffffff; box-sizing: border-box; box-shadow:3px 3px 3px rgba(0,0,0,.2);}
.ol-zoom-out:hover{position:fixed; top:350px; right:30px; margin: 0; text-decoration: none; display: block; float: left; width: 35px; height:35px; margin-bottom: 5px; color: #ffffff; font-size: 20px;border: 1px solid #dfdfdf; border-radius: 5px; text-align: center; background: #373d51; box-sizing: border-box; box-shadow:3px 3px 3px rgba(0,0,0,.2);}

.weather_api_form{
	background: url('../../asset/images/vwis_web/맑음_배경_ㅣ.jpg') no-repeat;
	background-size: 280px;
	padding: 15px;
	position:fixed;
	width:240px;
	height:140px;
	top:120px;
	right:30px;
	border: 1px solid #777777;
	border-radius: 5px;
	box-shadow:3px 3px 3px rgba(0,0,0,.2);
	isolation: isolate;
}
.weather_api_form::after{
	content: '';
	position: absolute;
	background: white;
	z-index: -1;
	inset: 0;
	opacity: 0.5;
}