@charset "utf-8";

/* reset style */
html,body{width:100%;height:100%;}
html{font-size:10px}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,form,fieldset,p,button{margin:0;padding:0}
body,h1,h2,h3,h4,input,button{font-family: "맑은 고딕", "Malgun Gothic", Helvetica, sans-serif; font-size:12px;color:#666;}
body, body[class ^= egate_]{margin:0;padding:0;width:100%;font-size:12px;color:#666;background-color:#fff; word-break:break-all;-ms-word-break:break-all;}
form{margin-bottom:0;}
img,fieldset,iframe{border:0 none}
li{list-style:none}
input,select,button{vertical-align:middle;font-family:Gulim;}
input[type = 'checkbox'], input[type = 'radio'] {cursor:pointer;}
input[type = 'checkbox']:disabled, input[type = 'radio']:disabled {cursor:default;}
img{vertical-align:top}
i,em,address{font-style:normal}
label,button{cursor:pointer}
button{margin:0;padding:0}
a{color:#666;text-decoration:none}
a:hover{color:#390;text-decoration:underline}
button {margin: 0; padding: 0; border: 0; background: none;}
button *{position:relative}
button img{left:-3px;*left:auto}
html:first-child select{height:20px;padding-right:6px}
option{padding-right:6px}
hr{display:none}
legend{width:0;display:none;}
table{font-size:12px;border-collapse:collapse;border-spacing:0;border:none;}
table th, table td {word-break:break-all;box-sizing:border-box;}
caption {display:none;}
input {margin: 0; padding: 0; overflow: visible;}
input::-ms-clear{display:none}

/* login_style */
#login_wrap {min-width:576px;}
.login_title{width: 233px;height: 55px;text-indent: -999em;background: transparent url(../images/login/login_logo_white.png) 0 0 no-repeat;background-size: 233px 55px;position: absolute;top: 20px;left: 50%;margin-left: -116px}
.login_container {position:absolute; top:50%; width: 100%;  margin-top: -250px;}
.login_container .login_frm_area{position: relative; max-width: 1170px; min-width:576px; margin: 0 auto;}
.login_container .login_frm_area .login_visual{position: relative;}
.login_container .login_frm_area .login_visual p {cursor: pointer;}
.login_container .login_frm_area .login_visual .login_slogan{ position: absolute; top:  65px;left: 37px; font-size: 30px; color: #fff;}

.login_visual .bx-controls{}
.login_visual .bx-controls .bx-prev{width: 30px;height: 40px; position: absolute; top:50%; left: 10px; margin-top: -15px; z-index: 55 ;text-indent: -999em; background: transparent url(../images/login/login_btn_left.png) center no-repeat; }
.login_visual .bx-controls .bx-next{width: 30px;height: 40px; position: absolute; top:50%; right: 298px; margin-top: -15px; z-index: 55;text-indent: -999em; background: transparent url(../images/login/login_btn_right.png) center no-repeat; }
.login_visual .bx-controls .bx-pager{position: absolute ; bottom: 20px; left: 50%;; overflow: hidden;  z-index: 55;margin-left: -120px}
.login_visual .bx-controls .bx-pager .bx-pager-item{float: left; margin:10px 8px ; }
.login_visual .bx-controls .bx-pager .bx-pager-item > a {text-indent: -999em; width: 10px; height: 10px ; border: 2px solid #fff; border-radius: 50%; display: block;opacity: 0.6}
.login_visual .bx-controls .bx-pager .bx-pager-item > a.active {background-color: #fff;opacity: 1}

.login_container .login_frm_area .login_frm{position: absolute; top: 0; right: 0; padding: 0 25px 0; width: 238px; height: 100%; z-index: 95; background-color: rgba( 0, 0, 0, .4);}
.login_container .login_frm_area .login_frm .login_inp_area{margin-top: 90px}
.login_container .login_frm_area .login_frm .login_inp_area .login_inp{}
.login_container .login_frm_area .login_frm .login_inp_area .login_inp input{width: 225px; margin: 5px 0; padding-left: 10px; border: 1px solid #ededed; border-radius: 3px ; height: 30px;}

.login_inp_chk {margin: 20px 0;height:16px;line-height:16px;color:#fff;font-family: "맑은 고딕";}
.login_inp_chk input[type=checkbox] {display: inline-block;margin-right:7px;vertical-align:middle;}


.login_btn {margin-bottom:15px;height:40px;overflow:hidden;}
.login_btn > button {transition: all .3s; display:block;width:245px;height:100%;line-height:40px;color:#fff;background-color: #0050a0;text-transform:uppercase;border:none;border-radius:2px;letter-spacing:1px;font-family:'Malgun Gothic';font-size: 14px}
.login_btn > button:hover {font-size: 16px;font-weight: bold;transition: all .3s;}

.login_footer{width:100%;}
.login_footer>p{text-align: center;font-size: 14px;color:#999999;margin-top: 18px}



.bdr_ctrl {border-color: #ff6464 !important;}
.egate_error {position:relative;height:100%;overflow-x:hidden;}
.egate_error_area {position:absolute;left:50%;top: 50%;margin:-159px 0 0 -409px;padding:25px 55px;max-width:702px;min-width:594px;background-color:#fff;border:3px solid #3bb6b5;border-radius:6px;}
.egate_error_area .egate_error_con {padding:25px 0 0 284px;min-height:214px;min-width:310px;background:transparent url(../images/login/img_error.jpg) no-repeat left top;}
.egate_error_con > h2 {margin-bottom:20px;min-height:30px;line-height:30px;font-size:27px;color:#333;font-weight:400;letter-spacing:-1px;font-family:'Malgun Gothic';}
.egate_error_con p.txt {margin-bottom:23px;line-height:24px;color:#333;font-size:15px;font-family:'Malgun Gothic';}
.egate_error_area .egate_error_con.ico_certification {background-image:url(../images/login/img_error_cerify.png);background-position:left 30px;}
.txt_btn > span {
    display: block;
    padding: 2px 15px;
    min-width: 40px;
    height: 21px;
    line-height: 22px;
    text-align: center;
    border-radius: 2px;
    background-color: #fff;
    cursor: pointer;
}
.txt_btn .btn_highlight {
    position: relative;
    color: #fff;
    background-color: #ff6464;
    z-index: 2;
}
@media screen and (max-width:1280px) {
    .login_visual .visual_slide .login_slogan {position:fixed;top:50%;left:30px;margin-top:-192px;}
}
@media screen and (max-height:573px) {
    .login_container {top:0;margin-top:0;}
}

/* error page response*/
@media screen and (max-width:850px) and (min-width:501px) {
	.egate_error {display:table;width:100%;height:100%;vertical-align:middle;}	
	.egate_error_area {display:table-cell;position:static;top:0;left:0;margin:0;padding:4%;width:92%;height:auto;min-width:90%;overflow:hidden;vertical-align:middle;border:none;border-width:0;}
	.egate_error_area .egate_error_con {padding:3% 3% 3% 25%;min-width:200px;min-height:auto;width:100%;background-position:3% 30% !important;background-size:20% auto;border:3px solid #999;border-radius:4px;border-color:inherit;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizigng:border-box;}
	.egate_error_con > h2 {margin:10px 0;font-size:20px;line-height:130%;}
	.egate_error_con p.txt {margin-bottom:10px;font-size:13px;}
	.egate_error_con .txt_btn {width:auto !important;}
	.egate_error_con .txt_btn > span {padding:12px 10px;}
}
@media screen and (max-width:500px) and (max-device-width:500px) {
	.egate_error {display:table;width:100%;height:100%;vertical-align:middle;}	
	.egate_error_area {display:table-cell;position:static;top:0;left:0;margin:0;padding:4%;width:92%;height:auto;min-width:90%;overflow:hidden;vertical-align:middle;border:none;}
	.egate_error_area .egate_error_con {padding:100px 3% 3%;min-width:100px;min-height:auto;width:100%;background-position:50% 10px !important;background-size:auto 90px;border:3px solid #999;border-color:inherit;border-radius:4px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizigng:border-box;}
	.egate_error_con > h2 {margin:10px 0;font-size:20px;line-height:130%;}
	.egate_error_con p.txt {margin-bottom:10px;font-size:13px;}
	.egate_error_con .txt_btn {width:auto !important;}
	.egate_error_con .txt_btn > span {padding:12px 10px;}
}