.hidden_body {height:100%; min-height:100%; overflow:hidden !important; touch-action:none;}

#member_layer { position:fixed; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0.7); letter-spacing:-0.8px; word-break:keep-all; z-index:99999;}
#member_layer .layer_content { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:530px; max-height:90%; overflow-y:auto; padding:60px 50px; background-color:#fff; box-shadow:0 0 20px rgba(0,0,0,0.7); }
#member_layer .layer_content h3 { font-size:18px; font-weight:bold; }
#member_layer .layer_content h4 { font-size:17px; color:#777; }
#member_layer .layer_content a.m_layer_close { position:absolute; right:30px; top:30px; display:block; width:24px; height:24px; background:url('../images/form/layer_close.png') center no-repeat; font-size:0; }
#member_layer .layer_content .section { position:relative; }
#member_layer .layer_content .frm_title { padding-bottom:20px; font-size:32px; font-weight:500; text-align:center; letter-spacing:-2px; }
#member_layer .layer_content .frm_title + p { font-size:17px; text-align:center; color:#555; line-height:1.4; }
#member_layer .layer_content .frm_title + p span.br { display:block; }

#member_layer .layer_content .find_tab ul { display:flex; }
#member_layer .layer_content .find_tab li { width:50%; }
#member_layer .layer_content .find_tab li a { position:relative; display:block; height:50px; line-height:50px; font-size:18px; color:#b4b4b4; text-align:center; border:1px solid #d4d4d4; border-left:0; border-bottom:1px solid #242424; transition:ease-out 0.2s; }
#member_layer .layer_content .find_tab li a:hover { color:#242424; transition:ease-out 0.2s; }
#member_layer .layer_content .find_tab li.on a { border-color:#242424; color:#242424; border-bottom-color:#fff; }
#member_layer .layer_content .find_tab li.on a:after { position:absolute; left:-1px; top:-1px; display:block; width:1px; height:calc(100% + 2px); background-color:#242424; content:''; }
#member_layer .layer_content .find_tab li:first-child a { border-left:1px solid #d4d4d4; }

#member_layer .layer_content .join_step { padding:24px 0; border-top:3px solid #242424; border-bottom:1px solid #e4e4e4; }
#member_layer .layer_content .join_step ul { display:flex; align-items:center; }
#member_layer .layer_content .join_step li { position:relative; width:calc(100% / 3); text-align:center; }
#member_layer .layer_content .join_step li span { display:block; width:26px; height:27px; margin:0 auto; }
#member_layer .layer_content .join_step li span.icon1 { background:url('../images/form/join_step.png') no-repeat; background-position:-4px -4px; }
#member_layer .layer_content .join_step li span.icon2 { background:url('../images/form/join_step.png') no-repeat; background-position:-4px -41px; }
#member_layer .layer_content .join_step li span.icon3 { background:url('../images/form/join_step.png') no-repeat; background-position:-4px -75px; }
#member_layer .layer_content .join_step li p { padding-top:8px; font-size:16px; color:#949494; }
#member_layer .layer_content .join_step li.on span { background-position-x:-32px; }
#member_layer .layer_content .join_step li.on p { color:#d60b52; }
#member_layer .layer_content .join_step li:after { position:absolute; left:-4px; top:0; display:block; width:8px; height:100%; background:url('../images/form/join_step_arrow.png') center no-repeat; content:''; }
#member_layer .layer_content .join_step li:first-child:after { display:none; }

#member_layer .layer_content .join_sns h4 { color:#242424; font-weight:500; padding-bottom:12px; }

.join_agree .all_agree { position:relative; }
.join_agree .all_agree input { display:none; }
.join_agree .all_agree input + label { display:inline-block; width:100%; cursor:pointer; padding-left:calc(27px + 8px); font-size:19px; font-weight:500; line-height:1.3; background: url('../images/form/all_agree.png') left 1px no-repeat; }
.join_agree .all_agree input:checked + label { background-image:url('../images/form/all_agree_on.png'); }
.join_agree .all_agree p { padding-left:calc(27px + 8px); padding-top:12px; font-size:16px; line-height:1.3; color:#777; }
.join_agree .all_agree:before, #member_layer .layer_content .all_agree:after { position:absolute; left:0; width:100%; height:10px; background:url('../images/form/dotted.gif') repeat-x; content:''; }
.join_agree .all_agree:before { top:0; }
.join_agree .all_agree:after { bottom:0; }
.join_agree .term_item { padding:30px 0; border-top:1px solid #e4e4e4; }
.join_agree .term_item .agree_term { width:100%; height:98px; padding:12px 16px; font-size:14px; line-height:1.2; resize:none; background-color:#f1f1f3; border:0; outline:0; }
.join_agree .term_item input { display:none; }
.join_agree .term_item input + label { display:inline-block; height:18px; cursor:pointer; padding-left:calc(18px + 8px); font-size:17px; background:url('../images/form/term_agree.jpg') no-repeat; }
.join_agree .term_item input:checked + label { background-image:url('../images/form/term_agree_on.jpg'); }

.join_frm .section { padding-top:30px; }
.join_frm .section h4 { margin-bottom:10px; color:#242424; font-weight:500; }
.join_frm .section p.txt_comment { padding-left:2px; margin-top:5px; font-size:15px; color:#777; }
.join_frm .join_agree label { margin-right:30px; font-size:17px; }
.join_frm .join_agree input { display:none; }
.join_frm .join_agree input + label { display:inline-block; height:20px; line-height:20px; padding-left:calc(20px + 4px ); cursor:pointer; font-size:17px; background:url('../images/form/auto_check.png') left 1px no-repeat; background-size:18px; }
.join_frm .join_agree input:checked + label { background-image:url('../images/form/auto_check_on.png'); }
.join_frm .join_number { font-size:0; }
.join_frm .join_number select { width:100px; -webkit-appearance:none; -moz-appearance:none; appearance:none; background:url('../images/form/select_arrow.png') 88% center #f1f1f3 no-repeat; }
.join_frm .join_number select::-ms-expand { display:none; }
.join_frm .join_number input { width:100px; text-align:center; }
.join_frm .join_number span { display:inline-block; width:6px; height:1px; margin:0 8px; background-color:#242424; }


.hidden_label label { position:absolute; left:0; top:0; width:0; height:0; font-size:0; }


/* style */
.color_point { color:#d60b52; }
.ipt_st { width:100%; height:54px; padding:0 22px; border-radius:10px; background-color:#f1f1f3; font-size:17px; color:#98989c; outline:0; border:0; color:#242424; }
.txt_comment { font-size:17px; color:#444; line-height:1.4; }
.txt_notice { font-size:21px; font-weight:500; line-height:1.4; text-align:center; }
.txt_notice span.icon { display:block; line-height:1; padding-bottom:10px; }


/* 자동로그인 & 아이디비밀번호 찾기 */
.login_frm .log_check { position:relative; height:24px; line-height:24px; margin-top:20px; }
.login_frm .log_check a.login_find { position:absolute; right:0; top:0;  font-size:17px; font-weight:500; text-decoration:underline; }
.login_frm .check_auto { display:none; }
.login_frm .check_auto + label { display:inline-block; cursor:pointer; padding-left:calc(24px + 6px); background: url('../images/form/auto_check.png') left center no-repeat; font-size:17px; }
.login_frm .check_auto:checked + label { background-image:url('../images/form/auto_check_on.png'); }


/* button */
.roundbtn { position:relative; display:block; width:100%; height:54px; line-height:54px; border:0; outline:0; border-radius:10px; font-size:18px; font-weight:500; color:#fff; background-color:#242424; letter-spacing:-1px; }
.roundbtn.sns { display:inline-block; width:calc(50% - 5px); padding-left:calc(50px + 20px); vertical-align:top; text-align:left; }
.roundbtn.sns span.icon { position:absolute; left:0; top:0; display:inline-block; width:50px; height:100%; vertical-align:top; }
.roundbtn.naver { margin-right:10px; background-color:#49be34; }
.roundbtn.naver span.icon { background:url('../images/form/btn_naver.png') center no-repeat; background-size:18px; border-right:1px solid #3fa42d; }
.roundbtn.kakao { background-color:#fce739; color:#452323; }
.roundbtn.kakao span.icon { background:url('../images/form/btn_kakao.png') center no-repeat; background-size:24px; border-right:1px solid #e0cd33; }
.roundbtn.white { line-height:52px; background-color:#fff; border:2px solid #242424; color:#242424; }
.roundbtn.grey { background-color:#949494; }

.brdt0 { border-top:0 !important; }
#member_layer img { vertical-align:top; }
#member_layer strong, span { word-break:keep-all; }
#member_layer input:-webkit-autofill { -webkit-box-shadow: 0 0 0 30px rgba(255,255,255,0) inset ; -webkit-text-fill-color: #242424; }
#member_layer input:-webkit-autofill, 
#member_layer input:-webkit-autofill:hover, 
#member_layer input:-webkit-autofill:focus, 
#member_layer input:-webkit-autofill:active { transition: background-color 5000s ease-in-out 0s; }

#pops_layer { position:fixed; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0.7); letter-spacing:-0.8px; word-break:keep-all; z-index:99999;}
#pops_layer .layer_content { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:800px; max-height:90%; overflow-y:auto; padding:60px 50px; background-color:#fff; box-shadow:0 0 20px rgba(0,0,0,0.7); }
#pops_layer .layer_content h2 { font-size:18px; font-weight:bold;margin-bottom:20px; }
#pops_layer .layer_content a.m_layer_close { position:absolute; right:30px; top:30px; display:block; width:24px; height:24px; background:url('../images/form/layer_close.png') center no-repeat; font-size:0; }


@media all and (max-width:640px) {
	#member_layer .layer_content { width:90%; padding-left:44px; padding-right:44px; }
	.ipt_st { height:48px; border-radius:6px; }
	.roundbtn { height:48px; line-height:48px; border-radius:6px; font-size:17px; }
	.roundbtn.white { line-height:44px; }
	#member_layer .layer_content .find_tab li a { height:44px; line-height:42px; font-size:17px; }

	#pops_layer .layer_content { width:90%; padding-left:44px; padding-right:44px; }
}
@media all and (max-width:480px) {
	#member_layer .layer_content { width:94%; padding:50px 32px; }
	#member_layer .layer_content a.m_layer_close { right:16px; top:20px; background-size:20px; }
	.roundbtn.sns { width:100%; padding-left:0; text-align:center; }
	.roundbtn.sns span.icon { position:static; width:28px; border-right:0; }
	.roundbtn.naver { margin:0; margin-bottom:10px; }
	.roundbtn.naver span.icon { background-size:14px; }
	.roundbtn.kakao span.icon { background-size:18px; }
	.ipt_st { padding:0 16px; }
	.txt_notice span.icon img { width:28px; }
	.join_agree .all_agree p { padding-left:calc(24px + 4px); padding-top:8px; }
	.join_agree .all_agree input + label { padding-left:calc(25px + 4px); background-size:25px; }
	.join_agree .term_item .agree_term { height:96px; padding:10px 12px; }
	.join_frm .join_number select { width:75px; background-size:9px; }
	.join_frm .join_number input { width:75px; }
	.join_frm .join_number span { width:5px; margin:0 4px; }
	.join_frm .join_agree input + label { display:block; margin-top:14px; margin-right:0; }
	.login_frm .log_check { height:20px; line-height:20px; }
	.login_frm .check_auto + label { padding-left:calc(18px + 6px); background-size:20px; }

	/* font */
	#member_layer .layer_content .frm_title { font-size:26px; }
	.txt_notice { font-size:18px; line-height:1.3; }
	.join_agree .all_agree input + label { font-size:17px; }
	.roundbtn, .txt_comment, .join_frm .join_agree input + label, #member_layer .layer_content h4, #member_layer .layer_content .find_tab li a, #member_layer .layer_content h3, .join_agree .term_item input + label { font-size:16px; }
	#member_layer .layer_content .frm_title + p, .ipt_st, .login_frm .check_auto + label, .login_frm .log_check a.login_find, #member_layer .layer_content .join_step li p, .join_agree .all_agree p { font-size:15px; }

	#pops_layer .layer_content { width:94%; padding:50px 32px; }
	#pops_layer .layer_content a.m_layer_close { right:16px; top:20px; background-size:20px; }
	#pops_layer .layer_content h2 { font-size:14px; }
}
@media all and (max-width:380px) {
	#member_layer .layer_content { padding-left:24px; padding-right:24px; }
	#pops_layer .layer_content { padding-left:24px; padding-right:24px; }
}