@import url('sub.css');


/**** S:: 공통 ****/
.recruit_top{text-align:center; background-repeat:no-repeat; background-size:cover; background-position:center; padding: 150px 0;}
.recruit_top .fs15{letter-spacing: 7.5px; color:var(--white); padding:0 0 10px; font-family:var(--eng);}
.recruit_top .fs36{color:var(--white);}
.recruit_top .fs17{color:var(--white); padding:20px 0 0;}
.recruit_txt{text-align:center; padding: 30px 0 0;}
.recruit_txt .underline_txt{color:var(--main); font-weight: 700;}
.btn_m{max-width:180px; margin:50px auto 0;}
/**** E:: 공통 ****/



/**** S:: 직무소개 ****/
.job_youtube{overflow: hidden;}
	.job_youtube_wrap{max-width:890px;  margin:0 auto;}
	.job_youtube_roll{width: calc(100% + 30px); margin: 0 -15px; padding: 0 0 50px;}
	.job_youtube_roll .slick-list{overflow: visible;}
	.job_youtube_roll .roll{padding: 0 15px;}

.job_youtube_roll .slick-dots{position: absolute; left:50%; bottom: 0; transform:translateX(-50%); font-size:0; text-align:center;}
.job_youtube_roll .slick-dots li{display: inline-block; vertical-align: top; width: 10px; height: 10px; border-radius:50%; margin: 0 20px 0 0; background:var(--main); opacity: 0.2; transition:all .3s linear; cursor:pointer;}
.job_youtube_roll .slick-dots li.slick-active{opacity: 1;}
.job_youtube_roll .slick-dots li:hover{opacity: 1;}
.job_youtube_roll .slick-dots li:last-child{margin: 0;}
.job_youtube_roll .slick-dots li button{padding:0; border:0; background:none; font-size:0;}
.job_youtube_roll .slick-arrow{padding: 0; border:0; font-size:0; cursor:pointer; background:none; width: 70px; height: 70px; position: absolute; top:50%; z-index: 9991; transition:all .3s linear; margin-top: -40px; background:var(--white); border-radius:50%; box-shadow: 0px 10px 15px 0px rgba(5, 29, 85, 0.20); color:var(--main);}
.job_youtube_roll .slick-arrow:hover{background:var(--main); color:var(--white);}
.job_youtube_roll .slick-prev{left:-35px;}
.job_youtube_roll .slick-next{right:-35px;}
.job_youtube_roll .slick-arrow:after{content:'\e5c8'; display: block; width: 100%; height: 100%; line-height: 70px; font-size:30px; text-align:center; font-family:var(--icon);}
.job_youtube_roll .slick-prev:after{transform:rotate(180deg);}


.job_in{}
.job_in .tit_area{text-align:center; padding: 0 0 50px;}
.job_in .tit_area .fs15{letter-spacing: 7.5px; padding: 0 0 10px;}
.job_in .tit_area .fs17{padding: 20px 0 0;}

.job_list{display: flex; flex-wrap:wrap; gap:30px;}
.job_list .list{box-sizing:border-box; border:1px solid var(--border); border-radius:10px; overflow: hidden; width: calc((100% - 60px)/3);}
.job_list .list a{display: block;}
.job_list .list .thumb{background:var(--grayBg2); aspect-ratio:3/2; overflow: hidden;}
.job_list .list .thumb img{display: block; width: 100%; height:100%; object-fit:cover;}
.job_list .list .desc{padding:30px; box-sizing:border-box;}
.job_list .list .desc dl{padding: 0 0 10px; display: flex; align-items:center;}
.job_list .list .desc dl dt{border-radius:5px; font-size:0.765rem; font-weight: 600; letter-spacing: 0; padding:0 10px; background:rgba(124, 94, 66, .1); line-height: 26px; text-align:center; color:var(--main);}
.job_list .list .desc dl dd{padding: 0 10px; font-size:0.882rem; font-weight: 600; letter-spacing: -0.45px;  color:var(--main);}
.job_list .list .desc .fs21{font-weight: 600;}
.job_list .list .desc .fs17{padding: 10px 0 0;}


.job_banner{text-align:left; padding:150px 0; background:url('/assets/images/newRecruit/job_banner.jpg') no-repeat center/cover;}
.job_banner .fs17{font-weight: 600; color:var(--white); padding: 0 0 5px;}
.job_banner .fs36{ color:var(--white);}
.job_banner .btn_m{margin: 50px 0 0; border:1px solid var(--white); color:var(--white); background:none;}
.job_banner .btn_m:hover{border-color:var(--white); color:var(--black); background:var(--white);}

#popup_job{}
#popup_job .popup_in{height: 80vh; overflow: hidden; }
#popup_job .popup_con{height: calc(100% - 82px); padding: 30px 10px 30px 30px;}
.popup_job{text-align:left; height: 100%; overflow-x: hidden; overflow-y: auto; padding: 0 20px 0 0; box-sizing:border-box;}
.popup_job .img{background:var(--grayBg2); border-radius:10px; overflow: hidden;}
.popup_job .img img{width: 100% !important; height: auto !important;}
.popup_job .fs21{padding: 20px 0 10px; font-weight: 600;}
.popup_job .fs17{padding: 0 0 25px;}
.popup_job .fs17:last-of-type{padding: 0;}
/**** E:: 직무소개 ****/




/**** S:: 비전 ****/
.vision_cont{}
.vision_cont .tit_area{padding:0 0 50px; text-align:center;}
.vision_cont .tit_area .fs17{padding: 15px 0 0;}
/**** E:: 비전 ****/


/**** S:: 교육 및 육성 ****/
.education_cont .recruit_txt{padding: 60px 0 0;}
.education_style{display: flex; flex-wrap:wrap; gap:30px;}
.education_style dl{width: 100%; display: flex;}
.education_style dl dt{width: 315px; text-align:center; border-radius:10px; display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative;}
.education_style dl:nth-child(1) dt{background:var(--main);}
.education_style dl:nth-child(2) dt{background:var(--sub4);}
.education_style dl dt .fs25{color:var(--white);}
.education_style dl dt:after{content:'\e5c8'; display: block; width: 80px; height:80px; font-size:24px; line-height: 80px; font-family:var(--icon); color:var(--main); border-radius:50%; text-align:center; font-weight: 400; background:var(--white); position: absolute; right: -55px; top:50%; margin-top: -40px; box-shadow: 10px 0px 20px 0px rgba(0, 0, 0, 0.10);}
.education_style dl:nth-child(2) dt:after{color:var(--sub4);}
.education_style dl dd{width: calc(100% - 315px); padding: 0 0 0 30px;}
.education_style dl dd ul{box-sizing:border-box; display: flex; border:1px solid var(--border); border-radius:10px; padding: 50px 0;}
.education_style dl dd ul li{width: 33.333%; text-align:center; box-sizing:border-box; border-right: 1px solid var(--border); position: relative;}
.education_style dl dd ul li:last-child{border: 0;}
.education_style dl dd ul li:after{content:'\e145'; display: block; width: 31px; height:31px; font-size:19px; line-height: 31px; font-family:var(--icon); color:var(--main); border-radius:50%; text-align:center; font-weight: 700; background:rgba(124, 94, 66, 0.3); position: absolute; right: -16px; top:50%; margin-top: -15px;}
.education_style dl:nth-child(2) dd ul li:after{color:var(--sub4); background:rgba(63, 26, 19, 0.3);}
.education_style dl dd ul li:last-child:after{display: none;}
.education_style dl dd ul li img{margin: 0 auto 20px;}
/**** E:: 교육 및 육성 ****/



/**** S:: 채용공고 ****/


.posting_cont .border_box{padding: 40px; box-sizing:border-box; border:1px solid var(--border); border-radius:10px;}
.posting_cont .check_list{}
.posting_cont .check_list li{padding-left: 110px;}
.posting_cont .check_list li:before{background:var(--grayBg);}
.posting_cont .check_list li b{color:var(--black); font-weight: 600; position: absolute; left:35px; top:0;}

.photo_style{display:flex; flex-wrap:wrap; gap:30px;}
.photo_style dl{background:var(--grayBg2); border:1px solid var(--border); border-radius:10px; box-sizing:border-box; overflow: hidden; text-align:center;}
.photo_style.four dl{width: calc((100% - 90px)/4);}
.photo_style.three dl{width: calc((100% - 60px)/3);}
.photo_style dl dt{aspect-ratio:3/2; overflow: hidden;}
.photo_style dl dt img{display: block; width: 100%; height:100%; object-fit:cover;}
.photo_style dl dd{padding: 16px; box-sizing:border-box;}
.photo_style dl dd .fs17{font-weight: 600; color:var(--black);}


.education_list{display:flex; flex-wrap:wrap; gap:30px;}
.education_list dl{width: calc((100% - 60px)/3); border:1px solid var(--border); border-radius:10px; box-sizing:border-box; overflow: hidden; text-align:left;}
.education_list dl dt{aspect-ratio:3/2; overflow: hidden;}
.education_list dl dt img{display: block; width: 100%; height:100%; object-fit:cover;}
.education_list dl dd{padding: 40px; box-sizing:border-box;}
.education_list dl dd h4.fs17{padding: 0 0 5px; color:var(--black); font-weight: 600;}


.posting_process{display: flex; justify-content: space-between; padding: 60px 110px; box-sizing:border-box; border-radius:10px; border:1px solid var(--border);}
.posting_process dl{display: flex; align-items:center; width: 240px; position: relative;}
.posting_process dl dt{width: 130px;}
.posting_process dl dt img{width: 100%; height: auto;}
.posting_process dl dd{width: calc(100% - 130px); padding:0 0 0 30px; box-sizing:border-box;}
.posting_process dl dd .fs13{font-weight:600; color:var(--main); padding:0 0 5px;}
.posting_process dl dd .fs21{}
.posting_process dl dd.arrow{display: flex; align-items:center; position: absolute; right: -150px; top:50%; margin-top: -10px;}
.posting_process dl dd.arrow span{display:block; width:5px; height:5px; border-radius:50%; background:var(--main); margin: 0 5px 0 0;}
.posting_process dl dd.arrow span.doi {opacity:0.6;}
.posting_process dl dd.arrow span.trei {opacity:0.3;}
.posting_process dl dd.arrow img{width: 10px; height: auto;}

    .unu, .doi, .trei {-webkit-animation: mouse-scroll 1s infinite; -moz-animation: mouse-scroll 1s infinite; animation: mouse-scroll 1s infinite;}
	.unu {-webkit-animation-delay: .1s; -moz-animation-delay: .1s; -webkit-animation-direction: alternate; animation-direction: alternate; animation-delay: alternate;}
	.doi {-webkit-animation-delay: .2s; -moz-animation-delay: .2s; -webkit-animation-direction: alternate; animation-delay: .2s; animation-direction: alternate;}
	.trei {-webkit-animation-delay: .3s; -moz-animation-delay: .3s; -webkit-animation-direction: alternate; animation-delay: .3s; animation-direction: alternate;}

	@-webkit-keyframes mouse-scroll {
		0%   { opacity: 0;}
		50%  { opacity: .5;}
		100% { opacity: 1;}
	}
	@-moz-keyframes mouse-scroll {
		0%   { opacity: 0; }
		50%  { opacity: .5; }
		100% { opacity: 1; }
	}
	@-o-keyframes mouse-scroll {
		0%   { opacity: 0; }
		50%  { opacity: .5; }
		100% { opacity: 1; }
	}
	@keyframes mouse-scroll {
		0%   { opacity: 0; }
		50%  { opacity: .5; }
		100% { opacity: 1; }
	}

/**** E:: 채용공고 ****/