@charset "UTF-8";
* [unresolved] {display: none}
article, aside, figure, footer, header, hgroup, nav, section {display:block}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,form,fieldset,p,button,input,figure {margin:0;padding:0}
/* body,input, textarea, select {font-size:12px; font-family:돋움,dotum,AppleGothic,arial,Helvetica,sans-serif; color:#3b3b3b} */
body,input {*word-break:break-all; -ms-word-wrap:break-all; white-space:normal; word-break:break-all} 
select:disabled {background-color: #eee; color:#999}
/* h1, h2, h3, h4, h5, h6 {font-family:돋움,dotum,AppleGothic,arial,Helvetica,sans-serif; color:#000} */
h1 {font-size:20px}
h2 {font-size:18px}
h3 {font-size:16px}
input,select,button{vertical-align:middle;font-size:12px}
img{vertical-align:top}	
a{color:#3b3b3b; text-decoration:none; cursor:pointer; /*overflow:hidden;*/ vertical-align:baseline}
a:hover{/*color:#2EACB3;*/ text-decoration:none}
span {vertical-align:baseline}
a img, img {border:0} 
ul, ol {list-style:none}
table {border-collapse:collapse; width:100%}
input.checkbox {margin-right:2px; /*vertical-align:baseline;*/ position:relative; top:2px}
input.radio {margin-right:3px; position:relative; top:-1px}
label {vertical-align:baseline}
fieldset {border:none}
data-role {background: red}
body.popup {min-width:200px!important}
select {border-radius: 2px}
dl, font, p, ol {line-height:150%} 
input[type="checkbox"], input[type="radio"] {position:relative; top:-1px; margin-right:3px}
input[type="text"]::-ms-clear {display:none}/* ie10 x icon */

/* layout */
.wrap_login {width: 900px; margin: 100px auto 0}
.wrap_login h1.logo {margin: 0 0 10px 0}

.login {position: relative; background: url(../images/bg.gif) no-repeat; width: 900px; height: 380px}
.login h2.tit {position: absolute; top: 16px; left: 14px; color: #fff; letter-spacing: -1px}
.login .opt {position: absolute; top: 7px; right: 10px}
.login .opt span {vertical-align: top}
.login .slogan {display: inline-block; background: url(../images/txt_h2o.gif) no-repeat; width: 105px; height: 39px;}
.login .year {display: inline-block; background:url(../images/txt_year.gif) no-repeat; width:61px; height:39px;}
.login .wrap_photo {position: absolute; top: 80px; left: 55px; border: 1px solid #e5e5e5; width: 460px; height: 200px; overflow: hidden}
.login .wrap_photo img {display: block; width: 460px; height: 200px}
.login .wrap_login_form {position: absolute; top: 80px; right: 55px; border: 1px solid #e5e5e5; width: 260px; height: 160px; padding: 20px; background: #f4f4f4}
.login .wrap_login_form .wrap_form {position: relative}
.login .wrap_login_form .txt_login {display: inline-block; background: url(../images/tit_login.gif) no-repeat; width: 65px; height: 28px; margin-top:20px; margin-bottom:5px;}
.login .wrap_login_form .wrap_form .ipt_login {width: 100%; background: #fff; border: 1px solid #e5e5e5; height: 26px; line-height: 26px; padding: 0 4px; box-sizing: border-box}
.login .wrap_login_form .wrap_form .login_id,
.login .wrap_login_form .wrap_form .login_pw {margin: 0 60px 6px 0;}
.login .wrap_login_form .wrap_form a.btn_login {position: absolute; top: 0; right: 0}
.login .wrap_login_form .wrap_form .btn_login {display: inline-block; background: url(../images/btn_login.gif) no-repeat; width: 49px; height: 57px}
.login .wrap_login_form .wrap_form .login_check {margin: 4px 0 0 0}
.login .wrap_login_form .wrap_form .login_check .part {color: #e5e5e5}
.login .wrap_login_form .wrap_form .desc {font-size: 12px; color: #888; margin: 12px 0 0 0; font-size: 11px}
.login .login_msg {position: absolute; top: 80px; left: 543px; z-index: 10}

/* captcha */
.login .wrap_login_form .wrap_form .captchaContents {position:absolute; top:124px; left:-21px; width:260px; z-index:10;}
.login_box .captchaContents {margin:-10px 0 10px}
.captchaContents {position:relative; border:1px solid #e5e5e5; background:#f4f4f4; padding:20px}
.captchaContents .txt {color:#888; line-height:1.5; margin-right:40px}
.captchaContents img {display:block; margin:15px 0 0 -23px}
.captchaContents input {border:1px solid #ccc; height:44px; width:100%; padding:0 10px; box-sizing: border-box; box-shadow:none!important; font-size:16px!important}
.captchaContents .ic_refresh_tyep2 {position:absolute; top:20px; right:20px; display:inlne-block; background-position:0 -1050px!important; width:16px; height:16px}



.hot {position: absolute; bottom: 40px; left: 55px; border: 1px solid #e5e5e5; width: 789px; height: 40px}
.hot .tit_hot {display: inline-block; background: url(../images/tit_hot.gif) no-repeat; width: 88px; height: 38px}
.hot a {display: inline-block; height: 40px; line-height: 40px; padding: 0 10px}
.hot span, .hot a {vertical-align: top}


.wrap_login .header {position: relative}
.wrap_login .header .language {position: absolute; bottom: 0; right: 0}

.login_msg {display: inline-block; background: #000; padding: 10px; width: 282px}
.login_msg .txt {color: #fff}
.login_msg span.ic_error {
    padding: 2px 6px;
    background: #f44e40;
    border-radius: 2px;
    border: 1px solid #df6c36;
    color: #fff;
    font-weight: bold;
}
