@CHARSET "UTF-8";


/* 로그인 ID-PWD-BT*/
#wrap {background: #fff;}

.containerWrap {position:relative; margin: 0 auto;  padding: 3% 3% 5%;}

img {width:100%;}

.logoL {padding: 20px 0px; text-align: center; margin: 0 auto;}
.logoL {max-width:445px;}

/* 로그인 폼 */
.login .input_style {display: block; position:relative; }
.login .input_style input{ border: 0; margin: 0; border-radius: 0; height: 40px; padding-left: 30px; border: 0; font-size: 14px; background: #fff url('/img/response/ico_member.png') no-repeat 0 12px; background-size: 36px 449px;}
.login > div {border: 1px solid #ccc;}
.login .input_style:nth-of-type(2) input {margin-top: 1px; border-top: 1px solid #eaeaea; background-position: 0 -40px;}

/* 회사소개 개인정보 회원가입 링크 */
.submWrap {margin-top:33px; border-top:1px solid #eaeaea; text-align:center; }
.submWrap ol {overflow:hidden; display:inline-block;  }
.submWrap ol > li{float:left; padding:20px 3px;}
.submWrap ol > li.gap0 {color:#eaeaea}
.submWrap ol > li > a {display:block; font-size:1.16em}

/* 전력수급현황 */
.eleTitle {background:#f2f2f2; height:50px; text-align:center ; font-size:1.5em;}
.eleTitle p {padding: 13px 0;}
.eleTitle span {color:#2f79ff}
.eleContext dt {text-align:center; padding-top:20px;}
.eleContext .eleImg {padding:22px 10% 10%; text-align: center;}
.eleContext ul {padding:0 6%}
.eleContext li {border-bottom:1px solid #e8e8e8;}
.eleContext li:last-child {border-bottom:none; text-align: right; padding: 10px;} 
.eleContext li p {padding:10px 0}
.eleContext li.eleUnitBig p {padding-top:15px; padding-bottom:15px;}
.eleContext li.eleUnitBig span {position:relative; float:right; margin:-7px 0; font-size:2em;}
.eleContext li.eleUnitBig span mark {background:#e6f7ee}
.eleContext li.eleUnitBig span em {padding-left:5px; font-size:.66em;}
.eleContext li.eleUnit span {font-size: 1.3em; position: relative; float: right; margin: -2px 0; }
.eleContext li.eleUnit span em {padding-left:6px; font-size:.75em}



/* 에러페이지 */
.errWrap {padding:10px; }
.errWrap dl {overflow: hidden; }
.errWrap dl > dt, .errWrap dl > dd {float: left}
.errWrap dl > dt {width: 85px; }
.errWrap dl > dd {width: calc(100% - 95px); font-size: 2em; font-weight: bold; line-height: 2em; text-align: center; }
.errWrap dl:after {content:""; clear:both; }
.errInWrap {margin-top:15px; border:1px solid #000}

/* 서버에러페이지 */
.serverErrWrap {margin: 10% auto; width: 80%; max-width:900px;  text-align:center; border:2px solid #C8C8C8;  } 
.serverErrContent {max-width:360px; margin: 0 auto; border: 6px solid #EDEDED;}
.serverErrContent li{padding:10px; }
.serverErrContent .errmsg{margin: 20px 10%; border-top: 1px solid #ccc;  line-height: 2em;}
.serverErrImg > img{width:100%; max-width:400px}


@media only screen and (min-width:450px){
	.serverErrContent {max-width:inherit; }
	.serverErrImg > img {max-width:400px; }
}


@media only screen and (min-width:768px){
	.containerWrap{
		position:relative;padding: 3% 20% 5%;
		max-width:500px;		
	}
	.eleContext dl{
		overflow: hidden; 
	}
	.eleContext dt, .eleContext dd{
		float:left; 
		width:50%;
	}
	.eleContext dd {
	    padding-top: 15px;
	}
	.eleContext .eleImg img{width:170px}
	
}


@media only screen and (min-width:1025px){
	.containerWrap{
		position:relative;padding: 3% 25% 5%;
		max-width:550px; 
	}
	.submWrap ol > li{float:left; padding:20px 10px;}
	
}


@media only screen and (min-width:1441px){
	.containerWrap{
		position:relative;padding: 3% 34% 5%;
		max-width:600px; 
	}
}