@charset "utf-8";
/*───────────────────────────────────────────────────────────
	
	" board｜errors｜goods｜service｜layout/board｜layout/display｜layout/goods "
	" layout/popup.html "

	위 폴더 및 페이지 커스텀 및 layout, navigation, button, company 관련 편집 css 파일 입니다.

	** header, footer, main 관련은 /css/skin.css 에 있습니다.

───────────────────────────────────────────────────────────*/


.sub_title { font-size: var(--title-20); }
.sub_title h3 { position: relative; font-size: 160%; font-weight: 500; color: var(--point-color03); padding-left: 15px; box-sizing: border-box; }
.sub_title h3::before { content: ''; width: 4px; height: 80%; background: var(--point-color01); position: absolute; left: 0; top: 50%; transform: translateY(-50%); }

@media screen and (max-width: 1023px){
    .sub_title h3 { font-size: 150%; padding-left: 12px; }
}

@media screen and (max-width: 860px){
    .sub_title h3 { font-size: 140%; padding-left: 10px; }
    .sub_title h3::before { width: 3px; }
}

@media screen and (max-width: 640px){
    .sub_title h3 { font-size: 130%; }
}

@media screen and (max-width: 479px){
    .sub_title h3 { padding-left: 8px; }
    .sub_title h3::before { width: 2px; }
}



/*───────────────────────────────────────────────────────────
	
	common.css 커스텀 css 아래에 작성

───────────────────────────────────────────────────────────*/


/*───────────────────────────────────────────────────────────
	sub_visual common
───────────────────────────────────────────────────────────*/
.sub_visual {background:url('../images/sub/sub_visual.jpg') no-repeat center;background-size:cover;height:420px;position:relative;}
.sub_visual .sub_visual_title {position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);padding:0 20px;box-sizing:border-box;}
.sub_visual .sub_visual_title h2 {font-size:50px;color:#fff; text-align: center; }


@media only screen and (max-width:1217px) {
	.sub_visual {height:auto;padding-bottom:32%;}
	.sub_visual .sub_visual_title h2 {font-size:45px;}
}
@media only screen and (max-width:1023px) {
	.sub_visual .sub_visual_title h2 {font-size:40px;}
}
@media only screen and (max-width:860px) {
	.sub_visual .sub_visual_title h2 {font-size:35px;}
}
@media only screen and (max-width:767px) {
}
@media only screen and (max-width:640px) {
	.sub_visual{padding-bottom:35%;}
	.sub_visual .sub_visual_title h2 {font-size:30px;}
}
@media only screen and (max-width:540px) {
	.sub_visual{padding-bottom:40%;}
}
@media only screen and (max-width:479px) {
	.sub_visual {height:185px;padding-bottom:0;}
	.sub_visual .sub_visual_title h2 {font-size:25px;}
}
@media only screen and (max-width:355px) {
	.sub_visual .sub_visual_title h2 {font-size:22px;}
}

/*───────────────────────────────────────────────────────────
	side box common
───────────────────────────────────────────────────────────*/
/* slide toggle */
#side_box {position: absolute;z-index: 5;width: 100%;left: 0;bottom: 0;background: rgba(0,0,0,0.5);}
#side_box .sub_menu {padding:0;margin:0;z-index:2;width:1200px;margin:0 auto;}
#side_box .sub_menu * {transition:all .2s;}
#side_box .sub_menu:after{content:"";display:block;clear:both;}
#side_box .sub_menu h2 {font-size:0;float:left;border: 1px solid rgba(255,255,255,0.2);border-width: 0 1px;box-sizing: border-box;}
#side_box .sub_menu h2 a {display:inline-block;width: 52px;height:54px;background: url('../images/sub/ico_navi_home.png') no-repeat 50% 50%;font-size:0;}
#side_box .sub_menu dl {float:left;font-size:0;vertical-align:top;height:54px;line-height:54px;box-sizing:border-box;text-align:left;font-size:0;font-weight:500;}
#side_box .sub_menu dt,
#side_box .sub_menu dd {display:inline-block;vertical-align:top;height:inherit;line-height:inherit;text-align: left;color: #fff;box-sizing:border-box;border-right: 1px solid rgba(255,255,255,0.2);font-weight:400;width: 220px;font-size: 16px;}
#side_box .sub_menu dt {cursor:default;color: rgba(255,255,255,.8);}
#side_box .sub_menu dd {position:relative;z-index: 5;}
#side_box .sub_menu dt,
#side_box .sub_menu dd strong {padding: 0 40px 0 15px;}
#side_box .sub_menu dd strong {display:block;cursor:pointer;box-sizing:border-box;font-size:inherit;font-weight:500;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
#side_box .sub_menu dd strong:after {content:'';display:block;width: 1px;height: 1px;position: absolute;right: 20px;top: 50%;margin-top: -3px;transform-origin:bottom;transition: all .2s;border-left: 5px solid transparent;border-right: 5px solid transparent;border-top: 5px solid #fff;}
#side_box .sub_menu dd.on strong {background:rgba(0,0,0,0.3);color: var(--point-color01);}
#side_box .sub_menu dd.on strong:after {transform: rotate(181deg);margin-top: -9px;}
#side_box .sub_menu dd strong img{padding-left:5px;}
#side_box .sub_menu dd ul {display:none;position:absolute;left: -1px;top: 100%;width: calc(100% + 2px);z-index:5;overflow:hidden;border: 1px solid #ddd;background:#fff;box-sizing: border-box;text-align: left;}
#side_box .sub_menu dd ul li:nth-of-type(1) {margin-top: 7px;}
#side_box .sub_menu dd ul li:last-of-type {margin-bottom: 13px;}
#side_box .sub_menu dd ul li {background:#fff;border-top:0;font-weight: 400;font-size: 15px;color: #555;height: 2.66em;line-height: 2.8;}
#side_box .sub_menu dd ul li + li {}
#side_box .sub_menu dd ul li a {padding: 0 20px;display:inline-block;vertical-align:top;box-sizing:border-box;text-align:center;font-weight:400;font-size: 15px;color: inherit;width:100%;text-align: left;}
#side_box .sub_menu dd ul li.on a,
#side_box .sub_menu dd ul li:hover a {font-weight:600;color: #333;}


@media only screen and (max-width:1217px) {
	#side_box .sub_menu {width:100%;}
}

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

@media only screen and (max-width:860px) {
	#side_box .sub_menu h2 a {width:50px;height:50px;background-size:auto 16px;}
	#side_box .sub_menu dl {line-height:50px;height:50px;width: calc(100% - 52px);}
	#side_box .sub_menu dt,
	#side_box .sub_menu dd {width: 40%;font-size: 14px;}
	#side_box .sub_menu dt,
	#side_box .sub_menu dd strong {padding:0 18px;}
	#side_box .sub_menu dd ul li a {font-size:14px;padding:0 18px;}
}

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

@media only screen and (max-width:640px) {
	#side_box .sub_menu dt,
	#side_box .sub_menu dd {width:50%;}
}

@media only screen and (max-width: 479px) {
	#side_box .sub_menu h2 a {width:40px;height:45px;}
	#side_box .sub_menu dl {line-height:45px;height:45px;width: calc(100% - 42px);}
	#side_box .sub_menu dt {display:none;}
	#side_box .sub_menu dd {width:100%;font-size: 13px;border-right: 0;}
	#side_box .sub_menu dd strong {padding:0 14px;}
	#side_box .sub_menu dd ul li a {font-size:13px;line-height:2.3;padding:0 18px;}
}

/*───────────────────────────────────────────────────────────
	navigation common
───────────────────────────────────────────────────────────*/
.nav_wrap {}
.nav_wrap .nav_box {border:0;margin:0;padding-bottom: 60px;position:relative;z-index:1;}
.nav_wrap .nav_box:after {clear:both;content:"";display:block;}
.nav_wrap .nav_box h2 {font-size:40px;line-height: 1.1;padding:0;margin:0;text-align:center;color:var(--point-color03);font-weight:600;z-index:1;text-transform:uppercase;}
.nav_wrap .nav_box span + h2{padding-top:30px;}
.nav_wrap .nav_box p {font-size: 18px;line-height: 1.44;padding: 1.5em 0 0 0;color:#666;font-weight:400;text-align:center;}
.nav_wrap .nav_box ul {line-height:18px;top:20%;position:absolute;left:0;font-size:0;padding:0;z-index:5;display:block;}
.nav_wrap .nav_box ul li {line-height:18px;height:18px;font-size:8px;text-align:left;vertical-align:top;padding:0;color:#aaa;display:inline-block;}
.nav_wrap .nav_box ul li + li {padding-left:5px;}
.nav_wrap .nav_box ul li span,
.nav_wrap .nav_box ul li strong,
.nav_wrap .nav_box ul li > a {line-height:18px;height:18px;padding:0 4px 0px 0;font-size:12px;display:inline-block;width:auto;color:#666;vertical-align:top;margin:0;box-sizing:border-box;}
.nav_wrap .nav_box ul li a.home {padding-left:0px;font-size:12px;color:#666666;}
.nav_wrap .nav_box ul li a.home:before {width:11px;height:11px;margin:0 5px 2px 0;content:"";display:inline-block;background:url("../images/common/sub_locate_home.png") no-repeat left center #333333;background-size:auto 13px;vertical-align:middle;}
.nav_wrap .nav_box ul li:last-child a,
.nav_wrap .nav_box ul li:last-child span,
.nav_wrap .nav_box ul li:last-child strong {color:#444;font-weight:700;padding-right:0;}

.nav_wrap .nav_box ul li .navi_select {min-width:150px;border: 1px solid #999;cursor: pointer;margin-top: -3px;position:relative;box-sizing: border-box;}
.nav_wrap .nav_box ul li .navi_select .navi_tit {padding: 2px 10px;line-height: 18px;height: auto;display: block;}
.nav_wrap .nav_box ul li .navi_select .navi_tit:after {content:"";display:inline-block;border-left: 5px solid transparent;border-right: 5px solid transparent;border-top: 5px solid #999;position:absolute;right: 10px;top: 9px;transition:all .2s;}
.nav_wrap .nav_box ul li .navi_select ul {display:none;position:absolute;left: -1px;top: 100%;width:150px;background:#fff;padding:6px 0 6px 0;border: 1px solid #888;box-sizing: border-box;}
.nav_wrap .nav_box ul li .navi_select ul li {display: block;line-height: 1;height: auto;font-size: 12px;padding: 0;}
.nav_wrap .nav_box ul li .navi_select ul li a {display:block;padding:5px 10px;font-size: 12px;line-height: 1;height: auto;transition:all .2s;}
.nav_wrap .nav_box ul li .navi_select ul li a:hover {background:#999;color:#fff;}

.nav_wrap .nav_box ul li .navi_select:hover .navi_tit:after {transform: rotate(180deg);}
.nav_wrap .nav_box ul li .navi_select:hover ul {display:block;}

	.nav_wrap .nav_box.dis_flex{display:flex;}
	.nav_wrap .nav_box.dis_flex h2{width: 305px;padding-top:0 !important;}
	.nav_wrap .nav_box.dis_flex .sub_title{width: calc(100% - 305px);text-align:left;padding-top: 2px;}
	.nav_wrap .nav_box.dis_flex .sub_title h3 small{font-size:94.4%;}
	.nav_wrap .nav_box.dis_flex .sub_title h3 + p{margin-top: 17px;text-align:left;padding-top:0;word-break:keep-all;}



	@media only screen and (max-width:1217px) {
		.nav_wrap .nav_box h2{font-size:41px;}
		.nav_wrap .nav_box.dis_flex h2{width:250px;}
		.nav_wrap .nav_box.dis_flex .sub_title{width:calc(100% - 250px);}
	}
	@media only screen and (max-width:1023px) {
        .nav_wrap .nav_box { padding-bottom: clamp(30px, 8vw, 80px); }
		.nav_wrap .nav_box h2{font-size:38px;}
        .nav_wrap .nav_box span + h2 { padding-top: clamp(20px, 3vw, 30px); }
		.nav_wrap .nav_box.dis_flex{display:block;}
		.nav_wrap .nav_box.dis_flex h2{width:100%;}
		.nav_wrap .nav_box.dis_flex .sub_title{width:100%; padding-top:30px;}
	}
	@media only screen and (max-width: 860px) {
		
		.nav_wrap .nav_box h2{font-size:35px;}
	}
	@media only screen and (max-width:767px) {
		.nav_wrap .nav_box.dis_flex .sub_title p br{display:none;}
	}
	@media only screen and (max-width:640px) {
		
		.nav_wrap .nav_box h2{font-size:32px;}

		.nav_wrap .nav_box.dis_flex .sub_title{padding-top:25px;}
		.nav_wrap .nav_box.dis_flex .sub_title h3 + p{margin-top:10px;}
	}
	@media only screen and (max-width:479px) {
		.nav_wrap .nav_box h2{font-size:29px;}
		.nav_wrap .nav_box h2:after{margin-left:10px; transform:none;}

		.nav_wrap .nav_box.dis_flex .sub_title{padding-top:20px;}
	}
	@media only screen and (max-width:431px) {
		.nav_wrap .nav_box h2{font-size:26px;}
	}


/*───────────────────────────────────────────────────────────
	 COMPANY
───────────────────────────────────────────────────────────*/
/*** company/index (회사소개) ***/
.sub_about {  }
.sub_about * {word-break:keep-all;}
.sub_company .point_tit{font-size:var(--title-18);color:var(--point-color01);font-weight:600;display:block;text-align:center;letter-spacing:0;}
.sub_about .sub_about_tit{ margin:0 auto;box-sizing:border-box;}
.sub_about .sub_about_tit p{font-size:var(--title-18);color:#333;font-weight:400;text-align:center;line-height:1.78;letter-spacing:-0.03em;}
.sub_about .sub_about_tit p + p { margin-top: 15px; }
.sub_about .img_list { display: flex; flex-wrap: wrap; margin-top: 20px; gap: 20px; }
.sub_about .img_list li { width: calc(100% / 3 - 13.34px); }
.sub_about .img_list li img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sub_about .about_intro { margin-top: 120px; font-size: var(--title-20); }
.sub_about .about_intro ul { margin-top: 40px; }
.sub_about .about_intro li + li { margin-top: 20px; padding-top: 20px; box-sizing: border-box; border-top: 1px solid var(--border-color01); }
.sub_about .about_intro dl { display: flex; flex-wrap: wrap; gap: 15px 0; }
.sub_about .about_intro dt { color: var(--point-color03); font-size: 110%; width: 30%; padding-right: 20px; box-sizing: border-box; }
.sub_about .about_intro dd { font-weight: 500; width: 70%; }

@media screen and (max-width: 1023px){
    
    .sub_about .sub_about_tit p + p { margin-top: clamp(10px, 1.5vw, 15px); }
    .sub_about .about_intro { margin-top: clamp(80px, 12vw, 120px); }
    .sub_about .about_intro ul { margin-top: clamp(20px, 4vw, 40px); }
    .sub_about .about_intro li + li { margin-top: clamp(15px, 2vw, 20px); padding-top: clamp(15px, 2vw, 20px); }
}


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

    .sub_about .img_list { gap: 20px 15px; }
    .sub_about .img_list li { width: calc(100% / 3 - 10px); }
    .sub_about .about_intro dl { flex-direction: column; }
    .sub_about .about_intro dt { padding-right: 0; width: 100%; font-size: 100%; }
    .sub_about .about_intro dd { width: 100%; font-size: 90%; }
}

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

    .sub_about .img_list li { width: calc(100% / 2 - 7.5px); }
    .sub_about .about_intro dl { gap: 10px 0; }
    .sub_about .about_intro dd 
}

/*** company/location (오시는길) ***/

.sub_location ul { display: flex; flex-wrap: wrap; gap: 20px 40px; font-size: var(--title-20); justify-content: space-between; margin-top: 30px; }
.sub_location ul li { display: flex; gap: 20px;  } 
.sub_location ul dl { display: flex; gap: 20px 0; }
.sub_location ul dt { color: var(--point-color03); font-weight: 600; padding-right: 20px; box-sizing: border-box; }
.sub_location ul dd { font-size: 90%; color: var(--black-color06); }
.sub_location ul dd a { display: block; width: 100%; height: 100%; color: inherit; font-weight: inherit; font-size: inherit; }
.sub_location .map_wrap .map { margin-top: 40px; height: 420px; }
.sub_location .map_wrap + .map_wrap { margin-top: 120px; }

@media screen and (max-width: 1023px){
    .sub_location ul { margin-top: clamp(15px, 3vw, 30px); gap: clamp(15px, 2vw, 20px) clamp(20px, 4vw, 40px); }
    .sub_location ul dl { gap: 10px 0; }
    .sub_location ul dt { padding-right: clamp(10px, 2vw, 20px); }
    .sub_location .map_wrap + .map_wrap { margin-top: clamp(80px, 12vw, 120px); }
    .sub_location .map_wrap .map { margin-top: clamp(15px, 3.5vw, 38px); height: clamp(250px, 42vw, 420px); }
}

@media screen and (max-width: 479px){
    .sub_location .map_wrap ul { gap: 10px; }
}


/*** company/history (연혁) ***/
	.history_cont{width:1200px;margin:0 auto;margin-top:47px;box-sizing:border-box;}
	.history_box{margin-bottom:36px;text-align:left;}
	.history_box .history_year{width:320px;display: inline-block;vertical-align: top;line-height:32px;padding-top:29px;border-top:1px solid #000;}
	.history_box .history_year span{font-size:42px;color:#000;font-weight:600;letter-spacing:-0.06em;}
	.history_box .history_detail{width:840px;display: inline-block;padding-top:27px;border-top:1px solid #ccc;margin-left:37px;}
	.history_box .history_detail dl{padding-left:9px;margin-bottom:22px;}
	.history_box .history_detail dl dt{display: inline-block;vertical-align:top;margin:3px 32px 0 0;line-height:1;width:22px;letter-spacing:-0.05em;}
	.history_box .history_detail dl dd{display: inline-block;margin-top:-2px;width:calc(100% - 70px);line-height:1;}
	.history_box .history_detail .month{font-size:18px;color:#000;font-weight:600;}
	.history_box .history_detail .detail{font-size:17px;color:#666;font-weight:300;position: relative;padding-left:13px;line-height:25px;font-family:'Noto Sans KR', Sans-serif;letter-spacing:-0.035em;word-break:keep-all;}
	.history_box .history_detail .detail:before{width:3px;height:3px;border-radius:100%;background-color:#888;content:"";position: absolute;left:1px;top:11px;}
	.history_box .history_detail .detail + .detail{margin-top:9px;}

@media only screen and (max-width:1250px) {
	.history_cont{width:100%;padding:0 15px;}
	.history_box .history_year{width:25%;}
	.history_box .history_detail{width:70%;}
}
@media only screen and (max-width:910px) {
	.history_box .history_year{width:22%;}
	.history_box .history_year span{font-size:38px;}
	.history_box .history_detail{width:72%;}
	.history_box .history_detail .month{font-size:17px;}
	.history_box .history_detail .detail{font-size:16px;}	
}
@media only screen and (max-width:780px) {
	.history_box .history_year{width:20%;}
	.history_box .history_year span{font-size:32px;}
	.history_box .history_detail .month{font-size:16px;}
	.history_box .history_detail .detail{font-size:15px;}	
	.history_box .history_detail .detail:before{top:10px;}
}
@media only screen and (max-width:640px) {
	.history_cont{padding:0;}
	.history_box {margin-bottom:50px;}
	.history_box .history_year{display: block;width:100%;border-top:none;border-bottom:1px solid #000;padding-top:0;padding-bottom:10px;}
	.history_box .history_year span{font-size:42px;}
	.history_box .history_detail{display: block;width:100%;margin-left:0;margin-top:15px;border-top:none;border-bottom:1px solid #ccc;padding-top:0;padding-bottom:15px;}
	.history_box .history_detail .month{font-size:18px;}
	.history_box .history_detail .detail{font-size:17px;}	
	.history_box .history_detail .detail:before{top:12px;}
}
@media only screen and (max-width:375px) {
	.history_cont{margin-top:0px;}
	.history_box .history_year{padding-bottom:4px;}
	.history_box .history_year span{font-size:35px;}
	.history_box .history_detail .month{font-size:17px;}
	.history_box .history_detail .detail{font-size:16px;}	
}
@media only screen and (max-width:320px) {
	.history_box{margin-bottom:36px;}
	.history_box .history_year span{font-size:28px;}
	.history_box .history_detail .detail{font-size:15px;}	
}




/*** 조직도 ***/
.sub_work { font-size: var(--title-20); position: relative; }
.sub_work .line_box { margin-top: 60px; position: relative; }
.sub_work .line_box02 { margin-top: 90px; position: relative; }
.sub_work .line_box03 { padding-top: 50px; position: relative; }
.sub_work .line_box::before { content: ''; width: 1px; height: 60px; background: var(--border-color01); position: absolute; top: -60px; left: calc(50% - 1px); }
.sub_work .line_box02::before { content:''; width: 1px; height: 250px; background: var(--border-color01); position: absolute; top: -250px; left: calc(50% - 1px); z-index: 1; }
.sub_work .line_box02::after { content: ''; width: calc(100% - calc(100% / 5 - 80px)); height: 1px; background: var(--border-color01); position: absolute; top: 0; left: calc(50% - 0.5px); transform: translateX(-50%); z-index: 1; }
.sub_work .line_box03::before { content:''; width: 1px; height: 50px; background: var(--border-color01); position: absolute; top: 0; left: calc(50% - 1px); z-index: 1; }
.sub_work .line_box03::after { content:''; display: block; width: 9px; aspect-ratio: 1/1; background: var(--point-color03); position: absolute; top: 0; left: calc(50% - 0.5px); border-radius: 9999px; transform: translate(-50%, -50%); z-index: 2; }
.sub_work .work_title { position: relative; }
.sub_work h3,
.sub_work h4,
.sub_work h5 { position: relative; display: flex; justify-content: center; align-items: center; width: 275px; height: 80px; color: var(--point-white); font-size: 130%; font-weight: 600; letter-spacing: -0.03em; margin-inline: auto; text-align: center; padding: 0 10px; box-sizing: border-box;}
.sub_work h3 { background: var(--point-color03); }
.sub_work h4 { background: var(--point-color01); }
.sub_work h5 { background: var(--point-color02); }
.sub_work h3::after,
.sub_work h4::after,
.sub_work h5::after { content: ''; position: absolute; right: -1px; top: -1px; width: 60px; height: 60px; background: var(--point-white); clip-path: polygon(70% 0, 100% 30%, 100% 0); }
.sub_work .center_line { position: relative; margin-top: 20px; }
.sub_work .center_line > li { position: relative;width: 200px; height: 60px; margin-left: auto; color: var(--point-white); font-size: 130%; font-weight: 600; letter-spacing: -0.03em; text-align: center; background: var(--point-color01); }
.sub_work .center_line > li + li { margin-top: 20px; }
.sub_work .center_line > li::before { content: ''; position: absolute; left: -50%; top: 50%; transform: translateY(-50%); height: 1px; width: 50%; background: var(--border-color01); }
.sub_work .center_line > li::after { content: ''; position: absolute; left: -50%; top: 0; width: 1px; height: 100%; background: var(--border-color01); }
.sub_work .center_line > li:nth-child(1)::after { transform: translateY(50%); }
.sub_work .center_line > li:nth-child(2)::after { transform: translateY(-50%); }
.sub_work .center_line > li span { position: relative; display: block; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 0 10px; box-sizing: border-box;  }
.sub_work .center_line > li span::after { content: ''; position: absolute; right: -1px; top: -1px; width: 60px; height: 60px; background: var(--point-white); clip-path: polygon(70% 0, 100% 30%, 100% 0); }
.sub_work .center_line::before { content: ''; position: absolute; left: 50%; top: 50%; transform: translateY(-50%); width: calc(50% - 300px); height: 1px; background: var(--border-color01); }
.sub_work .work_box { display: flex; flex-wrap: wrap; gap: 100px; }
.sub_work .work_box > li { position: relative; width: calc(100% / 5 - 80px); }
.sub_work .work_box > li > ul > li:nth-child(1) { display: flex; justify-content: center; align-items: center; width: 100%; height: 70px; border: 1px solid var(--point-color01); background: var(--point-white); color: var(--point-color01); font-size: 110%; font-weight: 500; letter-spacing: -0.03em; box-sizing: border-box; text-align: center; padding: 0 10px; }
.sub_work .work_box > li > ul > li:not(:nth-child(1)) > ul > li { display: flex; justify-content: center; align-items: center; width: 100%; height: 66px; border: 1px solid var(--border-color01); background: var(--gray-bg02); color: var(--black-color03); font-size: 95%; font-weight: 400; letter-spacing: -0.03em; box-sizing: border-box; margin-top: 10px; text-align: center; padding: 0 10px; }

@media screen and (max-width: 1023px){
    .sub_work .work_box { gap: 50px; }
    .sub_work .work_box > li { width: calc(100% / 5 - 40px); }
    .sub_work .line_box02::after { width: calc(100% - calc(100% / 5 - 40px)); }

}

@media screen and (max-width: 860px){
    .sub_work .work_box { gap: 20px; }
    .sub_work .work_box > li { width: calc(100% / 5 - 16px); }
    .sub_work .work_box > li > ul > li:nth-child(1) { height: 60px; }
    .sub_work .work_box > li > ul > li:not(:nth-child(1)) > ul > li { height: 55px; }
    .sub_work .line_box02::after { width: calc(100% - calc(100% / 5 - 16px)); }
    .sub_work h3,
    .sub_work h4,
    .sub_work h5 { width: 247px; height: 67px; }
    .sub_work .center_line > li { width: 180px; height: 54px; }
    .sub_work .center_line::before { width: calc(50% - 270px); }
    .sub_work .line_box02::before { height: 238px; top: -238px; }
}

@media screen and (max-width: 640px){
    .sub_work .work_box > li { width: calc(100% / 3 - 13.34px); }
    .sub_work .line_box { margin-top: 40px; }
    .sub_work .line_box::before { height: 40px; top: -40px; }
    .sub_work .line_box02::after { width: calc(100% - calc(100% / 3 - 13.34px)); }
    .sub_work h3,
    .sub_work h4,
    .sub_work h5 { width: 200px; height: 70px; font-size: 120%; }
    .sub_work .center_line > li { margin-inline: auto; font-size: 110%; }
    .sub_work .center_line > li::before { width: 1px; height: 20px; left: 50%; top: -20px; background: var(--border-color01); transform: translateY(0); }
    .sub_work .center_line > li::after { display: none; }
    .sub_work .center_line::before { display: none; }
    .sub_work .line_box02 { margin-top: 70px; }
    .sub_work .line_box02::before { height: 70px; top: -70px; }
    .sub_work .line_box03 { padding-top: 30px; }
    .sub_work .line_box03::before { height: 30px; }
    .sub_work .work_box > li > ul > li:nth-child(1) { height: 60px; }
    .sub_work .work_box > li > ul > li:not(:nth-child(1)) > ul > li { height: 50px; }
    .sub_work .line_box03:where(:nth-child(4), :nth-child(5)) { padding-top: 0; }
    .sub_work .line_box03:where(:nth-child(4), :nth-child(5))::before { display: none; }
    .sub_work .line_box03:where(:nth-child(4), :nth-child(5))::after { display: none; }
    
}

@media screen and (max-width: 479px){
    .sub_work h3, 
    .sub_work h4,
    .sub_work h5 { width: 160px; height: 60px; }
    .sub_work .line_box02 { margin-top: 50px; }
    .sub_work .line_box02::before { height: 50px; top: -50px; }
    .sub_work .line_box02::after { width: calc(100% - calc(100% / 2 - 10px)); }
    .sub_work .center_line > li { width: 144px; height: 48px; }
    .sub_work .work_box > li { width: calc(100% / 2 - 10px); }
    .sub_work .work_box > li > ul > li:nth-child(1) { height: 50px; }
    .sub_work .work_box > li > ul > li:not(:nth-child(1)) > ul > li { height: 40px; }
    .sub_work .line_box03:where(:nth-child(3), :nth-child(4), :nth-child(5)) { padding-top: 0; }
    .sub_work .line_box03:where(:nth-child(3), :nth-child(4), :nth-child(5))::before { display: none; }
    .sub_work .line_box03:where(:nth-child(3), :nth-child(4), :nth-child(5))::after { display: none; }
    
}


/*** 수행실적 ***/
.sub_performance {}
.sub_performance .perfor_cont {margin-top: 30px;}
.sub_performance .perfor_cont table {border-top: 1px solid #000; overflow: scroll;}
.sub_performance .perfor_cont tr {border-bottom: 1px solid #ddd;}
.sub_performance .perfor_cont th,
.sub_performance .perfor_cont td {box-sizing: border-box; padding: 17px 10px 15px; font-size: 18px; letter-spacing: 0.05em; line-height: 1.4; text-align: center;}
.sub_performance .perfor_cont th {background: #fff; font-weight: 500; color: var(--point-color03);}
.sub_performance .perfor_cont td {font-weight: 300; color: #666;}
.sub_performance .perfor_cont col:nth-child(1) { width: 10%; }
.sub_performance .perfor_cont col:nth-child(2) { width: 15%; }
.sub_performance .perfor_cont col:nth-child(3) { width: 13%; }
.sub_performance .perfor_cont col:nth-child(5) { width: 15%; }
.sub_performance .perfor_cont col:nth-child(6) { width: 15%; }
.sub_performance .perfor_cont span { font-size: var(--title-16); color: var(--point-color03); font-weight: 400; display: block; margin-bottom: 10px; display: none; }


@media only screen and (max-width:1023px) {
    .sub_performance .perfor_cont span { display: block;  }
    .sub_performance .perfor_cont td {padding: clamp(10px, 1.7vw, 17px) clamp(5px, 1vw, 10px), clamp(10px, 1.5vw, 15px);}
    .sub_performance span { display: block; }
    .sub_performance .perfor_cont th,
    .sub_performance .perfor_cont td {font-size: 16px;}
    .sub_performance .table{width:1100px;}

    .sub_performance .perfor_cont .swiper-container { overflow: visible; }
}
@media only screen and (max-width:860px) {
    .sub_performance .table{width:1000px;}
    .sub_performance .perfor_cont th,
    .sub_performance .perfor_cont td { font-size: 15px;}
}
@media only screen and (max-width:640px) {
    .sub_performance .table{width:900px;}
    .sub_performance .perfor_cont th,
    .sub_performance .perfor_cont td {font-size: 14px;}
}
@media only screen and (max-width:479px) {
    .sub_performance .table{width:800px;}

}


/*** 장비보유현황 ***/
.sub_technology table {border-top: 1px solid #000;}
.sub_technology tr {border-bottom: 1px solid #ddd;}
.sub_technology th,
.sub_technology td {box-sizing: border-box; padding: 17px 10px 15px; font-size: var(--title-18); letter-spacing: 0.05em; line-height: 1.4; text-align: center; word-break: keep-all; }
.sub_technology th {background: #fff; font-weight: 500; color: var(--point-color03); font-size: var(--title-18); }
.sub_technology td {font-weight: 300; color: #666;}
.sub_technology td:nth-child(1) { text-align: left; }

@media screen and (max-width: 1023px){
    .sub_technology td { padding: clamp(10px, 1.7vw, 17px) clamp(5px, 1vw, 10px), clamp(10px, 1.5vw, 15px); }
}

@media screen and (max-width: 860px){
    .sub_technology col:nth-child(4),
    .sub_technology th:nth-child(4),
    .sub_technology td:nth-child(4) { display: none; }
    .sub_technology col:nth-child(3) { width: 10%; }
}

@media screen and (max-width: 479px){
    .sub_technology col:nth-child(1) { width: 30%; }
}

@media screen and (max-width: 410px){
    .sub_technology th { font-size: 12px; }
    .sub_technology td { font-size: 12px;}
}

@media screen and (max-width: 350px){
    .sub_technology th { font-size: 10px; }
    .sub_technology td { font-size: 10px;}
}


.sub_partners { font-size: var(--title-20); }
.sub_partners .cate_wrap{display: flex;flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 40px;}
.sub_partners .cate_wrap > li{font-size: var(--title-18); font-weight: 400;color: var(--black-color06); line-height: 1.58; padding: 18px 29px; box-sizing: border-box; border-radius: 100px; border: 1px solid var(--border-color01); cursor: pointer; transition: all 0.4s; }
.sub_partners .cate_wrap > li > button { display: block; width: 100%; height: 100%; color: inherit; font-size: inherit; font-weight: inherit; }
.sub_partners .cate_wrap > li.on{color: var(--point-white); font-weight: 500; border: 1px solid var(--point-color01); background: var(--point-color01)}
.sub_partners .partner_con > ul > li { display: flex; align-items: center; gap: 20px; }
.sub_partners .partner_con > ul > li + li { margin-top: 40px; padding-top: 40px; border-top: 1px solid var(--border-color01); box-sizing: border-box; }
.sub_partners .partner_con > ul > li .img { width: 30%; flex-shrink: 0; }
.sub_partners .partner_con > ul > li strong { display: block; margin-bottom: 20px; color: var(--point-color01); font-size: 120%; line-height: 1.5; }
.sub_partners .partner_con > ul > li dl { display: flex; gap: 5px 0; }
.sub_partners .partner_con > ul > li dl + dl { margin-top: 15px; }
.sub_partners .partner_con > ul > li dt { width: 110px; padding-right: 20px; box-sizing: border-box; color: var(--point-color03); flex-shrink: 0; }
.sub_partners .partner_con > ul > li dd { line-height: 1.5; }
.sub_partners .partner_con .map_con { margin-top: 80px; }
.sub_partners .partner_con .map_con img { display: block; margin-inline: auto; }
.sub_partners .partner_con { display: none; }
.sub_partners .partner_con.on { display: block; }

@media (hover: hover) and (pointer: fine){
    .sub_partners .cate_wrap > li:hover {color: var(--point-white); font-weight: 500; border: 1px solid var(--point-color01); background: var(--point-color01)}
}

@media screen and (max-width: 1023px){
    .sub_partners .cate_wrap > li { padding: clamp(10px, 1.8vw, 18px) clamp(15px, 2.9vw, 29px); }
    .sub_partners .partner_con > ul > li + li { margin-top: clamp(20px, 4vw, 40px); padding-top: clamp(20px, 4vw, 40px); }
    .sub_partners .partner_con > ul > li strong { margin-bottom: clamp(10px, 2vw, 20px); }
    .sub_partners .partner_con > ul > li dt { padding-right: clamp(10px, 2vw, 20px); flex-shrink: 0; }
    .sub_partners .partner_con > ul > li dl + dl { margin-top: clamp(10px, 1.5vw, 15px); }
    .sub_partners .partner_con .map_con { margin-top: clamp(40px, 8vw, 80px); }
}

@media screen and (max-width: 640px){
    .sub_partners .partner_con > ul > li { flex-direction: column; align-items: flex-start; }
    .sub_partners .partner_con > ul > li .img { width: 40%; flex-shrink: 0; margin-inline: auto; }
    .sub_partners .partner_con > ul > li .info{ width: 100%; }
    .sub_partners .partner_con > ul > li dl { flex-direction: column; }
    .sub_partners .partner_con > ul > li dt { width: 100%;}
    .sub_partners .partner_con > ul > li dd { width: 100%; }
    
}

@media screen and (max-width: 479px){
    .sub_partners .partner_con > ul > li strong { font-size: 110%; }
    .sub_partners .partner_con > ul > li dt { font-size: 90%; }
    .sub_partners .partner_con > ul > li dd { font-size: 90%; }
}


/*** 채용공고 ***/

.sub_recruit .tab_title{font-size: var(--title-20); text-align: center; margin-bottom: 45px;}
.sub_recruit .tab_title h5{font-size: 150%; font-weight: bold; color: var(--black-color03); line-height: 1.4;}
.sub_recruit .tab_title h5 em{font-weight: inherit; color: var(--point-color01);}
.sub_recruit .tab_title h5 strong{font-weight: 900;}

.sub_recruit .detail_list{border-top: 2px solid var(--black-color01);}
.sub_recruit .detail_list > li{padding:53px 0; box-sizing: border-box; border-bottom: 1px solid var(--border-color01); display: flex; align-items: center;}
.sub_recruit .detail_list > li.start{align-items: flex-start;}
.sub_recruit .detail_list .info{font-size: var(--title-20); width:190px; box-sizing: border-box; padding-right: 15px;}
.sub_recruit .detail_list .info h5{font-size: 130%; font-weight: 500; color: var(--black-color03); line-height: 1.3;}
.sub_recruit .detail_list .exp{font-size: var(--title-20); width: calc(100% - 190px); box-sizing: border-box;}
.sub_recruit .detail_list .exp p{font-size: 90%; font-weight: 500; color: var(--black-color06); line-height: 1.4;}
.sub_recruit .detail_list .exp:has(.btn_wrap){display: flex; gap:20px; align-items: center;}
.sub_recruit .detail_list .btn_wrap{padding:0; margin:0;}
.sub_recruit .step_list{display: flex; gap:79px;}
.sub_recruit .step_list > li{position:relative; width:calc(100% / 4 - 59.25px); padding-bottom: calc(100% / 4 - 59.25px); border-radius: 100%; background: var(--gray-bg02); box-sizing: border-box;}
.sub_recruit .step_list > li + li:before{position: absolute; content:''; width:20px; height:20px; background:var(--black-color01) url('../images/sub/sub_employment_arw.svg') no-repeat center; border-radius: 100%; top:50%; right:calc(100% + 29px); transform: translateY(-50%);}
.sub_recruit .step_list .desc{position:absolute;top:0;left:0;display:flex;align-items: center;justify-content: center;text-align: center;flex-direction: column;width:100%;height:100%;gap: 14px;font-size: var(--title-20);}
.sub_recruit .step_list .desc dt{font-size: 0;display: flex;align-items: center;justify-content: center;margin:0 auto;height: 62px;}
.sub_recruit .step_list .desc dd{font-size: 90%;font-weight: 500;color: var(--black-color03);display:flex;flex-direction: column;gap: 1px;}
.sub_recruit .step_list .desc dd small{font-size: 88.8%; font-weight: inherit; color: var(--black-color06);}
.sub_recruit .stepExp_list{font-size: var(--title-20); margin-top:40px; counter-reset: stepNum;}
.sub_recruit .stepExp_list > li{position: relative; padding:22px 30px;}
.sub_recruit .stepExp_list > li:nth-child(2n){background: rgba(48, 30, 227, 0.03);}
.sub_recruit .stepExp_list .marker{position:absolute; left:30px; top:50%; transform:translateY(-50%); font-size: 85%; font-weight: bold; color: var(--black-color01); display: inline-flex; gap: 4px;}
.sub_recruit .stepExp_list .marker:after{content:counter(stepNum, decimal-leading-zero); counter-increment: stepNum; color: var(--point-color01);}
.sub_recruit .stepExp_list dl{display: flex; align-items:center; padding-left:110px; box-sizing: border-box;}
.sub_recruit .stepExp_list dl :where(dt,dd){font-size: 85%; font-weight: 500;}
.sub_recruit .stepExp_list dl dt{color: var(--black-color03); width:130px; padding-right: 15px; box-sizing: border-box;}
.sub_recruit .stepExp_list dl dd{color: var(--black-color06); width:calc(100% - 130px); box-sizing: border-box;}
.sub_recruit .stepExp_list dl dd span{color: var(--black-color10);}

@media screen and (max-width:1280px){
    .sub_recruit .step_list{gap:6vw;}
    .sub_recruit .step_list > li{width:calc(100% / 4 - 4.5vw); padding-bottom: calc(100% / 4 - 4.5vw);}
    .sub_recruit .step_list > li + li:before{right:calc(100% + 2.25vw - 4px);}
    .sub_recruit .step_list .desc dt{width:5vw; height:4.8vw;}
}
@media screen and (max-width:1023px){
    .tab_title{ margin-bottom: 40px;}
    .sub_recruit .detail_list > li{padding:45px 0;}
    .sub_recruit .detail_list .info{width:170px;}
    .sub_recruit .detail_list .exp{width:calc(100% - 170px);}
    .sub_recruit .step_list .desc{gap:10px;}
    .sub_recruit .stepExp_list > li{padding:20px 30px;}
    .sub_recruit .stepExp_list dl{padding-left: 100px;}
    .sub_recruit .stepExp_list dl dt{width:120px;}
    .sub_recruit .stepExp_list dl dd{width:calc(100% - 120px);}
}
@media screen and (max-width:860px){
    .tab_title{ margin-bottom: 35px;}
    .sub_recruit .detail_list > li{padding:40px 0;}
    .sub_recruit .detail_list .info{width:150px;}
    .sub_recruit .detail_list .exp{width:calc(100% - 150px);}
    .sub_recruit .detail_list > li.start{flex-direction:column; gap:30px;}
    .sub_recruit .detail_list > li.start .info{width:100%;}
    .sub_recruit .detail_list > li.start .exp{width:100%;}
}
@media screen and (max-width:640px){
    .tab_title{ margin-bottom: 30px;}
    .sub_recruit .detail_list > li{padding:35px 0; flex-direction:column;}
    .sub_recruit .detail_list > :is(li,li.start){gap:25px;}
    .sub_recruit .detail_list > li .info{width:100%;}
    .sub_recruit .detail_list > li .exp{width:100%;}
    .sub_recruit .step_list{flex-direction: column; gap:40px;}
    .sub_recruit .step_list > li{width:150px; padding-bottom: 150px; margin:0 auto;}
    .sub_recruit .step_list > li + li:before{top:auto; right:auto; bottom:calc(100% + 10px); left:50%; transform: translateX(-50%) rotate(90deg); width:18px; height:18px;}
    .sub_recruit .step_list .desc dt{width:32px; height:30px;}
    .sub_recruit .stepExp_list{margin-top:30px;}
    .sub_recruit .stepExp_list > li{padding:20px 25px;}
    .sub_recruit .stepExp_list .marker{left:25px;}
    .sub_recruit .stepExp_list dl{padding-left: 90px;}
    .sub_recruit .stepExp_list dl dt{width:100px;}
    .sub_recruit .stepExp_list dl dd{width:calc(100% - 100px);}
}
@media screen and (max-width:479px){
    .tab_title{ margin-bottom: 25px;}
    .sub_recruit .detail_list > li{padding:30px 0; }
    .sub_recruit .detail_list > :is(li,li.start){gap:20px;}
    .sub_recruit .step_list .desc dt{width:32px; height:30px;}
    .sub_recruit .stepExp_list{margin-top:20px;}
    .sub_recruit .stepExp_list > li{padding:18px 20px;}
    .sub_recruit .stepExp_list .marker{left:20px;}
    .sub_recruit .stepExp_list dl{padding-left: 80px;}
    .sub_recruit .stepExp_list dl dt{width:90px;}
    .sub_recruit .stepExp_list dl dd{width:calc(100% - 90px);}
}
@media screen and (max-width:431px){
    .sub_recruit .stepExp_list dl{flex-direction: column; gap:5px;}
    .sub_recruit .stepExp_list dl dt{width:100%;}
    .sub_recruit .stepExp_list dl dd{width:100%;}
}


/*사업범위*/
	.sub_business .business_list{display: flex;flex-wrap:wrap;gap:40px 30px;}
	.sub_business .business_list > li{width:calc(100% / 3 - 20px);box-sizing:border-box;}
	.sub_business .business_list li .thumb{width:100%;asepect-ratio:1;overflow:hidden;position: relative;}
	.sub_business .business_list li .thumb img{width:100%;height:100%;object-fit:cover;}
	.sub_business .business_list li dl{margin-top:30px;font-size:var(--title-20);}
	.sub_business .business_list li dl dt{font-size:150%;color:var(--black-color00);font-weight:700;}
	.sub_business .business_list li dl	dd{margin-top:20px;}
	.sub_business .business_list li dl dd ul li{font-size:var(--title-18);color:var(--black-color06);font-weight:400;line-height:1.66;}
	.sub_business .business_list li dl dd ul li + li{}
	
	.sub_business .award_box{margin-top:130px;}
	.sub_business .award_box .list{display: flex;flex-wrap:wrap;gap:20px 20px;}
	.sub_business .award_box .list > li{width:calc(25% - 15px);}	
	.sub_business .award_box .list > li .img{width:100%;height:0;padding-bottom:130%;overflow:hidden;position: relative;box-sizing:border-box;border:1px solid var(--border-color01);}
	.sub_business .award_box .list > li .img img{width:100%;height:100%;object-fit:cover;position: absolute;top:0;left:0;}
	
	@media screen and (max-width:1024px){
		.sub_business .business_list{gap:40px 15px;}
		.sub_business .business_list > li{width:calc(100% / 3 - 10px);}
		.sub_business .business_list li dl dd ul li{line-height:1.5;}
		.sub_business .business_list li dl dd ul li + li{margin-top:5px;}
		
		.sub_business .award_box{margin-top:clamp(80px, 12vw, 130px);}
		.sub_business .award_box .list > li{width:calc(100% / 3 - 14px);}	
	}
	@media screen and (max-width:860px){
		.sub_business .business_list{gap:30px 20px;}
		.sub_business .business_list > li{width:calc(100% / 2 - 10px);}
		.sub_business .business_list li dl{margin-top:15px;}
		.sub_business .business_list li dl dd{margin-top:10px;}
	}
	@media screen and (max-width:640px){
		.sub_business .business_list{gap:30px 15px;}
		.sub_business .business_list > li{width:calc(100% / 2 - 7.5px);}
		.sub_business .business_list li dl dd ul li + li{margin-top:3px;}
		
		.sub_business .award_box .list{gap:15px 15px;}
		.sub_business .award_box .list > li{width:calc(100% / 2 - 7.5px);}	
	}
	
/*oversea*/
	.sub_oversea{}
	.sub_oversea .oversea_cont{font-size:var(--title-20);}
	.sub_oversea .oversea_cont + .oversea_cont{margin-top:100px;}
	.sub_oversea h4{text-align: center;font-size:250%;color:var(--black-color00);font-weight:700;line-height:1.2;margin-bottom:40px;}
	.sub_oversea .img{text-align: center;}
	.sub_oversea .des{margin-top:40px;display: flex;flex-direction: column;gap:40px;font-size:var(--title-20);color:var(--black-color00);font-weight:600;line-height:1.2;}
	.sub_oversea .des dl dd{font-size:80%;color:var(--black-color06);font-weight:400;line-height:1.62;margin-top:10px;}
	.sub_oversea .des dl dd ul li{display: flex;align-items:baseline;gap:8px;}
	.sub_oversea .des dl dd ul li:before{width:3px;height:3px;content:"";box-sizing:border-box;background:var(--black-color06);;border-radius:100%;flex-shrink:0;transform:translateY(-4px)}
	.sub_oversea .sec01 .img02{margin-top:89px;}
	
	.sub_oversea .logo{display: flex;flex-wrap:wrap;gap:60px;margin-top:77px;}
	
	.sub_oversea .img_list{display: flex;flex-wrap:wrap;gap:20px;}
	.sub_oversea .img_list li{width:calc(50% - 10px);}
	.sub_oversea .img_list li img{width:100%;height:100%;object-fit:cover;}
	
	@media screen and (max-width:1200px){
		.sub_oversea h4{font-size:220%;margin-bottom:20px;}
	}
	@media screen and (max-width:1024px){
		.sub_oversea .des{margin-top:30px;gap:30px;}
		.sub_oversea .des br{display: none;}
		.sub_oversea .sec01 .img02{margin-top:60px;}
		
		.sub_oversea .logo{gap:40px;margin-top:50px;}
		.sub_oversea .logo li img{width:150px;}
	}
	@media screen and (max-width:860px){
		.sub_oversea h4 br{display: none;}
		
		.sub_oversea .logo li img{width:120px;}
	}
	@media screen and (max-width:640px){
		.sub_oversea .des dl dd ul li{gap:5px;}
		.sub_oversea .des dl dd ul li:before{width:2px;height:2px;transform:translateY(-3px)}
		
		.sub_oversea .logo{gap:25px;margin-top:30px;}
		.sub_oversea .logo li img{width:100px;}
		
		.sub_oversea .img_list{gap:15px;}
		.sub_oversea .img_list li{width:calc(50% - 7.5px);}
	}
	@media screen and (max-width:479px){
		.sub_oversea h4{font-size:160%;}
		.sub_oversea .des{margin-top:25px;gap:25px;}
		.sub_oversea .sec01 .img02{margin-top:40px;}
		
		.sub_oversea .logo{gap:15px;}
		.sub_oversea .logo li{width:calc(100% / 3 - 10px);}
		.sub_oversea .logo li img{width:100%;}
	}