@charset "utf-8";

#addr_modal_layer{}
#addr_modal_layer .modal{padding: unset; max-height: calc(100vh - 64px); overflow: hidden; border-radius: 10px;}
#addr_modal_layer .close_btn{float: right; padding: 10px; font-size: 22px}
#addr_modal_layer .close_btn::before{content: '\f00d'; font-family: "FontAwesome";}
#addr_modal_layer .close_btn ~ *:nth-of-type(1){clear: both}

.member_wrap{background-color: var(--gray); padding: 50px 0;}
.member_wrap input[type="text"],
.member_wrap input[type="password"],
.member_wrap input[type="tel"],
.member_wrap input[type="email"],
.member_wrap input[type="date"]{display: block; width: 100%; border: 1px solid #eee; padding: 0.5rem; background-color: #fbfbfb; line-height: 20px; border-radius: 0.4rem;}
.login{display: flex; align-items: center;}
.login > div{flex: 1; padding: 0 50px;}
.login > div + div{border-left: 1px solid #eee;}
.white_box .btn_b02{background-color: #fbfbfb;}
.re_icon {width: 20%; max-width: 80px; margin: 20px auto;}
.re_icon img{display: block; width: 100%; animation: heartbeat 0.5s infinite alternate;}
.re_icon_copy{font-size: 1px; color: #fff;}

/* ==================== 로그인 ==================== */
.login_tit_box{display: flex; margin-bottom: 1rem; align-items: center; justify-content: space-between;}
.login .login_tit_box .tit{margin-bottom: 0;}
.login h2.tit{margin-bottom: 1rem;}
.login_left h2.tit{font-size: 2rem;}
#login_form p{margin-bottom: 5px;}
#login_form input{padding: 0.75rem;}
#login_form button{display: block; width: 100%; background-color: var(--color-basic); color: #fff; padding: 0.75rem; text-align: center; border: 1px solid var(--color-basic); line-height: 20px; border-radius: 0.4rem; font-size: 0.95rem; font-weight: 600;}
#login_form button:hover{cursor: pointer;}
#login_form .ul_group {margin-top: 1rem;}
#login_form .ul_group li{width: 50%; text-align: center; font-size: 0.9rem;}
#login_form .ul_group li a{display: block; padding: 0.25rem 0; color: #666;}
#login_form .ul_group li + li::before{float: left; content:"｜"; display: block; clear: both; color: #ddd; line-height: 1.5;}

.login_right > p{line-height: 1.25;}
.login_right .ul_icon {margin: 1.5rem auto;}
.login_right .ul_icon .img{width: 3rem; height: 3rem; margin: 0 auto;}
.login_right .ul_icon .img .svg{width: 100%; height: 100%;}
.login_right .ul_icon .text{margin-top: 0.5rem; font-size: 0.8rem; line-height: 1.25;}
.login_right .ul_icon .text b{display: block; font-size: 1rem; font-weight: 600; margin-bottom: 0.25rem;}

.call_wrap{padding: 1.5rem; border-radius: 12px; background-color: var(--gray); text-align: center;}
.call_wrap .ul_group li{width: 50%; font-size: 0.85rem;}
.call_wrap .ul_group li strong{display: block; font-weight: 800; font-size: 1.4rem; letter-spacing: -0.04em; margin-top: 0.25rem;}
.call_wrap > p{margin-top: 0.5rem; font-size: 0.95rem; padding-top: 0.5rem; border-top: 2px dashed #fff;}
.call_wrap > p .svg{width: 1.4rem; height: 1.4rem; margin-right: 0.25rem; vertical-align: sub;}
.call_wrap > p .svg path{stroke-width: 2;}


/* ==================== 회원가입 ==================== */
/* ***** 01 약관동의 ***** */
.register_wrap section + section{margin-top: 20px;}
.register_wrap section > h2{text-align: center; line-height: 1.2;}
.register_wrap section > p{text-align: center; line-height: 1.3; margin: 2rem auto; word-break: keep-all;}


/* 필수 동의 */
.register_wrap form{}
.register_wrap form textarea{display: block; width: 100%; border: 1px solid #eee; background-color: #fbfbfb; padding: 1rem; line-height: 1.25; resize: none; border-radius: 12px; font-size: 0.9rem;}
.register_wrap .re_tit{display: block; margin-top: 50px; margin-bottom: 1rem; font-size: 1.2rem; font-weight: 600;}
.register_wrap .re_tit small{font-size: 0.85rem; margin-left: 0.25rem; color: var(--color-basic); vertical-align: top;}
.checkbox{margin-top: 1rem; text-align: right; font-weight: 500; padding: 0 0.5rem;}
.all_check{margin: 50px 0; font-size: 1.1rem; font-weight: 500; padding: 15px 0; border: 1px solid #eee; border-style: solid none; line-height: 1.2;}

/* ***** 02 본인인증 ***** */
#register_2 .btn_box{margin-top: 2rem;}


/* ***** 03 정보입력 ***** */
#registerForm fieldset{margin-bottom: 50px;}
#registerForm fieldset legend{display: block; width: 100%; font-size: 1.2rem; font-weight: 600; margin-bottom: 1rem;}
#registerForm .com_list{border-bottom: 1px solid #eee; border-top: 2px solid #1a1a1a; padding: 0.5rem;}
#registerForm .com_list > li + li{margin-top: 25px}
#registerForm .com_list .c_tit{width: 20%;}
#registerForm .com_list .c_con{width: 80%;}
#registerForm .com_list .c_con .info_msg{display: inline-block; font-size: 0.8rem; color: #999; margin-top: 5px}
#registerForm .com_list .c_con .info_msg.no{color: red}
#registerForm .com_list .c_con .info_msg.yes{color: green}
#registerForm .com_list .c_con .filebox{display: flex; align-items: center}

.address li + li{margin-top: 0.5rem;}
.row_2{display: flex; gap: 0.5rem; align-items: center;}
.row_2 > button{white-space: nowrap; line-height: 20px; padding-left: 1rem; padding-right: 1rem;background-color: #1a1a1a;}

label[for="c_file"] > .btn{width: fit-content; display: inline-block; padding-left: 1rem; padding-right: 1rem;}
.c_file{position: absolute; width: 0; height: 0; padding: 0; overflow: hidden; border: 0;}
.c_file_name{font-size: 0.8rem; margin-left: 0.25rem;}


/* ***** 회원정보 찾기 ***** */
#find_info .com_list{max-width: 720px; border-bottom: 1px solid #eee; border-top: 2px solid #1a1a1a; padding: 0.5rem; margin: 2rem auto;}
#find_info .com_list > li + li{margin-top: 25px}
#find_info .com_list .c_tit{width: 20%;}
#find_info .com_list .c_con{width: 80%;}


/* 이메일 */
#result_email{max-width: 720px; margin: 2rem auto; border-top: 2px solid #1a1a1a; padding: 0 0.5rem;}
#result_email .row{display: flex; gap: 10px; padding: 1em 0; border-bottom: 1px solid #eee;}
#result_email .row dt{font-weight: 600; width: 20%;}
#result_email .row dd{flex: 1;}

.alert_msg {display: block; margin-top: 0.5rem; font-size: 0.85rem; color: var(--color-basic);}

@media screen and (max-width: 1280px){
	.member_wrap{padding: 0;}
	.member_wrap > .white_box{padding: 30px 16px 50px 16px; border-radius: 0;}
	.login {flex-direction: column; align-items: normal; gap: 30px;}
	.login_tit_box{display: block; text-align: center;}
	.login_tit_box .login_if_auto{margin: 5px 0; text-align: right; font-size: 0.9em;}
	.login > div{padding: 0;}
	.login > div + div{border-left: none; border-top: 1px solid #eee; padding-top: 30px;}
}
@media screen and (max-width: 768px){
	.login_right .ul_icon{display: block; padding: 15px; background-color: var(--gray); border-radius: 12px;}
	.login_right .ul_icon > li{display: flex; align-items: center; gap: 10px;}
	.login_right .ul_icon li + li{margin-top: 10px; padding-top: 10px; border-top: 1px dashed #fff; border-lefT: none;}
	.login_right .ul_icon .img{width: 30%;} 
	.login_right .ul_icon .text{flex: 1;} 
	.call_wrap{padding: 0; background-color: transparent; border-radius: 0; padding-top: 15px; border-top: 2px solid var(--color-basic);}
	.checkbox{font-size: 0.9rem; text-align: left;}
	.all_check{margin: 30px 0; font-size: 1rem;}

	#registerForm .com_list{padding: 0;}
	.com_list > li{align-items: normal; flex-direction: column; gap: 10px; padding-top: 15px;}
	.new_win_box .com_list .c_con,
	#registerForm .com_list .c_tit, #registerForm .com_list .c_con{width: initial;}
	#registerForm .com_list > li + li{margin-top: 0;}
	
	.new_win_wrap .new_win_box{padding-left: 16px; padding-right: 16px;}
}