@charset "utf-8";


.sub_contents {width:100%; line-height:1.45; overflow:hidden; position:relative; z-index:2;  color:#666; font-size:1.8rem;}

figure {margin:0;}
.color_w {color:#fff; }
.color_b {color:#000;}}
.bor_line {border:1px solid #ddd; }
.line_top {border-top:2px solid #222; }
.line_bot {border-bottom:1px solid #ddd; }
.grey_bg {background:#f8f8f8 !important;}

.flex_box {display:flex; flex-wrap:wrap;}

.table_info {font-size:1.8rem; text-align:left; margin-top:2.0rem; color:#666; line-height:1.5;}
.table {width:100%;  text-align:center;   position:relative; font-size: 1.8rem; background:transparent; line-height:1.65; }
.table thead {border-top: 3px solid #2a303a; background:#f8f8f8; }
.table thead th{ border-bottom: 1px solid #2a303a;   border-left: 1px solid #2a303a; color: #000; font-weight: bold;  padding: 20px 12px; }
.table thead th:first-child {border-left: 0;}
.table .le_line { border-left: 1px solid #2a303a !important;}
.table .le_line2 { border-left: 1px solid #bebebe !important;}


.table tbody th {border-bottom: 1px solid #bebebe; padding: 12px; color: #000;  vertical-align: middle;  font-weight: bold;}
.table tbody td {border-bottom: 1px solid #bebebe; border-left: 1px solid #bebebe; padding: 12px; color: #555;  vertical-align: middle;  }
.table tbody td:first-child {border-left: 0; text-align:center; }
.table tbody td {text-align:center;}
.table tbody td strong {color:#000;}
.table .ri_line { border-right: 1px solid #bebebe !important;}
.table tfoot {background:#626262; color:#fff; }
.table tfoot th {text-align:center; padding:12px;  vertical-align: middle;}
.table tfoot td {padding: 12px 15px; text-align:center; vertical-align: middle;}



/*동영상*/
.video-section{
  width:100%;
  max-width:100%;
  margin:0 auto;
}

.video-container{
 margin-bottom:0rem;
  background:#dfdfdf;
  position: relative;
  width: 100%;
  height: auto;
  padding-top: 56.25%;
}

.video-container iframe{
  z-index: 1;
  top: 0;
  left: 0;
  position: absolute;
  width: 100%;
  height: 100%;
}
.wps_100 {width:100% !important;}
.pd_150 {padding:15.0rem 0 !important;}
.pd_50 {padding:5.0rem 0 !important;}
.mob_br {display:none;}

@media( max-width:1400px ) {
.side_pd2 {padding-left:17px !important; padding-right:17px !important;}

}




@media( max-width:1600px ) {
.side_pd {padding-left:17px !important; padding-right:17px !important;}

}



@media( max-width:768px ) {
	.mob_br {display:block;}
	.pd_150 {padding:8.0rem 17px !important;}
}	.pd_50 {padding:5.0rem 17px !important;}




/*회사개요*/
.overview_top {padding:12.0rem 5.0rem; overflow:hidden; text-align:center; color:#fff; }
.overview_top > span {font-size:3.0rem; font-weight:700; display:block;}
.overview_top > strong {font-size:5.0rem; margin-top:0rem; font-weight:800; display:block;}
.overview_top > strong br {display:none;}
.overview_top > p {font-size:2.2rem; margin-top:3.0rem; font-weight:500; }
.overview_top > p > span {font-weight:700;}

.overview_ico_wrap {margin-top:8.0rem;  }
.overview_ico_wrap ul {display:grid; gap:2.5rem; grid-template-columns: repeat(3, 1fr);  padding:0 7.0rem;}
.overview_ico_wrap ul li.overview_ico_box {text-align:center; padding:5.0rem 2.5rem 3.5rem 2.5rem; border:1px solid #ddd; border-radius:2.0rem;  }
.overview_ico_wrap ul li.overview_ico_box strong {font-size:2.2rem; font-weight:500; color:#000; margin-top:2.0rem; display:block;  }
.overview_ico_wrap ul li.overview_ico_box p {font-size:1.8rem; margin-top:0.5rem;}
.overview_ico_wrap ul li.overview_ico_box p > span {display:block; margin-top:1.0rem;}

.overview_bt_wrap {margin-top:15.0rem; text-align:center;  }
.overview_bt_wrap h3 {color:#000; font-size:5.0rem; }
.overview_bt_wrap h3 br {display:none;}
.overview_bt_wrap  > ul {margin-top:5.0rem; display:grid; gap:2.5rem; grid-template-columns: repeat(3, 1fr);}


.overview_bt_box {text-align:center; padding:12.0rem 5.0rem 5.0rem 5.0rem; color:#fff; border-radius:2.0rem; overflow:hidden; }
.overview_bt_box h4 {font-size:4.8rem; font-weight:600;}
.overview_bt_box h4 span {display:block; font-size:2.8rem;}
.overview_bt_box ul.overview_bt_li { margin-top:8.0rem;  border-top:3px solid #fff; }
.overview_bt_box ul.overview_bt_li li {font-size:2.2rem; padding:2.5rem; border-bottom:1px solid rgba(255,255,255,0.4); font-weight:500;}
.overview_bt_box ul.overview_bt_li li:first-child {font-weight:800;}

@media( max-width:1600px ) {
.overview_top {border-radius:0;}
.overview_ico_wrap ul {grid-template-columns: repeat(2, 1fr); }

}

@media( max-width:1024px ) {
.overview_bt_wrap  > ul {grid-template-columns: repeat(1, 1fr); max-width:800px; margin:8.0rem auto 0;}
.overview_top > strong {font-size:4.0rem;}
.overview_top > strong br {display:block;}
.overview_top > p  br {display:none;}
.overview_bt_wrap h3 {font-size:3.8rem; }
.overview_bt_wrap h3 br {display:block;}
}

@media( max-width:768px ) {
.overview_ico_wrap ul {grid-template-columns: repeat(1, 1fr); }
.overview_bt_wrap  > ul { margin-top:5.0rem; }

}



/*인사말*/
.message_top {height:50.0rem;}
.message_txt {padding:8.0rem 7.0rem 0 7.0rem; }
.message_txt .txt1 {font-size:3.8rem; font-weight:600; color:#000;}

.message_conts {margin-top:3.0rem; justify-content: space-between; display:flex; }
.message_conts > div {width:48%; }
.message_conts > div p {margin-bottom:2.0rem; font-size:2.0rem;  }

.message_conts .txt2 {font-size:2.8rem; color:#000; font-weight:600; }


.message_name {display:flex;  justify-content: flex-end; margin-top:5.0rem;}
.message_name .name_txt {font-size:2.2rem; color:#000;}
.message_name .name_txt  strong {font-size:3.2rem; font-weight:600; display:inline-block; margin-left:1.0rem; }

@media( max-width:1024px ) {
.message_top {height:35.0rem;}
.message_conts {flex-wrap:wrap;}
.message_conts > div {width:100%; }

.message_name .name_txt img {height:60px;}
}


@media( max-width:768px ) {
.message_txt .txt1 {font-size:3.2rem;}
.message_txt {padding:8.0rem 0 0 0; }

.message_name .name_txt img {height:50px;}
.message_name .name_txt  strong {font-size:2.8rem;}
}


/*About Chairman, About CEO*/

.person_wrap { justify-content: space-between;}
.person_wrap .person_img {width:45%; }
.person_wrap .person_txt {width:50%; padding:5.0rem 0; font-size:2.0rem; }
.person_wrap .person_txt p {margin-bottom:2.0rem;}
.person_wrap .person_txt .txt1 {font-size:2.4rem; color:#000; margin-bottom:3.5rem; font-weight:600; border-bottom:1px solid #ddd; padding-bottom:1.5rem; }
.person_wrap .person_txt .txt1 strong {display:inline-block; margin-left:1.5rem; font-size:2.8rem; }

@media( max-width:768px ) {

.person_wrap .person_img {width:100%; order:1;}
.person_wrap .person_txt {width:100%; order:2;padding:5.0rem 0 0 0;}

}


/*연혁*/
.course_top {}
.course_top .txt1 {font-size:4.6rem; font-weight:700; color:#000;}
.course_top p {font-size:2.2rem; margin-top:2.0rem;  }

.course_top_img {height:50.0rem; margin-top:5.0rem; }
.course_conts {margin-top:8.0rem;}
.course_conts .course_conts_left {width:50%; color:#000; padding-left:5.0rem; position:relative; }
.course_conts .course_conts_left:before {content:'';position:absolute;  width:1.7rem; height:1.7rem; border-radius:100%; background:#c91e1e; left:0; top:1.8rem; }
.course_conts .course_conts_left h3 {font-size:3.8rem; }
.course_conts .course_conts_left span {display:block; font-size:3.2rem; font-weight:700;}
.course_conts .course_conts_left strong {font-size:3.8rem; display:block;  margin-top:3.0rem; line-height:1.3;}


.course_conts .course_conts_right {width:50%;}
.course_conts .course_conts_right ul li {display:flex; width:100%; font-size:2.0rem; margin-bottom:1.8rem;}
.course_conts .course_conts_right ul li strong {width:15.0rem; color:#000;}
.course_conts .course_conts_right ul li p {width:calc(100% - 15.0rem);}

.course_top_img2 {color:#fff; text-align:center; padding:12.0rem 5.0rem; margin-top:8.0rem; }
.course_top_img2 strong {font-size:4.6rem;}
.course_top_img2 p {font-size:7.0rem; font-weight:700;}

.course_conts2 {margin-top:8.0rem;}

.course_conts2_wrap { margin-bottom:8.0rem;}
.course_conts2_wrap .tit {}
.course_conts2_wrap .tit span {font-size:3.0rem; font-weight:700;}
.course_conts2_wrap .tit h4 {font-size:3.4rem; color:#000;}
.course_conts2_wrap ul {display:flex; gap:20px;  justify-content: space-between; margin-top:3.0rem; }
.course_conts2_wrap ul li { background:#f8f8f8; padding:5.0rem 3.0rem 3.0rem 3.0rem; border-radius:2.0rem; text-align:center;  }
.course_conts2_wrap ul li strong { color:#000; font-size:2.4rem;}
.course_conts2_wrap ul li p  {font-size:2.0rem; margin-top:1.0rem;}


@media( max-width:1024px ) {

.course_top {text-align:center;}
.course_top .txt1 {font-size:3.4rem; }
.course_top p {font-size:2.0rem;  }



.course_conts .course_conts_left {width:100%;}
.course_conts .course_conts_right {width:100%; margin-top:5.0rem; padding-left:5.0rem;}

.course_top_img2 strong {font-size:2.6rem;}
.course_top_img2 p {font-size:4.0rem; font-weight:700;}


.course_conts2_wrap .tit h4 {font-size:2.8rem; }
.course_conts2_wrap ul {display:grid; grid-template-columns: repeat(2, 1fr); gap:20px;}
.course_conts2_wrap ul li {}


}

@media( max-width:768px ) {
.course_conts .course_conts_left h3 {font-size:3.0rem; }
.course_conts .course_conts_left span {font-size:2.4rem;}
.course_conts .course_conts_left strong {font-size:3.2rem; margin-top:1.0rem; }

.course_conts2_wrap .tit {text-align:center; }
.course_conts2_wrap .tit h4 strong {display:block;}
.course_conts2_wrap ul {display:grid; grid-template-columns: repeat(1, 1fr); gap:20px;}

}


@media( max-width:500px ) {
.course_conts .course_conts_right ul li {flex-wrap:wrap;}
.course_conts .course_conts_right ul li strong {width:100%;}	
.course_conts .course_conts_right ul li p {width:100%;}
}


/*조직도*/
.subtop_txt {text-align:center;}
.subtop_txt strong {font-size:4.6rem; font-weight:600; color:#000; }
.subtop_txt p {font-size:2.4rem; margin-top:2.0rem;}

.organization_img {text-align:center; padding:5.0rem 2.0rem; background:#f8f8f8; border-radius:2.0rem; margin-top:8.0rem;}


.organization1 {display:block;}
.organization2 {display:none;}

@media( max-width:1024px ) {
.subtop_txt strong {font-size:3.4rem;}
.subtop_txt p {font-size:2.0rem;}

.organization1 {display:none;}
.organization2 {display:block;}


}



/*비전&정체성*/
.vision01 {text-align:center; padding:25vh 5.0rem; color:#fff;   }
.vision02 {text-align:center; padding:20vh 5.0rem;  }
.vision03 {text-align:center; padding:18vh 5.0rem; color:#fff;  }

.vision_txt1 {color:var(--main-color); font-weight:800; font-size:5.0rem;}
.vision_txt2 {font-size:4.6rem; font-weight:700; margin-top:2.0rem; line-height:1.4;}
.vision_txt3 {color:#d9d9d9; font-size:2.8rem;font-weight:500; margin-top:3.0rem;}

.vision03 ul {display:flex; flex-wrap:wrap; justify-content: center; gap:2.0rem; margin-top:5.0rem;}
.vision03 ul li { background:rgba(255, 255, 255,0.1); width:26%; padding:3.5rem 2.0rem; border-radius:2.0rem; 
				-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }

.vision03 .core_txt h4 {font-size:2.8rem;}
.vision03 .core_txt h4 span {opacity:0.6; font-weight:500; font-size:2.4rem; display:block; }
.vision03 .core_txt p {font-size:2.0rem;  margin-top:1.0rem;}

@media( max-width:1400px ) {
.vision03 { padding:15.0rem 2.0rem;}
.vision03 ul li {width:32%;}
}

@media( max-width:1024px ) {
.vision_txt1 {font-size:4.0rem;}
.vision_txt2 {font-size:3.6rem;}
.vision_txt2 br {display:none;}

.vision03 ul li {width:48%;}

}


@media( max-width:768px ) {

.vision_txt1 {font-size:3.0rem;}
.vision_txt2 {font-size:3.2rem;}

.vision03 ul li {width:100%;}
}


/*글로벌 네트워크*/
.global_network {text-align:center; margin-top:5.0rem; position:relative;}
.global_network_title {position:absolute; font-size:3.0rem; font-weight:600; left:calc((100% - 1600px) / 2); top:6.5rem; 
						padding:1.0rem 2.5rem; border-radius:1.5rem;  background:#000; color:#fff; }



@media( max-width:1600px ) {
.global_network_title {left:2.0rem; font-size:2.4rem; top:4.0rem;}

}


@media( max-width:1024px ) {
.global_network {overflow-y:scroll;}
.global_network img {max-width:1100px;}

}

/*주요거래처*/


.clients_top {padding:16.0rem 3.0rem 12.0rem 3.0rem; overflow:hidden; text-align:center; color:#fff; }
.clients_top > strong {font-size:4.0rem; margin-top:0rem; font-weight:800; display:block;}

.clients_top > p {font-size:2.2rem; margin-top:3.0rem; font-weight:500; }
.clients_top > p > span {font-weight:700;}


.client_wrap {margin-top:8.0rem;}
.client_wrap ul {display:grid; gap:3.0rem; grid-template-columns: repeat(4, 1fr);}
.client_wrap ul li img {border:1px solid #ddd; }
.client_wrap ul li figcaption {text-align:center; font-size:2.0rem; margin-top:1.5rem;}


@media( max-width:768px ) {
.client_wrap ul { gap:2.0rem; grid-template-columns: repeat(2, 1fr);}

.clients_top > strong {font-size:3.0rem}
.clients_top > p {font-size:2.0rem; }
}



/*사업영역*/
.biz_conts {padding-top:8.0rem;}
.biz_wrap {padding-bottom:8.0rem;  justify-content: space-between;}
.biz_wrap .biz_img {}
.biz_img {
  width:50%; min-height:47.0rem;
  position: relative;
  overflow: hidden;
  background-position: center;
  background-size: cover;

  opacity: 0;
  /* 처음엔 완전히 아래쪽에 가려진 상태 (밑에서부터 차오르게) */
  clip-path: inset(100% 0 0 0);

  will-change: clip-path, opacity, transform;
}


.biz_wrap .biz_txt {width:45%;  display:flex;  flex-direction: column;  justify-content: center;}
.biz_wrap .biz_txt h4 {font-size:4.0rem; font-weight:600; margin-bottom:1.0rem; color:#000; }
.biz_wrap .biz_txt p {font-size:2.2rem;}

.biz_wrap:nth-child(2n) { flex-direction: row-reverse; }


@media( max-width:1024px ) {
.biz_conts {padding-top:5.0rem;}
.biz_img {width:100%;}
.biz_wrap {padding-bottom:5.0rem; padding-top:0;}
.biz_wrap .biz_txt {width:100%; padding:3.0rem;} 
.biz_wrap .biz_txt h4 {font-size:2.8rem;}

}



/*선대정보*/

.ship-table-wrap {
	width: 100%;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	border-top: 1px solid #222;
	/*border-bottom: 2px solid #222;*/

	margin-top:8.0rem;
}

.ship-table {
	width: 100%;
	min-width: 1200px;
	border-collapse: separate;
	border-spacing: 0;
	table-layout: fixed;
	background: #fff;
	font-family: Arial, sans-serif;
	font-size: 15px;
	color: #666;
}

.ship-table caption {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.ship-table col.col-category {
	width: 100px;
}

.ship-table col.col-sub {
	width: 70px;
}

.ship-table col.col-ship {
	width: 145px;
}

.ship-table th,
.ship-table td {
	height: 58px;
	padding: 10px 8px;
	border-right: 1px solid #d9d9d9;
	border-bottom: 1px solid #d9d9d9;
	box-sizing: border-box;
	text-align: center;
	vertical-align: middle;
	line-height: 1.45;
	word-break: keep-all;
	white-space: normal;
}

.ship-table tr > *:first-child {
	border-left: 1px solid #d9d9d9;
}

.ship-table thead th {
	border-top: 1px solid #d9d9d9;
}

.ship-table th {
	font-weight: 500;
}

.ship-table .group-title {
	height: 54px;
	font-size: 17px;
}

.ship-table .chartered,
.ship-table tbody th {
	background: #000;
	color: #fff;
	font-weight:600;
}

.ship-table .owned {
	background: #f5f5f7;
	color: #555;
}

.ship-table tbody td {
	background: #fff;
}

/* 첫 번째 항목 열 고정 */
.ship-table tbody .main-label {
	position: sticky;
	left: 0;
	z-index: 4;
	background: #000;
	color: #fff;
	font-weight:600;
}

/* 두 번째 세부 항목 열 고정 */
.ship-table tbody .sub-label {
	position: sticky;
	left: 100px;
	z-index: 3;
	background: #000;
	color: #fff;
	font-weight:600;
}

/* colspan="2" 항목은 왼쪽 전체 영역으로 고정 */
.ship-table tbody .colspan-label {
	position: sticky;
	left: 0;
	z-index: 4;
}

/* 상단 Chartered 영역 고정 */
.ship-table .chartered {
	position: sticky;
	left: 0;
	z-index: 5;
}

/* 고정 열 오른쪽 구분선 */
.ship-table tbody .sub-label::after,
.ship-table tbody .colspan-label::after {
	position: absolute;
	top: 0;
	right: -1px;
	width: 1px;
	height: 100%;
	background: #d9d9d9;
	content: "";
}

/* 가로 스크롤바 */
.ship-table-wrap::-webkit-scrollbar {
	height: 8px;
}

.ship-table-wrap::-webkit-scrollbar-track {
	background: #eee;
}

.ship-table-wrap::-webkit-scrollbar-thumb {
	background: #999;
	border-radius: 10px;
}

@media (max-width: 768px) {
	.ship-table {
		min-width: 1050px;
		font-size: 13px;
	}

	.ship-table col.col-category {
		width: 82px;
	}

	.ship-table col.col-sub {
		width: 65px;
	}

	.ship-table col.col-ship {
		width: 130px;
	}

	.ship-table th,
	.ship-table td {
		height: 52px;
		padding: 8px 6px;
	}

	.ship-table tbody .sub-label {
		left: 82px;
	}
}

@media (max-width: 480px) {
	.ship-table {
		min-width: 980px;
		font-size: 12px;
	}

	.ship-table col.col-category {
		width: 74px;
	}

	.ship-table col.col-sub {
		width: 52px;
	}

	.ship-table col.col-ship {
		width: 122px;
	}

	.ship-table th,
	.ship-table td {
		padding: 7px 5px;
	}

	.ship-table tbody .sub-label {
		left: 74px;
	}
}


/*ESG*/
.esg_top {padding:18.0rem 3.0rem; overflow:hidden; text-align:center; color:#fff;}
.esg_top strong {font-size:3.2rem; margin-top:0rem; font-weight:800; display:block;}
.esg_top p {font-size:5.0rem; margin-top:0rem; font-weight:700;}

.esg_ico_wrap {margin-top:5.0rem; display:flex;   justify-content: space-between; margin-bottom:12.0rem;}
.esg_ico_wrap:last-child {margin-bottom:0;}
.esg_ico_wrap .esg_ico_box {border:1px solid #ddd;  width:32%; padding:2.5rem 4.0rem;; text-align:center;}
.esg_ico_wrap .esg_ico_box h4 {color:#000; font-size:2.4rem; margin-top:2.0rem; line-height:1.35;}
.esg_ico_wrap .esg_ico_box p {font-size:1.8rem; margin-top:1.0rem;}

@media (max-width: 768px) {

	.esg_top {padding:10.0rem 3.0rem;}
	.esg_top p {font-size:3.0rem;}
	.esg_top strong {font-size:2.4rem;}


	.esg_ico_wrap { flex-direction: column;}
	.esg_ico_wrap .esg_ico_box .ico img {width:90px;}
	.esg_ico_wrap .esg_ico_box {width:100%; margin-bottom:3.0rem}
	.esg_ico_wrap .esg_ico_box h4 {margin-top:1.0rem;}

}



/*오시는길*/
.loc_wrap { justify-content: space-between;}
.loc_wrap .loc_map {position:relative; width:50%;}
.loc_wrap .loc_map .map_height {height:45.0rem; width:100%;  /*pointer-events: none; */position:relative; }
.loc_wrap .loc_map .root_daum_roughmap .wrap_map {height: 100% !important; z-index:0;}

.loc_wrap .loc_txt {position:relative; width:45%; padding:3.0rem 0;}
.loc_wrap .loc_txt h4 {font-size:3.2rem; color:#000; padding-bottom:2.0rem; border-bottom:2px solid #222; margin-bottom:0rem;}
.loc_wrap .loc_txt dl {display:flex; padding:2.05rem 1.5rem; border-bottom:1px solid #ddd; }
.loc_wrap .loc_txt dl dt {width:15.0rem; color:#000;}
.loc_wrap .loc_txt dl dd {width:calc(100% - 15.0rem);}
.loc_wrap .loc_txt dl dd a {color:#666;}

.loc_wrap:nth-child(2n) {flex-direction: row-reverse;}


@media (max-width: 1024px) {

.loc_wrap .loc_map {width:100%; order:1;}
.loc_wrap .loc_txt {width:100%;  order:3;  margin-top:2.0rem; padding:0;}

}

@media (max-width: 768px) {

.loc_wrap .loc_txt dl {flex-wrap:wrap;}
.loc_wrap .loc_txt dl dt {width:100%;}
.loc_wrap .loc_txt dl dd {width:100%;}

}