/* common */
* {font-family: 'SUIT', sans-serif;}
h1, h2, h3, h4, h5 {font-family:'SUIT';}
.spacer {width: 100%; height: 100%;}
area {outline: none;}
input {outline: none;}
button {outline: none;}

/* original css */
.member-join {max-width: 376px; margin: 100px auto; padding: 0 16px;}
.member-join #login_logo {text-align:center;padding: 40px 0 0 0; font-size: 26px; line-height: 39px; letter-spacing: -0.04em; color: #212121; font-weight: 300; font-family: 'SUIT', sans-serif;}
.member-join #login_logo img{width:50px;}
.member-join #login_logo span{margin-left:10px;}
@media handheld, only screen and (max-width: 370px) {
	.member-join #login_logo{font-size: 22px;}
}
.member-join #login_logo * {display: inline-block; vertical-align: middle; }
	
.member-forms .login_tit.agree_tit {margin-bottom: 20px; margin-top: 30px;}
.member-forms .login_tit {display: block; color: #cccccc; text-align: center; position: relative; font-size: 12px;}
.member-forms .login_tit b, strong {font-weight: 700;}
.member-forms .login_tit::before {left: 0;}
.member-forms .login_tit::before, .login_tit::after {position: absolute; content: ""; display: inline-block; width: 35%; height: 1px; background-color: #ccc; top: 50%;}
.member-forms .login_tit::after {right: 0;}

.member-join .member-forms .input-item #email_id {padding: 0 30px 0 16px;}
.member-join .member-forms .input-item #email_id::-ms-clear {display: none;}
.member-join .member-forms .input-item input[type=text],.member-join .member-forms .input-item input[type=password]{width: 100%; height: 52px; outline: 0; font-size: 12px; padding: 0 16px; box-sizing: border-box; border: 1px solid #DDDDDD; background: #FAFAFA; border-radius:0; color: #000; letter-spacing: -0.5px;  box-shadow: none; }
.member-join .member-forms .input-item input::placeholder{color: #BDBDBD;}
.member-join .member-forms .input-item.btns .confirm-box{width: 25%; height: 52px; float:right;}
.member-join .member-forms .input-item.btns .confirm-box a{background-color:#000; letter-spacing:-0.5px; border-radius:0;}
.member-join .member-forms .input-item label {position: relative; display: block;}
.member-join .member-forms .input-item.btns label{width:73%;}
.member-join .member-forms .input-item-alert {font-size:10px; color:#EC0505; font-weight:500; font-family: SUIT Medium; margin: 2px 0 0 0;}
#searchclear {position: absolute; right: 15px; top: 0; bottom: 0; width: 10px; height: 14px; margin: auto; font-size: 12px; cursor: pointer; color: #ccc;}
.input-item{position:relative; margin-top:16px; label{position: relative; display: block;}
.member-join .member-forms .input-item .icon-eye:before {line-height: 0;}
    	.icon-eye{@extend .glyphicon-mdi_remove-red-eye; display: block; position:absolute; right: 16px; top: 50%; margin-top: -7px; font-size: 14px; line-height: 0; opacity: .3;} &:before {@extend .glyphicon; line-height:0;}}
.member-join .member-another-links {margin-bottom: 0; margin-top: 30px; overflow: hidden; position: relative; text-align: center;}
.member-join .member-another-links>.left {float: left;}
.Form_rect input[type=checkbox] {overflow: hidden; opacity: 0; position: absolute; top: 0; left: 0; width: 1px; height: 1px; box-sizing: border-box; padding: 0;}

.member-join .member-another-links>.left .Form_rect input[type=checkbox]:checked+label {color: #121212;}
.member-join .member-another-links>.left .Form_rect label, .member-join .member-another-links .find_account a {letter-spacing: -0.3px; font-size: 12px; font-weight:300}

/*.Form_rect label.left {padding-left: 26px;}*/
.Form_rect label.keep_login:before{width:24px; height:24px;}
.Form_rect label:before {content: ""; display: inline-block; vertical-align: middle;}
.Form_rect input[type=checkbox]+label.keep_login:before{background: url(//s3.ap-northeast-2.amazonaws.com/st.dev.dangidata/static_conects/public/img/join/icon_radio_16_off.png) no-repeat center;background-size: 100%;  transform: none; top: -3px; left:-3px;}
.member-join .member-another-links>.left .Form_rect input[type=checkbox]:checked+label.keep_login:before{/*position: absolute;*/ right: 0; background: url(//s3.ap-northeast-2.amazonaws.com/st.dev.dangidata/static_conects/public/img/join/icon_radio_16_on.png) no-repeat center;}
.Form_rect label {position: relative;display: block;}
.member-join .member-another-links>.right {float: right;}
.member-join .member-another-links .find_account a {color: #757575; letter-spacing: -0.3px;}
.member-join .member-another-links a {display: inline-block; font-size: 12px; vertical-align: middle; font-weight:300}
.member-join .member-another-links i {display: inline-block; width: 1px; height: 8px; margin: 0 8px; background-color: #cacaca; vertical-align: middle;}

.member-join .member-forms .confirm-box {margin-top: 20px;}
.member-join .member-forms .confirm-box .member-join-btn.active {background: #0a3cd2;}
.member-join .member-forms .confirm-box .member-join-btn {display: block; text-align: center; color: #fff; font-size: 14px; font-weight: 700; line-height: 60px;}
.member-join .member-forms .confirm-box .member-join-btn.join {background-color: #ffffff; color: #0a3cd2; border: 1px solid #0a3cd2; margin-top: 12px; line-height: 58px;}

.join_email {margin-top: 25px;}
.join_email li {font-weight: 500; font-size: 12px; color: #999999; margin-top: 10px; font-weight:200}
.join_email li span {float: right;}
.join_email li span a{text-decoration:underline;}