@charset "UTF-8";
@import "jquery/jquery-ui.min.css";
@import "font-awesome/css/all.min.css";
@import "select2/select2.min.css";
@import "daterangepicker/daterangepicker.css";
@import "XEIcon-2.2.0/xeicon.min.css";
/*
* NotoSansKR-Hestia > https://theeluwin.github.io/NotoSansKR-Hestia/
*/
@font-face {
	font-family: 'Noto Sans Korean';
	font-style: normal;
	font-weight: 300;
	src: local('Noto Sans Light'), local('NotoSans-Light'),
		url(fonts/eot/NotoSansKR-Light-Hestia.eot),
		url(fonts/eot/NotoSansKR-Light-Hestia.eot?#iefix)
		format('embedded-opentype'),
		url(fonts/woff/NotoSansKR-Light-Hestia.woff) format('woff'),
		url(fonts/otf/NotoSansKR-Light-Hestia.otf) format('opentype');
}

@font-face {
	font-family: 'Noto Sans Korean';
	font-style: normal;
	font-weight: 400;
	src: local('Noto Sans Regular'), local('NotoSans-Regular'),
		url(fonts/eot/NotoSansKR-Regular-Hestia.eot),
		url(fonts/eot/NotoSansKR-Regular-Hestia.eot?#iefix)
		format('embedded-opentype'),
		url(fonts/woff/NotoSansKR-Regular-Hestia.woff) format('woff'),
		url(fonts/otf/NotoSansKR-Regular-Hestia.otf) format('opentype');
}

@font-face {
	font-family: 'Noto Sans Korean';
	font-style: normal;
	font-weight: 500;
	src: local('Noto Sans Medium'), local('NotoSans-Medium'),
		url(fonts/eot/NotoSansKR-Medium-Hestia.eot),
		url(fonts/eot/NotoSansKR-Medium-Hestia.eot?#iefix)
		format('embedded-opentype'),
		url(fonts/woff/NotoSansKR-Medium-Hestia.woff) format('woff'),
		url(fonts/otf/NotoSansKR-Medium-Hestia.otf) format('opentype');
}

@font-face {
	font-family: 'Noto Sans Korean';
	font-style: normal;
	font-weight: 700;
	src: local('Noto Sans Bold'), local('NotoSans-Bold'),
		url(fonts/eot/NotoSansKR-Bold-Hestia.eot),
		url(fonts/eot/NotoSansKR-Bold-Hestia.eot?#iefix)
		format('embedded-opentype'),
		url(fonts/woff/NotoSansKR-Bold-Hestia.woff) format('woff'),
		url(fonts/otf/NotoSansKR-Bold-Hestia.otf) format('opentype');
}
/*
* Roboto > https://github.com/googlefonts/roboto
*/
@font-face {
	font-family: 'Noto Sans Korean';
	font-style: normal;
	font-weight: 300;
	unicode-range: U+0020-002F, U+003A-0040, U+005B-0060, U+007B-007E,
				U+0041-005A, U+0061-007A, U+0030-0039;
	src: local('Roboto Light'), local('Roboto-Light'),
		url(fonts/eot/Roboto-Light.eot),
		url(fonts/eot/Roboto-Light.eot?#iefix)
		format('embedded-opentype'),
		url(fonts/woff/Roboto-Light.woff) format('woff'),
		url(fonts/otf/Roboto-Light.otf) format('opentype');
}

@font-face {
	font-family: 'Noto Sans Korean';
	font-style: normal;
	font-weight: 400;
	unicode-range: U+0020-002F, U+003A-0040, U+005B-0060, U+007B-007E,
				U+0041-005A, U+0061-007A, U+0030-0039;
	src: local('Roboto Regular'), local('Roboto-Regular'),
		url(fonts/eot/Roboto-Regular.eot),
		url(fonts/eot/Roboto-Regular.eot?#iefix)
		format('embedded-opentype'),
		url(fonts/woff/Roboto-Regular.woff) format('woff'),
		url(fonts/otf/Roboto-Regular.otf) format('opentype');
}

@font-face {
	font-family: 'Noto Sans Korean';
	font-style: normal;
	font-weight: 500;
	unicode-range: U+0020-002F, U+003A-0040, U+005B-0060, U+007B-007E,
				U+0041-005A, U+0061-007A, U+0030-0039;
	src: local('Roboto Medium'), local('Roboto-Medium'),
		url(fonts/eot/Roboto-Medium.eot),
		url(fonts/eot/Roboto-Medium.eot?#iefix)
		format('embedded-opentype'),
		url(fonts/woff/Roboto-Medium.woff) format('woff'),
		url(fonts/otf/Roboto-Medium.otf) format('opentype');
}

@font-face {
	font-family: 'Noto Sans Korean';
	font-style: normal;
	font-weight: 700;
	unicode-range: U+0020-002F, U+003A-0040, U+005B-0060, U+007B-007E,
				U+0041-005A, U+0061-007A, U+0030-0039;
	src: local('Roboto Bold'), local('Roboto-Bold'),
		url(fonts/eot/Roboto-Bold.eot),
		url(fonts/eot/Roboto-Bold.eot?#iefix)
		format('embedded-opentype'),
		url(fonts/woff/Roboto-Bold.woff) format('woff'),
		url(fonts/otf/Roboto-Bold.otf) format('opentype');
}

html, body{height: 100%;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,address{margin:0;padding:0;color:#666;}
table{border:0;border-collapse:collapse;border-spacing:0;font-size:inherit;}
fieldset,img{border:0;vertical-align:middle;}
address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:normal;}
li{list-style:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
a {text-decoration:none; color:#fff; }
input,textarea,select{font-size:12px; vertical-align:middle; border:1px solid #dddde1; margin:0;}
input{height:18px; line-height:18px; padding:0 3px;}
input[type~="image"]{border:0 solid #fff;}
input[type~="radio"]{margin:0; vertical-align:middle; border:0 solid #fff;}
input[type~="checkbox"]{border:0 solid #fff; padding:0;}
body{background:#0b0b0b; padding:0; position:relative;width:100%;height:100%;font-family:'Noto Sans Korean', 'MalgunGothic','돋움',Dotum,'굴림',Gulim,'맑은 고딕','Malgun Gothic',Arial,Verdana,Geneva,sans-serif;font-size:12px;color:#666; font-weight:400;}

header, section, article,aside, nav, footer{display:block;}
hr,caption,legend {font-size:0; height:0; line-height: 0; width: 0;}
label{vertical-align:middle;}

/* input-type */
select {height:19px; color:#999; margin:0;font-size:12px; border:1px solid #bfbfbf;}
input.file {position:relative; text-align:right; -moz-opacity:0; filter:alpha(opacity:0); opacity:0; z-index:2;}
input:focus,
textarea:focus, .text_area textarea:focus {background:#f9f9f9;border-color:#c1c1c1;}

/* basic-alink */
a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:active {text-decoration:none; outline: none;}
a:hover {text-decoration:none;}
	
/* 숨김 컨텐츠 */
.sr-only{position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;}

/* Chrome, Safari용 스크롤 바 */
::-webkit-scrollbar {width:12px; height:12px; /* border: 3px solid #121419; background: #121419; */}
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {display: block; width:0;height:0; background:#121419;}
::-webkit-scrollbar-track { background-color: rgba(0,0,0,0.2); }
::-webkit-scrollbar-thumb { background-color: rgba(157, 194, 222, 0.75);}

/* Internet Explorer용 스크롤 바 */
html {
	scrollbar-face-color: rgba(67, 99, 123, 0.75);
	scrollbar-track-color: #fff;
	scrollbar-arrow-color: none;
	scrollbar-highlight-color: rgba(67, 99, 123, 0.75);
	scrollbar-3dlight-color: none;
	scrollbar-shadow-color: rgba(67, 99, 123, 0.75);
	scrollbar-darkshadow-color: none;
}

/* body_wrap */
#body_wrap{max-width:1920px; min-width:320px; height:1079px; overflow: hidden;
	background: rgb(0,33,61);
	background: -moz-linear-gradient(45deg, rgba(0,33,61,1) 0%, rgba(0,87,105,1) 100%);
	background: -webkit-linear-gradient(45deg, rgba(0,33,61,1) 0%, rgba(0,87,105,1) 100%);
	background: linear-gradient(45deg, rgba(0,33,61,1) 0%, rgba(0,87,105,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00213d",endColorstr="#005769",GradientType=1);
}
#body_wrap.login{width:100%; min-width:1400px; height:1079px;
	background: rgb(0,8,61);
	background: -moz-linear-gradient(45deg, rgba(0,8,61,1) 0%, rgba(79,153,167,1) 100%);
	background: -webkit-linear-gradient(45deg, rgba(0,8,61,1) 0%, rgba(79,153,167,1) 100%);
	background: linear-gradient(45deg, rgba(0,8,61,1) 0%, rgba(79,153,167,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00083d",endColorstr="#4f99a7",GradientType=1);
	background: url(../img/bg_img.png) no-repeat center;
	background-size: cover;
}

/* header */
#header{height:50px; width: 100%; position:relative; border-bottom: 1px solid #86bad8; box-shadow: 1px 1px 20px #86bad8; background: rgba(0,0,0,0.2); display: inline-block; box-sizing: border-box;}
#header .logo{padding:0 0 0 14px; font-size:26px; color:#fff; line-height:49px; font-weight: 500; display: inline-block; vertical-align: middle; max-width: 450px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
#header .logo a{color:#fff;}
#header .logo span{color:#00c0ff;}
#header .logo img{margin: 0 4px 1px 0; padding: 0; height: 40px; filter: drop-shadow(1px 1px 1px #fff);}

#header .search_site{display: inline-block; margin:0 0 0 20px; vertical-align: middle;}
#header .search_site>p{display: inline-block; border:1px solid #286183; border-radius:6px; background-color: #255e81; vertical-align: middle; position: relative; height:28px;}
#header .search_site>p>input{border: none; background: none; height:28px; width:204px; vertical-align: top; outline: none; color:#fff; font-size:15px; padding:0 30px 0 10px;}
#header .search_site>p>input::placeholder{color:#7ab1d3;}
#header .search_site>p>button{position:absolute;right: 5px;top: 5px;background: none;border: none; outline: none; cursor: pointer;}
#header .search_site>p>button:after{font-family: FontAwesome; content: '\f002'; font-size:15px; color:#d6efff;}
#header .search_site>.btn>i{border: 1px solid #85fff7; padding: 6px 12px; border-radius: 20px; color: #85fff7;}
#header .search_site>.btn>i:hover{background-color: #85fff7; color: #000;}
#header .search_site .select2-container--default .select2-selection--single{border: none; background-color: rgba(255,255,255,0.15); border-radius: 25px; height: 25px; box-shadow: inset 0px 0px 2px 0px #5481a0; max-width: 150px; width: 150px;}
#header .search_site .select2-container--default .select2-selection--single .select2-selection__rendered{line-height: 28px;}
#header .search_site .select2-container--default .select2-selection--single .select2-selection__arrow{height: 24px;}

#header .alarm_box{display: none; background-color: rgba(255,255,255,0.15); height: 25px; overflow: hidden; margin: 0 0 0 20px; vertical-align: middle; border-radius: 25px; box-shadow: inset 0px 0px 2px 0px #5481a0; width: 24%; text-align: center;}
#header .alarm_box>.alarm_wrap{height: 100%;
	transition: all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;}
#header .alarm_box>.alarm_wrap>dl{padding: 1px 5px; font-size: 15px; height: 100%; cursor: pointer; line-height: 25px;}
#header .alarm_box>.alarm_wrap>dl>dt{width: 25%; float: left; color: #7be4ff; display: inline-block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; line-height: 25px;}
#header .alarm_box>.alarm_wrap>dl>dd{width: 75%; float: left; color: #fff; display: inline-block;}
#header .alarm_box>.alarm_wrap>dl>dd>span{color: #ffdfb0; font-weight: 500; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 60%; float: left; display: inline-block; box-sizing: border-box;}
#header .alarm_box>.alarm_wrap>dl>dd>em{width: 40%; display: inline-block; float: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; line-height: 25px;}

#header .right_text{float: right;}
#header .right_text .menu_open{position: relative; top: 10px; left: 5px; display: none; font-size: 30px; padding: 2px 10px;}
#header .right_text .menu_open:after{content: "\f0c9"; font-weight: 900; font-family: 'Font Awesome\ 5 Free';}
#header .right_text .menu_open.close:after{content: "\f00d";}
#header .right_text>ul{display: inline-block;}
#header .right_text>ul>li{float:left; font-size:22px; color:#fff; font-weight:300; border-right: 1px solid #c1c1c1; margin: 8px 0; padding: 0 3px; line-height: 33px;}
#header .right_text>ul>li:last-child{margin-right:0; border-right: none;}
#header .right_text>ul>li>a{padding: 0px 5px; padding-bottom: 3px; font-weight: 400;}
#header .right_text>ul>li>a.on{border-bottom: 3px solid #7be4ff;}
#header .right_text>ul>li>a.on>span{color: #7be4ff;}
#header .right_text>ul>li>a:hover{color: #0ff;}
#header .right_text>.logout{display: inline-block; padding: 1px 10px 0 10px; float: right; text-shadow: 1px 1px 0px black; border-left: 2px solid rgba(255,255,255,0.05);}
#header .right_text>.logout>a{color: #7be4ff;}
#header .right_text>.logout>a:hover{color: #00cbff;}
#header .right_text>.logout>a>span{font-size: 28px; display: block; text-align: center;}
#header .right_text>.logout>a>em{position: relative; top: -4px; letter-spacing: 0.5px;}

#header .right_text>.volume{float: right; border-left: 2px solid rgba(255,255,255,0.05);}
#header .right_text>.volume>a{font-size: 28px; text-align: center; display: inline-block; padding: 8px 10px; text-shadow: 1px 1px 0px black; color: #d2bfff;}
#header .right_text>.volume.mute>a>i:before{content: '\f6a9';}

/* container */
.container {position: relative; padding: 0px; height: 1001px; min-height: 910px;}

/* footer */
#footer{height:26px; border-top: 1px solid #86bad8; box-shadow: 1px 1px 20px #86bad8; background: rgba(0,0,0,0.2);}
#footer>.left{display: inline-block; box-sizing: border-box; float: left; width: 20%; line-height:28px;}
#footer>.left>span{color: #7be4ff; font-size: 15px; padding-left: 20px; font-weight: 300;}
#footer>.left>span>i{font-size: 18px; position: relative; top: 2px;}
#footer>.left>span>span{padding-left: 5px; letter-spacing: 1px;}
#footer>.center{display: inline-block; box-sizing: border-box; float: left; width: 60%; color:#d2d2d2; font-size:13px; text-align:center; line-height:25px;}
#body_wrap.login #footer>.center{width: 100%;}
#footer>.center>span.tel{padding-left: 20px; color: #fff;}
#footer>.center>em{padding-left: 20px; font-size: 10px; color: #858585;}
#footer>.center>em>a{color: #858585; cursor: text;}
#footer>.right{display: inline-block; box-sizing: border-box; float: left; width: 20%; line-height:28px; text-align: right; padding-right: 20px;}
#footer>.right>span{color: #7be4ff; font-size: 15px; font-weight: 300; letter-spacing: 0.5px;}
#footer>.right>span>i:first-child{font-size: 18px; position: relative; top: 2px;}
#footer>.right>span>em{color: #fff; padding-left: 5px;}
#footer>.right>span>a{padding-left: 20px;}
#body_wrap.login #footer{position:fixed; width:100%; bottom:0; border-top: 1px solid #93e1ff; box-shadow: 1px 1px 20px #93e1ff; background: rgba(0,0,0,0.4);}

/* content */
.content{position: relative; height: 100%;}

/* select2 */
.select2_wrap{position:relative; display:inline-block;}
.select2_wrap .select2-container--open:last-child{position:absolute !important;}
.select2.select2-container{width:auto !important; position:relative !important;}
.select2.select2-container .select2-container--open, 
.select2-container--default .select2-selection--single{background-color:inherit; border:1px solid #85fff7; /* border-radius:5px; */ height:33px; border-top: none; border-right: none; border-left: none; outline: 0; border-radius: 0;}
.select2-container--default .select2-selection--single:focus{ border-bottom: 2px solid #4285f4; }
.select2-container--default .select2-selection--single .select2-selection__rendered{color:#fff; font-size:15px; padding-left:15px; padding-right:31px; line-height:33px; letter-spacing:0;}
.select2-container--default .select2-selection--single .select2-selection__arrow{width:28px; height:28px;}
.select2-container--default .select2-selection--single .select2-selection__arrow b{border-color:#85fff7 transparent transparent transparent;}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:transparent transparent #85fff7  transparent;}
.select2-dropdown{background-color: #436176; border: 1px solid #85fff7; white-space: nowrap;}
div.table_style .select2-dropdown{width: auto !important;}
div.table_style .select2-container--open .select2-dropdown--below{width: fit-content !important;}
.select2-container--default .select2-results__option{font-size: 15px; color: #fff; line-height:14px; letter-spacing:0; padding:6px 10px 6px 10px;  text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.select2-container--default .select2-results__option[aria-selected=true]{background-color:#0082a5; padding:6px 10px 6px 10px;}
.select2-container--default .select2-results__option--highlighted[aria-selected] {background-color:#528fbd; color: white;}
.select2-container--default .select2-results__option[aria-disabled=true] {cursor: not-allowed;}
.select2-container--default .select2-search--dropdown .select2-search__field{background: none; border: 1px solid #85fff7; color:#fff; line-height: 22px; height: 23px; font-size: 14px; outline: none; border-top: none; border-left: none; border-right: none; width: 90%;}
.select2-container--default .select2-search--dropdown:before{font-family: 'Font Awesome\ 5 Free'; font-weight: 900; content:'\f054'; font-size: 12px; color:#85fff7; padding-right: 5px; padding-left: 2px;}
.select2-container--open .select2-dropdown--below{border-radius: 5px; margin-top: 3px; border-top: 1px solid #85fff7;}
.select2-container--open .select2-dropdown--above {border-bottom: 1px solid #85fff7; border-radius: 5px;}

/* 상단 발전소 검색 */
#header .search_site .select2.select2-container{min-width: 150px; max-width: 150px;}
#header .search_site .select2-container--default .select2-selection--single{outline: none; border-top: none; border-right: none; border-left: none;}
#header .search_site .select2-container--default .select2-selection--single .select2-selection__rendered{color:#e6f7ff; font-size:15px;}
#header .search_site .select2-container--default .select2-selection--single .select2-selection__arrow b {border-color: #85fff7 transparent transparent transparent;}
#header .search_site .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {border-color: transparent transparent #85fff7 transparent;}
#header .search_site .select2-search--dropdown {line-height: 22px;}
#header .search_site .select2-container--default .select2-search--dropdown .select2-search__field{background: none; border: 1px solid #85fff7; color:#fff; line-height: 22px; height: 23px; font-size: 14px; outline: none; border-top: none; border-left: none; border-right: none; width: 90%;}
#header .search_site .select2-search--dropdown:before{font-family: 'Font Awesome\ 5 Free'; font-weight: 900; content:'\f054'; font-size: 12px; color:#85fff7; padding-right: 5px; padding-left: 2px;}
#header .search_site .select2-container--open .select2-dropdown--below{width: auto !important; min-width: 150px;}

/* scrollbar-track 스타일 */
div.scrollbar-track{background-color: rgba(0,0,0,0.2);}
div.scrollbar-track .scrollbar-thumb{background-color: rgba(157, 194, 222, 0.75);}