@charset "utf-8";


.22_box{width:100%; height:100px; background:#fc0;}
/* 개인정보처리방침 resume_policy*/
.policy{width:100%; max-width:1000px; margin: 0 auto;}
.policy h3{font-size:22px; color:#ad1c14; font-weight:bold; margin-bottom:4px;}
.policy p.h3_sub{padding:20px; font-size:16px; font-weight:bold; line-height:1.4em; color:#333; border:6px solid #fff3f2; box-sizing:border-box;}

.agree_box{margin-top:40px;}
.agree_box + .agree_box{padding:40px 0; border-top:1px solid #ddd; border-bottom:1px solid #ddd; margin-bottom:40px;}
.agree_box > p{font-size:18px; font-weight:bold; color:#333; margin-bottom:10px;}
.agree_box .a_box_01{padding:0 24px;}
.agree_box .a_box_01 p{font-size:15px; color:#666;}
.agree_box .a_box_01 p + p{margin-top:10px;}
.agree_box .a_box_01 p b{color:#3387a6;}


.agree_box .a_box_sub{padding:0 10px; margin:25px 0 10px; word-break: keep-all;}
.agree_box .a_box_02{padding:10px; line-height:26px; border:2px solid #ddd;}

.agree_box .a_box_02 .agree_check{float:right;}
.agree_box .a_box_02 .agree_check input{display:none;}

.agree_box .a_box_02 .agree_check label{position:relative; padding-right:32px; font-weight:bold; line-height:26px; margin-left:30px;}
.agree_box .a_box_02 .agree_check label i{position:absolute; right:0; display:inline-block; content:""; width:26px; height:26px; text-indent:-9999px; border:2px solid #ddd;
											box-sizing:border-box;}
.agree_box .a_box_02 .agree_check label i:before,
.agree_box .a_box_02 .agree_check label i:after{position:absolute; display:none; content:""; width:2px; background:#fff; border-radius:2px;}
.agree_box .a_box_02 .agree_check label i:before{top:10px; left:7px; height:10px; transform:rotate(-45deg);}
.agree_box .a_box_02 .agree_check label i:after{top:6px; left:16px; height:16px; transform:rotate(45deg);}

.agree_box .a_box_02 .agree_check input:checked + label i{background:#3387a6; border:none; box-shadow:0px 0px 5px rgba(39, 140, 177, 02);}
.agree_box .a_box_02 .agree_check input:checked + label i:before,
.agree_box .a_box_02 .agree_check input:checked + label i:after{display:inline-block;}

.info_box{width:424px; margin:0 auto;}
.info_box > div{padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid #ddd;}
.info_box > div + div{}
.info_box > div span{display:inline-block; width:120px; font-size:16px; font-weight:bold; color:#3387a6;}
.info_box > div input{width:300px; height:42px; padding:10px; border:2px solid #ddd; box-sizing:border-box;}
.info_box > div input:focus{outline:none;}
.info_box a{position:relative; display:block; width:100%; height:50px; background:#3387a6; font-size:16px; font-weight:bold; line-height:50px; color:#fff; text-align:center; margin:0 auto;
			transition:all 0.5s;}
.info_box a:before{position:absolute; bottom:0; left:0; display:inline-block; content:""; width:0; height:4px; background:#1c5a70; transition:all 0.5s;}

.info_box a:hover{opacity:1; box-shadow:0px 0px 10px rgba(0, 0, 0, 0.4);}
.info_box a:hover:before{width:100%;}

/* 이력서 작성 resume_write */
.policy_write{width:100%; max-width:1000px; margin: 0 auto;}
.top_box{align-items:end; margin-bottom:50px;}
.top_box .img_box{display:flex; justify-content:center; align-items:center; width:220px; height:220px; border:4px solid #ad1c14; box-sizing:border-box; overflow:hidden;}
.top_box .img_box img{max-height:220px; }
.top_box .img_btn{width:740px; align-self:flex-end;}
.top_box .img_btn input{display:none;}
.top_box .img_btn label{display:inline-block; width:220px; height:42px; background:#333; font-size:16px; line-height:44px; text-align:center; color:#fff;}
.top_box .img_btn span{display:inline-block; font-weight:bold; margin-left:6px;}
.top_box .img_btn label:hover{cursor:pointer;}

.p_box{display:flex; justify-content:space-between; width:100%; margin-bottom:40px;}
.p_box p.sub_title{padding-left:28px; font-size:20px; font-weight:bold; color:#ad1c14; border-bottom:1px solid #2c2c2c; margin-bottom:14px;}
.p_box p.s_name{background:url(../img/w_name_icon.png) no-repeat left top;}
.p_box p.s_contact{background:url(../img/w_contact_icon.png) no-repeat left top;}
.p_box p.s_birth{background:url(../img/w_birth_icon.png) no-repeat left top;}
.p_box p.s_gender{background:url(../img/w_gender_icon.png) no-repeat left top;}
.p_box p.s_adress{background:url(../img/w_adress_icon.png) no-repeat left top;}
.p_box p.s_workarea{background:url(../img/w_workarea_icon.png) no-repeat left top;}
.p_box p.s_career{background:url(../img/w_career_icon.png) no-repeat left top;}
.p_box p.s_education{background:url(../img/w_education_icon.png) no-repeat left top;}
.p_box p.s_company{background:url(../img/w_company_icon.png) no-repeat left top;}
.p_box p.s_license{background:url(../img/w_license_icon.png) no-repeat left top;}
.p_box p.s_language{background:url(../img/w_language_icon.png) no-repeat left top;}
.p_box p.s_oa{background:url(../img/w_oa_icon.png) no-repeat left top;}
.p_box p.s_foreign{background:url(../img/w_foreign_icon.png) no-repeat left top;}
.p_box p.s_army{background:url(../img/w_army_icon.png) no-repeat left top;}
.p_box p.s_introduce{background:url(../img/w_introduce_icon.png) no-repeat left top;}
.p_box p.s_grade{background:url(../img/w_grade_icon.png) no-repeat left top;}
.p_box p.s_character{background:url(../img/w_character_icon.png) no-repeat left top;}
.p_box p.s_hope{background:url(../img/w_hope_icon.png) no-repeat left top;}
.p_box p.s_skill{background:url(../img/w_skill_icon.png) no-repeat left top;}
.p_box p.s_social{background:url(../img/w_social_icon.png) no-repeat left top;}

.p_box .one_box{width:1000px;}
.p_box .two_box{width:480px;}
.p_box .three_box{display:flex; align-items:center;}
.p_box .f_box{position:relative; z-index:1;}
.p_box .f_box a.del_a{position:absolute; top:9px; right:-27px; display:inline-block; width:25px; height:25px;}
.p_box .f_box a.del_a img{position:absolute; top:0; left:0; transition:all 0.5s;}
.p_box .f_box a.del_a img.del_off{}
.p_box .f_box a.del_a img.del_on{opacity:0;}
.p_box .f_box a.del_a:hover img.del_on{opacity:1;}
.p_box .f_box a.del_a:hover img.del_off{opacity:0;}
.p_box .sel_box{display:flex;}
.p_box .sel_box span.t_span,
.p_box .sel_box input{display:inline-block; width:110px; height:42px; background:#2c2c2c; color:#fff; font-size:16px; font-weight:bold; line-height:40px;  text-align:center;
					border:2px solid #2c2c2c; box-sizing:border-box;}

/* .p_box .sel_box input::placeholder{color:#fff;} */
.p_box .sel_box input.input_etc{background:transparent; color:#2c2c2c; border:1px solid #2c2c2c; border-right:none;}
.p_box .sel_box input.input_etc::placeholder{color:#999 !important;}
.p_box .sel_box select{width:110px !important;}
.p_box .sel_box select.sel_etc{border-left:none;}
.p_box .box_100p{width:100%;}
.p_box .box_140{width:140px;}
.p_box .box_220{width:220px;}
.p_box .box_480{width:480px;}
.p_box input{width:100%; height:42px; padding:0 10px; background:transparent; font-size:16px; color:#666; text-align:center; border:1px solid #2c2c2c; cursor:pointer; vertical-align:middle;
			box-sizing:border-box;}
.p_box input:focus{outline:1px solid #ad1c14; !important; border:1px solid #ad1c14 !important;}
.p_box input.f_none:focus{border:1px solid #2c2c2c !important;}
.p_box input.cal_input{text-align:left;}
.p_box input.ch_calender{text-align:center; text-indent:200px; transition:all 0.5s;}
.p_box input.ch_calender.ch_calender_on{text-indent:0;}
.p_box input[type="radio"]{display:none;}
.p_box .sel_wrap_span{position:relative; display:block; }
.p_box .sel_wrap_span:before,
.p_box .sel_wrap_span:after{position:absolute; top:17px; display:inline-block; content:""; width:2px; height:8px; background:#ad1c14;}
.p_box .sel_wrap_span:before{right:13px; transform:rotate(-45deg);}
.p_box .sel_wrap_span:after{right:8px; transform:rotate(45deg);}
.p_box select{position:relative; width:100%; height:42px; padding:0 10px; background:transparent; font-size:16px; font-weight:bold; text-align:center; border:1px solid #2c2c2c;
			vertical-align:middle; box-sizing:border-box; -moz-appearance:none; -webkit-appearance:none; appearance:none;}
.p_box select::-ms-expand{ display:none;/*for IE10,11*/}
.p_box select.hide_sel{color:transparent; text-indent:100px; transition:all 0.5s;}
.p_box select.hide_sel_on{color:#333; text-indent:0;}
.p_box select:focus{outline:1px solid #ad1c14 !important; border:1px solid #ad1c14 !important;}

.p_box button.add_btn{position:absolute; top:0; right:0; display:inline-block; height:24px; padding:0 27px 0 10px; background:#333333; font-size:14px; font-weight:bold; line-height:26px;
				color:#fff; border:none; cursor:pointer; box-shadow:0px 0px 15px rgba(51, 51, 51, 0.4), inset 0px 0px 15px rgba(0, 0, 0, 0); transition:all 0.5s;}
.p_box button.add_btn:before,
.p_box button.add_btn:after{position:absolute; top:0; content:""; display:inline-block; width:2px; height:12px; background:#fff; transition:0.5s;}
.p_box button.add_btn:before{top:6px; right:12px;}
.p_box button.add_btn:after{transform:rotate(90deg); top:6px; right:12px;}
.p_box button.add_btn:hover{background:#ad1c14; box-shadow:0px 0px 15px rgba(0, 0, 0, 0), inset 0px 0px 15px rgba(255, 255, 255, 0.4);}
.p_box button.add_btn:hover:before{transform:rotate(360deg);}
.p_box button.add_btn:hover:after{transform:rotate(450deg);}
.p_box button.adress_btn{position:relative; width:100%; height:42px; background:#333; font-size:16px; font-weight:bold; color:#fff; border:none; cursor:pointer;
						box-shadow:0px 0px 15px rgba(0,0,0,0.3); overflow:hidden; transition:all 0.5s; box-sizing:border-box;}
.p_box button.adress_btn:before,
.p_box button.adress_btn:after{position:absolute; right:-40px; display:inline-block; content:""; transition:all 0.5s;}
.p_box button.adress_btn:before{top:11px; width:16px; height:16px; border:1.5px solid #fff; border-radius:50%;}
.p_box button.adress_btn:after{top:26px; width:1px; height:6px; background:#fff; transform:rotate(-45deg);}
.p_box button.adress_btn:hover{padding-right:40px;}
.p_box button.adress_btn:hover:before{top:11px; right:46px;}
.p_box button.adress_btn:hover:after{top:26px; right:46px;}

.education_wrap .re_info:first-child button.del_btn{display:none;}
.company_wrap .re_info:first-child button.del_btn{display:none;}
.license_wrap .re_info:first-child button.del_btn{display:none;}

.p_box button.del_btn{position:absolute; top:14px; left:1010px; width:42px; height:42px; background:transparent; text-indent:-100px; font-size:14px; font-weight:bold; color:#fff;
					word-break:keep-all; border:1px solid #ddd; box-sizing:border-box; overflow:hidden; transition:all 0.5s;}
.p_box button.del_btn:before{position:absolute; top:19px; right:11px; display:inline-block; content:""; width:16px; height:1px; background:#ddd; transition:all 0.5s;}
.p_box button.del_btn:hover{padding:0 65px 0 10px; background:#ad1c14; border:2px solid #ad1c14; cursor:pointer; box-shadow:0px 0px 15px rgba(51, 51, 51, 0.4); text-indent:0;}
.p_box button.del_btn:hover:before{transform:rotate(360deg);}
.p_box textarea{display:block; width:100%; height:200px; padding:10px; font-family: "Arial","맑은 고딕", "Malgun Gothic", sans-serif; font-size:16px; border:2px solid #ddd;
				box-sizing:border-box; resize:none; transition:0.3s; overflow:auto;}
.p_box textarea:hover{transform:scale(1.01);}
.p_box textarea:active{transform:scale(1.04);}
.p_box textarea:focus{outline:none; border:2px solid #ad1c14; box-shadow:0px 0px 15px rgba(0, 0, 0, 0.15);}

.p_box .div_wrap .re_info + .re_info{padding-top:14px; border-top:1px dashed #ddd; margin-top:14px;}
.p_box .sel_wrap .re_info{justify-content:flex-start;}
.p_box .sel_wrap .re_info .sel_box + .sel_box{margin-left:40px;}
.p_box .sel_wrap .re_info .sel_box:nth-child(4n+1){margin:14px 0 0 0;}
.p_box .sel_wrap .re_info .sel_box:nth-child(1){margin-top:0;}
.p_box .sel_wrap .re_info .sel_box:nth-child(n+5){margin-top:14px;}


.p_box .re_info{display:flex; justify-content:space-between; flex-wrap:wrap;}
.p_box .f_box span.tit_ls{letter-spacing:-2px;} 
.p_box .f_box span.tit_span{position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); display:inline-block; padding:0 5px; background:transparent; font-size:16px;
							font-weight:bold; color:#333; transition:left ease 0.5s,top ease 0.5s,transform ease 0.5s, font-size ease 0.5s, background-color 0.3s ease 0.5s; z-index:-1;}
.p_box .f_box span.tit_span.tit_span_on{left:8px; top:-8px; transform:translate(0,0); background-color:#fff; font-size:14px; z-index:2;}
.p_box .f_box span.tit_sub_span{position:absolute; top:0; right:10px; display:inline-block; height:42px; font-size:16px; line-height:42px; color:#fff; transition:all 1s; z-index:-1;}
.p_box .f_box span.tit_sub_span.tit_sub_span_on{color:#666;}
.p_box .f_box span.position_n{display:inline-block; width:30px; text-align:center;}
.p_box .f_box span.tit_hide{left:70px;}
.p_box .f_box span.tit_sel_two{left:110px;}

.p_box .f_box input[type="radio"]:checked + label{color:#fff; border:none; box-shadow:0px 0px 10px rgba(255, 13, 0, 0.4);}
.p_box .f_box label{position:relative; display:inline-block; width:100%; height:42px; font-weight:bold; border:1px solid #2c2c2c; box-sizing:border-box; transition:background-color 0.5s;}
.p_box .f_box label span{position:absolute; top:50%; left:50%; transform:translate(-75%, -50%); display:inline-flex; justify-content:space-between; align-items:center; font-size:16px; 
						font-weight:bold; transition:left 0.5s, color 0.5s;}
.p_box .f_box label span.o_span{transform:translate(-50%, -50%);}
.p_box .f_box label span.y_span{transform:translate(-50%, -50%);}
.p_box .f_box label span.m_span{width:32px;}
.p_box .f_box label span.w_span{width:38px;}
.p_box .f_box label span img{opacity:0; transition:all 0.5s;}


.p_box .f_box label span.l_span + i{left:20px; top:14px;}
.p_box .f_box label span.r_span + i{right:20px; top:14px;}

.p_box .f_box label i{position:absolute; display:inline-block; content:""; width:20px; height:14px; text-indent:-9999px;}
.p_box .f_box label i:before,
.p_box .f_box label i:after{position:absolute; display:inline-block; content:""; width:2px; background:#fff;}
.p_box .f_box label i:before{transform:rotate(-45deg); height:10px; top:4px; left:4px;}
.p_box .f_box label i:after{transform:rotate(45deg); height:16px; top:-1px; right:6px;}


.p_box .f_box input:checked + label span{transform:translate(0, -50%); color:#fff;}
.p_box .f_box input:checked + label span img{opacity:1;}
.p_box .f_box input.gen_m:checked + label{background:#133ea0; box-shadow:0px 0px 10px rgba(0, 14, 205, 0.4);}
.p_box .f_box input.gen_m:checked + label span{left:20px;}
.p_box .f_box input.gen_w:checked + label{background:#ad1c14;}
.p_box .f_box input.gen_w:checked + label span{left:164px;}

.p_box .f_box input.ch_army{display:none;}
.p_box .f_box input.ch_army + label{display:flex; width:100%; background:#ad1c14; font-size:16px; line-height:42px; text-align:center; border:none; cursor:pointer; overflow:hidden;
									box-shadow:0 0 10px rgba(0, 0, 0, 0.3); transition:all 0.2s;}
.p_box .f_box input.ch_army + label b{display:block; width:220px; transition:all 0.5s;}
.p_box .f_box input.ch_army + label b:first-child{color:#fff;}
.p_box .f_box input.ch_army + label b:last-child{margin-right:-220px;}

.p_box .f_box input.ch_army:checked + label{background:#ddd; box-shadow:inset 0 0 5px rgba(0, 0, 0, 0.4);}
.p_box .f_box input.ch_army:checked + label b:first-child{margin-left:-220px;}
.p_box .f_box input.ch_army:checked + label b:last-child{color:#333; margin-right:0;}
.p_box .f_box label.label_army:hover{box-shadow:0 0 0 rgba(0, 0, 0, 0.3);}

.p_box .f_box div.work_date{display:flex;}
.p_box .f_box div.work_date span:first-child select{border-right:none;}


.final_btn{padding-top:20px; text-align:center; border-top:1px solid #333;}
.final_btn a{position: relative; -webkit-transition: color .1s,background-color .1s; display:inline-block; width:180px; height:50px; font-size:20px; line-height:50px; color:#fff;
				box-shadow:0px 0px 10px rgba(0, 0, 0, 0.3);}
.final_btn a:before{ position: absolute; bottom: 0; left: 0; height: 4px; width: 100%; content: ''; background-color: #fff; 
	-webkit-transform-origin: right top; 
	transform-origin: right top; 
	-webkit-transform: scaleX(0); transform: scaleX(0); 
	-webkit-transition: -webkit-transform .3s cubic-bezier(.165,.84,.44,1); 
	transition: -webkit-transform .3s cubic-bezier(.165,.84,.44,1);
	transition: transform .3s cubic-bezier(.165,.84,.44,1); 
	transition: transform .3s cubic-bezier(.165,.84,.44,1),-webkit-transform .3s cubic-bezier(.165,.84,.44,1); 
}
.final_btn a:focus:before, .final_btn a:hover:before { -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scaleX(1); transform: scaleX(1); }

.final_btn a:nth-child(1){background:#ff7800; margin-right:20px;}
.final_btn a:nth-child(2){background:#ad1c14;}
.final_btn a:hover{opacity:1;}


.final_btn{padding-top:20px; text-align:center; border-top:1px solid #333;}
.final_btn button{position: relative; -webkit-transition: color .1s,background-color .1s; display:inline-block; width:180px; height:50px; font-size:20px; line-height:50px; color:#fff;
				box-shadow:0px 0px 10px rgba(0, 0, 0, 0.3);cursor:pointer;}
.final_btn button:before{ position: absolute; bottom: 0; left: 0; height: 4px; width: 100%; content: ''; background-color: #fff; 
	-webkit-transform-origin: right top; 
	transform-origin: right top; 
	-webkit-transform: scaleX(0); transform: scaleX(0); 
	-webkit-transition: -webkit-transform .3s cubic-bezier(.165,.84,.44,1); 
	transition: -webkit-transform .3s cubic-bezier(.165,.84,.44,1);
	transition: transform .3s cubic-bezier(.165,.84,.44,1); 
	transition: transform .3s cubic-bezier(.165,.84,.44,1),-webkit-transform .3s cubic-bezier(.165,.84,.44,1); 
}
.final_btn button:focus:before, .final_btn a:hover:before { -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scaleX(1); transform: scaleX(1); }

.final_btn button:nth-child(1){background:#ff7800; margin-right:20px;}
.final_btn button:nth-child(2){background:#ad1c14;}
.final_btn button:hover{opacity:1;}