/*======================================
				Login
========================================*/
	
.login_area {width:100%; height:100vh; position:relative; background:url(../images/login/login_bg.png) no-repeat center center; background-position:center bottom 70px;}
.login_area .login_title {text-align:left; color:#4f4e56; padding-top:80px; padding-left:70px;}
.login_area .login_title .top_title {margin-bottom:50px;}
.login_area .login_title h1 {font-size:36px; font-weight:600;}
.login_area .login_title p {font-size:22px;  font-weight:500;}
.login_area .login_title .txt_link {font-size:15px;}
.login_area .login_title .txt_link a {text-decoration:underline; color:#1fa0dc; text-underline-position:under;}
.login_area .login_title .txt_lock {color:#fd3237; font-size:15px;}
.login_area .login_inner {border:1px solid #8f8f8f; background:#fff; border-radius:36px; width:350px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
	padding:45px 47px; margin-top:30px;}
.login_area .login_title .btn_request {color:#fff; background:#fd3237; font-weight:600; font-size:15px; border-radius:6px; transition:0.2s; padding:0 15px; text-align:center; height:34px; line-height:33px;
	border:1px solid #fd3237;}
.login_area .login_title .btn_request:hover {color:#fd3237; border-color:#fd3237; background:#fff;}
.login_area .login_title .btn_request i {margin-left:5px;}
.login_area .login_inner .login_logo {text-align:center; margin:auto; display:block;}
.login_area .login_inner .login_logo h2 {text-indent:-9999px; font-size:0; background:url(../images/login/logo_login2.png) no-repeat center center; width:200px; height:92px; display:inline-block; background-size:100% auto;}
.login_area .login_inner .login_logo h3 {font-size:45px;  font-weight:700; margin:25px 0 0; color:#666;}
.login_area .login_inner .login_list {margin:0; padding:0; margin-top:30px;}
.login_area .login_inner .login_list li {list-style:none;}
.login_area .login_inner .login_function {margin-top:10px; display:flex; justify-content:space-between;}
.login_area .login_inner .login_function .m_check > input[type=checkbox] + label, .login_area .login_inner .login_function .find_joininfo {font-size:14px;}
.login_area .login_inner .login_list li .form_control {width:100%; height:35px; border-radius:6px; border:1px solid #bbb; padding:0 10px;}
.login_area .login_inner .login_list li label {font-size:0; visibility:hidden;}
.login_area .login_inner .login_list li input {border:1px solid #8f8f8f; background:#fff; border-radius:0; height:35px; width:100%; transition:0.2s; padding:0 10px;}
.login_area .login_inner .login_list li input:focus {border:1px solid #26a1ff; background:#fff; outline:none;}
.login_area .login_inner .login_list li input::placeholder {font-size:18px; color:#000;}

.login_area .login_inner .btn_area {text-align:center; margin-top:40px;}
.login_area .login_inner .btn_area .login_btn {background:#4da1f8; color:#fff; font-size:18px; border-radius:6px; border:0; height:45px; line-height:44px; width:100%; transition:0.2s; 
	font-weight:500;}
.login_area .login_inner .btn_area .login_btn:hover {background:#214ca4;}

.login_area .join_sub_txt {position:absolute; bottom:40px; left:70px; margin:0; font-size:15px;}
.login_area .join_sub_txt span {margin-left:15px;}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	-webkit-text-fill-color:#000;
    -webkit-box-shadow:0 0 0px 1000px #fff inset;
    box-shadow:0 0 0px 1000px #fff inset;
    transition:background-color 5000s ease-in-out 0s;
}

input:autofill,
input:autofill:hover,
input:autofill:focus,
input:autofill:active {
	-webkit-text-fill-color:#000;
    -webkit-box-shadow:0 0 0px 1000px #fff inset;
    box-shadow:0 0 0px 1000px #fff inset;
    transition:background-color 5000s ease-in-out 0s;
}


/* 로그아웃 */
.login_area.logout_area .login_inner {border:0; background:none; margin-top:-100px; width:auto;}
.login_area.logout_area .login_inner .logout_comment {font-size:18px;}


/* response - mobile */
@media all and (max-width:480px){
}

.login_area h1 {display:block; position:fixed; left:70px; top:30px; z-index:10;}
.login_area h1.login_logo a {background:url(../images/login/logo_login2.png) no-repeat center center; text-indent:-9999px; font-size:0;
	 width:200px; height:92px; display:inline-block; background-size:100% auto;}

/* 비밀번호 사용자 확인 */
.form_member {display:block; width:480px; padding:55px 60px 45px; border-radius:36px; z-index:1; cursor:auto; box-sizing:border-box; background:#fff; margin:0 auto; 
	border:1px solid #8f8f8f; position:absolute; left:50%; top:calc(50% - 40px); transform:translate(-50%,-50%);}
.form_member h2 {padding:0 0 20px; margin:0; font-size:26px; color:#333333; font-weight:700; letter-spacing:-1px; line-height:36px; text-align:left;}
.form_member .member_form {display:flex; flex-direction:column; padding:0; margin:0;}
.form_member .member_form > li {padding:5px 0; margin:0; list-style:none; position:relative;}
.form_member .member_form label {padding:0 5px; position:absolute; top:15px; left:15px; color:#1fa0dc; font-size:14px; font-weight:100; border-radius:5px; background-color:transparent; opacity:0; transition:all ease 0.2s;}
.form_member .member_form input {width:100%; height:35px; padding:0 10px 0 10px; position:relative; border:1px solid #bbb; font-size:14px; border-radius:6px;
	background-color:#fff !important; outline:0; transition:0.2s; box-sizing:border-box;}
.form_member .member_form input::placeholder {color:#333;}
.form_member .member_form > li:after {content:""; display:block; width:30px; height:40px; position:absolute; right:0; top:5px; font-family:"Icofont"; line-height:40px; text-align:center; font-size:18px;}

.form_member .member_form .msg_info {display:block; padding:5px 5px 0 5px; color:#7b7e85; font-size:14px; font-weight:300;}
.form_member .member_form .msg_error {display:none; padding:5px 5px 0 5px; color:#ff2b2b; font-size:14px; font-weight:300;}
.form_member .member_form > li .msg_password {font-size:14px; padding:5px 5px 0 5px; line-height:1.2em; font-weight:400;}

/* 인풋 스타일 */
.form_member .member_form input::placeholder {color:#c1c1c1;}
.form_member .member_form input + button,
.form_member .member_form input + label + button,
.form_member .member_form input + label + i,
.form_member .member_form input + label + span.icon_check {display:inline-block; padding:0 10px; line-height:40px; position:absolute; top:5px; right:0; border:0; font-size:12px; background-color:inherit;}
.form_member .member_form input + label + i {padding:0 6px; color:#999; display:none;}

.form_member .member_form input + button:hover,
.form_member .member_form input + label + button:hover {text-decoration:underline;}

.form_member .member_form input + label + i {display:none; font-size:18px;}
.form_member .member_form input:focus + label + i {display:inline-block;}

.form_member .member_form input:focus {border-color:#1dbae1;}
.form_member .member_form input:focus + label {top:0; left:10px; font-size:10px; color:#1fa0dc; background-color:#fff; opacity:1;}
.form_member .member_form input.input_error {border-color:#ff2b2b;}
/* input placeholder focus 크로스브라우징 */
.form_member .member_form input:focus::placeholder{color:transparent;}
.form_member .member_form input:focus::-ms-input-placeholder{color:transparent;}

.form_member .member_form .msg_info {display:block; padding:5px 5px 0 5px; color:#7b7e85; font-size:14px; font-weight:300;}
.form_member .member_form .msg_error {display:none; padding:5px 5px 0 5px; color:#ff2b2b; font-size:14px; font-weight:300;}
.form_member .member_form input.input_error + label + .msg_error,
.form_member .member_form input.input_error + label + i,
.form_member .member_form input.input_error + label + i + .msg_error,
.form_member .member_form input.input_error + label + span.icon_check,
.form_member .member_form input.input_error + label + span.icon_check + .msg_error,
.form_member .member_form input.input_error + label + button + .msg_error,
.form_member .member_form input.input_error + label + button + .msg_error,
.form_member .member_form input.input_error + label + button + .time + .msg_error,
.form_member .member_form input.input_error + label + span.time_count,
.form_member .member_form input.input_error + label + span.time_count + button.reset_resend,
.form_member .member_form input.input_error + label + span.time_count + button.reset_resend + .msg_error,
.form_member .member_form input.input_sended + label + span.time_count,
.form_member .member_form input.input_sended + label + span.time_count + button.reset_resend,
.form_member .member_form input.input_sended + label + span.time_count + button.reset_resend + .msg_total_time,
.form_member .member_form input.input_sended + label + span.time_count + button.reset_resend + .msg_error + .msg_total_time
{display:block;}
.form_member .member_form input.input_error + label + i {color:#ff2b2b; display:block;}

.form_member .member_form > li.login_password input,
.form_member .member_form > li.join_id input {padding-right:30px;}

.form_member .member_form .btn_checking:before {display:none;}
.form_member .member_form input.input_ok + .btn_checking,
.form_member .member_form input.input_ok + label + .btn_checking {padding:0; font-size:0;}
.form_member .member_form input.input_ok + .btn_checking:before,
.form_member .member_form input.input_ok + label + .btn_checking:before {display:inline-block; content:'\eed8'; padding:0 10px; position:absolute; top:0; right:0; color:#1fa0dc; font-size:20px; font-family:'IcoFont';}

.form_member .member_form .time {display:inline-block; padding:0 10px; line-height:40px; position:absolute; top:10px; right:65px; font-size:12px;}
.form_member .member_form input.input_error + .btn_resent + .time {color:#ff2b2b;}

.form_member p.id_info {font-size:15px; color:#007eff; margin:15px 0 5px;}
.form_member p.id_info i {margin-right:6px;}

.form_member .login_fnc {padding:0; margin:0; overflow:hidden;}
.form_member .login_fnc > li {padding:10px 0; margin:0; list-style:none; position:relative;}
.form_member .login_fnc > li.maintain_login {float:left;}
.form_member .login_fnc > li.forget_password {float:right;}
.form_member .login_fnc .forgot_pwd {color:#000; cursor:pointer; transition:0.2s; text-decoration:underline;}
.form_member .login_fnc .forgot_pwd:hover {color:#1fa0dc;}

.form_member .btn_login_area {padding:20px 0; text-align:center;}
.form_member .btn_login_area .login_btn,
.form_member .btn_login_area .join_btn,
.form_member .btn_login_area .password_btn {display:block; width:100%; max-width:360px; line-height:43px; color:#fff; font-size:18px; text-align:center; border-radius:6px; border:0; 
	background-color:#4da1f8; transition:0.2s; margin:0 auto;}
.form_member .btn_login_area .password_btn {width:165px; display:inline-block; margin:0;}
.form_member .btn_login_area .password_btn:hover {background-color:#214ca4;}
.form_member .btn_login_area .default_btn {display:inline-block; width:165px; line-height:43px; color:#222; font-size:18px; text-align:center; border-radius:6px; border:0; background:#fff; 
	transition:0.2s; margin:0 10px 0 0; border:1px solid #222; transition:0.2s;}
.form_member .btn_login_area .default_btn:hover {background:#fff; color:#214ca4; border-color:#214ca4;}
.form_member .btn_login_area .login_btn:hover {background-color:#214ca4;}
.form_member .btn_login_area .login_btn:disabled,
.form_member .btn_login_area .join_btn:disabled {color:#aaadb0; background-color:#edeff1;}
.form_member .member_join {padding:5px 0; color:#7b7e85; text-align:center;}
.form_member .member_join #div_memberJoin, .form_member .member_join #go_login {margin-left:2px; border-bottom:1px solid transparent; color:#28a2ff; cursor:pointer; transition:0.2s;}
.form_member .member_join #div_memberJoin:hover, .form_member .member_join #go_login:hover {border-bottom:1px solid #1fa0dc; color:#1fa0dc; text-decoration:none;}
.form_member .member_join #next_time {color:#000; text-decoration:underline;}
.form_member .member_join p {margin:0;}
.form_member .member_join p.blocking_connection {color:#f5311d;}
.form_member .member_join p.blocking_connection button.btn_blocked {width:110px; display:block; margin:5px auto 0;}
.form_member .member_join p a {border-bottom:1px solid transparent; color:#28a2ff; cursor:pointer; transition:0.2s;}
.form_member .member_join p a:hover {border-bottom:1px solid #1fa0dc; color:#1fa0dc; text-decoration:none;}
.form_member .login_lock {padding:5px 0; text-align:center; color:#ff2b2b;}
.form_member .login_lock #unblock_request {display:inline-block; position:relative; font-size:13px;}
.form_member .login_lock #unblock_request:after {display:inline-block; content:'\eaa0'; margin-left:5px; font-family:'IcoFont';}



#formUserCheck .user_check_title {}
#formUserCheck .user_check_title p {font-size:16px; color:#797979; margin:0 0 40px;}

#formUserCheck li.user_check_id input#userCheckId {padding-right:100px;}
#formUserCheck li.user_check_id .btn_certified {font-size:12px; color:#fff; background:#000; transition:0.2s; outline:none; border:none; width:70px; height:20px; text-align:center;
	line-height:20px; border-radius:10px; top:13px; right:15px;}
#formUserCheck li.user_check_id .btn_certified:hover {background:#1fa0dc; text-decoration:none;}

#formUserCheck li.user_check_num input#userCheckNum {}
li.user_check_num span.time_count {position:absolute; right:65px; top:14px; color:#000; font-size:14px; display:none;}
li.user_check_num span.time_count strong {color:#ff0000; font-weight:400; display:inline-block; margin-right:5px;}
li.user_check_num button.reset_resend {position:absolute; right:15px; top:15px; padding:0; border:none; outline:none; margin:0; background:none; display:none;
	border-bottom:1px solid #000; padding-bottom:1px; transition:0.2s; font-size:10px;}
li.user_check_num button.reset_resend:hover {color:#1fa0dc; border-bottom:1px solid #1fa0dc;}
li.user_check_num .msg_error {display:none;}
li.user_check_num .msg_total_time {display:none; color:#606060; font-size:12px; padding:5px 5px 0 5px}

#formUserCheck .reset_info_txt {text-align:center; margin-top:50px; font-size:16px;}

.login_info {background:#4f4d56; padding:10px 30px; display:inline-block; width:100%; position:fixed; left:0; bottom:0; z-index:20; text-align:center;}
.login_info p {font-size:12px; color:#fff; font-weight:300; line-height:20px; display:inline-block; margin:0 30px 0 0;}
.login_info p:last-child {margin-right:0;}
.login_info p img {margin-right:10px; vertical-align:middle; opacity:0.5; height:15px; width:auto; margin-top:-3px;}


/******* 팝업 - (로그인)본인확인 *******/
.form_step {margin-bottom:20px;}
.form_step .step_title {font-size:18px; margin-bottom:10px;}
.form_step p.sub_txt {font-weight:400; margin-top:5px;}
.form_step .form_area {}
.form_step .form_area .form_item {}
.form_step .form_area .form_item .form_label {float:none; text-align:left; display:block; margin-bottom:5px; width:auto; padding:0;}
.form_step .form_area .form_item .form_control {width:100%;}
.form_step .form_area .form_item.form_year .form_control {display:inline-block;}
.form_step .form_area .form_item.form_year .form_control:nth-of-type(1) {width:200px;}
.form_step .form_area .form_item.form_year .form_control:nth-of-type(2) {width:30px; margin-left:10px;}
.form_step .form_area .form_item.form_year span {height:34px; line-height:34px; display:inline-block; margin-left:10px;}
.form_step .form_area .form_item.form_num .form_control {width:23.4%; margin-right:2%;}