@charset "utf-8";
@font-face { font-family:OpenSans-Bold; src:url(/FONT/OpenSans-Bold.eot);}
@font-face { font-family:OpenSans-Bold; src:url(/FONT/OpenSans-Bold.ttf);}
@font-face { font-family:OpenSans-Regular; src:url(/FONT/OpenSans-Regular.eot);}
@font-face { font-family:OpenSans-Regular; src:url(/FONT/OpenSans-Regular.ttf);}
@font-face { font-family:OpenSans-Semibold; src:url(/FONT/OpenSans-Semibold.eot);}
@font-face { font-family:OpenSans-Semibold; src:url(/FONT/OpenSans-Semibold.ttf);}

/* Reset CSS*/
body, html {/*height:100%;*/ }
* {margin:0; padding:0; border:0; vertical-align:top;}
article, aside, details, pigcaption, figure, footer, header, hgroup, 
menu, nav, section {display:block;}
ul, ol, dl {list-style:none;}
img, video {max-width:100%;}
a {text-decoration:none; color:#000;}
table {border-collapse:collapse; border-spacing:0;}
body, input, select, button {
    line-height:1; font-weight:normal;
    font-family:'OpenSans-Regular','OpenSans-Semibold','OpenSans-Bold',
        Malgun Gothic,'맑은고딕','나눔고딕',NanumGothic,'돋움',Dotum,'굴림',Gulim,Helvetica,sans-serif;}
body {font-size:100%; background:#e0e6eb; }
input, select, button {vertical-align:middle; margin:0; outline: none;}
lable {cursor:pointer;}
.blind,legend,caption {display:block; overflow:hidden; position:absolute; top:0; left:-1000em;}
i,em,address {font-style:normal; font-weight:normal;}


/*HEADER -----------------------*/
#header { 
    background:#0058b3 url(/images/login/bg.png) no-repeat 50% 45px; 
    text-align:center; padding:153px 0 43px 0; color:#FFF; }
#header h3 {font-size:120%; color:#72b7ff; margin:0 0 10px 0;}
#header h3 span {font-family:''OpenSans-Bold'';}
#header h1 {color:#fff;
    font-size:435%; font-family:"OpenSans-Bold","나눔고딕";letter-spacing:-1px;
    -webkit-text-shadow:0 1px 2px #003168;
    -moz-text-shadow:0 1px 2px #003168;
    -ms-text-shadow:0 1px 2px #003168;
    -o-text-shadow:0 1px 2px #003168;
    text-shadow:0 1px 2px #003168;
}
#header .line {margin:28px 0 26px 0;}
#header .line span {display:block; margin:auto; border:2px solid #4d8aca; width:138px; }
#header .time {margin:auto; width:320px; padding:12px 0 11px 0; font-size:85%;
    border:2px solid #b3cde8;
    -webkit-border-radius:22px;
    -moz-border-radius:22px;
    -ms-border-radius:22px;
    -o-border-radius:22px;
    border-radius:22px;
}
#header .time img {margin:0 10px 0 0;}



/*MAIN -----------------------*/
#main       {margin:auto; padding:20px 0 50px 0; background:#eff2f5; text-align:center;}
#main li    {margin:12px 0 0 0;}
#main input {
    width:381px; font-size:17px; color:#2a3e59;
    border:2px solid #cdd4d8; padding:13px 12px 10px 60px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -webkit-transition:all 0.2s;
    -moz-transition:all 0.2s;
    -ms-transition:all 0.2s;
    -o-transition:all 0.2s;
    transition:all 0.2s;
}
#main .name     {background:#FFF url(/images/login/form_name.png) no-repeat 20px 50%; }
#main .id       {background:#FFF url(/images/login/form_id.png) no-repeat 20px 50%;}
#main .password {background:#FFF url(/images/login/form_password.png) no-repeat 20px 50%;}
#main .commonkey {background:#FFF url(/images/login/form_common.png) no-repeat 20px 50%;}

#main .name:focus       {border:2px solid #1abb9b; }
#main .id:focus         {border:2px solid #13b1ca; }
#main .password:focus   {border:2px solid #e74c3c; }
#main .commonkey:focus  {border:2px solid #f09300; }

#main .login,
#main .login:active
#main .login:hover {
    width:455px; padding:17px 60px;
    font-family:'OpenSans-Bold'; font-size:110%;
    -webkit-box-shadow:0 2px #0064ca;
    -moz-box-shadow:0 2px #0064ca;
    -ms-box-shadow:0 2px #0064ca;
    -o-box-shadow:0 2px #0064ca;
    box-shadow:0 2px #0064ca;
}
#main .login,
#main .login:active {background:#0074e1; border:none; color:#FFF;}
#main .login:hover  {background:#0050bd; cursor:pointer;}
#main .login:focus  {border:none;}


/*save id,password*/
#main .saveid {
    width:452px; font-size:90%; margin:auto; padding:22px 0 0 0;
    text-align:right; letter-spacing:-1px; color:#474b4f; font-weight:bold;
}
#main .saveid input[type='checkbox'] {
    width: 20px;
    height: 20px;
    background: #fff;
    padding:0;
    border: solid 3px #c7cfd3;
    -webkit-appearance: none;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
}
#main .saveid input[type='checkbox']:checked {
    background: #fff;
    border: solid 3px #46aeff;
}
#main .saveid input[type='checkbox']:checked:after {
    content: ' ';
    display: block;
    width: 8px;
    height: 8px;
    background: #46aeff;
    position: relative;
    top: 3px;
    left: 3px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
}
#main .saveid label {
    display: inline-block;
    margin: 2px 0 0 2px; cursor: pointer; border: 0; outline: 0;
}
#main .saveid input[type='checkbox']:checked + label {color:#46aeff;}

/*FOOTER -----------------------*/
#foot {
    /*position:absolute; bottom:0; width:100%;*/
    border-top:1px solid #c7cdd2; padding:20px 0 22px 0;
    font-family:'NanumGothic'; font-size:85%; color:#abb3be; text-align:center;
}