@charset "utf-8";

/* RESET */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,big,cite,code,del,dfn,em,font,img,ins,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:none 0}
body{font-family:'Malgun Gothic', '맑은고딕', Verdana, Geneva, sans-serif;font-size:12px;color:#555}
img,li,button{vertical-align:middle;text-align:left}
select,input{vertical-align:middle;text-align:left}
form legend,table caption{width:0;height:0;font-size:0;text-indent:-9999px;line-height:0}
input[type=radio], input[type=checkbox], input[type=image] {margin:0;border:none;background:none;}
button {margin:0;border:none;background:none;cursor:pointer;}
img,fieldset,iframe{border:0 none}
table,div{border-collapse:collapse;border-spacing:0}
table{width:100%}
address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:normal}
ul,li,ol{list-style-type:none}
hr{overflow:hidden;height:0;width:0;border:0 none}
a{display:inline-block;text-decoration:none;vertical-align:middle;color:#555}
li,p,dt,dd,div,span{white-space:normal}
label{display:inline-block;cursor:pointer}

/* INITIALIZE */
input[type=text],input[type=password]{box-sizing:border-box;}

/* CONTENTS */
html, body {height:100%;}

.wrap {height:100%;padding-top:190px;background:#FFF url('../images/bg_body.jpg') 50% 0 no-repeat;background-size:cover;box-sizing:border-box;}
.container {width:685px;height:543px;margin:0 auto;background: url('../images/key_img.png') 50% 0 no-repeat;}
.container h1 {width:0;height:0;font-size:0;line-height:0;text-indent:-9999px;}
.login_area {float:right;width:338px;height:620px;margin-top:1px;text-align:right;}

.login_area h2 {margin:80px auto 35px;text-align:center;}
.login_area > select {width:75px;height:20px;margin-right:65px;color:#787878; font-size: 11px}
.login_input {position:relative;width:215px;height:36px;padding:0 25px;margin:9px auto 0;line-height:41px;background-color:#FFF;border:1px solid #787878;border-radius:41px;box-sizing:border-box;box-shadow:0 4px 10px rgba(0,0,0,0.1);}
.login_input .id_bx {background:url('../images/label_id.png') 0 50% no-repeat;}
.login_input .pw_bx {background:url('../images/label_pw.png') 0 50% no-repeat;}
.login_input:after {display:block;position:absolute;top:10px;right:10px;content:'';width:19px;height:19px;border:1px solid #787878;border-radius:20px;box-sizing:border-box;}
.login_input > input[type="text"]{width:159px; margin-right:10px; height:34px;-webkit-appearance:none;border:none;}
.login_input > input[type="password"]{width:159px; margin-right:10px; height:34px;-webkit-appearance:none;border:none;}
.login_input > label {width:0;height:0;font-size:0;line-height:0;text-indent:-9999px;}
.login_area .check_option {width:200px;margin:18px auto 0;text-align:left; font-size: 11px}
.login_area .check_option > label {margin:0 6px 0 1px;color:#787878;}
.login_area .check_option > input[type="checkbox"] {margin:-1px 0 1px;}
button {display:block;width:114px;height:36px;margin:30px 0 0 65px;background:#4e98b3 url('../images/login_btn.png') 50% 50% no-repeat;font-size:0;line-height:0;border-radius:41px;box-sizing:border-box;box-shadow:0 4px 10px rgba(0,0,0,0.1);}
