@charset "utf-8";
/* CSS Document */

html, body {width: 100%; height: 100%;font-family:NotoSansCJKkrRegular, 맑은고딕, "Malgun Gothic", Dotum, Dotumche, 돋움, 돋움, 돋움체, Arial; }
body{padding:0px; margin:0px; display:block; font-size: 18px; font-family: NotoSansCJKkrRegular, 맑은고딕, "Malgun Gothic", Dotum, Dotumche, 돋움, 돋움, 돋움체, Arial; COLOR: #5d5d5d;}
*{margin:0; padding:0;}

.wrapper{width:100%; height:100%; margin: 0px auto;}
.wrap{display: table; width: 100%; height: 100%; }
.login_outer{display:table-cell; vertical-align: middle; text-align: center;}
.login{position: relative; display: inline-block; text-align:center;}

form{width: 560px; height: 500px; border: solid 3px #e1e1e1;}
h1{margin-bottom:30px;}
h2{padding-top:80px; margin-bottom:40px; font-size: 30px;font-family:'NotoSansCJKkrBold';}
.pr12{padding-right:12px;}
.mt10{margin-top:10px;}
.btn{ margin-top:20px; background-color: #ed1654; background-position:center; height:50px; line-height:50px; color:#FFFFFF; font-weight:bold; border:none; width:400px; font-size:16px;font-family:NotoSansCJKkrRegular, 맑은고딕, "Malgun Gothic", Dotum, Dotumche, 돋움, 돋움, 돋움체, Arial;}
.input_txt {
	padding: 0px; padding-left:10px; MARGIN: 0px;  WIDTH: 336px;  HEIGHT: 48px;
	BORDER-BOTTOM: #dcdcdc 1px solid; BORDER-TOP: #dcdcdc 1px solid; BORDER-RIGHT: #dcdcdc 1px solid;
	background-color:#ffffff; font-size: 16px; COLOR: #a0a0a0;
}
.check{margin-top:15px; margin-left:-255px;}
.check span{font-size: 15px; COLOR: #595959; line-height: 21px; float:left  }
.pwfind{font-size: 15px; font-weight:bold; color:#5d5d5d; margin-top:-21px; margin-left:230px}

.id_info{width: 400px; text-align: center; margin-left: 80px}
.id_info span{width: 52px; height: 50px; display: inline-block; float: left}
.id_info span.left_id{background:url("../imgs/login/id.png") no-repeat;}
.pw_info{width: 400px; text-align: center; margin-left: 80px}
.pw_info span{width: 52px; height: 50px; display: inline-block; float: left}
.pw_info span.left_pw{background:url("../imgs/login/pw.png") no-repeat;}

input[type=checkbox] {  
    display: none;  
}
input[type=checkbox] + label{
    display: inline-block;  
    cursor: pointer;  
    position: relative;  
    padding-left: 25px;  
    margin-right: 15px;  
    font-size: 13px;
}

input[type=checkbox]+ label:before {     

    content: "";  
    display: inline-block;  
  
    width: 20px;  
    height: 20px;  
  
    margin-right: 10px;  
    position: absolute;  
    left: 0;  
    bottom: 1px;  
    background-color: #f6f6f6;  
    border-radius: 2px; 
    BORDER-BOTTOM: #dcdcdc 1px solid; BORDER-LEFT: #dcdcdc 1px solid; BORDER-TOP: #dcdcdc 1px solid; BORDER-RIGHT: #dcdcdc 1px solid;
}
input[type=checkbox]:checked + label:before { 

    content: "\2713";  /* 체크모양 */
    text-shadow: 1px 1px 1px 1px rgba(0, 0, 0, .2);  
    font-size: 16px; 
    font-weight:800; 
    color: #fff;  
    background:#ed1654;
    text-align: center;  
    line-height: 16px;  
} 

footer{font-size:12px; padding-top:50px; color:#888; font:dotum}

.y_fb {font-family:NotoSansCJKkrRegular, 맑은고딕, "Malgun Gothic", Dotum, Dotumche, 돋움, 돋움, 돋움체, Arial;}
.y_tl {font-family:NotoSansCJKkrRegular, 맑은고딕, "Malgun Gothic", Dotum, Dotumche, 돋움, 돋움, 돋움체, Arial;}

/* reset css */
.blind, legend, hr, caption { display: block; position: absolute; left: 1000em; top: 0; overflow: hidden; }
i, em, address { font-style: normal; font-weight: normal; }
body, h1, h2, h3, h4, h5, h6, p, ul, ol, dl, dt, dd, li, table, th, td,  form, address, pre, caption, cite, ode, dfn, var { font-style: normal; text-decoration: none; }

* { margin: 0; padding: 0; border: 0; outline: 0; }
html, body { width: 100%; height: 100%; }
body { min-width: 320px; word-wrap: break-word; word-break: break-all; text-size-adjust: none; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; font-size: 100%; }
article, aside, details, figcaption, figire, footer, header, hgroup, menu, nav, section { display: block; }
ul, li, ol, dl { height: auto; overflow: hidden; list-style: none; }
table { border-collapse: collapse; border-spacing: 0; }
img, video { vertical-align: top; }
button { background: none; outline: none; border: none; cursor: pointer; background-color: transparent; border-radius: 0px; }
label { cursor: pointer; vertical-align: middle; }
input, select, textarea, button { font: inherit; color: inherit; vertical-align: middle; }
input:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px #f6f8f9 inset !important; }
select::-ms-expand { display: none; }
select { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
textarea { resize: none; }
a, a:hover, a:focus { display: block; color: inherit; text-decoration: none; }
.etc{font-size: 13px; color: red; margin-top: 20px}

@media all and (max-width:529px) and (min-width:0px)
{
body{background: url('../images/logo.png') no-repeat; background-position: 50% 90%; }
.wrapper{width:100%; height:auto;}
.wrap{display: table; width: 100%; height:auto; background-color: #fff}
.login_outer{display:table-cell; vertical-align: middle; text-align: center;}
.login{position: relative; display: inline-block; text-align:center; width: 100%}
form{width: 100%; height: auto; border:none}
h1{display: none}
h2{padding-top:30px; margin-bottom:20px; }

.id_info{width: 80%; text-align: center; margin-left: 10%}
.id_info span{width: 52px; height: 50px; display: inline-block; float: left}
/*.id_info span.left_id{background:url("../images/id.png") no-repeat;}*/
.pw_info{width: 80%; text-align: center; margin-left: 10%}
.pw_info span{width: 52px; height: 50px; display: inline-block; float: left}
/*.pw_info span.left_pw{background:url("../images/pw.png") no-repeat;}*/
    
.input_txt{padding: 0px; padding-left:10px; MARGIN: 0px;  WIDTH: calc(100% - 58px); margin-left: -5px}
.check{margin-top:15px;width: 80%; margin-left: 10%; text-align: left}
.id_not{width: 80%; margin-left: 10%;padding:0px; text-align: left}
.btn{width:80%;}
.etc{display: none}
footer{display: none}  
}