.scroll-area {
    overflow-x: auto;
    cursor: grab;
}

.scroll-area.dragging {
    cursor: grabbing;
    user-select: none;
}
section .contents {
	width: 100%; max-width: 1320px;
	padding: 0px 60px;
	left: 50%;
    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
}

article.contents .content_title { 
	height: auto; line-height: 1;
	font-size: 40px; color: #fff;
	font-weight: 700;


	width: 100%; max-width: 1280px;

	left: 50%;
    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
}





/************************************************************************************************

		section.careers 

/************************************************************************************************/
section.careers { 
	/*position: absolute; top: 4285px; left: 0px;*/
    position: relative; left: 0px;
	width: 100%; height: auto;background: #372608;
}

section.careers .careers_txt {
	font-size: 60px; color: var(--color-white); text-align: left;
	font-weight: 300; 
	margin-top: 40px;
	z-index: 2;
}

section.careers .careers_box {height: auto;margin-top: 40px;left: 18%;}
@media (max-width: 1680px) {
    section.careers .careers_box {left: 30%;}
    
}

@media (max-width: 1610px) {
    section.careers .careers_box {left: 40%;}
    
}
@media (max-width: 1400px) {
    section.careers .careers_box {left: 43%;}
    
}
@media (max-width: 1280px) {
    section.careers .careers_box {left: 42%;}
    
}


section.careers .careers_box .careers_list { width: 100%; height: auto; }
section.careers .careers_box .careers_list .careers_item:nth-child(1) { margin-left: 0px; }
section.careers .careers_box .careers_list .swiper-slide:nth-child(odd) .careers_item { margin-top: 140px; }
section.careers .careers_box .careers_list .careers_item { 
	width: 306px; height: auto; 
	margin-left: 20px; 
}
section.careers .careers_box .careers_list .careers_item .blank{ width: 100%; height: auto; }

section.careers .careers_box .careers_list .careers_item .card.on{
    -webkit-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
 section.careers .careers_box .careers_list .careers_item:hover .card.flip { 
/*section.careers .careers_box .careers_list .careers_item .card.flip {*/
    -webkit-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

section.careers .careers_box .careers_list .careers_item .card {
	position: absolute; top: 0px; left: 0px;
	width: 100%; height: 100%;

	transition: all 300ms ease-in-out;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;

	transform-style: preserve-3d;
	cursor: pointer;
}

section.careers .careers_box .careers_list .careers_item .card .front:hover { opacity: 1; }
section.careers .careers_box .careers_list .careers_item .card .front {
	position: absolute; top: 0px; left: 0px;
	display: flex;
	justify-content: center;
	align-items: baseline;
	opacity: 1;

	width: 100%; height: 100%;
	border-radius: 15px;
	backface-visibility: hidden;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	box-sizing: border-box;
}

section.careers .careers_box .careers_list .careers_item .card .back {
	position: absolute; top: 0px; left: 0px;    overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: baseline;

	padding: 27px 27px 70px 27px;

	width: 100%; height: 100%;
	border-radius: 15px;
	backface-visibility: hidden;
    -webkit-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    transform: rotateY(180deg);
	background-color: var(--color-blue2);
}

section.careers .careers_box .careers_list .swiper-slide:nth-child(odd) .careers_item .card .back { background-color: var(--color-white); }
section.careers .careers_box .careers_list .careers_item .card .back > div { width: 100%; height: 100%; }


section.careers .careers_item .card_title {
	width: 100%; height: auto; line-height: 1;
	padding-top: 0px;
	font-size: 20px; color: var(--color-white); text-align: left;
}
section.careers .careers_box .careers_list .swiper-slide:nth-child(odd) .card_title { color: var(--color-blue2); }

section.careers .careers_item .card_info {
	width: 100%; height: auto;
	margin: 40px 0 20px 0;
	background-size: 30px 30px;
	background-image: url('/img/careers_btn.png');
	background-position: top right;
	background-repeat: no-repeat;
	box-sizing: border-box;
}
section.careers .careers_box .careers_list .swiper-slide:nth-child(odd) .card_info { background-image: url('/img/careers_btn2.png'); }




section.careers .careers_item .card_info .card_dep,
section.careers .careers_item .card_info .card_name { 
	width: 100%; height: auto; line-height: 20px;
	font-size: 18px; color: var(--color-white); text-align: left;
	letter-spacing: -0.4px;
}


section.careers .careers_item .card_info .card_dep{ font-size: 16px; }
section.careers .careers_item .card_info .card_name { margin-top: 10px; }

section.careers .careers_box .careers_list .swiper-slide:nth-child(odd) .card_dep,
section.careers .careers_box .careers_list .swiper-slide:nth-child(odd) .card_name { color: var(--color-blue2); }

section.careers .careers_item .card_desc {
	width: 100%; height: auto; line-height: 25px;
	font-size: 16px; color: var(--color-white); text-align: left;
	font-weight: 300;
	margin-top: 10px;
	letter-spacing: -0.4px;
}
section.careers .careers_box .careers_list .swiper-slide:nth-child(odd) .card_desc { color: var(--color-blue2); }


section.careers .careers_box .swiper-slide { width: auto; }


section.careers .careers_item .card .front .video_bg:hover { opacity: 1; }
section.careers .careers_item .card .front .video_bg {
	position: absolute; top: 0px; left: 0px;
	width: 100%; height: 100%;
	border-radius: 15px;
	background-color: var(--color-blue2);
	opacity: 0.8;
	z-index: 1;
}


section.careers .careers_item .card .front .video_btn {
	position: absolute; top: 50%; left: 50%;
	width: 100%; height: auto;
	font-size: 18px; color: var(--color-white); text-align: center;
	z-index: 2;


    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

section.careers .careers_item .card .front .video_btn img {
	width: 75px; height: auto;
	float: none;
	margin-bottom: 15px;
}



section.careers .careers_arrow {
	position: absolute; top: 824px; right: 45px;
	z-index: 10;
	width: auto; height: auto;
}

section.careers .careers_arrow .arrow:nth-child(1){ margin-left: 0px; }
section.careers .careers_arrow .arrow:hover { background-color: var(--color-blue2); }
section.careers .careers_arrow .arrow {
	width: 50px; height: 50px;
	border-radius: 100%; 
	margin-left: 10px;
	background-color: #333333;
	cursor: pointer;
}
section.careers .careers_arrow img{
	position: absolute; top: 50%; left: 50%;


    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);

	width: 12px; height: auto; 
	vertical-align: middle;
}
section.careers .careers_arrow img.prev{ margin-left: -2px; }
section.careers .careers_arrow img.next{ margin-left: 2px; }













@media (max-width: 749px) { 

	section .contents {
		max-width: calc((480 / 480) * 100vw);
		/*padding: 0px calc((24 / 480) * 100vw);*/
        padding: 0px calc((0 / 480) * 100vw);

	}

	article.contents .content_title { 
		font-size: calc((40 / 480) * 100vw); 
		max-width: calc((432 / 480) * 100vw);
	}




	/************************************************************************************************

			section.careers 

	/************************************************************************************************/


	section.careers .careers_txt {
		font-size: calc((32 / 480) * 100vw); 
		margin-top: calc((20 / 480) * 100vw);
	}

	section.careers .careers_box {
		margin-top: calc((60 / 480) * 100vw);padding: 0px calc((30 / 480) * 100vw);left: 50%;
	}


	section.careers .careers_box .careers_list .swiper-slide:nth-child(odd) .careers_item { margin-top: calc((40 / 480) * 100vw); }
	section.careers .careers_box .careers_list .careers_item { 
		width: calc((300 / 480) * 100vw);
		margin-left: calc((20 / 480) * 100vw); 
	}

	section.careers .careers_box .careers_list .careers_item .card .front {
		border-radius: calc((15 / 480) * 100vw);
	}

	section.careers .careers_box .careers_list .careers_item .card .back {
		padding: calc((20 / 480) * 100vw) calc((20 / 480) * 100vw) calc((20 / 480) * 100vw) calc((20/ 480) * 100vw);
		border-radius: calc((15 / 480) * 100vw);
	}

	section.careers .careers_item .card_title {
		font-size: calc((20 / 480) * 100vw);

		background-size: calc((25 / 480) * 100vw) calc((25 / 480) * 100vw);
	}


	section.careers .careers_box .careers_list .swiper-slide:nth-child(odd) .card_info,
	section.careers .careers_item .card_info {
		margin-top: calc((20 / 480) * 100vw);
		background-image: url('../../images/careers_btn.png');
		background-image: none;

	}
    section.careers .careers_item .card_info {margin: 15px 0 10px 0;}


	section.careers .careers_item .card_info .card_dep,
	section.careers .careers_item .card_info .card_name { 
		line-height: 1.2;
		font-size: calc((25 / 480) * 100vw);
	}

	section.careers .careers_item .card_desc {
		line-height: 1.4;
		font-size: calc((17 / 480) * 100vw); 
		/*margin-top: calc((40 / 480) * 100vw);*/
        margin-top: calc((0 / 480) * 100vw);

	}

	section.careers .careers_item .card .front .video_bg {
		border-radius: calc((15 / 480) * 100vw);
	}


	section.careers .careers_item .card .front .video_btn {
		font-size: calc((20 / 480) * 100vw); 
	}

	section.careers .careers_item .card .front .video_btn img {
		width: calc((55 / 480) * 100vw); 
		margin-bottom: calc((15 / 480) * 100vw);
	}



	section.careers .careers_arrow {
		display: none;
		top: calc((845 / 1280) * 100vw); 
		right: calc((50 / 1024) * 100vw);

	}
	section.careers .careers_arrow .arrow {
		width: calc((50 / 1280) * 100vw); height: calc((50 / 1280) * 100vw);
		margin-left: calc((10 / 1280) * 100vw);

	}
	section.careers .careers_arrow img{
		width: calc((12 / 1280) * 100vw); 
	}
	section.careers .careers_arrow img.prev{ margin-left: -1px; }
	section.careers .careers_arrow img.next{ margin-left: 1px; }



}

@media (max-width: 1023px) and (min-width: 750px) { 



	section .contents {
		max-width: calc((1320 / 1280) * 100vw);
		padding: 0px calc((30 / 750) * 100vw);

	}

	article.contents .content_title { 
		font-size: calc((35 / 750) * 100vw); 
		max-width: calc((690 / 750) * 100vw);
	}







	/************************************************************************************************

			section.careers 

	/************************************************************************************************/
	

	section.careers .careers_box {
		margin-top: calc((60 / 750) * 100vw);
		padding: 0px calc((30 / 750) * 100vw);
	}


	section.careers .careers_box .careers_list .swiper-slide:nth-child(odd) .careers_item { margin-top: calc((60 / 750) * 100vw); }
	section.careers .careers_box .careers_list .careers_item { 
		width: calc((200 / 750) * 100vw);
		margin-left: calc((20 / 750) * 100vw); 
	}

	section.careers .careers_box .careers_list .careers_item .card .front {
		border-radius: calc((15 / 750) * 100vw);
	}

	section.careers .careers_box .careers_list .careers_item .card .back {
		padding: calc((40 / 750) * 100vw) calc((20 / 750) * 100vw) calc((40 / 750) * 100vw) calc((20 / 750) * 100vw);
		border-radius: calc((15 / 750) * 100vw);
	}

	section.careers .careers_item .card_title {
		font-size: calc((18 / 750) * 100vw);
	}

	section.careers .careers_box .careers_list .swiper-slide:nth-child(odd) .card_info { background-image: inherit; }

	section.careers .careers_item .card_info {
		background-image: inherit;
		margin-top: calc((60 / 750) * 100vw);

		background-size: calc((20 / 750) * 100vw) calc((20 / 750) * 100vw);
        background-position: center right;
	}

	section.careers .careers_item .card_info .card_dep,
	section.careers .careers_item .card_info .card_name { 
		line-height: calc((20 / 750) * 100vw);
		font-size: calc((16 / 750) * 100vw);
	}

	section.careers .careers_item .card_desc {
		display: none;
		line-height: calc((25 / 750) * 100vw);
		font-size: calc((14 / 750) * 100vw); 
		margin-top: calc((40 / 750) * 100vw);

	}

	section.careers .careers_item .card .front .video_bg {
		border-radius: calc((15 / 750) * 100vw);
	}


	section.careers .careers_item .card .front .video_btn {
		font-size: calc((18 / 750) * 100vw); 
	}

	section.careers .careers_item .card .front .video_btn img {
		width: calc((75 / 750) * 100vw); 
		margin-bottom: calc((15 / 750) * 100vw);
	}





}


@media (max-width: 1279px) and (min-width: 1024px) { 


	section .contents {
		max-width: calc((1320 / 1280) * 100vw);
		padding: 0px calc((60 / 1280) * 100vw);

	}

	article.contents .content_title { 
		font-size: calc((40 / 1280) * 100vw); 
		max-width: calc((1208 / 1280) * 100vw);
	}



	/************************************************************************************************

			section.careers 

	/************************************************************************************************/
	
	section.careers .careers_txt { font-size: calc((60 / 1280) * 100vw); margin-top: calc((40 / 1280) * 100vw); }
	section.careers .careers_box { margin-top: calc((40 / 1280) * 100vw); }

	section.careers .careers_box .careers_list .swiper-slide:nth-child(odd) .careers_item { margin-top: calc((140 / 1280) * 100vw); }
	section.careers .careers_box .careers_list .careers_item { width: calc((306 / 1280) * 100vw); margin-left: calc((20 / 1280) * 100vw);  }

	section.careers .careers_box .careers_list .careers_item .card .front { border-radius: calc((15 / 1280) * 100vw); }
	section.careers .careers_box .careers_list .careers_item .card .back {
		padding: calc((70 / 1280) * 100vw) calc((15 / 1280) * 100vw) calc((70 / 1280) * 100vw) calc((15 / 1280) * 100vw);
		border-radius: calc((15 / 1280) * 100vw);
	}

	section.careers .careers_item .card_title { font-size: calc((20 / 1280) * 100vw); }

	section.careers .careers_item .card_info {
		margin-top: calc((50 / 1280) * 100vw);
		background-size: calc((25 / 1280) * 100vw) calc((25 / 1280) * 100vw);
	}

	section.careers .careers_item .card_info .card_dep,
	section.careers .careers_item .card_info .card_name { 
		line-height: calc((26 / 1280) * 100vw);
		font-size: calc((18 / 1280) * 100vw); 
		letter-spacing: calc((-0.4 / 1280) * 100vw);
	}

	section.careers .careers_item .card_desc {
		line-height: calc((25 / 1280) * 100vw);
		font-size: calc((16 / 1280) * 100vw); 
		margin-top: calc((30/ 1280) * 100vw);
		letter-spacing: calc((-0.4 / 1280) * 100vw);
	}
	section.careers .careers_item .card .front .video_bg { border-radius: calc((15 / 1280) * 100vw); }


	section.careers .careers_item .card .front .video_btn { font-size: calc((18 / 1280) * 100vw); }

	section.careers .careers_item .card .front .video_btn img { width: calc((75 / 1280) * 100vw);  margin-bottom: calc((15 / 1280) * 100vw); }

	section.careers .careers_arrow { top: calc((824 / 1280) * 100vw); right: calc((45 / 1280) * 100vw); }

	section.careers .careers_arrow .arrow {
		width: calc((50 / 1280) * 100vw); height: calc((50 / 1280) * 100vw);
		margin-left: calc((10 / 1280) * 100vw);
	}

	section.careers .careers_arrow img{ width: calc((12 / 1280) * 100vw); }
	section.careers .careers_arrow img.prev{ margin-left: calc((-2 / 1280) * 100vw); }
	section.careers .careers_arrow img.next{ margin-left: calc((2 / 1280) * 100vw); }

}


