@charset "UTF-8";

body{background:#f2f2f2}
.inner{width:96%}

.cont_box{background:#fff}
.cont_box .title{font-family:'NanumBarunGothic';font-size:2.1875rem}
.cont_box .title2{font-family:'NanumBarunGothic';font-size:20px;color:#444}
.cont_box .title3 em{font-family:'NanumBarunGothic-Bold'}
.cont_box .title3 span{color:#b6906a}
/* input_type */
.input_text input , select{color:#898989;font-size:0.8125rem}
.input_text{display:inline-block;position:relative;width:287px;height:36px;background:#fff;border:1px solid #ccc;border-radius:3px}
.input_text input{width:100%;height:100%;padding-left:10px;border:0;outline:0;background: transparent;-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
-o-box-sizing:border-box;
box-sizing:border-box}

.input_text.input_pw{background:#f9f9f9}
.btn.type_c{background:#999;border-radius:3px;height:36px;color:#fff;font-size:0.9375rem}
.join_form .btn{padding:0 12px}
.input_radio{display:inline-block;position:relative;font-size:0}
.input_radio input{position:absolute;left:0;top:0;width:17px;height:18px;opacity:0;filter: alpha(opacity=0);cursor: pointer;z-index: 1}
.input_radio label{padding-left:25px;font-size:0.9375rem;color:#666;line-height:17px;z-index:2}
.input_radio input[type="radio"] + label{background: url('../img/page/login/input_radio.png') no-repeat 0 0;vertical-align:middle;cursor:pointer}
.input_radio input[type="radio"]:checked + label{background-position:0 -18px}

/* join_step */
.join_step .step_list{padding:34px 0;font-size:0;text-align:center}
.join_step .step_list li{display:inline-block;position:relative;margin-left:130px}
.join_step .step_list li:first-child , .join_step.type_b .step_list li:first-child{margin-left:0}
.join_step .step_list li:first-child:after{display:none}
.join_step .step_list li:after{display:block;content:"";position:absolute;top:78px;left:-65px;width:15px;height:28px;background: url('../img/page/login/step_arrow.png') no-repeat 50% 50%;background-size:cover}
.join_step .step_list li .img{position:relative;width:150px;margin:0 auto}
.join_step .step_list li .img img{position:absolute;top:0;left:0;width:100%}
.join_step .step_list li .img img.step_on{display:none}
.join_step .step_list li .tit{padding-top:167px;font-size:1.0625rem;color:#666}

.join_step .step_list li.on .img img.step_on{display:block}
.join_step .step_list li.on .tit{color:#6ec9c0}

.btn_wrap{padding:60px 0;text-align:center;font-size:0}
.btn_wrap button{display:inline-block;width:130px}
.btn_wrap .btn.type_b{margin-right:20px}

/* join_step type_b */
.join_step.type_b .step_list li{margin-left:210px}
.join_step.type_b .step_list li:after{left:-115px}

.cont_box.personal_info{width:100%;margin-top:15px;margin-bottom:35px;padding:10px;box-sizing:border-box;text-align:left}
.cont_box.personal_info .title{padding-bottom:15px;font-size:1rem;color:#444}
.cont_box.personal_info .title em{font-family:'NanumBarunGothic-Bold';color:#444}
.cont_box.personal_info .title em span{color:#b6906a}
.text{font-size:10px;color:#898989;line-height:167%}
.text em{font-family:'NanumBarunGothic-Bold';color:#be9d6d}

/***** join_form  start *****/
.join_form{margin-top:30px;padding:10px 50px}
.join_form table{width:100%;table-layout:fixed;border-bottom:1px solid #d6d6d6}
.join_form table th , .join_form table td{padding:40px 0;vertical-align:top;border-top:1px solid #d6d6d6;text-align:left}
.join_form table th{padding-top:48px;color:#444;font-size:1.25rem;line-height:135%}
.join_form table th .essential{display:inline-block;width:13px;height:11px;margin-left:10px;background: url('../img/page/login/essential.png') no-repeat 50% 50%;background-size:cover}
.join_form table tr:nth-child(1) th , .join_form table tr:nth-child(1) td{border-top:0}
.join_form table td{font-size:0}
.td_name{font-size:0}
.td_name .btn{margin-left:10px}
.join_form .text{padding-top:10px;line-height:100%;color:#b6906a}

.join_form select , .join_form .btn{display:inline-block;}
.radio_area{display:inline-block}

.join_form table td.gender .input_radio{margin-top:10px}
.join_form table td.gender .input_radio:first-child{margin-right:20px}

.join_form select{display:inline-block;width:110px;height:36px;margin-right:5px;background:#fff;border:1px solid #ccc;border-radius:3px;color:#666;font-size:0.9375rem}
.join_form table td.birth .input_radio{margin-left:25px}

.join_form table td.tel .input_text , .join_form table td.email .input_text , .join_form table td.email select{width:140px}
.join_form table td.tel .hp_line{display:inline-block;width:8px;height:1px;background:#666;margin:0 6px}

.join_form table td.email span{display:inline-block;font-size:0.9375rem;color:#666;vertical-align:middle;margin:0 5px}
.join_form table td.email select{margin-left:15px}

.join_form table td.add .add_post{margin-bottom:5px}
.join_form table td.add .add_post .input_text{width:140px}
.join_form table td.add .input_text{margin-right:5px}
.join_form table td.add .input_text:last-child{margin-right:0}

.join_form table td.etc .etc_list li{position:relative;margin-top:10px;min-height:38px}
.join_form table td.etc .etc_list li:first-child{margin-top:0}
.join_form table td.etc .etc_list li .input_radio{padding-top:11px;width:144px;vertical-align:top}
.join_form table td.etc .etc_list li .input_text{display:none}

.join_form table td.etc .etc_list li.on .input_text{display:inline-block}

.join_form .txts{padding-top:40px;padding-bottom:33px;}
.join_form .txts li{position:relative;font-size:0.8125rem;line-height:176%;color:#888;padding-left:10px}
.join_form .txts li:before{display:block;content:'';position:absolute;top:8px;left:0;width:2px;height:2px;background:#888}

.join_form table td.agree .radio_area{padding-top:10px}
.join_form table td.agree .text{display:inline-block;padding-top:0;vertical-align:middle;line-height:167%}

.join_form .input_radio label{color:#888}
.join_form table td.tel .input_radio, .join_form table td.email .input_radio , .join_form table td.agree .input_radio{margin-left:0;margin-right:25px}

.btn{display:block;height:37px;border-radius:30px;text-align:center;font-size:12px;line-height:37px;color:#fff}
.btn.type_b{background:#aaa}
.btn.type_a{background:#ceaa74}

@media screen and (max-width: 1259px){
	.join_form table td.tel .input_radio, .join_form table td.email .input_radio , .join_form table td.agree .input_radio{margin-left:0;margin-right:25px}
}

@media screen and (max-width: 960px){
	.join_form{padding:10px 20px}
	.join_form table th{font-size:1.125rem}
	.join_form table td{padding-left:20px}

	.input_text{width:241px}
}

@media screen and (max-width: 758px) {
	.join_form table th{font-size:1rem}
	.td_name .input_text{width: calc(100% - 95px )}
	.input_text{width:100%}

	.join_form table td.birth select{width: calc((100% - 15px) / 3)}
	.join_form table td.tel .input_text{width: calc((100% - 50px) / 3)}
	.join_form table td.email .input_text , .join_form table td.email select{width: calc((100% - 50px) / 3)}

	.join_form table td.add .input_text:nth-child(3){margin-top:5px}

	.join_form table td.etc .etc_list li.on .input_text{display:block;margin-top:5px}

	.join_form table td.agree .radio_area{padding-top:0}
	.join_form table td.agree .text , .join_form .text{display:block;padding-top:10px}
	.join_form table td.birth .radio_area{display:block;padding-top:20px}
	.join_form table td.birth .input_radio{margin-left:0;margin-right:25px}

}

@media screen and (max-width: 640px) {
	.join_form table th, .join_form table td{padding:20px 0}
	.join_form table td{padding-left:5px}
	.join_form table th{font-size:0.875rem}
	.join_form table th br{display:block}
	.join_form table th .essential{margin-left:5px;width:10px;height:8px}
	.join_form table td.email .input_text{width: calc((100% - 30px) / 2);}
	.join_form table td.email select{margin-top:5px;margin-left:0;margin-right:0;width:100%}

	.join_form table td.tel .input_text{width: calc((100% - 24px) / 3);}
	.join_form table td.tel .hp_line{width:4px;margin:0 2px}

	.join_form table td.add .add_post .input_text{width: calc(100% - 97px);}
	.join_form table td.add .add_post .btn.type_c{width:90px}

	.txt_br{display:block}
	.join_form table td.birth .input_radio, .join_form table td.tel .input_radio, .join_form table td.email .input_radio{margin-right:10px}
	.join_form table th{padding-top:30px}

}

@media screen and (max-width:480px) {
.join_form table th .essential{margin-left:2px}
.join_form table td.birth .input_radio, .join_form table td.tel .input_radio, .join_form table td.email .input_radio, .join_form table td.agree .input_radio{margin-right:10px}
.join_form table td.agree .btn{padding: 0 9px}

}

/***** join_form  end *****/

/* pw_form 비밀번호 찾기 , 마이페이지 비밀번호 확인 */
.change_pw_form{width:373px;margin:0 auto;font-size:0}
.change_pw_form form{overflow:hidden;padding-top:60px;}
.change_pw_form form:after{display:block;content:'';clear:both}
.change_pw_form .input_text{display:block;float:left;}
.change_btn{float:right;width:76px;height:36px;background:#f36731;border-radius:2px;font-size:0.9375rem;color:#fff}
.change_pw_form .title br , .change_pw_form .text br{display:none}
.change_pw_form .text{padding-top:5px;text-align:left}


@media screen and (max-width: 1259px){
	.join_step .step_list li{margin-left:78px}
	.join_step .step_list li:after , .join_step.type_b .step_list li:after{left:-44px}

	.join_step.type_b .step_list li{margin-left:150px}
	.join_step.type_b .step_list li:after{left:-75px}

}


@media screen and (max-width: 980px){
	.cont_box .title{font-size:1.875rem}

}

@media screen and (max-width: 920px){
	.join_step .step_list li .img{width:104px}
	.join_step .step_list li .tit{padding-top:120px;font-size:0.9375rem}
	.join_step .step_list li:after{top:45px;width:12px;height:19px;left:-39px}


}

@media screen and (max-width: 758px) {
	.cont_box .title{font-size:1.25rem}
	.join_step .step_list li{margin-left:50px}
	.join_step .step_list li .img{width: 100px}
	.join_step .step_list li:after{top:47px;left:-30px}

	.join_step.type_b .step_list li{margin-left:70px}
	.join_step.type_b .step_list li:after{left:-40px}

	.change_pw_form{width:100%;padding:10px 20px;-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	-o-box-sizing:border-box;
	box-sizing:border-box
	}
	.change_pw_form .input_text{width: calc(100% - 86px)}
    .stitle{font-size: 0.9375rem}
}

@media screen and (max-width: 640px) {
	.join_step .step_list li{margin-left:40px}
	.join_step .step_list li .img{width:80px}
	.join_step .step_list li:after{width:6px;height:9px;top:40px;left:-20px}
	.join_step .step_list li .tit{padding-top:90px;font-size:0.75rem}

	.btn_wrap{padding:30px 0}

	.change_pw_form form{padding-top:30px}
	.change_pw_form .title br , .change_pw_form .text br{display:block}
}

@media screen and (max-width: 639px) {
}

@media screen and (max-width:480px) {
	.join_step .step_list li{margin-left:20px}
	.join_step .step_list li .img{width:60px}
	.join_step .step_list li .tit{padding-top:70px;font-size:10px}
	.join_step .step_list li:after{top:28px;left:-14px}

	.join_step.type_b .step_list li{margin-left:30px}
	.join_step.type_b .step_list li:after{left:-18px}
	.join_step.type_b .step_list li .img{width:70px}
	.join_step.type_b .step_list li .tit{padding-top:80px}
}