/* @import url(//fonts.googleapis.com/earlyaccess/notosanskr.css); */

/* 폰트 페이스 15M나 먹어서 주석처리함
@font-face{
	font-family:'Noto Sans KR';
	src:url('../fonts/NotoSansKR-Black.otf') format("opentype");
	font-weight: 900;
}
@font-face{
	font-family:'Noto Sans KR';
	src:url('../fonts/NotoSansKR-Bold.otf') format("opentype");
	font-weight: 700;
}
@font-face{
	font-family:'Noto Sans KR';
	src:url('../fonts/NotoSansKR-Medium.otf') format("opentype");
	font-weight: 500;
}
@font-face{
	font-family:'Noto Sans KR';
	src:url('../fonts/NotoSansKR-Regular.otf') format("opentype");
	font-weight: 400;
}
@font-face{
	font-family:'Noto Sans KR';
	src:url('../fonts/NotoSansKR-Light.otf') format("opentype");
	font-weight: 300;
}
@font-face{
	font-family:'Noto Sans KR';
	src:url('../fonts/NotoSansKR-Thin.otf') format("opentype");
	font-weight: 200;
}
*/
html{
	overflow-x: auto;
}
*{font-family:"Noto Sans KR", sans-serif !important;}
BODY {
	MARGIN: 0px
}
BODY {
	FONT-SIZE: 12px; colsOR: #2f2f2f; FONT-FAMILY: 돋움, dotum, sans-serif;
}
TD 
{    
    FONT-SIZE: 12px; colsOR: #2f2f2f; FONT-FAMILY: 돋움, dotum, sans-serif
}
A {
	colsOR: #2f2f2f
}
A:link {
	TEXT-DECORATION: none
}
A:visited {
	TEXT-DECORATION: none
}
A:hover {
	colsOR: #2f2f2f; TEXT-DECORATION: underline
}


A.rt:link {
	colsOR: #2f2f2f
}
A.rt:visited {
	TEXT-DECORATION: none
}
A.rt:hover {
	FONT-SIZE: 9px; colsOR: #2f2f2f; TEXT-DECORATION: underline
}



A.p:link {
	colsOR: #2f2f2f
}
A.p:visited {
	TEXT-DECORATION: none
}
A.p:hover {
	colsOR: #ff5c0d; TEXT-DECORATION: none
}

.img 
{
	cursor:pointer;
}


INPUT {
	FONT-SIZE: 12px; colsOR: #2f2f2f; FONT-FAMILY: 돋움;
	text-align: center;
}
SELECT {
	FONT-SIZE: 12px; colsOR: #2f2f2f; FONT-FAMILY: 돋움
}
TEXTAREA {
	FONT-SIZE: 12px; colsOR: #2f2f2f; FONT-FAMILY: 돋움
}
.t10 {
	FONT-SIZE: 10px; FONT-FAMILY: 돋움,AppleGothic,sans-serif;LETTER-SPACING: -1px
}
.t9 {
	FONT-SIZE: 9pt; FONT-FAMILY: 돋움,AppleGothic,sans-serif;LETTER-SPACING: -0.5px
}
.text02 {
	BORDER-RIGHT: #d4d0c8 1px solid; BORDER-TOP: #d4d0c8 1px solid; FONT-SIZE: 12px; BORDER-LEFT: #d4d0c8 1px solid; colsOR: #2f2f2f; BORDER-BOTTOM: #d4d0c8 1px solid; FONT-FAMILY: 굴림
}
.mtable1 {border:solid 1 #88AA88; background:#88AA88;
}
.mtable1_title {padding-left:8px; font-size:12px; font-weight:bold; background-colsor:#FFFFDD; font-family:verdana;
}

.mtable5 {border:solid 1 #c7a2c4; background:#c7a2c4;
}
.mtable5_title {padding-left:8px; font-size:12px; font-weight:bold; background-colsor:#FFFFDD; font-family:verdana;
}
/*AutoComplete flyout */

.autocomplete_completionListElement 
{  
	visibility : hidden;
	margin : 0px!important;
	background-colsor : inherit;
	colsor : windowtext;
	border : buttonshadow;
	border-width : 1px;
	border-style : solid;
	cursor : 'default';
	overflow : auto;
	height : 70px;
    text-align : left; 
    list-style-type : none;
    cursor:pointer;
}

/* AutoComplete highlighted item */

.autocomplete_highlightedListItem
{
	background-colsor: #ffff99;
	colsor: black;
	padding: 1px;
}

/* AutoComplete item */

.autocomplete_listItem 
{
	background-colsor : window;
	colsor : windowtext;
	padding : 1px;
}

.modalBackground {
	background-colsor:Gray;
	filter:alpha(opacity=70);
	opacity:0.7;
}
.modalPopup {
	background-colsor:#ffffdd;
	border-width:3px;
	border-style:solid;
	border-colsor:Gray;
	padding:3px;
}
body{
	padding-right: 0 !important
}

.style1 {colsor: #999999}
.style47
{
    height:20px;
}
.course {border:solid 1 #1f83df; background:#1f83df;}
.course_title {padding-left:8px; font-size:12px; font-weight:bold; background-colsor:#FFFFDD; font-family:verdana;}
.booktitle {width:100%; font-weight:bold; background-colsor:#ebf5d4; line-height:160%; font-family:verdana; text-align:center;}
.desc {text-align:justify; padding:10 10 10 10; background:#FFFFFF;}

.t100 {
	FONT-SIZE: 15px; FONT-FAMILY: 돋움,AppleGothic,sans-serif;LETTER-SPACING: -1px
}

.combo_alarm 
{
	background: #ffffff; font-size: 12px; font-family: 돋움; colsor:#666666;
}


.fixed-table-container thead th .th-inner2,
.fixed-table-container tbody td .th-inner2 {
    padding: 16px;
    line-height: 48px;
    vertical-align: top;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cols-xs-1, .cols-sm-1, .cols-md-1, .cols-lg-1, .cols-xs-2, .cols-sm-2, .cols-md-2, .cols-lg-2, .cols-xs-3, .cols-sm-3, .cols-md-3, .cols-lg-3, .cols-xs-4, .cols-sm-4, .cols-md-4, .cols-lg-4, .cols-xs-5, .cols-sm-5, .cols-md-5, .cols-lg-5, .cols-xs-6, .cols-sm-6, .cols-md-6, .cols-lg-6, .cols-xs-7, .cols-sm-7, .cols-md-7, .cols-lg-7, .cols-xs-8, .cols-sm-8, .cols-md-8, .cols-lg-8, .cols-xs-9, .cols-sm-9, .cols-md-9, .cols-lg-9, .cols-xs-10, .cols-sm-10, .cols-md-10, .cols-lg-10, .cols-xs-11, .cols-sm-11, .cols-md-11, .cols-lg-11, .cols-xs-12, .cols-sm-12, .cols-md-12, .cols-lg-12 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}

.cm_ro_section {
	bottom: 10px !important;
    z-index: 11 !important;
    margin-left: 1%;
}



/*캡처용*/
/* ::-webkit-scrollbar{
	display: none;
} */

.mobile_show_span{
	display: none;
}

/*데이터 불러오기 실패 모달 크기*/
.ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.ui-draggable.ui-resizable{
	width:98% !important;
	max-width:400px !important
}

/*goWtGateInfo_web*/
#mobile_header, #mh_sub_menu, .mh_tab, .mh_tab2{
	display: none;
}
#contents{
	max-width:1920px !important;
	min-width:1700px !important;
	width:100% !important;
	height:auto !important;
	min-height: -webkit-calc(100vh - 80px);
	min-height: calc(100vh - 80px);
	background-size:cover
}
#gateInfoContainer{
	display: -webkit-box;
	display: flex;
	flex-flow:row wrap;
	/* float: left; */
}
/* #gateInfoContainer:after{
	display: block; content: ""; clear: both;
} */
#gateInfoContainer #LeftMap, #gateInfoContainer #CenterMap, #gateInfoContainer #RightMap{
	width:33.333% !important;
	/* height: calc(100vh - 132px) */
	box-sizing:border-box
}
#gateInfoContainer #CenterMap{
	/* background: url(../../images/mapImg.png) center / 160% */
	padding: 30px 5px;
	letter-spacing: -1px
}
#gateInfoContainer #RightMap{
	background: url(../../images/mapImg.png) center / 160%
}
#Dam, #WaterDam, #Bo{
}
.rm_contents{
	background: #fff;
	border:2px solid rgb(164,200,235);
	border-radius: 0 0 10px 10px;
	padding:0 10px 15px
}
.rm_tit{
	border:3px solid rgb(204,204,204);
	font-size:18px;
	font-weight:600;
	color: rgb(0,85,150);
	padding:5px 15px;
	line-height: 18px;
	border-radius:18px;
	margin-bottom: 10px;
	display: inline-block;
	background: #fff
}
/* .rm_tit img{
	width:100%;
	height: auto;
	margin-bottom: 10px
} */
.rm_tab1{
	width:100%;
	font-size:16px;
	background: rgb(220,220,220);
	color:rgb(116,116,116);
	font-weight:600;
	display: -webkit-box;
	display: flex;
	border-radius: 10px 10px 0 0;
}
.rm_tab1 li{
	text-align: center;
	width:50%;
	padding:5px 0;
	border-radius: 10px 10px 0 0;
	cursor:pointer;
}
.rm_tab1 li.active{
	color:rgb(67,73,79);
	background: rgb(164,200,235)
}
.rm_list1{
	display: -webkit-box;
	display: flex;
	width:82%;
	margin-left: 18%
}
.rm_list1 li{
	padding: 5px 0;
	font-size: 14px;
	font-weight: 600;
	text-align: center;
	width:25%
}
.rm_list1 li:nth-child(1){
	color:rgb(74,74,74);
}
.rm_list1 li:nth-child(2){
	color:blue;
}
.rm_list1 li:nth-child(3){
	color:red;
}
.rm_list1 li:nth-child(4){
	color:rgb(47,167,84);
}
.rm_list1 li span{
	color:rgb(190,193,198);
	font-size: 13px;
	margin-left: -2px
}
.rm_table1{
	border: 2px solid rgb(186,186,186);
	border-radius:5px;
	overflow: hidden;
	margin-bottom: 10px
}
.rm_table1 table{
	width:100%;
}
.rm_table1 table th{
	width:18%;
	background: rgb(231,231,231);
	color:rgb(67,73,79);
	font-size: 15px;
	font-weight: 600;
	padding:7px 0;
	text-align: center;
	border-bottom: 1px solid rgb(201,201,201)
}
.rm_table1 table td{
	padding:5px 5px;
	border-bottom: 1px solid rgb(201,201,201);
	text-align: center;
}
.rm_table1 table tr:last-child th, .rm_table1 table tr:last-child td{
	border-bottom:0
}
.rm_tab2{
	border-bottom: 5px solid rgb(215,227,247);
	position: relative;
	padding: 7px 5px
}
.rm_tab2 li{
	color:rgb(105,105,105);
	font-size: 16px;
	display: inline-block;
	cursor: pointer;
	border-right: 1px solid #ccc;
	padding-right: 12px;
	margin-right: 10px;
	line-height: 16px
}
.rm_tab2 li:nth-child(3), .rm_tab2 li:last-child{
	border-right: 0;
	padding-right: 0;
	margin-right: 0;
}
.rm_tab2 li.active{
	color:rgb(21,91,208);
	font-weight: 600;
}
.rm_tab2 button{
	background: #fff;
	border:1px solid rgb(177,177,177);
	padding:0 7px;
	font-weight: 600;
	position: absolute;
	top:5px;
	right: 5px;
	border-radius:2px
}
.rml2{
	display: -webkit-box;
	display: flex
}
.rm_list2{
	width:35%;
	margin-left:15%;
	box-sizing:border-box;
	text-align: center;
	display: -webkit-box;
	display: flex;
}
.rm_list2 li{
	width:25%;
	line-height: 1.1em;
	font-weight: 600;
	padding: 8px 0
}
.wthi_rb_contents .rm_list2 li{
	width:33.333%
}
.rm_list2 li:nth-child(1){
	color:rgb(74,74,74);
}
.rm_list2 li:nth-child(2){
	color:blue;
}
.rm_list2 li:nth-child(3){
	color:rgb(255,124,43);
}
.rm_list2 li:last-child{
	color:rgb(47,167,84);
}
.rm_list2 li span{
	color:rgb(190,193,198);
	font-size: 12px;
	margin-left: -2px;
	display: block;
}
.rm_table2_tit{
	background: rgb(185,185,185);
	color:#fff;
	font-size: 12px;
	font-weight: 700;
	padding: 2px 0;
	border-radius: 5px 5px 0 0;
	text-align: center;
}
.rm_table2{
	/* display: flex;
	flex-flow:row wrap; */
	border-top:2px solid rgb(199,216,243);
	max-height: 500px;
	overflow: auto;
	margin-bottom: 5px;
}
.rm_table2:last-child{
	margin-bottom: 0;
}
.rm_table2>dl{
	width:50%;
	border-bottom:2px solid rgb(199,216,243);
	display: -webkit-box;
	display: flex;
	float: left;
}
.rm_table2:after{
	content: "";
	display: block;
	clear: both;
}
.rm_table2 dt{
	background:rgb(215,233,241);
	width:30%;
	text-align: center;
	font-size: 16px;
	letter-spacing: 0;
	line-height: 45px
}
.rm_table2 dd{
	display: -webkit-box;
	display: flex;
	width:70%;
	line-height: 45px;
}
.rm_table2 dd div{
	width:25%;
	text-align: center;
	font-size: 14px
}
.wthi_rb_contents .rm_table2 dd div{
	width:33.333%;
}

/* #CenterMap{
	position: relative;
} */
#RightMap{
	position: relative;
}
.cm_video_btn{
	position: absolute;
	top: 25px;
	right: 20px;
	z-index: 9999;
	width:72px
}
.cm_video_btn img{
	display: block;
	width:100%;
	height: auto
}
.cm_dam_img{
	position: absolute;
	bottom: 10px;
	right: 20px;
	z-index: 9
}
.cm_paging_btn{
	position: absolute;
	bottom: 10px;
	left: 50%;
	transform:translateX(-50%);
	z-index: 9
}

#LeftMap{
	position: relative;
}
#lm_canvas_container{
	position: relative;
	width:100%;
}
#lm_canvas_container canvas{
	width:100%;
	height: auto
}
#lm_canvas_btn{
	position: absolute;
	bottom:30px;
	right:20px;
	z-index: 4000;
}
#lm_canvas_btn span{
	display: inline-block;
}
#LeftBox{
	display: -webkit-box;
	display: flex;
	padding: 30px 10px;
	flex-flow:row wrap
}
#LeftBox > div{
	padding: 0 6px
}
#LeftBox > div:nth-child(1){
	width:60%
}
#LeftBox > div:nth-child(2){
	width:40%
}
#TableBox1 ul{
	width:30%;
	text-align: center;
	padding: 7px 0 8px;
}
#TableBox1 li{
	display: inline-block;
}
.MapTable{
	border: 1px solid rgb(0,45,197);
	border-radius:10px;
	background: -webkit-linear-gradient( right, rgb(0,45,197), rgb(0,180,232) );
	background: linear-gradient( to right, rgb(0,45,197), rgb(0,180,232) );
	position: relative;
	/* margin-top: 40px */
}
.mt_thead{
	border:1px solid rgb(101,161,202);
	border-radius:10px;
	position: absolute;
	top:-40px;
	right:0%;
	background: rgba(255,255,255,0.25);
	box-shadow: 0 0 2px rgba(0,0,0,0.3);
	width:70%;
	height: -webkit-calc(100% + 40px);
	height: calc(100% + 40px);
}
.mt_thead ul{
	display: -webkit-box;
	display: flex;
}
.mt_thead li{
	width:30%;
	text-align: center;
	line-height: 1em;
	font-weight: 600;
	font-size: 13px;
	padding-top: 6px;
	color: rgb(31,97,142);
	letter-spacing: -0.5px
}

.mt_thead li:last-child{
	width:40%
}

.mt_thead li span{
	display: block;
	font-size: 12px;
}
#MapTable{
	width:100% !important;
}
#MapTable tr:nth-child(even){
	background: -webkit-linear-gradient( right, rgb(0,45,197), rgba(0,162,233));
	background: linear-gradient( to right, rgb(0,45,197), rgba(0,162,233));
}
#MapTable td, #MapTable th{
	border-right: 1px solid rgba(0,45,197,0.7);
}
#MapTable th{
	width:30% !important;
}
#MapTable td:last-child{
	border: 0
}
.lm_table2{
	background: rgb(1,116,204);
	border-radius:10px;
	width:100%;
}
#GridBox1{
	border-radius:10px 10px 0 0;
	background: rgb(102,173,227)
}
#GridBox1 ul{
	display: -webkit-box;
	display: flex;
}
/*#GridBox1 li{
	width:50% !important;
}*/

#GridBox1 #mg1_1{
	width: calc(50% - 10px);
}
#GridBox1 #mg1_2{
	width: calc(50% + 10px);
}

#GridBox1 li a{
	display: block;
	text-decoration: none;
	color: rgb(0,85,150)
}

.lm_t2_thead{
	line-height: 30px;
	background: #f4f4f4;
	text-align: center;
	display: flex;
	border-right: 1px solid #c6c6c6;
	border-left: 1px solid #c6c6c6;
	font-weight: 600;
}
.lm_t2_thead li:nth-child(1){
	width: calc(51% - 10px);
}
.lm_t2_thead li:nth-child(2){
	width: calc(50% + 10px);
	border-left: 1px solid #c6c6c6;
}

#flexGrid1{
	margin-bottom: 5px;
	height: 140px;
	overflow: auto;
}

/*탭작업*/
.rmt1_th2{display: none}
.rm_tab2 .rmt_2{display: none}

/***weather***/
.flex_container{
	display: -webkit-box;
	display: flex;
	flex-flow:row wrap;
}
.left_container{
	width:34%;
	padding: 10px 20px;
}
.center_container{
	width:46%;
	padding: 0 20px 0 12px
}
.right_container{
	width:66%;
	padding: 10px 20px;
}
.canvas_container{
	width:100%;
	height: auto;
	position: relative;
	padding: 30px 10px
}
.canvas_container canvas{
	width:-webkit-calc(100% - 20px);
	width:calc(100% - 20px);
	left:10px !important;
	top:30px !important;
	height: auto
}
.mu_tab {
	width: 98%;
	max-width: 610px;
	margin: 35px 0 20px;
	/* background-image: url(../../../images/hdaps/weather/bg_tab.png);
	background-repeat: no-repeat; */
}

.mu_tab a {
	text-decoration: none !important;
	color: #fff;
}

.mu_tab ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: -webkit-box;
	display: flex;
	flex-flow:row wrap
}
.mu_tab>ul {
	border-radius: 18px;
	background: #bfbfbf
}

.mu_tab li {
	margin: 0px 0px 5px 0;
	/* border : 1px solid #666666; */
	width: 50%;
	/* border-radius:10px; */
	/* background:#FFF; */
	text-align: center;
	font-size: 15px;
	font-weight: bold;
	margin-bottom: 0;
}
.mu_tab li a{
	line-height: 38px;
}

.mu_tab .on {
	border: 3px solid #bfbfbf;
	border-radius: 18px;
	background: #fff;
	font-weight: bold;
}

.mu_tab .on a {
	color: #014dcc;
	line-height: 32px;
	display: block;
}

.mu_tab .off {
	border: none;
	background: none;
}

.mu_tab .off a {
	color: #005596;
}
.AreaLink2 {
	font-size: 16px;
	text-align: center;color: black;
}

.AreaLink2 .lnkOn {
	color: #014dcc;
	font-weight: bold;
}

.list ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.list li {
	margin: 0px 5px 0px 5px;
	width: 85px;
}

.list a {
	text-decoration: none;
	color: gray;
}
.infoLine {
	width: 90%;
	height: 32px;
	margin: 0 auto;
	border: 3px solid #00a0ea;
	background: #00a0ea;
	border-radius: 12px;
	font-size: 15px;
	font-weight: bold;
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content:space-between;
}

.infoLine .infoText {
	padding: 3px 5px 3px 9px;
	color: #fff;
	width:170px;
}

.infoLine #infoContent {
	width: -webkit-calc(100% - 170px);
	width: calc(100% - 170px);
	height:26px;
	line-height: 21px;
	background: #e9feff;
	border-radius: 10px;
	padding: 0px 4px 0px 8px;
}


#t1, #t2{
	width:100%;
	display: -webkit-box;
	display: flex;
	flex-flow: row wrap;
	-webkit-box-pack: justify;
	justify-content:space-between;
	margin-bottom: 20px
}
#t1 > div{
	width:22%;
	margin-bottom: 20px
}
#t2 > div{
	width: 205px;
	margin-bottom: 20px
}

.wBox{
	/* width:200px;
	height:60px;
	background-image: url(../../../images/hdaps/weather/weather1_box.png);
	background-repeat:no-repeat;
	margin-top:10px; */
	font-size:16px;
	font-weight:bold;
	border-radius:8px;
	overflow: hidden;
	border: 3px solid rgb(0,160,233);
	background: rgb(0,160,233);
}
.irradianceBox{
	/* width:200px;
	height:60px;
	background-image: url(../../../images/hdaps/weather/weather_irradiance_box.png);
	background-repeat:no-repeat;
	margin-top:10px; */
	font-size:16px;
	font-weight:bold;
	border-radius:8px;
	overflow: hidden;
	border: 3px solid rgb(0,160,233);
	background: rgb(0,160,233);
}
.irradianceBox ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: -webkit-box;
	display: flex
}
.irradianceBox li {
	width: 33.333%;
	line-height:35px;
	text-align:center;
	font-size: 14px;
	font-weight: 500
} 

.irradianceBox li span {
  display: inline-block;
  vertical-align: middle;
  text-align:center;
  line-height: 35px;
}
.irradianceBox ul:FIRST-CHILD li{
	line-height: 24px;
	color:#fff;
	font-weight: 400
}
.irradianceBox ul:LAST-CHILD{
	background: #fff
}
.irradianceBox ul:LAST-CHILD li{
	border-right: 2px solid rgb(125,189,219);
}
.irradianceBox ul:LAST-CHILD li:LAST-CHILD{
	border-right: 0;
}
.wBox ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: -webkit-box;
	display: flex
}

.wBox li {
	width: 33.333%;
	line-height:35px;
	text-align:center;
	font-size: 14px;
	font-weight: 500
}
.wBox ul:FIRST-CHILD li{
	line-height: 24px;
	color:#fff;
	font-weight: 300
}
.wBox ul:LAST-CHILD{
	background: #fff
}
.wBox ul:LAST-CHILD li{
	border-right: 2px solid rgb(125,189,219);
}
.wBox ul:LAST-CHILD li:LAST-CHILD{
	border-right: 0;
}

.wTop{
	font-size:16px;
	font-weight:bold;
}
.wTop ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: -webkit-box;
	display: flex
}

.wTop li {
	width: 33.333%;
	text-align:center;
}

.wTop li span {
  display: inline-block;
  vertical-align: middle;
  line-height: 35px;
  letter-spacing: -1px
}
.icon{
	width: 35px;
	height:35px;
}
.cls_deg{
color:#00a0ea;
}
.cls_chartBox{
    width: 205px;
    height: 130px;
    border: 2px solid #019fea;
    border-radius: 13px;
    background: #fff;
}

.cls_chartBox2{
    width: 205px;
    height: 130px;
    border: 0px solid #019fea;
}

.cls_chart {
width: 175px;height: 128px;overflow: hidden;text-align: left;
    float:left;
}


.cls_chartBox p.css-vertical-text {
 writing-mode:tb-rl;
    margin: 10px 2px 10px 0px;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 3px;
    display: inline;
    height: 108px;
    text-align: left;
    float:left;
    border-right:2px solid #d2d2d2;
    color:#029eea;
}


.excelButton {
    width: 180px;
    height: 30px;
    font-size: 14px;
    font-weight: bold;
    display : inline-block;
    color: #f9ffff;
    background-color: #00b0f0;

    -moz-border-radius : 5px;
    -webkit-border-radius : 5px;
    border:1px solid rgba (0,0,0,3);
    border-bottom-width:3px;
    border-radius : 8px;
	margin-left: 10px;
	margin-top: 5px       
}

.excelButton:hover {
   <!--background-color: #2cb77b;-->
   width: 182px;
   height: 32px;
   border-radius : 4px;
   border-color: rgba (0,0,0,5);
   border-radius : 8px;
}


.ui-datepicker-week-end a {
  color:red !important;
}

.t_info{
	text-align: right;
	margin: -40px 0 30px
}
#weather3_Box .t_info{
	margin-top: 0
}
.t_info *{
	vertical-align: bottom;
}

.right_container h3{
	/*margin-bottom: 24px*/
}
/*.weather_video > div{
	padding-left: 32px;
	border-radius:5px;
	border:3px solid rgb(1,116,204);
	background: no-repeat 0 0 rgb(1,116,204);
	height: auto;
	overflow: hidden;
	margin-bottom: 14px;
	cursor: pointer;
}*/

.vedio_div{
	/*padding-left: 32px;*/
	border-radius:5px;
	border:3px solid rgb(1,116,204);
	background: no-repeat 0 0 rgb(1,116,204);
	height: auto;
	overflow: hidden;
	margin-bottom: 14px;
	cursor: pointer;
}

.vedio_div h4{
		color: #fff;
		padding-left: 10px;
}

/*.weather_video > div:nth-child(1){
	background-image: url(../../../images/hdaps/weather/sub_tit_weather_video1.png)
}
.weather_video > div:nth-child(2){
	background-image: url(../../../images/hdaps/weather/sub_tit_weather_video2.png)
}
.weather_video > div:nth-child(3){
	background-image: url(../../../images/hdaps/weather/sub_tit_weather_video3.jpg)
}*/

/*.weather_video img{
	width:100%;
	border-radius:5px;
	height:100%;
	background: #eee
}*/

.vedio_div img{
	width:100%;
	border-radius:5px;
	height:100%;
	background: #eee
}

/****goWtGateInfoDetail****/
.col3_content{
	width:33.333%;
}
.col_content{
	padding: 30px 10px;
	letter-spacing: -1px
}
.wtgi_right{
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between
}
.wthi_local{
	width:100%;
	/*width:calc(100% - 90px); */
	/* padding-right: 20px */
}
.wthi_local_table{
	border-radius:10px;
	overflow: hidden;
	border:2px solid rgb(2,117,205);
	background:rgb(2,117,205);
	margin-bottom: 14px;
}
.wthi_local_table:last-child{
	margin-bottom: 0
}
.wthi_local_table h3{
	color:#fff;
	background: rgb(2,117,205);
	font-size: 15px;
	font-weight:700;
	padding: 0 10px 0 18px;
	margin: 0;
	position: relative;
	line-height: 30px
}
.wthi_local_table h3 button{
	position: absolute;
	top:3px;
	right: 8px;
	padding: 0;
	border: 0;
	border-radius:2px;
	height: 18px;
	line-height: 18px;
}
.wthi_local_table h3 button img{
	height: 100%
}
.wthi_lt_con1{
	padding: 10px;
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
	text-align: center;
	background: #fff;
}
.water_level{
	width:25%;
	margin-right: 7px
}
.water_level dt{
	font-weight: 700;
	line-height: 27px;
}
.water_level dd{
	font-size: 24px;
	font-weight: 700;
	line-height: 42px;
}
.water_data{
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
	border:1px solid rgb(179,179,179);
	border-radius:5px;
	width:75%
}
.water_data dl{
	width:33.333%
}
.wthi_local_table:nth-child(4) .water_data dl{
	width:50%
}
.water_data dl:first-child{
	color:rgb(0,24,255);
}
.water_data dl:nth-child(2){
	color:rgb(205,51,16);
}
.water_data dl:last-child{
	color:rgb(1,158,1);
}
.water_data dt{
	background: rgb(231,231,231);
	font-size: 13px;
	font-weight: 700;
	line-height: 1em;
	padding: 8px 0
}
.water_data dt br{
	display: none;
}
.water_data dd{
	font-size: 19px;
	font-weight: 700;
	line-height: 42px;
}
.wthi_lt_con2{
	padding: 0 10px 10px;
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
	text-align: center;
	background: #fff;
}
.wthi_lt_con2 dl{
	border:1px solid rgb(185,233,255);
	background: rgb(215,238,255);
	border-radius:5px;
	padding: 5px 0
}
.wthi_local_table:nth-child(2) .wthi_lt_con2 dl{
	width:32.5%
}
.wthi_local_table:nth-child(3) .wthi_lt_con2 dl{
	width:24%
}
.wthi_local_table:nth-child(5) .wthi_lt_con2 dl{
	width: 32.5%
}
.wthi_lt_con2 dl:last-child{
	margin-right: 0
}
.wthi_lt_con2 dt{
	color: rgb(18,109,175);
	font-weight: 700;
	font-size: 13px
}
.wthi_lt_con2 dd{
	color: rgb(0,96,168);
	font-weight: 700;
}
.wthi_lt_con2 dd span{
	color: rgb(60,134,245);
	font-weight: 700;
	font-size: 17px;
	margin-right: 2px
}

.wthi_rain_top{
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
	position: relative;
	margin-bottom: 37px;
}
.wthi_rain_memo{
	position: absolute;
	right: 0;
	top: -20px;
	color: rgb(107,107,107);
	font-weight: 700
}
.wthi_rain_top > div{
	border: 2px solid rgb(0,160,233);
	background: rgb(0,160,233);
	overflow: hidden;
	border-radius:10px;
}
.wthi_rain_top > div:nth-child(2){
	width: 58%;
}
.wthi_rain_top > div:nth-child(3){
	width: 40%;
}
.wthi_rain_top table{
	width:100%;
	height: 100%;
	min-height: 124px
}
.wthi_rain_top table thead th{
	text-align: center;
	background: rgb(0,160,233);
	color:#fff;
	font-size: 14px;
	padding: 7px 0;
}
.wthi_rain_top table tbody th{
	text-align: center;
	background: rgb(214,243,255);
	border:1px solid rgb(104,199,242);
	font-size: 14px;
	padding: 7px 0;
}
.wthi_rain_top table td{
	text-align: center;
	border:1px solid rgb(104,199,242);
	font-size: 13px;
	background: #fff;
	height: 33px
}

.wthi_rain_bottom{
	position: relative;
}
.wthi_rb_tab{
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
	background: rgb(0,160,233);
	border-radius:10px 10px 0 0;
	padding: 0 7px 0 18px
}
.wthi_rb_tab li{
	display: inline-block;
	color: #fff;
	cursor: pointer;
	font-size: 15px;
	font-weight:700;
	line-height: 15px;
	margin: 12px 0 11px;
	opacity:0.6;
	border-right: 1px solid rgb(0,141,228);
	margin-right: 8px;
	padding-right: 12px;
}
.wthi_rb_tab li:last-child{
	border-right: 0;
	margin-right: 0;
	padding-right: 0;
}
.wthi_rb_tab li.active{
	opacity:1
}
.wthi_rb_tab button{
	border: 0;
	background: none;
	height: 34px;
	padding-top: 6px
}
.wthi_rb_tab button:FOCUS{
	outline: none
}
.wthi_rb_contents{
	border: 2px solid rgb(0,160,233);
	border-radius: 0 0 10px 10px;
	padding: 0 10px 15px;
	background: #fff
}
.wthi_rain_bottom .rm_list2 li{
	font-size: 14px;
	padding: 14px 0
}
#stateTable table{
	width:100%
}


/*vWorld Control Bar CSS*/
.vw-zoombar {
	opacity: 1 !important; 
	height: 175px !important; 
	top: -100px !important;
}
.ol-zoom-dist {
	display: block !important;
}
.ol-zoom-area {
	display: none !important;
} 
.ol-zoomslider {
	display: none !important;
}
.ol-zoomout {
    top: 95px !important;
}

.ol-zoom-init {
	top: 115px !important;
}



/*****goWtGateState*******/
.wtgs_content{
	width:50%;
}

/*댐보운영 슬라이드메뉴*/
a.area_link:link {
	font-size: 14px;
	font-weight: bold;
	color:#7181b7;
	text-decoration: none;
	line-height: 28px;
}

a.area_link:visited {
	font-size: 14px;
	font-weight: bold;
	color:#7181b7;
	text-decoration: none;
}

a.area_link:active {
	font-size: 14px;
	font-weight: bold;
	color: #00b3ff;
	text-decoration: none;
}

a.area_link:hover {
	font-size: 14px;
	font-weight: bold;
	color: #00b3ff;
	text-decoration: none;
}

.area_menu {
	width: 176px !important;
	position: absolute;
	z-index: 99999;
	margin-top: 30px;
}

#area_menu1 {
	left: 184px !important;
}

#area_menu2 {
	left: 359px !important;
}

#area_menu3 {
	left: 710px !important;
}

#area_menu4 {
	left: 535px !important;
}

.area_menu ul {
	float: left;
	text-align: center;
	width:100%;
}

.area_menu ul li {
	display: inline-block;
	text-align: center;
	width: 100% !important;
}

.gnb_area {
	float: left;
	width: 100%;
	height: auto;
	background:rgba(255, 255, 255, 0.8);
	border: 1px solid #7181b7;
}

.gnb_area  ul {
	_border: #06ff00 solid 3px;
}
.gnb_area  li {
	display: inline-block;
	width: 188px;
	text-align: center;
	vertical-align: text-top;
}

.trans {
	-webkit-transform: translate(0, 0);
	-webkit-transition: -webkit-transform 500ms;
	transform: translate(0, 0);
	transform-origin: bottom right;
	transition: transform 500ms;
	width: 49%;
}

.trans.expand {
	-webkit-transform: translate(-950.5px, 0px);
	transform: translate(-950.5px, 0px);
}

.trans.Reduction {
	-webkit-transform: translate(0px, 0px);
	transform: translate(0px, 0px);
}

.transRT {
	-webkit-transform: translate(0, 0);
	-webkit-transition: -webkit-transform 500ms;
	transform: translate(0, 0);
	transform-origin: bottom right;
	transition: transform 500ms;
	/* width: 49%; */
}

.transRT.expand {
	-webkit-transform: translate(950.5px, 0px);
	transform: translate(950.5px, 0px);
}

.transRT.Reduction {
	-webkit-transform: translate(0px, 0px);
	transform: translate(0px, 0px);
}

.transRB {
	-webkit-transform: translate(0, 0);
	-webkit-transition: -webkit-transform 500ms;
	transform: translate(0, 0);
	transform-origin: bottom right;
	transition: transform 500ms;
	/* width: 49%; */
}
#bottomDiv{
	width:100%;
	height: auto;
	position: relative;
	padding: 30px 10px;
}

.transRB.expand {
	-webkit-transform: translate(950.5px, 0px);
	transform: translate(950.5px, 0px);
}

.transRB.Reduction {
	-webkit-transform: translate(0px, 0px);
	transform: translate(0px, 0px);
}

#fullDiv{
	padding: 0 1% 20px;
	width:100%;
	z-index:99999;
	display: none;
}
#fullDiv .functionIcon{
	top: 0;
	right: 1%;
}
#fullChartdiv{
	border: #ccc solid 2px;
	width: 100%;
	height: 838px;
	background: white;
}
#chartdiv{
	border: #ccc solid 2px;
	background: white;
	padding:20px 10px 10px
}

#flexGrid.wj-flexgrid .wj-cell {
	padding: 4.8px;
}

.wj-content {
	border-radius: 4px;
	background-color: #ffffff;
	color: #000000;
	font-size: 13px;
}

.wj-header {
	background-color: #00b0f0;
	color: #000;
}

.wj-state-selected {
	background-color: #0085c7;
	color: #000000;
}

.wj-state-multi-selected {
	background-color: #82a7ba;
	/* color: #ffffff; */
}

.cell-type {
	font-weight: bold;
	color: #ffffff;
}

.lowHeader {
	background-color: #4280a0;
	color: #000;
}

.functionIcon {
	position: absolute;
	top: 30px;
	margin: 5px;
	right: 0;
}
.cls_searchBox{
	font-size:13px;
	border:1px solid #dcd9d9;
	margin:5px;
}
.cls_searchBox span{
	font-weight:bold;
/* 	width:55px;
	display:block; */
	padding-left:10px;
	padding-right:15px;
}
.cls_searchBox tr{
	height:34px;
}
.cls_searchBox .floatR{
	float:right;
}
.cls_searchBox select{
	width:100px;
}

.cls_searchBox .clsA{
	width:112px;
}
.cls_searchBox #sDate, .cls_searchBox #eDate{
	height:25px;
	margin-right:3px;
}

.cls_searchBox #sDate, .cls_searchBox #eDate{
	height:24px;
	margin-right:3px;
}
.cls_searchBox .clsTime{
	width:60px;
}

.cls_searchBox .clsItem{
	width:120px;
}
.cls_searchBox .clsA{
	width:112px;
}
.cls_searchBox .btn{
	width:75px;
	height:24px;
	padding:0;
	border-radius:3px;
	margin:2px;
}

/******홍수분석 시뮬레이션*******/
#analysis {
	position: absolute;
	top: 0;
	width: -webkit-calc(100% - 20px);
	width: calc(100% - 20px);
	height: -webkit-calc(100% - 20px);
	height: calc(100% - 20px);
	margin: 10px;
	overflow: auto
}

.AnalysisHead{
	position: relative;
}
.AnalysisHead h2{
	margin: 0
}

.AnalysisHead h2 img{
	width:100%
}
.AnalysisHead .AnalysisCombo{
	position: absolute;
	bottom: 0;right: 0
}

.anal_container{
	border: 2px solid rgb(1,112,198);
	border-radius: 8px;
	background: rgb(239,239,239);
	margin-top: 10px;
	position: relative;
	padding-left: 20px
}
.anal_sub_tit{
	position: absolute;
	left:0;
	top:50%;
	transform:translateY(-50%);
	width:20px;
	line-height: 1.2em;
	font-size: 14px;
	text-align: center;
	font-weight: 700;
	color:rgb(25,103,164);
}
.anal_contents{
	width:100%;
	border-radius: 8px;
	overflow: hidden;
	border-left: 2px solid rgb(1,112,198);
}
.rainfall_contents{
	background: rgb(1,112,198);
	padding: 8px 15px
}
.rainfall_contents>div{
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content:space-between;
	padding: 8px 0
}
.rainfall_contents .AnalysisDate{
	border-bottom: 1px solid rgba(255,255,255,0.3)
}
.rainfall_contents>div span{
	color:#fff;
	font-size: 14px;
	line-height: 22px;
	font-weight: 700;
	padding: 0 10px;
	line-height: 1.2em
}
.rainfall_contents>div input{
	flex-shrink:1;
	height: 22px;
	font-size: 14px;
}
.rainfall_contents .AnalysisDate input {
	width:25%
}
.rainfall_contents .AnalysisText input {
	width:17%
}

#analysis table{
	width:100%;
	min-height: 100%;
}
#analysis table th,
#analysis table td{
	border: 1px solid rgb(170,207,236);
	font-size: 14px;
	padding: 12px 8px
}
#analysis table th{
	width:32%;
	background: rgb(221,235,245);
}
#analysis table th span{
	font-size: 12px;
}
#analysis table td{
	width:18%;
	background: #fff;
}
#analysis table td:last-child{
	border-right: 0;
}
#analysis .anal_chart {
	width: 100%;
	font-size: 7px;
	border-radius: 8px;
	overflow: hidden;
	border: 2px solid rgb(1,112,198);
	margin-top: 10px;
}

#analysis #chartImg {
	width: 100%;
	height: 165px;/*임시*/
	font-size: 7px;
	overflow: hidden;
	text-align: left;
	/* background: url('/images/hdaps/wtGate/chartImg.png'); */
}

.label__on-off {
	width: 100% !important;
}

.tooltip_btn_section {
	width: 120px !important;
}
@media screen and (max-width: 768px) { 

	.cm_ro_section {
	    margin-left: 5%;
	}

	.cm_full_screen_img {
		right: 56px !important;
	}
	
	.mobile_show_span{
		display: block;
	}
	.mobile_hide{
		display: none;
	}
	#dwawCanvas-aniCanvas, #dwawCanvas-tooltip,
	#dwawCanvas-popupTrend, #dwawCanvas-popupGuidCanvas,
	#dwawCanvas-popupLegendCanvas, #dwawCanvas-popupMenu{
		display: none !important;
	} 
	
	#TopMenuFrame, #tab_area, .tab_area{display: none;}
	#mobile_header{
		display: block !important;
		position: fixed;
		top: 0;
		left: 0;
		width:100%;
		z-index: 999999
	}
	.modal-open #mobile_header{
		z-index: 1
	}
	.mh_top{
		position:absolute;
		top:0;
		left:0;
		width:100%;
		background: #fff;
		box-shadow: 0px 1px 3px rgba(0,0,0,0.2);
		padding: 0 15px
	}
	.mh_logo{
		font-size: 23px;
		margin: 0;
	}
	.mh_logo a{
		display:inline-block;
		padding: 18px 0
		/*line-height: 70px;*/
	}
	#mh_menu{
		position:absolute;
		top:23px;
		right:20px;
		display: block;
		width:28px;
		height: 24px;
		line-height: 0;
		cursor: pointer;
	}
	#mh_menu span{
		display: inline-block;
		width:100%;
		height: 5px;
		border-radius:2px;
		background: rgb(26,148,255);
		margin-bottom: 5px
	}
	#mh_menu span:last-child{
		margin-bottom: 0
	}
	#mh_sub_menu{
		display:block !important;
		position: fixed;
		top: 0;
		left: 0;
		width:100%;
		height:100%;
		z-index: -1
	}
	.mh_bg{
		opacity:0;
		width:100%;
		height:100%;
		background: rgba(0,0,0,0.5);
		transition: opacity 0.3s;
	}
	#mh_sub_menu_container{
		position: fixed;
		top:70px;
		right:-65%;
		width:65%;
		height: -webkit-calc(100% - 70px);
		height: calc(100% - 70px);
		transition: right 0.3s;
		box-shadow: 0px 1px 3px rgba(0,0,0,0.2);
		background: #fff;
		overflow: auto;
	}
	#mh_sub_menu_container .mh_btn_area{
		display: flex;
	}
	#mh_sub_menu_container .mh_btn_area div{
		width:50%
	}
	#mh_sub_menu_container .mh_btn_area div:FIRST-CHILD{
		border-right: 1px solid #cbd4e2
	}
	#mh_sub_menu_container .mh_btn_area div a{
		display: block;
		text-align:center;
		line-height: 45px;
		color: rgb(105,105,105);
		font-size: 14px;
		font-weight: 500;
		text-decoration: none;
	}
	#mh_sub_menu_container ul{
		width:100%;
		margin-bottom: 0
	}
	#mh_sub_menu_container ul li a{
		display: block;
		text-decoration: none;
		/*padding-left: 20px;*/
		cursor: pointer;
	}
	#mh_sub_menu_container ul li p{
		display: flex;
		justify-content: space-between;
		margin-bottom: 0
	}
	#mh_sub_menu_container ul li p>a{
		display: block;
		width: calc(100% - 40px)
	}
	#mh_sub_menu_container ul li p>a.openSubMenu{
		width: 40px;
		padding: 0 !important;
		text-align: center;
	}
	#mh_sub_menu_container>ul>li>a, #mh_sub_menu #mh_sub_menu_container>ul>li>p>a{
		color:#fff;
		font-size: 16px;
		font-weight:500;
		border-bottom: 1px solid rgba(255,255,255,0.3);
		background: rgb(1,116,204);
		line-height: 48px;
		padding-left: 20px;
	}
	
	.mh_sub_menu2, .mh_sub_menu3, .mh_sub_menu4{
		display: none;
	}
	
	.mh_sub_menu2 > li > a, .mh_sub_menu2 > li > p > a{
		border-bottom: 1px solid #cbd4e2;
		background: #fff;
		color:rgb(105,105,105);
		font-size: 15px;
		font-weight:500;
		line-height: 40px;
		padding-left: 30px;
	}
	.mh_sub_menu3 > li > a,.mh_sub_menu3 > li >p> a{
		border-bottom: 1px solid #d7dfeb;
		background: #eaecf1;
		color:#333;
		font-size: 14px;
		font-weight:500;
		line-height: 40px;
		padding-left: 40px;
	}
	.mh_sub_menu4 > li > a, .mh_sub_menu4 > li >p> a{
		border-bottom: 1px solid rgb(255 255 255 / 0.2);
		background: #6c6f75;
		color:#fff;
		font-size: 13px;
		line-height: 30px;
		padding-left: 50px;
	}
	
	/*메뉴 작동 시*/
	#mh_sub_menu.active{
		z-index: 999998
	}
	#mh_sub_menu.active .mh_bg{
		opacity: 1;
		transition: opacity 0.3s;
	}
	#mh_sub_menu.active #mh_sub_menu_container{
		right: 0;
		transition: right 0.3s;
	}
	#mh_sub_menu #mh_sub_menu_container.active>ul{
		left: -100%;
	}
		/*모바일 헤더 추가*/
	.mh_tab{
		display: block;
		margin-top: 70px;
		box-shadow: 0px 1px 2px rgba(0,0,0,0.2);
		position: relative;
		z-index: 9999;
	}
	.mh_tab ul{
		display: flex;
		margin: 0
	}
	.mh_tab li{
		width:25%;
		margin: 0;
		text-align: center;
	}
	.mh_tab li a{
		display: block;
		background: #658dab;
		color:#fff;
		line-height: 40px;
		font-size: 12px;
		font-weight: 700;
		text-decoration: none
	}
	.mh_tab li.active a, .mh_tab li:hover a{
		background: #e9e9e9;
		color:#005596;
	}
	
	.mh_tab2{
		display: block;
		position: relative;
		z-index: 1
	}
	.mh_tab2 ul{
		display: flex;
		margin: 0;
		justify-content: space-between;
	}
	.mh_tab2 li{
		width:33.333%;
		margin: 0;
	}
	.mh_tab2 li a{
		display: block;
		background: rgb(16,85,175);
		margin: 0;
		text-align: center;
		color: rgba(255,255,255,0.3);
		border-left: 1px solid #fff;
		font-weight: 400;
		line-height: 39px
	}
	.mh_tab2 li:nth-child(1) a{
		border-left: 0;
	}
	.mh_tab2 li.checked a{
		background: rgb(30,150,255);
		color: #fff;
		font-weight: 600;
	}
	
	#contents{
		max-width:auto !important;
		min-width:auto !important;
		min-height: -webkit-calc(100vh - 70px);
		min-height: calc(100vh - 70px);
		margin-top: 0 !important;
	}
	#gateInfoContainer{
		width:100%;
	}
	#gateInfoContainer #LeftMap, #gateInfoContainer #CenterMap, #gateInfoContainer #RightMap{
		width:100% !important;
	}
	/* #CenterMap{
		min-height: 700px !important;
	} */
	#RightMap{
		min-height: 700px !important;
	}
	.cm_video_btn{
		width:45px
	}
	.rm_table1 th{
		font-size:14px !important;
	}
	.rm_table2 dt{
		font-size:14px !important;
	}
	#lm_canvas_btn{
		text-align: right;
		padding: 0 15px 10px 0;
		position: relative;
		bottom:0;
		right:0;
		background: -webkit-linear-gradient( to right, #b9d3ea, #bee7f4, #b0e3f7);
		background: linear-gradient( to right, #b9d3ea, #bee7f4, #b0e3f7);
		margin-top: -4px
	}
	
	#GridBox1 li{
		width:50% !important;
	}
	
	.lm_t2_thead li:nth-child(1){
		width:calc(49.5% - 1px);
	}
	.lm_t2_thead li:nth-child(2){
		width:calc(50% - 2px);
	}
	
	
	/***weather***/
	.left_container, .center_container, .right_container{
		width:100%;
	}
	.weather_content .left_container{
		order:2
	} 
	.weather_content .center_container{
		order:3;
		margin-bottom: 40px
	} 
	.weather_content .right_container{
		order: 1;
	} 
	.center_container{
		padding: 0 20px
	}
	#t1 > div{
		width:48%
	}
	.weather_video{
		display: -webkit-box;
		display: flex;
		flex-flow:row wrap;
		-webkit-box-pack: justify;
		justify-content:space-between;
	}
	.right_container h3{
		margin-bottom: 15px;
	}
	.weather_video>div{
		width:32%
	}
	.t_info{
		margin: -10px 0 20px
	}
	.t_info{text-align: center;}
	
	/****goWtGateInfoDetail****/
	.col_content{
		letter-spacing: -1px
	}
	.col3_content{
		width:100%;
	}
	.canvas_container{
		padding: 20px 10px
	}
	.canvas_container canvas{
		top:20px !important;
	}
	.wtgi_right{
		display: block;
	}
	.wthi_local{
		width: 100%;
		padding-right: 0;
	}
	.wthi_pop ul{
		display: -webkit-box;
		display: flex;
		margin-top: 15px
	}
	.wthi_pop li{
		text-align: center;
		width:33.333%
	}
	.wthi_rain_top{
		justify-content:center;
		flex-flow:row wrap
	}
	.wthi_rain_top > div:nth-child(2){
		width:100%;
		margin-right: 0;
		margin-bottom: 10px
	}
	.wthi_rain_top > div:nth-child(3){
		width:100%
	}
	
	.wthi_rain_bottom .rm_list2 li{
		font-size: 13px
	}
	.wthi_pop{
		display: none;
	}
	#fullDiv .functionIcon{
		top: -5px !important;
	}
	#fullChartdiv{
		height: 400px
	}
	
	/*****goWtGateState*******/
	#rightDiv,.wtgs_content{
		width:99% !important;
	}
	.functionIcon{
		top:20px !important
	}
	.wtgs_content #topDiv{
		display: none !important;
	}
	
	#bottomDiv{
		padding: 20px 10px;
	}
	
	
	/************가로스크롤*************/
   	.v_scroll{
   		overflow: auto;
   		width:100%;
   	}
   	div::-webkit-scrollbar {
	    width: 3px;
	    height: 2px;
	}
	div::-webkit-scrollbar-thumb {
	    background: #a9a9a9;
	}
}
@media screen and (max-width: 620px) {
	.cm_ro_section {
	    margin-left: 5%;
	}
	.cm_full_screen_img {
		right: 56px !important;
	}
	.rm_list1{
		width: 70% !important;
		margin-left: 30% !important;
	}
	.rm_table1 th{
		width:30% !important;
	}
	.rm_list1 li span{
		display: block;
	}
	.rm_list2{
		width: 70% !important;
		margin-left: 30% !important;
	}
	.rm_list2:last-child{
		display: none !important;
	}
	.rm_table2{
		max-height: 400px !important;
	}
	.rm_table2 dl{
		width:100% !important;
	}
	.rm_table2 dd{
		width: 100%;
	}
	.rm_table2 dd > div{
		width: 25% !important;
	}
	#LeftBox > div{
		width: 100% !important;
	}
	.MapTable{
		margin-bottom: 20px
	}
	
	.weather_video > div{
		width:100% !important
	}
	.list li{
		width:25%;
		margin: 0;
	}
	
}


@media screen and (max-width: 400px) { 
	.cm_ro_section {
	    margin-left: 5%;
	}
	.cm_full_screen_img {
		right: 56px !important;
	}
	.water_data dt br{
		display: block;
	}
	
	#t1 > div{
		width:49.5%;
		margin-bottom: 5px
	}
	.cls_dam{
		font-size: 13px
	}
	.wBox li, .irradianceBox li{
		font-size: 12px;
		line-height: 28px
	}
	.wBox ul:FIRST-CHILD li, .irradianceBox ul:FIRST-CHILD li{
		line-height: 20px;
	}
	.mu_tab>ul>li{
		width:100%;
	}
	.list li{
		font-size: 13px
	}
	
	/*****weather*****/
	#weather2_Date{
		text-align: center;
	}
	#t2{
		justify-content:center
	}
	
}

/*유관기관*/
.cm_ro_section {
	position: absolute;
    bottom: 70px;
    z-index: 9;
    background: #fff;
    border-radius:5px;
    overflow: hidden;
	border: 1px solid rgb(141,141,141);
}

.cm_ro_section > table {
	width: 180px;
    height: 100px;
}
.cm_ro_section > table,
.cm_ro_section > table > tbody > tr,
.cm_ro_section > table > tbody > tr > td {
	border: 1px solid #FFFFFF;
}

.ro_img {
	width: 13px;
}

/*스위치 토글*/
input[type="checkbox"].input__on-off { 
	display: none; 
} 

.label__on-off { 
	overflow: hidden; 
	position: relative; 
	display: inline-block; 
	width: 58px; 
	height: 26px; 
	-webkit-border-radius: 13px; 
	-moz-border-radius: 13px; 
	border-radius: 13px; 
	background-color: #ed4956; 
	color: #fff; 
	font-weight: bold; 
	cursor: pointer; 
	-webkit-transition: all .3s; 
	-moz-transition: all .3s; 
	-ms-transition: all .3s; 
	-o-transition: all .3s; 
	transition: all .3s; 
} 

.label__on-off > * {
	vertical-align: middle; 
	-webkit-transition: all .3s; 
	-moz-transition: all .3s; 
	-ms-transition: all .3s; 
	-o-transition: all .3s; 
	transition: all .3s; 
	font-size: 14px; 
} 

.label__on-off .marble { 
	position: absolute; 
	top: 1px; 
	left: 1px; 
	display: block; 
	width: 24px; 
	height: 24px; 
	background-color: #fff; 
	-webkit-border-radius: 50%; 
	-moz-border-radius: 50%; 
	border-radius: 50%; 
	-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .3); 
	-moz-box-shadow: 0 0 10px rgba(0, 0, 0, .3); 
	box-shadow: 0 0 10px rgba(0, 0, 0, .3); 
} 

.label__on-off .on { 
	display: none; 
	padding-left: 12px; 
} 

.label__on-off .off { 
	padding-left: 30px; 
	line-height: 25px; 
} 

.input__on-off:checked + 
.label__on-off { 
	background-color: #0bba82; 
} 

.input__on-off:checked + 
.label__on-off .on { 
	display: inline-block; 
}

.input__on-off:checked + 
.label__on-off .off { 
	display: none; 
} 

.input__on-off:checked + 
.label__on-off .marble { 
	left: 96px !important; 
}

.wtGateDetailTrend_pop {
	cursor: pointer;
}

.cm_ro_section > table {
	width: 125px;
    height: 100px;
}
.cm_ro_section > table > tbody > tr > td {
	border-bottom: 1px solid rgb(141,141,141);
	font-weight: 600;
	text-align: center;
	font-size: 11px
}
.cm_ro_section > table > tbody > tr:first-child > td {
    background: rgb(230,230,230);
}
.cm_ro_section > table > tbody > tr:last-child > td {
	border-bottom: 0;
}

.ro_img {
	width: 13px;
}

.ui-widget-overlay {
	z-index: 9999999;
}

.cm_full_screen_img{
	position: absolute;
	top: 85px;
    right: 41px;
	z-index: 9;
	cursor: pointer;
}

.tooltip_btn_section {
	top: 125px !important;
}

.ol-zoom-up,
.ol-zoom-left,
.ol-zoom-center,
.ol-zoom-bottom,
.ol-zoom-right,
.ol-zoomin,
.ol-zoomout {
	display :none !important;
}

h1, .h1, h2, .h2, h3, .h3 {
    margin-top: 0px !important;
}

ul, ol {
    margin-top: 0;
    margin-bottom: 0px !important;
}

dl {
	margin-bottom: 0px !important;
}

.btnBox {
	width: 50% !important;
    float: right !important;
}

.cell-pointer > div {
	cursor : pointer;     	
}

.flex_container>.w60{width:60%}

#modal-layer-popup{
	z-index: 20000;
}