@charset "utf-8";

button, [type="button"], [type="reset"], [type="submit"] {
	padding:    0;
	border:     0 none;
	background: none;
	cursor:     pointer;
}

[type="checkbox"], [type="radio"] {
    box-sizing: border-box;
    padding: 0;
}

.desc_radio input, .desc_check input {
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 5px;
	margin-top: -1px;
    vertical-align: middle;
}

.i_button {
	width:      100%;
	background: #575c63;
	color:      #fff;
}

.user_area {width: 520px; margin: 0 auto;}

/* 아이디/비밀번호찾기 탭메뉴 */
.user_tabs {position: relative;width: 100%;border-top: 1px solid #dbdbdb;border-left: 1px solid #dbdbdb;box-sizing: border-box;}
.user_tabs:after {display: block;clear: both;content: '';}
.user_tabs li {position: relative;float: left;width: 50%;}
.user_tabs li a {display: block;height: 40px;background: #a2a2a2;border-right: 1px solid #dbdbdb;border-bottom: 1px solid #dbdbdb;line-height: 40px;color: #fff;text-align: center;font-weight: 400;}
.user_tabs li.active a {border-bottom: 1px solid #fff;background: #fff;color: #181818;}
.user_tabs li.active a, .user_tabs li.active a:hover, .user_tabs li.active a:focus, .user_tabs li.active a:active {}
.user_tabs + .user_form {border-top: 0 none;}

/* 로그인 폼 */
.login_form, .user_form {margin: 0 auto;padding: 32px;border: 1px solid #dbdbdb;}
.login_form:after, .user_form:after {display: block;clear: both;content: '';}

/* 사용자 폼 */
.user_form {margin-bottom: 20px;}
.user_form .user_title, .user_form .user_text, .user_form .user_process {padding-bottom: 16px; letter-spacing: 0;}
.user_form .user_text em {display: inline-block;padding-right: 5px;font-weight: 700;}
.user_form .user_result {padding-bottom: 22px;text-align: center;font-weight: 700;line-height: 1.3}
.user_form .user_result em {display: block;font-size: 28px;}

.user_form .user_process:after {display: block;clear: both;content: '';}
.user_form .user_process li {float: left;margin-right: 5px;}
.user_form .user_process span, .user_form .user_process em {float: left;height: 30px;line-height: 28px;}
.user_form .user_process span {display: block;width: 35px;border-radius: 10px;background: #a2a2a2;text-align: center;color: #fff;}
.user_form .user_process .active span {background: #0086cd;}
.user_form .user_process em {display: none;padding: 0 10px;}
.user_form .user_process .active em {display: block;}

.login_form .basic_login {width: 100%;box-sizing: border-box;}
.login_form .member_login {float: left;width: 55%;padding-right: 5%;border-right: 1px solid #d7d7d7;box-sizing: border-box;}
.login_form .social_login {float: right;width: 40%;box-sizing: border-box;}
.login_form .login_title {padding-bottom: 16px;}
.basic_login:after, .member_login:after, .social_login:after {display: block;clear: both;content: '';}

.login_form .desc_input, .login_form .desc_button,
.user_form .desc_input {position: relative;margin-bottom: 8px;}

.login_form .desc_input input, .login_form .desc_input select, .user_form .desc_input input, .user_form .desc_input select, .login_form .desc_button input, .login_form .desc_button button, .login_form .desc_button a, .user_form .desc_button input, .user_form .desc_button button, .user_form .desc_button a {height: 48px;padding: 0 12px;font-size: 16px;overflow: hidden;}
.login_form .desc_input input, .login_form .desc_input select, .user_form .desc_input input, .user_form .desc_input select {border: 1px solid #cfcfcf;background-color: #fcfcfc;color: #555453;}
.user_form .desc_input select, .login_form .desc_input select {padding: 6px 9px;}
.login_form .desc_input input::placeholder, .user_form .desc_input input::placeholder {color: #555453;}
.login_form .desc_button input, .login_form .desc_button button, .login_form .desc_button a, .user_form .desc_button input, .user_form .desc_button button, .user_form .desc_button a {color: #fff;}

.login_form .desc_check, .login_form .desc_link,
.user_form .desc_check, .user_form .desc_link {color: #181818}
.login_form .desc_check,
.user_form .desc_check {float: left;padding-top: 8px;}
.login_form .desc_link,
.user_form .desc_link {float: right;padding-top: 10px;}

.user_form .desc_button + .user_text {padding-top: 16px;}

.basic_login .desc_button input, .basic_login .desc_button button {background: #0086cd;}
.social_login .desc_button.naver {background: #00c63c url(../images/sub/social_login_arrow1.png) 100% 50% no-repeat;background-size: auto 36px}
.social_login .desc_button.kakao {background: #fff346 url(../images/sub/social_login_arrow2.png) 100% 50% no-repeat;background-size: auto 36px}
.social_login .desc_button.facebook {background: #395d98 url(../images/sub/social_login_arrow1.png) 100% 50% no-repeat;background-size: auto 36px}

.social_login .desc_button button {background-color: transparent;background-position: 0 50%;background-repeat: no-repeat;background-size: auto 36px;text-indent: -9999px}
.social_login .desc_button.naver button {background-image: url(../images/sub/social_login_naver.png)}
.social_login .desc_button.kakao button {background-image: url(../images/sub/social_login_kakao.png)}
.social_login .desc_button.facebook button {background-image: url(../images/sub/social_login_facebook.png)}

.user_form ul.desc_button:after {display: block;clear: both;content: '';}
.user_form ul.desc_button li {float: left;width: 50%;box-sizing: border-box;}
.user_form ul.desc_button li:first-child, .user_form ul.desc_button li.n1 {padding-right: 4px;}
.user_form ul.desc_button li:last-child, .user_form ul.desc_button li.n2 {padding-left: 4px}
.user_form .desc_button input, .user_form .desc_button button {background: #6b6b6b;}
.user_form ul.desc_button li:first-child input,
.user_form ul.desc_button li:first-child button,
.user_form ul.desc_button li.n1 input,
.user_form ul.desc_button li.n1 .desc_button button {background: #0086cd;}
.user_form div.desc_button {width: 75%;margin: 0 auto;}

.privacy_box { height: 205px; margin: 10px 0 0 0; border: 1px solid #d5d5d5; padding: 10px; }

@media screen and (max-width: 1023px) {
	.login_form,
	.user_form {padding: 32px}
	.login_form .desc_input input, .login_form .desc_input select, .user_form .desc_input input, .user_form .desc_input select, .login_form .desc_button input, .login_form .desc_button button, .login_form .desc_button a, .user_form .desc_button input, .user_form .desc_button button, .user_form .desc_button a {height: 38px;padding: 0 10px;font-size: 14px;}
	.user_form .desc_input select, .login_form .desc_input select {padding: 5px 7px;}
}

@media screen and (max-width: 767px) {
	.login_form,
	.user_form {padding: 22px}
	.login_form .member_login, .login_form .social_login {float: none;width: 100%;}
	.login_form .member_login {margin-bottom: 20px;padding: 0 0 20px;border-bottom: 1px solid #d7d7d7;border-right: 0 none}
	
}
@media screen and (max-width: 479px) {
	.login_form, .user_form {padding: 15px}
	
	.user_form .user_process li {margin-right: 4px;}
	.user_form .user_process span, .user_form .user_process em {height: 28px;line-height: 26px;}
	.user_form .user_process span {width: 30px;}
	.user_form .user_process em {padding: 0 5px;}
}
@media screen and (max-width: 359px) {
	.login_form, .user_form {padding: 10px;}
	.user_form .user_process li {font-size: 14px;}
}