@charset "utf-8";
/* hanbom.com _ Project _ HunHoon _ 202500000 */

/* ========================================
= [MODULE CSS STYLE] 필수 레이아웃 스타일
= Description: Module Css Style Collection
======================================== */

/* [Module - Lib] 모듈 - Lib */
@import url("../css/lib/swiper-bundle.min.css");

/* [Module - Styles] 모듈 - Styles */
@import url("../css/@styles/reset.css");
@import url("../css/@styles/font.css");

@import url("../css/@styles/var.css");
@import url("../css/@styles/color.css");

@import url("../css/@styles/icon.css");

@import url("../css/@styles/button.css");
@import url("../css/@styles/form.css");

@import url("../css/@styles/global.css?t=202604081637");
@import url("../css/@styles/layout.css?t=202604081637");

@import url("../css/@styles/customize.css");
/* // () => [MODULE CSS STYLE END] 필수 레이아웃 스타일 종료 */



/* ========================================
= [MAIN CONTENT STYLE] 메인 콘텐츠 스타일
= Description: Main Content Style
======================================== */
/* [Main - Common] 메인 - Common(메인 공통) */
.main{}
.main .section{ position: relative; width: 100%;}

/* [Main - Section Intro] 메인 - Section Intro(메인 인트로) */
.main .section.intro{
	overflow: hidden; 
	width: 100%; height: var(--vh100);
	background-color: var(--gray-light2);
}
.main .section.intro .gutter { 
	position: fixed; top: 0; left: 0; right: 0;
	width: 100%; height: var(--vh100);
}
.main .section.intro .intro-area{
	position: absolute; top: 0; left: 0;
	width: 100%; height: 100%;
	display: flex; align-items: center;
	justify-content: center;
}
.main .section.intro .intro-wrap{
	display: flex; align-items: center;
	justify-content: center; white-space: nowrap;
	gap: clamp(3px,0.8vw,6px);
}

.main .section.intro .intro-wrap .title-wrap{
	width: clamp(290px,28.32vw,355px); 
	display: flex;
}
.main .section.intro .intro-wrap .title-wrap.tit-frist{ justify-content: flex-end; }

.main .section.intro .video-group { 
	position: relative; width: 0px; height: clamp(110px,10.74vw,130px);
	display: flex; align-items: center;
	justify-content: center;
}
.main .section.intro .video-area{
	position: relative; z-index: 1;
	display: flex; align-items: center;
	justify-content: center;
	min-width: 100px; height: 100%;
}

.main .section.intro .video-wrap{
	overflow: hidden; position: absolute;
	width: 0%; height: 100%;
}

.main .section.intro .video			{}
.main .section.intro .video-bg		{
	position: absolute; inset: 0 0 0 0;
	width: 100%; height: 100%;
	background-color: rgba(27,32,34,0.2);
}

.main .section.intro .img-area	{
	position: relative; z-index: 1;
	width: 100%; height: var(--vh100);
	padding-block: clamp(40px,5.21vw,60px);

	display: flex; align-items: flex-end;
}
.main .section.intro .img-area .img-wrap	{ 
	max-width: clamp(942px,73.21vw,1145px); width: 100%;
	aspect-ratio: 1145/212;
}
/* [RWD Section Intro] 반응형 */
@media all and (min-width: 1921px) {
	.main .section.intro .img-area .img-wrap	{  max-width: max(1142px,59.48vw); }
}
@media all and (min-width: 1024px) and (max-width: 1279px) 	{
	.main .section.intro .img-area .img-wrap	{ max-width: clamp(742px,73.65vw,942px); }
}
@media all and (min-width: 768px) and (max-width: 1023px) 	{
	.main .section.intro .intro-wrap .title-wrap{ width: clamp(210px,27.34vw,290px); }
	.main .section.intro .video-group			{ height: clamp(75px,9.77vw,110px); }

	.main .section.intro .img-area .img-wrap	{ width: clamp(542px,70.57vw,742px); }
}
@media all and (max-width: 767px) {
	.main .section.intro .intro-wrap .title-wrap{ width: clamp(120px,32vw,210px); }
	.main .section.intro .video-group			{ height: clamp(42px,11.2vw,75px); }

	.main .section.intro .img-area .img-wrap	{ max-width: 542px; }
}


/* [Main - Section Drawing] 메인 - Section Drawing(메인 캔버스) */
.main .drawing-group{}
.main .section.drawing	{ width: 100%;  background-color: var(--gray-light2); }

.main .section.drawing .box-area{position: relative; width: 100%; height: calc(var(--vh100) * 4);}

.main .section.drawing .box-wrap{position: relative; width: 100%; }
.main .section.drawing .box-wrap :is( .canvas-wrap, .img-wrap ){
	position: absolute; inset: 0 0 0 0;
	width: 100%; height: var(--vh100);
	display: flex; align-items: center;
}

/* [Section Drawing - Machine Wrap] 섹션 드로잉 - Machine Wrap(시퀀스) */
.main .section.drawing .machine-wrap{ height: var(--vh100); }
.main .section.drawing .machine-wrap canvas{
	margin: 0 auto;  will-change: transform;
	backface-visibility: hidden;
}
.main .section.drawing .machine-wrap .title-wrap	{ padding-top: 120px; }
/* [RWD Machine Wrap] 반응형 */
@media all and (max-width: 767px) {
	.main .section.drawing .machine-wrap .canvas-wrap { align-items: flex-end; }
}

/* [Section Drawing - Cont Wrap] 섹션 드로잉 - Cont Wrap(비지니스) */
.main .section.drawing .cont-wrap {  }
.main .section.drawing .cont-wrap .img-wrap		{ clip-path: inset(50% 8% 0px); }
.main .section.drawing .cont-wrap .title-area	{
	width: 100%; height: var(--vh100);
	padding-block: 84px clamp(60px,5.86vw,120px); 
}
/* [RWD Cont Wrap] 반응형 */
@media all and (max-width: 767px) {}


/* [Main - Section Our Group] 메인 - Section Our Group(메인 그룹사) */
.main .section.ours{
	overflow: hidden;
	background-color: var(--white);
}

.main .section.ours .tabs-group		{ gap: clamp(168px,13.14vw,200px); }
 /* [RWD Section Our Group] 반응형 */
@media all and (min-width: 768px) and (max-width:1279px) {
	.main .section.ours .tabs-group	{ gap: clamp(84px,10.94vw,168px); }
}
@media all and (max-width: 767px) {
	.main .section.ours .tabs-group	{ gap: 84px; }
}

/* [Section Our Group - Content] 섹션 그룹사 - Content */
.main .section.ours .sect-content	{}
.main .section.ours .tabs-group		{}

.main .section.ours .tabs-header		{width: 100%;}
.main .section.ours .tabs .icon-wrap	{ position: relative; }
.main .section.ours .tabs .ico			{  }
.main .section.ours .tabs li.current .ico.mapal	{ background-image: url("../images/@ico/mapal-on.svg"); }
.main .section.ours .tabs li.current .ico.hiteco{ background-image: url("../images/@ico/hiteco-on.svg"); }
.main .section.ours .tabs li.current .ico.tams	{ background-image: url("../images/@ico/tams-on.svg"); }
.main .section.ours .tabs li.current .ico.nlt	{ background-image: url("../images/@ico/nlt-on.svg"); }

.main .section.ours .tabs .text			{ 
	position: absolute; bottom: 4px; left: 0; right: 0;
	text-align: center; opacity: 0; transition: opacity 0.4s ease;
}
.main .section.ours .button-area.swipers{
	position: absolute; top: 50%; left: 0; right: 0; z-index: 1;
	width: 100%; transform: translateY(-50%);
	justify-content: space-between;
}
.main .section.ours  .btn[class*="swiper-"]{ position: absolute;}
.main .section.ours  .btn.swiper-prev{ left: var(--gutter); }
.main .section.ours  .btn.swiper-next{ right: var(--gutter); }
.main .section.ours  .btn[class*="swiper-"] .ico{
	width: inherit; height: inherit;
	-webkit-mask-image: url("../images/@ico/arrow-40.svg");
			mask-image: url("../images/@ico/arrow-40.svg");
}
.main .section.ours  .btn[class*="swiper-"].swiper-button-disabled .ico{opacity: 0.2;}

.main .section.ours .tabs-body{position: relative; overflow: hidden;}
.main .section.ours .tabs-body .text-wrap {padding-top: clamp(40px,5.22vw,60px);}
.main .section.ours .tabs-body .ours-cursor{
	position: absolute; top: 0; left: 0; opacity: 0; visibility: hidden;
	width: 180px; height: 180px; border-radius: 50%;
	pointer-events: none; background-color: var(--point-green);
	translate: -50% -50%; 
	transition: opacity 0.4s ease-in-out, visibility 0.4s ease-in-out;
	display: none !important;
}
.main .section.ours .tabs-body:hover .ours-cursor{
	opacity: 1; visibility: visible;
	transition: opacity 0.4s ease-in-out, visibility 0.4s ease-in-out;
}

.main .section.ours .tab-content{
	position: absolute; inset: 0;
	opacity: 0; visibility: hidden;
	pointer-events: none;

  	/* iOS 안정화 */
	will-change: transform, opacity;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
.main .section.ours .tab-content.active{
	position: relative; overflow: hidden;
	opacity: 1; visibility: visible;
	transform: translateY(0);
	pointer-events: auto;
}

.main .section.ours .tab-content .rolling-wrap	{ 
	overflow: visible;	
	overscroll-behavior: none;
}
.main .section.ours .tab-content .rolling-list	{ 
	display: flex; width: max-content;  gap: 48px;
	align-items: flex-end; will-change: transform;
}
.main .section.ours .tab-content .rolling-wrap .img-wrap{ width: fit-content; }
/* [Effect Hover] 호버 이펙트 */
@media (any-hover: hover) and (any-pointer: fine) {
	.main .section.ours .tabs .icon-wrap:hover .ico,
	.main .section.ours .tabs .icon-wrap:hover .text	{ opacity: 1;}
	.main .section.ours .tabs li:hover .ico.mapal		{ background-image: url("../images/@ico/mapal-on.svg");  }
	.main .section.ours .tabs li:hover .ico.hiteco		{ background-image: url("../images/@ico/hiteco-on.svg"); }
	.main .section.ours .tabs li:hover .ico.tams		{ background-image: url("../images/@ico/tams-on.svg"); }
	.main .section.ours .tabs li:hover .ico.nlt			{ background-image: url("../images/@ico/nlt-on.svg"); }
}
/* [RWD Sect Content] 반응형 */
@media all and (min-width: 1024px) and (max-width: 1279px) {
	.main .section.ours .tab-content .rolling-wrap .img-wrap{ max-width: clamp(650px,63.48vw,800px); }
}
@media all and (min-width: 1024px){
	.main .section.ours .tabs li{ width: auto !important; }

	body:not(.is-tablet) .main .section.ours .tabs-body .ours-cursor{ display: flex; }
	body.is-tablet .main .section.ours .tabs-body .ours-cursor{display: none !important;}

	body.is-tablet .main .section.ours .tab-content .rolling-list{ gap: 24px; }
}
@media all and (max-width: 1023px){
	.main .section.ours .tabs-body .ours-cursor{display: none !important;}
}
@media all and (min-width: 768px) and (max-width: 1023px) {
	.main .section.ours .tab-content .rolling-list{ gap: 24px; }

	.main .section.ours .tab-content .rolling-wrap .img-wrap{ max-width: clamp(400px,52.08vw,650px); }
}
@media all and (min-width: 768px) {
	.main .section.ours .tabs{
		transform: none !important; gap: 10px;
		display: flex; align-items: center;
		justify-content: center;
	}
	.main .section.ours .tabs li.current .ico,
	.main .section.ours .tabs li.current .text{ opacity: 1; }
	.main .section.ours .button-area.swipers{ display: none !important; }
}
@media all and (max-width: 767px){
	.main .section.ours .tabs li[class*="-slide-active"] .ico,
	.main .section.ours .tabs li[class*="-slide-active"] .text{ opacity: 1; }
	.main .section.ours .tabs li[class*="-slide-active"] .ico.mapal	{ background-image: url("../images/@ico/mapal-on.svg"); }
	.main .section.ours .tabs li[class*="-slide-active"] .ico.hiteco{ background-image: url("../images/@ico/hiteco-on.svg"); }
	.main .section.ours .tabs li[class*="-slide-active"] .ico.tams	{ background-image: url("../images/@ico/tams-on.svg"); }
	.main .section.ours .tabs li[class*="-slide-active"] .ico.nlt	{ background-image: url("../images/@ico/nlt-on.svg"); }

	.main .section.ours .tab-content .rolling-list{ gap: 14px; }
	.main .section.ours .tab-content .rolling-wrap .img-wrap{ max-width: clamp(280px,74.67vw,400px); }

	.main .section.ours .button-area.swipers .btn{ border: none; width: 40px; height: 40px; }
	.main .section.ours .button-area.swipers .btn .ico{
		width: 100%; height: 100%;
		-webkit-mask-image: url('../images/@ico/arrow-md.svg');
				mask-image: url('../images/@ico/arrow-md.svg');
		background-color: var(--gray-blue);
	}
}

/* [Section Our Group - Ours 01] 섹션 그룹사 - Ours 01 */
.main .section.ours-01{}
.main .section.ours-01 .sect-content{ width: 100%; height: calc(var(--vh100) * 1.2); }
.main .section.ours-01 .sect-content .title-wrap{ width: 100%; height: var(--vh100); }


/* [Main - Section Future] 메인 - Section Future(메인 미래) */
.main .future-group{
	position: relative; 
	background-color: var(--white); 
}
.main .section.future{
	height: calc(var(--vh100) * 1);
	background-color: var(--white);
}
.main .section.future .img-wrap{ background-color: var(--gray-blue); }
/* [RWD Section Future] 반응형 */
@media all and (min-width: 1024px) {
	body:not(.is-tablet) .main .section.future .box-area { display: flex; align-items: flex-start; }
	body:not(.is-tablet) .main .section.future .box-wrap { width: 50%; height: 100%; }

	body.is-tablet .main .section.future .box-area { flex-direction: column; }
	body.is-tablet .main .section.future .box-wrap { width: 100%; height: 50%; }
}
@media all and (max-width: 1023px) {
	.main .section.future .box-area { flex-direction: column; }
	.main .section.future .box-wrap { width: 100%; height: 50%; }
}

/* [Section Future - Future 01] 섹션 미래 - Future 01 */
.main .section.future-01{}
@media all and (min-width: 1024px) {
	body:not(.is-tablet) .main .section.future-01 .title-wrap {padding-top: var(--gap-84);}

	body.is-tablet .main .section.future-01 .title-wrap { 
		width: 100%; height: 100%;
		display: flex; justify-content: center;
	}
}
@media all and (max-width: 1023px) {
	.main .section.future-01 .title-wrap { 
		width: 100%; height: 100%;
		display: flex; justify-content: center;
	}
}

/* [Section Future - Future 02] 섹션 미래 - Future 02 */
.main .section.future-02{}
@media all and (min-width: 1024px) {
	body:not(.is-tablet) .main .section.future-02 .box-area {
		flex-direction: row-reverse;
	}
}

/* [Section Future - Future 03] 섹션 미래 - Future 03 */
/* [Section Future - Future 04] 섹션 미래 - Future 04 */
.main .section.future-04{ height: auto !important; padding-block: 50vh; } 
.main .section.future-04 .box-wrap{ width: 100% !important; height: 100%; } 
@media all and (max-width: 1023px) {
	.main .section.future-04{padding-block: 30vh; } 
}


/* [Main - Section Smarter] 메인 - Section Smarter(메인 스마트) */
.main .section.smarter { background-color: var(--gray-dark); }
.main .section.smarter :is([class*="sect-"]){ position: relative; }
.main .section.smarter .sect-wrap			{}

/* [Section Smarter - Sect Header] 섹션 스마트 - Sect Header */
.main .section.smarter .sect-header	{}
/* [RWD Sect Header] 반응형 */
@media all and (max-width: 767px) {
	.main .section.smarter .sect-header .title{ text-align: center; }
}

/* [Section Smarter - Sect Content] 섹션 스마트 - Sect Content */
.main .section.smarter .sect-content	{
	width: 100%;
}
.main .section.smarter .pin-wrap		{
	width: 100%; height: var(--vh100);
	display: flex; align-items: center;
	justify-content: center;
}
.main .section.smarter .sect-content .img-wrap	{ 
	position: relative; 
	width: 100%; height: var(--vh100); margin: 0 auto;
}
.main .section.smarter .sect-content .bg-dim	{
	position: absolute; inset: 0 0 0 0;
	width: 100%; height: 100%;
	background-color: rgba(0,0,0,0.0);
}

.main .section.smarter .sect-content :is(.box-wrap, .title-wrap, .text-area, .corp-wrap){
	position: absolute; inset: 0 0 0 0;
}
.main .section.smarter .sect-content .box-wrap{ width: 100%; height: 100%; z-index: 1; }
.main .section.smarter .sect-content .title-wrap,
.main .section.smarter .sect-content .text-area,
.main .section.smarter .sect-content .corp-wrap	{
	width: 100%; height: var(--vh100);
	display: flex; align-items: center;
	justify-content: center; flex-direction: column;
	will-change: transform, opacity, visibility
}
.main .section.smarter .sect-content .title-wrap	{}
.main .section.smarter .sect-content .text-area		{}

/* [Section Smarter - Smart 01] 섹션 스마트 - Smart 01 */
.main .section.smart-01 .sect-content	{height: calc(var(--vh100) * 7); }
.main .section.smart-01 .sect-content .corp-wrap .gutter-pc{ gap: var(--gap-84-48); }
.main .section.smart-01 .sect-content .global-box{ 
	position: relative;
	max-width: 950px; width: 100%;
	display: flex; flex-direction: column;
	gap: 24px;
}
.main .section.smart-01 .sect-content .global-box dl{
	display: flex; flex-wrap: wrap;
	gap: 16px 40px;
}
.main .section.smart-01 .sect-content .global-box dt{
	width: 100%; color: var(--white);
	font-size: var(--fs-16); line-height: 1.8;
}
.main .section.smart-01 .sect-content .global-box dd{
	min-width: 217px;
	color: var(--n-400); line-height: var(--lh140);
	font-size: var(--fs-14);
}
@media all and (min-width: 768px) {
	.main .section.smarter .sect-content .corp-wrap{ background-color: var(--black-op-20); }
	.main .section.smarter .sect-content .corp-wrap::after{
		content: ""; position: absolute; right: 0; z-index: -1;
		background: url("../images/main/global.gif") center center / cover no-repeat;
		width: clamp(625px,81.38vw,1060px); aspect-ratio: 1060/600;
	}	
}
@media all and (max-width: 767px) {
	.main .section.smart-01 .sect-content .corp-wrap .gutter-pc{ padding-inline: 30px; gap: var(--gap-48-24); }
	.main .section.smart-01 .sect-content .global-box dl{ gap: 10px 10px; }
	.main .section.smart-01 .sect-content .global-box dt{ padding-top: 6px; }
	.main .section.smart-01 .sect-content .global-box dd{
		min-width: auto; width: calc(50% - 5px);
	}
	.main .section.smart-01 .sect-content .global-box dl:first-child{ 
		position: absolute; top: 0;
	}
}

/* [Section Smarter - Smart 02] 섹션 스마트 - Smart 02 */
.main .section.smart-02 .sect-content{  height: calc(var(--vh100) * 5); }
.main .section.smart-02 .sect-content .gutter{
	position: absolute; top: 50%; transform: translateY(-50%);
}
.main .section.smart-02 .sect-content .max-1752{
	display: flex; justify-content: space-between;
	gap: 40px;
}
.main .section.smart-02 .sect-content .text-box01{ padding-left: clamp(75px,7.32vw,150px); }
.main .section.smart-02 .sect-content .text-box02{
	position: relative;
	max-width: clamp(440px,42.97vw,702px); width: 100%;
}
.main .section.smart-02 .sect-content .text-box02 dl{
	position: absolute; top: 0; left: 0;
}

@media all and (min-width: 1024px) {
	body.is-tabelt .main .section.smart-02 .sect-content .text-box01 	{ padding-left: 0; }
	body.is-tabelt .main .section.smart-02 .sect-content .text-wrap 	{ 
		max-width: clamp(380px,61.33vw,400px); width: 100%; 
		margin: 0 auto;
	}
}
@media all and (max-width: 1023px) {
	.main .section.smart-02 .sect-content .text-box01 	{ padding-left: 0; }
	.main .section.smart-02 .sect-content .text-wrap 	{ 
		max-width: clamp(250px,66.67vw,380px); width: 100%; 
		margin: 0 auto;
	}
}
@media all and (max-width: 767px) {
	.main .section.smart-02 .sect-content .max-1752		{ flex-direction: column; }
}


/* [Main - Section Utility] 메인 - Section Utility(메인 유틸리티) */
.main .section.utility		{ 
	z-index: 2;
	background-color: var(--gray-blue);
}
.main .section.utility ul	{}
.main .section.utility .items.utility .ico{ width: clamp(32px,4.17vw,40px); }

.main .section.utility li.active .items.utility	{
	color: var(--white); 
	background-color: var(--gray-blue);
}
.main .section.utility li.active .items.utility .ico{ background-color: var(--white); }
/* [RWD Section Utility] 반응형 */
@media all and (max-width: 767px) {
	.main .section.utility ul{ grid-template-columns: repeat(1, 1fr); }
	.main .section.utility .items.utility .ico{ width: 28px; }
}
/* // () => [MAIN CONTENT STYLE END] 메인 콘텐츠 스타일 종료 */



/* ========================================
= [SUB - COMMON STYLES] (COMMON)
= Description: 서브 페이지 전체 공통 스타일
======================================== */
#content.sub { padding-top: var(--header); }
#content.sub .section{
	position: relative;
	width: 100%;
}
/* // () => [SUB - COMMON STYLES END] 서브 페이지 전체 공통 스타일 종료 */



/* ========================================
= [SUB - PAGE COMPANY] (Depth01)
= Description: Depth01 그룹소개
======================================== */
/* {Depth01 - Common} 그룹소개 페이지 공통 */
.sub.company {}
.sub.company .page-header	{ padding-top: var(--gap-160); }
.sub.company .page-content	{ margin-top: var(--gap-240-160); }

/* Common - Section Visual */
.sub.company .section.visual { 
	overflow: hidden;
	width: 100%; height: clamp(660px,85.94vw,780px);
}
.sub.company .section.visual .visual-bg{
	position: absolute; inset: 0 0 0 0;
	width: 100%; height: 110%;
	background-repeat: no-repeat; background-size: cover;
	background-position: center center;
	background-image: url("../images/company/about-01.jpg");
	
}
/* [RWD Common] 반응형 */
@media all and (max-width: 767px) {
	.sub.company .section.visual	{ height: 600px;}
	.sub.company .section.visual .visual-bg {
		background-image: url("../images/company/about-01_mo.jpg");
	}
}


/* {Depth01 - About} 그룹소개 - 회사소개 */
.sub.company.about {}
.sub.company.about .page-header	{}
.sub.company.about .page-content{}

/* 회사소개: Section Visual */
.sub.company.about .section.visual{}
/* [RWD Section Visual] 반응형 */
@media all and (max-width: 767px) {}


/* 회사소개: Section Make It */
.sub.company.about .section.makeit{ padding-block: var(--gap-240-160); }
.sub.company.about .section.makeit .title-wrap,
.sub.company.about .section.makeit .makeit-wrap,
.sub.company.about .section.makeit .grid-area	{
	display: flex; flex-direction: column;
	gap: var(--gap-84-48);
}

.sub.company.about .section.makeit .makeit-wrap .title		{ letter-spacing: -0.02em; }
.sub.company.about .section.makeit .makeit-wrap .img-wrap	{
	max-width: clamp(120px,15.63vw,192px); width: 100%;
}
/* [RWD Section Make It] 반응형 */
@media all and (min-width: 1024px) {
	body.is-tablet .sub.company.about .section.makeit .makeit-wrap .title  { font-size: 44px; }
	body.is-tablet .sub.company.about .section.makeit .makeit-wrap .grid-01{ grid-template-columns: repeat(2, 1fr); }
	body.is-tablet .sub.company.about .section.makeit .makeit-wrap .grid-02{ grid-template-columns: repeat(1, 1fr); }
}
@media all and (max-width: 1023px) {
	.sub.company.about .section.makeit .makeit-wrap .title	{ font-size: 44px; }
	.sub.company.about .section.makeit .makeit-wrap .grid-01{ grid-template-columns: repeat(2, 1fr); }
	.sub.company.about .section.makeit .makeit-wrap .grid-02{ grid-template-columns: repeat(1, 1fr); }
}
@media all and (max-width: 767px) {
	.sub.company.about .section.makeit .makeit-wrap .img-wrap { max-width: 80px; }
}


/* 회사소개: Section Journey */
.sub.company.about .section.journey{
	padding-block: var(--gap-240-160);
	background-color: var(--gray-dark);
}

.sub.company.about .section.journey .title-wrap		{
	display: flex; flex-direction: column;
	gap: var(--gap-48);
}
.sub.company.about .section.journey .title-wrap .btn{
	border-color: var(--n-800); 
	color: var(--white);
}

.sub.company.about .section.journey .journey-wrap{}
.sub.company.about .section.journey .journey-wrap li{
	padding-block: var(--gap-84-48); gap: var(--gap-48);
	display: flex; align-items: center;
	justify-content: space-between;
}
.sub.company.about .section.journey .journey-wrap li + li	{ border-top: 1px solid var(--n-700); }
.sub.company.about .section.journey .journey-wrap .desc-wrap{
	display: flex; flex-direction: column;
	gap: var(--gap-48-16);
}
.sub.company.about .section.journey .journey-wrap .desc-wrap .title,
.sub.company.about .section.journey .journey-wrap .desc-wrap .subtitle{
	color: var(--white); line-height: var(--lh125-160);
}

.sub.company.about .section.journey .journey-wrap .img-wrap	{
	overflow: hidden; 
	max-width: clamp(165px,21.48vw,327px); width: 100%;
}
.sub.company.about .section.journey .journey-wrap svg		{ overflow: hidden; }
.sub.company.about .section.journey .journey-wrap svg path	{ will-change: fill; }
.sub.company.about .section.journey .journey-wrap .icon-svg02 path,
.sub.company.about .section.journey .journey-wrap .icon-svg03 path{
	fill: none; will-change: fill;
  	stroke: var(--white);
}
.sub.company.about .section.journey .journey-wrap .icon-svg02 path{ stroke-width: 1; }
.sub.company.about .section.journey .journey-wrap .icon-svg03 path{ stroke-width: 2; }
/* [RWD Section Journey] 반응형 */
@media all and (min-width: 1024px) {
	body.is-tablet .sub.company.about .section.journey .journey-wrap li	{ align-items: flex-start; flex-direction: column; }
	body.is-tablet .sub.company.about .section.journey .journey-wrap .img-wrap{ margin-left: auto; }
}
@media all and (max-width: 1023px) {
	.sub.company.about .section.journey .journey-wrap li{ align-items: flex-start; flex-direction: column; }
	.sub.company.about .section.journey .journey-wrap .img-wrap{ margin-left: auto; }
}
@media all and (max-width: 767px) {
	.sub.company.about .section.journey .journey-wrap .img-wrap{ max-width: 102px; }
}


/* 회사소개: Section Message */
.sub.company.about .section.message{}
/* [RWD Section Message] 반응형 */
@media all and (max-width: 767px) {}


/* 회사소개: Section Feature */
.sub.company.about .section.feature{
	height: calc(var(--vh100) * 1);
	background-color: var(--gray-light2);
}
.sub.company.about .section.feature .content-wrap,
.sub.company.about .section.feature .title-wrap,
.sub.company.about .section.feature .img-area	{
	display: flex; align-items: center; 
	justify-content: center;
}
.sub.company.about .section.feature .title-wrap, 
.sub.company.about .section.feature .img-area	{ width: 50%; height: 100%; }

.sub.company.about .section.feature .content-wrap{ 
	height: 100%;
	border-top: 1px solid var(--gray-light);
}

.sub.company.about .section.feature .title-wrap	{}
.sub.company.about .section.feature .img-area	 { 
	position: relative;
	background-color: var(--gray-blue);
}
.sub.company.about .section.feature .img-wrap	 {
	position: absolute; inset: 0 0 0 0;
	width: 100%; height: 100%;
}
.sub.company.about .section.feature .img-wrap img{
	width: 100%; height: 100%;
	object-fit: cover; object-position: center center;
}
.sub.company.about .section.feature .captions	  { 
	mix-blend-mode: difference; 
	color: var(--white);
}
/* [RWD Section Feature] 반응형 */
@media all and (min-width: 1024px) {	
	body.is-tablet .sub.company.about .section.feature .content-wrap{ flex-direction: column; }
	body.is-tablet .sub.company.about .section.feature .title-wrap, 
	body.is-tablet .sub.company.about .section.feature .img-area	{ width: 100%; height: 50%; }
	body.is-tablet .sub.company.about .section.feature .img-wrap img{ object-position: center bottom; }
}
@media all and (max-width: 1023px) {
	.sub.company.about .section.feature .content-wrap{ flex-direction: column; }
	.sub.company.about .section.feature .title-wrap, 
	.sub.company.about .section.feature .img-area	 { width: 100%; height: 50%; }
	.sub.company.about .section.feature .img-wrap img{ object-position: center bottom; }
}
@media all and (max-width: 767px){
	.sub.company.about .section.feature .img-wrap img { object-position: center center; }
}
/* // {Depth01 - About End} 그룹소개 - 회사소개 종료 */


/* {Depth01 - Greeting} 그룹소개 - 인사말 */
.sub.company.greeting{}

/* 인사말: Section Greet */
.sub.company.greeting .section.greet { width: 100%; background-color: var(--gray-light2);	 }
.sub.company.greeting .section.greet .greet-wrap { width: 50%; }

.sub.company.greeting .section.greet .bg-wrap{ overflow: hidden;  }
.sub.company.greeting .section.greet .bg-wrap .greet-bg	{
	overflow: hidden; width: 100%; height: clamp(1050px,136.72vw,1250px);
	background-image: url("../images/company/greeting-01.jpg");
	background-size: cover; background-repeat: no-repeat;
	background-position: center center;
}

.sub.company.greeting .section.greet .title-area{ padding-inline: var(--gutter); }
.sub.company.greeting .section.greet .title-area .text span		{ display: block; }
.sub.company.greeting .section.greet .title-area .sing-wrap img	{ 
	max-width: clamp(110px,14.32vw,135px); 
	width: 100%;
}
/* [RWD Section Greet] 반응형 */
@media all and (min-width: 1024px) {
	body.is-tablet .sub.company.greeting .section.greet .content-area	{ flex-direction: column; }
	body.is-tablet .sub.company.greeting .section.greet .greet-wrap 	{ width: 100%; }

	body.is-tablet .sub.company.greeting .section.greet .bg-wrap .greet-bg	{
		height: 160vw; background-position: center center;
		background-image: url("../images/company/greeting-01_mo.jpg");
	}

	body.is-tablet .sub.company.greeting .section.greet .title-area{ padding-block: var(--gap-84); }
	body.is-tablet .sub.company.greeting .section.greet .title-area .sing-wrap img{ max-width: 100px; }

}
@media all and (max-width: 1023px) {
	.sub.company.greeting .section.greet .content-area	{ flex-direction: column; }
	.sub.company.greeting .section.greet .greet-wrap 	{ width: 100%; }

	.sub.company.greeting .section.greet .bg-wrap .greet-bg	{
		height: 160vw; background-position: center center;
		background-image: url("../images/company/greeting-01_mo.jpg");
	}

	.sub.company.greeting .section.greet .title-area{ padding-block: var(--gap-84); }
	.sub.company.greeting .section.greet .title-area .sing-wrap img{ max-width: 100px; }
}
/* // {Depth01 - Greeting End} 그룹소개 - 인사말 종료 */


/* {Depth01 - History} 그룹소개 - 연혁 */
.sub.company.history { }
.sub.company.history .page-content{ margin-top: var(--gap-160); }
.sub.company.history .content-area{
	display: flex; flex-direction: column;
	
}

/* 연혁: Section Hist */
.sub.company.history .section.hist .year-area{
	position: sticky; top: 0;
	width: 100%; height: calc(var(--vh100) * 1);
}
.sub.company.history .section.hist .year-wrap{
	position: relative;
	width: 100%; height: var(--vh100);
	display: flex; align-items: center;
	justify-content: center;
}
.sub.company.history .section.hist .year-wrap .title-area,
.sub.company.history .section.hist .year-wrap .title-wrap{
	position: absolute; inset: 0 0 0 0;
	width: 100%; height: 100%;
	display: flex; align-items: center;
	justify-content: center;
}
.sub.company.history .section.hist .year-wrap .title-area{}
.sub.company.history .section.hist .year-wrap .title-wrap{}

.sub.company.history .section.hist .year-wrap .second{}
.sub.company.history .section.hist .year-wrap .second .title{
	display: flex; align-items: center;
	justify-content: center; gap: var(--gap-48-24);
}
.sub.company.history .section.hist .year-wrap .second span{ position: relative; }
.sub.company.history .section.hist .year-wrap .second span + span::after{
	content: ""; position: absolute; 
	top: 50%; transform: translateY(-50%); left: -27px;
	width: 6px; aspect-ratio: 1/1; border-radius: 50%;
	background-color: var(--n-400);
}

.sub.company.history .section.hist .year-wrap .img-wrap{ height: 100%; transform: scale(0.75); }
.sub.company.history .section.hist .year-wrap .img-wrap img{ height: 100%; }
.sub.company.history .section.hist .year-wrap .img-wrap img:not(.first){ 
	position: absolute; inset: 0 0 0 0; width: 100%; height: 100%; object-fit: cover;
	clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
}

.sub.company.history .section.hist .hist-area{
	width: 50%; margin-left: auto;
	padding-top: calc(var(--vh100) * 2); padding-bottom: var(--gap-160);
	padding-inline: calc(var(--gutter) + clamp(34px,4.43vw,74px));
}
.sub.company.history .section.hist .hist-wrap	{
	display: flex; flex-direction: column;
	gap: var(--gap-160-84);
}
.sub.company.history .section.hist .hist-wrap dl{
	max-width: 450px; width: 100%;
	display: flex; gap: var(--gap-48-16);
}
.sub.company.history .section.hist .hist-wrap dt{
	width: 65px; font-size: var(--fs-20); 
	font-weight: var(--fw700);
}
.sub.company.history .section.hist .hist-wrap dd{
	width: calc(100% - (65px + var((--gap-48-16))));
	display: flex; flex-direction: column;
	gap: var(--gap-16-10);
}	
.sub.company.history .section.hist .hist-wrap dd span {
	font-size: var(--fs-18-16); font-weight: var(--fw400);
	color: var(--n-600);
}
/* [RWD Section Hist] 반응형 */
@media all and (min-width: 1024px) {

	body.is-tablet .sub.company.history .section.hist .year-area{ 
		position: relative; height: calc(var(--vh100) * 2);
	}
	body.is-tablet .sub.company.history .section.hist .year-wrap .img-wrap					{ transform: scale(0.9); }
	body.is-tablet .sub.company.history .section.hist .year-wrap .img-wrap img:not(.first){ display: none !important; }

	body.is-tablet .sub.company.history .section.hist .hist-area{ 
		width: 100%; padding-top: var(--gap-84-48);
		padding-inline: var(--gutter);
	}
	
	body.is-tablet .sub.company.history .section.hist .hist-wrap,
	body.is-tablet .sub.company.history .section.hist .hist-wrap :is(dl, dt, dd) { width: 100%; }
	body.is-tablet .sub.company.history .section.hist .hist-wrap 	{ gap: var(--gap-84-48); }
	body.is-tablet .sub.company.history .section.hist .hist-wrap dl { max-width: none; flex-direction: column; }
}
@media all and (max-width: 1023px) {
	.sub.company.history .page-content{ gap: 0 !important; }
	.sub.company.history .section.hist .year-area{ 
		position: relative; height: calc(var(--vh100) * 2);
	}
	.sub.company.history .section.hist .year-wrap .img-wrap					{ transform: scale(0.9); }
	.sub.company.history .section.hist .year-wrap .img-wrap img:not(.first)	{ display: none !important; }

	.sub.company.history .section.hist .hist-area{ 
		width: 100%; padding-top: var(--gap-84-48);
		padding-inline: var(--gutter);
	}
	.sub.company.history .section.hist .hist-wrap,
	.sub.company.history .section.hist .hist-wrap :is(dl, dt, dd) { width: 100%; }
	.sub.company.history .section.hist .hist-wrap 	{ gap: var(--gap-84-48); }
	.sub.company.history .section.hist .hist-wrap dl { max-width: none; flex-direction: column; }
}
/* // {Depth01 - History End} 그룹소개 - 연혁 종료 */


/* {Depth01 - Identity} 그룹소개 - CI */
.sub.company.identity{ padding-bottom: var(--gap-240-160); }
.sub.company.identity .ci-group	{ padding-top: var(--gap-240-160); }
.sub.company.identity .section.ci + .section{ padding-top: var(--gap-160); }


/* 아이덴티티: Section visual */
.sub.company.identity .section.visual{}
.sub.company.identity .section.visual .visual-bg{
	background-image: url("../images/company/ci-01.jpg");
}
/* [RWD Section Visual] 반응형 */
@media all and (max-width: 767px) {
	.sub.company.identity .section.visual .visual-bg	{ 
		background-image: url("../images/company/ci-01_mo.jpg");
	}
}


/* 아이덴티티: Section CI */
.sub.company.identity .section.ci{}
.sub.company.identity .section.ci .content-area,
.sub.company.identity .section.ci .desc-area,
.sub.company.identity .section.ci .desc-wrap	{
	display: flex; flex-direction: column;
}

.sub.company.identity .section.ci .content-area { gap: var(--gap-160-84); }
.sub.company.identity .section.ci .desc-area	{ gap: var(--gap-84-48); }
.sub.company.identity .section.ci .desc-wrap	{ gap: var(--gap-10-04); }

.sub.company.identity .section.ci .logo-wrap 				{}
.sub.company.identity .section.ci .logo-wrap .logo-box 		{
	position: relative;
	width: 100%; height: clamp(400px,52.08vw,680px);
	padding-block: clamp(30px,3.91vw,60px); 
	padding-inline: clamp(40px,5.21vw,60px);

	display: flex; align-items: center;
	justify-content: center;
	background-color: var(--n-50);
}
.sub.company.identity .section.ci .logo-wrap .img-wrap		{ mix-blend-mode: darken; width: max-content; } 
.sub.company.identity .section.ci .logo-wrap .logo-box .text{
	position: absolute; 
	bottom: clamp(30px,3.91vw,60px); left: clamp(40px,5.21vw,60px);
}

.sub.company.identity .section.ci .logo-wrap .logo-01{ height: clamp(520px,67.71vw,680px); }
.sub.company.identity .section.ci .logo-wrap .logo-02{ background-image: url("../images/company/ci-05.jpg"); }
.sub.company.identity .section.ci .logo-wrap .logo-03 .text,
.sub.company.identity .section.ci .logo-wrap .logo-04 .text{ left: 0; right: 0; }

.sub.company.identity .section.ci .colors-wrap {}
.sub.company.identity .section.ci .colors-wrap li { height: 200px; }
.sub.company.identity .section.ci .colors-wrap .color-box {
	height: 100%; padding-block: 20px;
	padding-inline: clamp(20px,2.61vw,40px);
	display: flex; align-items: flex-end;
}

.sub.company.identity .section.ci .grid-03	 {}
.sub.company.identity .section.ci .grid-03 ul{
	gap: clamp(32px,4.17vw,110px) var(--gap-48-24);
}
/* [RWD Section CI] 반응형 */
@media all and (min-width:1024px) {
	body.is-tablet .sub.company.identity .section.ci .grid-wrap { grid-template-columns: repeat(2,1fr); }

	body.is-tablet .sub.company.identity .section.ci .colors-wrap .color-01,
	body.is-tablet .sub.company.identity .section.ci .colors-wrap .color-02 { grid-column: span 12; }
	body.is-tablet .sub.company.identity .section.ci .colors-wrap .color-04,
	body.is-tablet .sub.company.identity .section.ci .colors-wrap .color-05 { grid-column: span 6; grid-row: span 1; }
	body.is-tablet .sub.company.identity .section.ci .colors-wrap .color-03 { 
		height: 100%;
		grid-column: span 6; grid-row: span 2;
	}
}
@media all and (max-width:1023px) {
	.sub.company.identity .section.ci .grid-wrap { grid-template-columns: repeat(2,1fr); }

	.sub.company.identity .section.ci .colors-wrap .color-01,
	.sub.company.identity .section.ci .colors-wrap .color-02 { grid-column: span 12; }
	.sub.company.identity .section.ci .colors-wrap .color-04,
	.sub.company.identity .section.ci .colors-wrap .color-05 { grid-column: span 6; grid-row: span 1; }
	.sub.company.identity .section.ci .colors-wrap .color-03 { 
		height: 100%;
		grid-column: span 6; grid-row: span 2;
	}
}
@media all and (max-width:767px) {
	.sub.company.identity .section.ci .grid-wrap 		{ grid-template-columns: repeat(1,1fr); gap: 0px; }
	.sub.company.identity .section.ci .grid-wrap li	 	{ padding-block: var(--gap-48); }
	.sub.company.identity .section.ci .grid-wrap li + li{ border-top: 1px solid var(--gray-light); }

	.sub.company.identity .section.ci .logo-wrap .col-4	{ grid-column: span 12; }
	.sub.company.identity .section.ci .logo-wrap .logo-box{ 
		height: 334px;
		padding-block: 20px; padding-inline: 30px;
	}
	.sub.company.identity .section.ci .logo-wrap .logo-box .text	{ 
		text-align: center;
		bottom: 20px; left: 0; right: 0;
	}
	.sub.company.identity .section.ci .logo-wrap .logo-01 { height: 520px; }
	.sub.company.identity .section.ci .logo-wrap .logo-02 { background-image: url("../images/company/ci-05_mo.jpg"); }
	.sub.company.identity .section.ci .logo-wrap .logo-01 .img-wrap{ max-width: 266px; width: 100%; } 
	.sub.company.identity .section.ci .logo-wrap .logo-02 .img-wrap{ max-width: 180px; width: 100%; } 
	.sub.company.identity .section.ci .logo-wrap .logo-03 .img-wrap{ max-width: 168px; width: 100%; }

	.sub.company.identity .section.ci .grid-03				{}
	.sub.company.identity .section.ci .grid-03 ul			{ gap: 24px var(--gap-48-24); }
	.sub.company.identity .section.ci .grid-03 .only-hide	{ display: none !important; }
	.sub.company.identity .section.ci .grid-03 .col-6		{ grid-column: span 12; }
	.sub.company.identity .section.ci .grid-03 .col-3		{ grid-column: span 6; }
}
/* // {Depth01 - Identity End} 그룹소개 - CI 종료 */
/* // () => [SUB - PAGE COMPANY END] 서브 그룹소개 종료 */



/* ========================================
= [SUB - PAGE FAMILY] (Depth02)
= Description: Depth02 그룹사소개
======================================== */
/* {Depth02 - Common} 그룹사소개 - 공통 */
#content.sub.orgs		{ padding-top: 0px; }

.sub.orgs				{}
.sub.orgs .page-header	{}
.sub.orgs .page-content	{ margin-top: var(--gap-84); }

/* <Common Titles> - 공통 타이틀 */
.sub.orgs .section.titles						{
	padding-top: calc(var(--gap-84) + var(--header));
	padding-bottom: var(--gap-160);
}
.sub.orgs .section.titles .title-area			{ 
	position: relative; z-index: 1;
	gap: var(--gap-240-160);
}
.sub.orgs .section.titles .title-wrap .title	{ font-size: var(--h2-48-24); font-weight: 700; }
.sub.orgs .section.titles .img-wrap				{ width: clamp(310px,40.36vw,500px); aspect-ratio: 564/120; }
/* [RWD Section Titles] */
@media all and (min-width: 1921px) {	
	.sub.orgs .page-tit	{ font-size: 3.33vw; }
	.sub.orgs .section.titles .title-area{ gap: max(240px,12.5vw); }
	.sub.orgs .section.titles .img-wrap	{ width: 13.02vw; }
}
@media all and (max-width: 767px) {
	.sub.orgs .section.titles					{ padding-top: calc(var(--header) + var(--gap-160)); }
	.sub.orgs .section.titles .title-area		{ gap: var(--gap-160-84); }
	.sub.orgs .section.titles .img-wrap			{ width: 210px; }
}

/* <Common Intro> - 공통 인트로 */
.sub.orgs .section.intros						{
	height: var(--vh100); z-index: 1;
	display: flex; align-items: center;
	justify-content: center;
}
.sub.orgs .section.intros .video-area			{ width: 100%; height: 100%; }
.sub.orgs .section.intros .video-wrap			{ 
	position: absolute; width: 100%; height: 100%;
	top: calc(var(--gap-84-48) + var(--header)); right: var(--gutter);
}
.sub.orgs .section.intros .video-wrap.active	{ position: fixed; }

.sub.orgs .section.intros .video-wrap img,
.sub.orgs .section.intros .video-wrap video		{
	width: 100%; height: 100%;
	object-fit: cover; object-position: center center;
}
/* [RWD Section Intros] */
@media all and (max-width: 767px) {}


/* <Common - Tabs> - 공통 탭 */
.sub.orgs .page-content				{}
.sub.orgs .page-content .tabs-group	{}
.sub.orgs .page-content .tabs-header{ 
	position: sticky; top: 0; z-index: 3;
	width: 100%; padding-block: var(--gap-24);
	background-color: var(--white);
}
.sub.orgs .page-content .tab-content{ padding-block: var(--gap-160-84) var(--gap-240-160); }
.sub.orgs .page-content #tabSwiper	{ margin-left: 0; margin-right: 0; }
@media all and (min-width: 768px) {
	.sub.orgs .page-content #tabSwiper ul	{ justify-content: center; }
}
@media all and (max-width: 767px) {
	.sub.orgs .page-content #tabSwiper		{ overflow: visible; }
}

/* {Common - Layout} - 공통 레이아웃 */
.sub.orgs .orgs-layout						{ display: flex; flex-direction: column; }
.sub.orgs .orgs-layout .infinity-loop		{ overflow: visible; margin-left: 0; margin-right: 0; }
.sub.orgs .orgs-layout .infinity-loop ul	{ transition-timing-function: linear !important; }

.sub.orgs .orgs-layout .marquee-wrap		{ padding-block: var(--gap-120-84); }
.sub.orgs .orgs-layout .marquee				{  }
.sub.orgs .orgs-layout .marquee .inner		{  
	--marquee-gap: 112px; --marquee-wh: 16px; 
	line-height: var(--lh125);
}
.sub.orgs .orgs-layout .marquee .text		{ 
	margin-right: var(--marquee-gap);
	font-size: var(--display-160-48); font-weight: var(--fw600);
}
.sub.orgs .orgs-layout .marquee .text::before{
	width: var(--marquee-wh); aspect-ratio: 1/1; border-radius: 50%;
	left: calc(-1 * ((var(--marquee-gap) / 2) + (var(--marquee-wh) / 2)));
	background-color: var(--point-green);
}

.sub.orgs .orgs-layout .table-wrap.line-table{ border-top: 2px solid var(--n-900); }
.sub.orgs .orgs-layout .table-wrap.line-table thead{ border-bottom: 2px solid var(--gray-light); }
.sub.orgs .orgs-layout .table-wrap.line-table th{ 
	height: 60px; font-size: var(--fs-20-16); 
	background-color: var(--gray-light2); font-weight: var(--fw500);
}
.sub.orgs .orgs-layout .table-wrap.line-table td{ 
	padding-block: 12px; padding-inline: 6px; 
	border-left: 1px solid var(--gray-light);
	border-bottom: 1px solid var(--gray-light);
	font-size: var(--fs-18-14); word-break: keep-all;
}
.sub.orgs .orgs-layout .table-wrap.line-table .bl-n,
.sub.orgs .orgs-layout .table-wrap .bl-n{ border-left: 0px !important; }

@media all and (max-width: 1025px){
	.sub.orgs .orgs-layout .marquee .inner	{ --marquee-gap: 66px; --marquee-wh: 8px }
}
@media all and (min-width: 768px){
	.sub.orgs .orgs-layout .infinity-loop li { width: auto !important; }
}
@media all and (max-width: 767px) {
	.sub.orgs .orgs-layout .marquee-wrap	{ padding-block: var(--gap-84-48); }
	.sub.orgs .orgs-layout .marquee .inner	{ --marquee-gap: 36px; --marquee-wh: 4px }
}


/* <About> - 레이아웃 - 소개 */
.sub.orgs .orgs-about		{ gap: var(--gap-84); }
.sub.orgs .orgs-about .box-wrap .icon-wrap		{}
.sub.orgs .orgs-about .box-wrap .icon-wrap ul	{ padding-top: var(--gap-48); }
@media all and (min-width: 1024px){
	body.is-tablet .sub.orgs .orgs-about .mo-hide		{ display: none !important; }
	body.is-tablet .sub.orgs .orgs-about .grid-wrap.col-2-1{
		grid-template-columns: repeat(1, 1fr);
	}
}
@media all and (max-width: 1023px){
	.sub.orgs .orgs-about .mo-hide	{ display: none !important; }
	.sub.orgs .orgs-about .grid-wrap.col-2-1{
		grid-template-columns: repeat(1, 1fr);
	}
}

/* <History> - 레이아웃 - 연혁 */
.sub.orgs .orgs-history							{}
.sub.orgs .orgs-history .box-area .box-wrap		{
	display: flex; flex-direction: column;
	gap: var(--gap-84);
}
.sub.orgs .orgs-history .box-area .box-wrap + .box-wrap	{ 
	padding-top: var(--gap-160-84);
	border-top: 1px solid var(--gray-light);
}
.sub.orgs .orgs-history .box-area .box-wrap .title-wrap{
	max-width: max(952px,49.58vw); width: calc(100% - (max(327px,17.03vw) + 48px));
	margin-left: auto;
}

.sub.orgs .orgs-history .history-area			{ 
	display: flex; align-items: flex-start; 
	justify-content: space-between; gap: var(--gap-48);
}
.sub.orgs .orgs-history .history-area .img-wrap	{ 
	max-width: max(327px,17.03vw); 
	width: 100%; height: auto;
}
.sub.orgs .orgs-history .history-wrap			{
	max-width: max(952px,49.58vw); width: 100%;
	border-top: 1px solid var(--gray-light);
}
.sub.orgs .orgs-history .history-wrap dl		{ 
	padding-block: var(--gap-40-24);
	display: flex; gap: var(--gap-48-16);
}
.sub.orgs .orgs-history .history-wrap dt		{ 
	max-width: clamp(120px,11.72vw,202px); width: 100%;
	font-size: var(--fs-24-18); line-height: var(--lh140-160);
}
.sub.orgs .orgs-history .history-wrap dd		{ 
	display: flex; flex-direction: column;
	font-size: var(--fs-24-14); line-height: var(--lh140-160);
}
.sub.orgs .orgs-history .history-wrap dd span	{ display: block; }
.sub.orgs .orgs-history .history-wrap dl + dl	{ border-top: 1px solid var(--gray-light); }
/* [RWD] 반응형 */
@media all and (max-width: 1440px){
	.sub.orgs .orgs-history .maquee-images .maquee-img		{ max-width: 825px; }
}
@media all and (min-width: 1024px){
	body.is-desktop .sub.orgs .orgs-history .history-area .img-wrap	{ position: sticky; top: calc(var(--header) * 1.5); }
	body.is-desktop .sub.orgs .orgs-history .history-box .img-wrap	{}
	body.is-desktop .sub.orgs .orgs-history .history-box .img-wrap img:not(.first){ 
		position: absolute; inset: 0 0 0 0; width: 100%; height: 100%; object-fit: cover;
		clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
	}

	body.is-tablet .sub.orgs .orgs-history .box-area .box-wrap .title-wrap{ width: 100%; text-align: center; }
	body.is-tablet .sub.orgs .orgs-history .maquee-images .maquee-img		{ max-width: 655px; }
	body.is-tablet .sub.orgs .orgs-history .history-box .img-wrap img:not(.first){ display: none !important; }
	

	body.is-tablet .sub.orgs .orgs-history .history-area,
	body.is-tablet .sub.orgs .orgs-history .history-wrap dl			{ flex-direction: column; }
	body.is-tablet .sub.orgs .orgs-history .history-area .img-wrap,
	body.is-tablet .sub.orgs .orgs-history .history-wrap,
	body.is-tablet .sub.orgs .orgs-history .history-wrap dt			{ max-width: none; }
	body.is-tablet .sub.orgs .orgs-history .history-wrap dd			{ gap: var(--gap-10); }
}
@media all and (max-width: 1023px){
	.sub.orgs .orgs-history .maquee-images .maquee-img		{ max-width: 655px; }
	.sub.orgs .orgs-history .box-area .box-wrap .title-wrap	{ width: 100%; text-align: center; }
	.sub.orgs .orgs-history .history-box .img-wrap img:not(.first){ display: none !important; }

	.sub.orgs .orgs-history .history-area,
	.sub.orgs .orgs-history .history-wrap dl	{ flex-direction: column; }
	.sub.orgs .orgs-history .history-area .img-wrap,
	.sub.orgs .orgs-history .history-wrap,
	.sub.orgs .orgs-history .history-wrap dt	{ max-width: none; }
	.sub.orgs .orgs-history .history-wrap dd	{ gap: var(--gap-10); }
}
@media all and (max-width: 767px){
	.sub.orgs .orgs-history .maquee-images .maquee-img		{ max-width: 465px; }
}

/* <R&D> - 레이아웃 - R&D */
.sub.orgs .orgs-rnd				{}

/* <Product> - 레이아웃 - 제품 */
.sub.orgs .orgs-product			{}

.sub.orgs .orgs-product .swiper-area					{}
.sub.orgs .orgs-product .swiper-area .title-area		{ padding-bottom: var(--gap-48-24); }
.sub.orgs .orgs-product .swiper-area .img-area			{ cursor: pointer; }
.sub.orgs .orgs-product .swiper-area .swiper-btns		{ gap: var(--gap-16); }
.sub.orgs .orgs-product .swiper-area .swiper-btns .btn	{ 
	width: 60px; aspect-ratio: 1/1; border-radius: 50%;
	background-color: var(--gray-blue);
}
.sub.orgs .orgs-product .swiper-area .swiper-btns:has(.swiper-button-lock)		{ display: none; }
.sub.orgs .orgs-product .swiper-area .swiper-btns .btn.swiper-button-disabled	{ opacity: 0.1; }
.sub.orgs .orgs-product .swiper-area .swiper-btns .btn.prev	{}
.sub.orgs .orgs-product .swiper-area .swiper-btns .btn.next	{}
.sub.orgs .orgs-product .swiper-area .swiper-product		{ overflow: visible; }

.sub.orgs .orgs-product .items.brand			{}
.sub.orgs .orgs-product .items.brand .img-area	{ 
	width: 100%; aspect-ratio: 1/1; 
	display: flex; align-items: center;
	justify-content: center; background-color: var(--n-50);
}
.sub.orgs .orgs-product .items.brand .img-wrap	{
	width: max(240px,12.5vw); aspect-ratio: 1/1;
	mix-blend-mode: darken;
}

.sub.orgs .orgs-product .product-boxed{
	padding-block: 42px; padding-inline: clamp(84px,8.2vw,125px);
	display: flex; align-items: center; justify-content: space-between;
}
.sub.orgs .orgs-product .product-boxed .title-area{ width: calc(100% - clamp(280px,36.46vw,499px)); }
.sub.orgs .orgs-product .product-boxed .img-wrap{ 
	max-width: clamp(280px,36.46vw,499px); width: 100%; 
	aspect-ratio: 499/436;
}
@media all and (min-width:1024px) {
	body.is-tablet .sub.orgs .orgs-product .swiper-area .swiper-btns { display: none !important; }
	 body.is-tablet.sub.orgs .orgs-product .product-boxed{ padding-inline: var(--gap-84-48); }
}
@media all and (max-width:1023px) {
	.sub.orgs .orgs-product .swiper-area .swiper-btns { display: none !important; }
	.sub.orgs .orgs-product .product-boxed{ padding-inline: var(--gap-84-48); }
}
@media all and (max-width: 767px) {
	.sub.orgs .orgs-product .product-boxed{ 
		flex-direction: column; align-items: flex-start;
		padding-inline: var(--gap-48-24); gap: var(--gap-48);
	}
	.sub.orgs .orgs-product .product-boxed .title-area,
	.sub.orgs .orgs-product .product-boxed .img-wrap	{ width: 100%; max-width: none; }
	.sub.orgs .orgs-product .items.brand .img-wrap		{ max-width: 170px; }
}

/* <Partners> - 레이아웃 - 파트너 */
.sub.orgs .orgs-partners				{}
.sub.orgs .orgs-partners .partners-list {  gap: var(--gap-84-48) var(--gap-48-24); }
.sub.orgs .orgs-partners .items.brand .img-area	{ 
	width: 100%; aspect-ratio: 1/1; 
	display: flex; align-items: center;
	justify-content: center; background-color: var(--n-50);
}
.sub.orgs .orgs-partners .items.brand .img-wrap{ 
	width: max(clamp(234px,22.85vw,284px),14.79vw);
	aspect-ratio: 284/199; mix-blend-mode: darken;
}
@media all and (min-width:1024px) {
	body.is-tablet .sub.orgs .orgs-partners .partners-list{ grid-template-columns: repeat(2, 1fr); }
	body.is-tablet .sub.orgs .orgs-partners .partners-list .utils-wrap{ 
		flex-direction: column; gap: var(--gap-16);
		align-items: flex-start;
	}
	body.is-tablet .sub.orgs .orgs-partners .partners-list .utils-wrap .btn.detail{ width: 100%; }
}
@media all and (max-width:1023px) {
	.sub.orgs .orgs-partners .partners-list{ grid-template-columns: repeat(2, 1fr); }
	.sub.orgs .orgs-partners .partners-list .utils-wrap{ 
		flex-direction: column; gap: var(--gap-16);
		align-items: flex-start;
	}
	.sub.orgs .orgs-partners .partners-list .utils-wrap .btn.detail{ width: 100%; }
}
@media all and (max-width:767px) {
	.sub.orgs .orgs-partners .partners-list .utils-wrap .btn.detail{ height: var(--xsmall); }
	.sub.orgs .orgs-partners .items.brand .img-area .img-wrap{ width: 120px; }
}

/* <Bisuness> - 레이아웃 - 비지니스 */
.sub.orgs .orgs-business		{}
.sub.orgs .orgs-business .info-area{ width: max(clamp(602px,58.85vw,702px),36.56vw); }
.sub.orgs .orgs-business .info-wrap{}
.sub.orgs .orgs-business .bg-box	{
	display: flex; flex-direction: column;
	align-items: flex-start; justify-content: center; gap: var(--gap-4);
	background-color: var(--gray-light2);
	padding-inline: var(--gap-48-24); height: 190px;
}
.sub.orgs .orgs-business .bg-box .count{}
.sub.orgs .orgs-business .bg-box .text{}
.sub.orgs .orgs-business .bg-box.bg-grayblue{ background-color: var(--gray-blue);}
.sub.orgs .orgs-business .bg-box.bg-grayblue .count{  color: var(--white); letter-spacing: -0.03em;  }
.sub.orgs .orgs-business .bg-box.bg-grayblue .text{  color: var(--n-200);  }

.sub.orgs .orgs-business .swiper-business .swiper-pagination.normal,
.sub.orgs .orgs-business #ctsSwiper .swiper-pagination.normal{ position: relative; margin-top: 16px; }
@media all and (min-width:1024px) {
	body.is-tablet .sub.orgs .orgs-business .info-area{ width: 100%; }
}
@media all and (max-width:1023px) {
	.sub.orgs .orgs-business .info-area		{ width: 100%; }
}
@media all and (max-width:767px) {
	.sub.orgs .orgs-business .info-wrap .grid-wrap		{ grid-template-columns: repeat(1, 1fr); }
	.sub.orgs .orgs-business .info-wrap .grid-custom li	{ grid-column: 12 span; }
	.sub.orgs .orgs-business .bg-box					{ height: 120px; }
	
}



/* {Depth02 - Mapal} 그룹사소개 - 마팔 */
.sub.orgs.mapal .section.titles .img-wrap				{ width: max(240px,12.5vw); aspect-ratio: 240/120; }
@media all and (max-width: 767px) {
	.sub.orgs.mapal .section.titles .img-wrap			{ width: 140px; }
}
/* <About> - 소개 */
.sub.orgs.mapal #tabAbout		 { padding-block: 0 !important; }
.sub.orgs.mapal #tabAbout .box-02{ padding-bottom: var(--gap-160-84); }
.sub.orgs.mapal #tabAbout .box-04,
.sub.orgs.mapal #tabAbout .box-05{ padding-block: var(--gap-160-84); border-top: 1px solid var(--gray-light); }
.sub.orgs.mapal #tabAbout .box-04 .title-area,
.sub.orgs.mapal #tabAbout .box-05 .title-area{ display: grid; gap: var(--gap-48); }
.sub.orgs.mapal #tabAbout .maquee-images .maquee-img	{ max-width: 608px; width: 100%; }
.sub.orgs.mapal #tabAbout .box-04 .icon-svg path		{
	fill: none; will-change: fill; stroke: var(--gray-blue);
}
@media all and (max-width: 1440px){
	.sub.orgs.mapal #tabAbout .maquee-images .maquee-img	{ max-width: 488px; width: 100%; }
}
@media all and (min-width: 1024px) {
	body.is-desktop .sub.orgs.mapal #tabAbout .box-02 .text-area,
	body.is-desktop .sub.orgs.mapal #tabAbout .box-04 .title-area,
	body.is-desktop .sub.orgs.mapal #tabAbout .box-05 .title-area	{
		display: grid; grid-template-columns: repeat(2, 1fr);
		gap: var(--gap-48);
	}
	
	body.is-tablet .sub.orgs.mapal #tabAbout .box-02,
	body.is-tablet .sub.orgs.mapal #tabAbout .box-area .box-05	{ padding-bottom: 0px; }

	body.is-tablet .sub.orgs.mapal #tabAbout .box-02 .mo-hide	{ display: none !important; }
	body.is-tablet .sub.orgs.mapal #tabAbout .box-area			{ gap: 0; }

	body.is-tablet .sub.orgs.mapal #tabAbout .maquee-images .maquee-img{ max-width: 358px; }
}
@media all and (max-width: 1023px) {
	.sub.orgs.mapal #tabAbout .box-02,
	.sub.orgs.mapal #tabAbout .box-area .box-05	{ padding-bottom: 0px; }

	.sub.orgs.mapal #tabAbout .box-02 .mo-hide	{ display: none !important; }
	.sub.orgs.mapal #tabAbout .box-area			{ gap: 0; }
	.sub.orgs.mapal #tabAbout .maquee-images .maquee-img{ max-width: 358px; }
}
@media all and (min-width: 768px) {
	.sub.orgs.mapal #tabAbout .orgs-about					{ gap: var(--gap-84); }
	.sub.orgs.mapal #tabAbout .box-04 .pack-basic.mo-col li,
	.sub.orgs.mapal #tabAbout .box-05 .pack-basic.mo-col li	{ width: calc(100% / 3); }
}
@media all and (max-width: 767px) {
	.sub.orgs.mapal #tabAbout .box-04 .pack-basic.mo-col li,
	.sub.orgs.mapal #tabAbout .box-05 .pack-basic.mo-col li	{ width: 100%; }
	.sub.orgs.mapal #tabAbout .maquee-images .maquee-img	{ max-width: 218px; }
}

/* <History> - 연혁 */
.sub.orgs.mapal #tabHistory	{}

/* <R&D> - R&D */
.sub.orgs.mapal #tabRnd	{}
.sub.orgs.mapal #tabRnd .box-01				{ width: 100%; height: calc(var(--vh100) * 2.5); }
.sub.orgs.mapal #tabRnd .box-01 .img-area	{
	position: sticky; top: 0;
	width: 100%; height: var(--vh100);
	clip-path: inset(50% 12% 0px);
	will-change: clip-path;
}
.sub.orgs.mapal #tabRnd .box-01 .img-wrap	{height: 100%;}

.sub.orgs.mapal #tabRnd .box-02 .pin-wrap	{ height: calc(var(--vh100) * 4); }
.sub.orgs.mapal #tabRnd .box-02 .pin-boxed	{
	position: sticky; top: 0;
	height: var(--vh100); padding-block: var(--gap-160-84);
}
.sub.orgs.mapal #tabRnd .box-02 .cir-area	{ 
	position: relative; width: 100%; height: 100%;
}
.sub.orgs.mapal #tabRnd .box-02 .cir-size	{ 
	position: absolute; top: 0; left: 50%; transform: translateX(-50%);
	border: 1px solid var(--gray-light); will-change: transform;
	aspect-ratio: 1/1; border-radius: 50%;
	transition: border-color 0.25s;
}
.sub.orgs.mapal #tabRnd .box-02 .cir-small	{ height: 25%; border-color: var(--n-50); }
.sub.orgs.mapal #tabRnd .box-02 .cir-medium	{ height: 50%; border-color: var(--n-100); }
.sub.orgs.mapal #tabRnd .box-02 .cir-large	{ height: 75%; border-color: var(--n-200); }
.sub.orgs.mapal #tabRnd .box-02 .cir-xlarge	{ height: 100%; border-color: var(--n-400); }
.sub.orgs.mapal #tabRnd .box-02 .cir-xlarge::after{
	content: ""; position: absolute; left: 0; right: 0;
	width: 1px; height: 100%; margin: 0 auto;
	background-color: var(--n-400);
}
.sub.orgs.mapal #tabRnd .box-02 .cir-size.current{ border-color: var(--point-green); }

.sub.orgs.mapal #tabRnd .box-02 .cir-area .labels{ 
	position: absolute; 
	bottom: calc(-1 * var(--gap-48)); left: 0; right: 0;
}
.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list{
	position: absolute; top: 0; right: 0;
	width: 50%; height: 100%;
}
.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list ul,
.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list li { width: 100%; }

.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list li{ position: absolute; }
.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list li:nth-child(1){ top: 25%; }
.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list li:nth-child(2){ top: 50%; }
.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list li:nth-child(3){ top: 75%; }
.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list li:nth-child(4){ top: 100%; }

.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list .text-wrap{
	position: absolute; opacity: 0; visibility: hidden;
	transition: transform 0.25s, opacity 0.25s 0s, visibility 0.25s 0s;
}
.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list .line{  
	position: relative; display: flex;
	width: 100%; height: 1px;
}
.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list li.current .text-wrap{
	opacity: 1; visibility: visible;
	transition: transform 0.25s, opacity 0.25s 0.25s, visibility 0.25s 0.25s;
}
.sub.orgs.mapal #tabRnd .box-03 .title-wrap + .pack-down{ width: max(clamp(602px,58.85vw,702px),36.56vw); }
.sub.orgs.mapal #tabRnd .box-04 #certSwiper{ overflow: visible; }
@media all and (min-width: 1024px){
	body.is-desktop .sub.orgs.mapal #tabRnd .box-03 .title-wrap{ 
		position: sticky; top: calc(var(--header) * 1.5);
	}
	body.is-tablet .sub.orgs.mapal #tabRnd .box-03 .title-wrap + .pack-down{ width: 100%; }

	body.is-tablet .sub.orgs.mapal #tabRnd .box-03 .max-1452	{ flex-direction: column; }
	body.is-tablet .sub.orgs.mapal #tabRnd .box-03 .future-list	{ width: 100%; }
}
@media all and (max-width: 1023px){
	.sub.orgs.mapal #tabRnd .box-03 .max-1452	{ flex-direction: column; }
	.sub.orgs.mapal #tabRnd .box-03 .future-list{ width: 100%; }
	.sub.orgs.mapal #tabRnd .box-03 .title-wrap + .pack-down{ width: 100%; }
}
@media all and (min-width: 768px) {
	.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list .text-wrap{
		top: -35px; right: 0; text-align: right; transform: rotate(90deg);
		transform-origin: top right;
	}

	.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list .line::after,
	.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list .line::before{
		content: ""; position: absolute;
	}
	.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list .line::after{
		top: 50%; transform: translateY(-50%) scale(0); left: calc(-1 * (6px / 2));
		width: 6px; height: 6px; border-radius: 50%;
		background-color: var(--n-600);
		transition: transform 0.25s 0.2s;
	}
	.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list .line::before{ 
		top: 0; left: 0; width: 0%; height: 100%;
		background-color: var(--n-400);
		transition: width 0.25s 0s;
	}
	.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list li.current .line::after	{ transform: translateY(-50%) scale(1); transition: width 0.25s 0s; }
	.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list li.current .line::before	{ width: 100%; transition: width 0.25s 0.2s; }
}
@media all and (max-width: 767px) {
	.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list .text-wrap{  top: -25px; left: 16px; }
	.sub.orgs.mapal #tabRnd .box-02 .cir-area .work-list .text-wrap .text{ display: none !important; }
}

/* <Business> - 비지니스 */
.sub.orgs.mapal #tabBusiness	{ }
.sub.orgs.mapal #tabBusiness .box-wrap:not(.box-01)	{
	border-top: 1px solid var(--gray-light);
	padding-top: var(--gap-160-84);
}
.sub.orgs.mapal #tabBusiness .cts-wrap,
.sub.orgs.mapal #tabBusiness .cts-wrap .img-wrap { aspect-ratio: 1/1; }
.sub.orgs.mapal #tabBusiness .cts-wrap .img-wrap { width: max(clamp(210px,27.34vw,340px),17.71vw); }

.sub.orgs.mapal #tabBusiness .tes-area{}
.sub.orgs.mapal #tabBusiness .tes-wrap{ height: 658px; }

.sub.orgs.mapal #tabBusiness .tes-01				{ padding: var(--gap-84-48); }
.sub.orgs.mapal #tabBusiness .tes-01 .img-wrap		{ max-width: max(1067px,55.57vw); width: 100%; margin: 0 auto; }

.sub.orgs.mapal #tabBusiness .tes-02{ text-align: center; }
.sub.orgs.mapal #tabBusiness .tes-02 .title-wrap{ position: relative; }
.sub.orgs.mapal #tabBusiness .tes-02 .pack-center + .title-wrap::after{
	content: ""; position: absolute; top: 32px; left: calc(-1 * var(--gap-84));
	width: 1px; height: calc(100% - 64px); background-color: var(--white);
}
@media all and (min-width:1024px) {
	body.is-desktop .sub.orgs.mapal #tabBusiness .box-01 .title-wrap	{ padding-bottom: var(--gap-48); }

	body.is-tabelt .sub.orgs.mapal #tabBusiness .tes-02 .tes-02-inner,
	body.is-tabelt .sub.orgs.mapal #tabBusiness .tes-02 .tes-02-01{ flex-direction: column; }
	body.is-tabelt .sub.orgs.mapal #tabBusiness .tes-02 .tes-02-01{ gap: var(--gap-48-24); }
	body.is-tabelt .sub.orgs.mapal #tabBusiness .tes-02 .tes-02-02{ }
}
@media all and (max-width:1023px) {
	.sub.orgs.mapal #tabBusiness .tes-02 .tes-02-inner,
	.sub.orgs.mapal #tabBusiness .tes-02 .tes-02-01{ flex-direction: column; }
	.sub.orgs.mapal #tabBusiness .tes-02 .tes-02-inner{ gap: var(--gap-84-48); }
	.sub.orgs.mapal #tabBusiness .tes-02 .tes-02-01{ gap: var(--gap-48-24); }
	.sub.orgs.mapal #tabBusiness .tes-02 .tes-02-02{}
	.sub.orgs.mapal #tabBusiness .tes-02 .pack-center + .title-wrap::after{
		top: calc(-1 * (var(--gap-48)) / 2); width: 74px; height: 1px;
		margin: 0 auto; left: 0; right: 0;
	}
}
@media all and (max-width:767px) {
	.sub.orgs.mapal #tabBusiness .cts-area{ grid-template-columns: repeat(1, 1fr); }
	.sub.orgs.mapal #tabBusiness .tes-wrap{ height: fit-content; padding: var(--gap-84-48); }



	.sub.orgs.mapal #tabBusiness .cts-wrap .img-wrap { width: 200px; }
}



/* {Depth02 - Hiteco} 그룹사소개 - 하이테코 */
.sub.orgs.hiteco{}
.sub.orgs.hiteco .section.titles .img-wrap				{ width: max(clamp(320px,16.67vw,450px),23.44vw); aspect-ratio: 450/120; }
@media all and (max-width: 767px) {
	.sub.orgs.hiteco .section.titles .img-wrap			{ width: 200px; }
}

/* <About> - 레이아웃 - 소개 */
.sub.orgs.hiteco .orgs-about 	{}
.sub.orgs.hiteco #tabAbout		{}
.sub.orgs.hiteco #tabAbout .box-02 .solution-wrap{  height: clamp(640px,62.5vw,870px); padding: var(--gap-48-24); }
.sub.orgs.hiteco #tabAbout .box-02 .solution-box	{ max-width: 437px; width: 100%; margin: 0 auto; }
.sub.orgs.hiteco #tabAbout .box-02 .solution-box .img-wrap{  width: 100%; aspect-ratio: 437/106; }
.sub.orgs.hiteco #tabAbout .box-02 .solution-list		{ padding-inline: var(--gap-40); }
.sub.orgs.hiteco #tabAbout .box-02 .solution-list dl	{ border-top: 4px solid var(--n-900); padding-top: var(--gap-24); }
.sub.orgs.hiteco #tabAbout .box-02 .solution-list dt	{}
.sub.orgs.hiteco #tabAbout .box-02 .solution-list dd	{ width: 120px; font-size: var(--fs-20-14); }
.sub.orgs.hiteco #tabAbout .box-02 .solution-list dd span{ color: var(--n-600);  }
@media all and (max-width: 767px) {
	.sub.orgs.hiteco #tabAbout .box-02 .solution-wrap				{ height: 520px; padding-inline: 0px; }
	.sub.orgs.hiteco #tabAbout .box-02 .solution-box .img-wrap		{ margin: 0 auto; }	
}
/* <History> - 레이아웃 - 연혁 */
/* <Business> - 레이아웃 - 비지니스 */
.sub.orgs.hiteco #tabBusiness{}
.sub.orgs.hiteco #tabBusiness .tab-content{padding-block: 0 !important;}
.sub.orgs.hiteco #tabBusiness .status-area{}
.sub.orgs.hiteco #tabBusiness .status-area .btn{ 
	padding-inline: var(--gap-48-24); background-color: var(--n-100);
	color: var(--n-800);
}

.sub.orgs.hiteco #tabBusiness .tabs-wrap{ width: 100%; border: 1px solid var(--gray-light);  }
.sub.orgs.hiteco #tabBusiness .tabs-wrap .tabs{ width: 100%; display: grid; grid-template-columns: repeat(3,1fr);  }
.sub.orgs.hiteco #tabBusiness .tabs-wrap .tabs li {}
.sub.orgs.hiteco #tabBusiness .tabs-wrap .tabs li + li { border-left: 1px solid var(--gray-light); }
.sub.orgs.hiteco #tabBusiness .tabs-wrap .tabs a{ background-color: var(--white); }
.sub.orgs.hiteco #tabBusiness .tabs-wrap .tabs li:hover a,
.sub.orgs.hiteco #tabBusiness .tabs-wrap .tabs li.current a{ background-color: var(--gray-blue); color: var(--white);}

.sub.orgs.hiteco #tabBusiness .status-area .tabs li.current .btn	{ background-color: var(--gray-blue); color: var(--white); }

.sub.orgs.hiteco #tabBusiness .status-area .ko-list	{ align-items: stretch; }
.sub.orgs.hiteco #tabBusiness .status-area .ko-list > li{ width: 50%; }

.sub.orgs.hiteco #tabBusiness .status-area .local-wrap	{ 
	height: 100%; 
	padding-block: clamp(48px,4.69vw,72px); padding-inline: clamp(32px,3.13vw,64px);
	gap: clamp(32px,3.13vw,60px);
}
.sub.orgs.hiteco #tabBusiness .status-area .local-wrap li{ 
	padding-inline: 20px;
	display: flex; align-items: flex-start;
	font-size: var(--fs-18-14);
}
.sub.orgs.hiteco #tabBusiness .status-area .local-wrap li p{ }

.sub.orgs.hiteco #tabBusiness .status-area .local-wrap .local-01{ position: relative; width: 30%; }
.sub.orgs.hiteco #tabBusiness .status-area .local-wrap .local-01 span{ 
	width: 12px;
	display: flex; align-items: center;
	justify-content: center;
}
.sub.orgs.hiteco #tabBusiness .status-area .local-wrap .local-02{ width: 30%; }
.sub.orgs.hiteco #tabBusiness .status-area .local-wrap .local-03{ width: 40%; text-align: right; }
.sub.orgs.hiteco #tabBusiness .status-area .local-wrap .local-main{ 
	border-top: 1px solid var(--gray-light);
	border-bottom: 1px solid var(--gray-light);
}
.sub.orgs.hiteco #tabBusiness .status-area .local-wrap .local-main li	{ height: clamp(70px,6.84vw,80px); align-items: center; }
.sub.orgs.hiteco #tabBusiness .status-area .local-wrap .local-sub		{
	gap: clamp(28px,2.73vw,48px);
}
.sub.orgs.hiteco #tabBusiness .btn.download{ color: var(--n-900); }
.sub.orgs.hiteco #tabBusiness .swiper-pagination.normal{ position: static; margin-top: 16px; }

.sub.orgs.hiteco #tabBusiness #hitecoBox04 .title-area .img-wrap{
	max-width: 580px; width: 100%; aspect-ratio: 580/499;
}
.sub.orgs.hiteco #tabBusiness #hitecoBox04 .table-wrap{ width: 100%; }
.sub.orgs.hiteco #tabBusiness #hitecoBox04 .table-wrap table{ table-layout: fixed; }
.sub.orgs.hiteco #tabBusiness #hitecoBox04 .table-wrap thead{ 
	border-bottom: 1px solid #DCDDDE;
	background-color: var(--n-50);
}
.sub.orgs.hiteco #tabBusiness #hitecoBox04 .table-wrap th{
	height: 65px; font-size: var(--fs-20-16);
	font-weight: var(--fw500); padding-inline: 24px;
}
.sub.orgs.hiteco #tabBusiness #hitecoBox04 .table-wrap td{
	padding-block: 10px; padding-inline: 24px;
	font-size: var(--fs-18-14); font-weight: var(--fw400);
	color: var(--gray-blue); 
	border-bottom: 1px solid #DCDDDE; border-left: 1px solid #DCDDDE;
	word-break: keep-all;
}


@media all and (max-width: 1280px) {
	.sub.orgs.hiteco #tabBusiness .status-area .ko-list > li:first-child{ width: 42%; }
	.sub.orgs.hiteco #tabBusiness .status-area .ko-list > li:last-child	{ width: 58%; }
}
@media all and (min-width: 1024px) {
	body.is-desktop .sub.orgs.hiteco #tabBusiness .status-area .btn:hover{ 
		background-color: var(--gray-blue); color: var(--white);
	}
	body.is-tablet .sub.orgs.hiteco #tabBusiness .status-area .ko-list{ flex-direction: column; }
	body.is-tablet .sub.orgs.hiteco #tabBusiness .status-area .ko-list > li{ width: 100% !important; }

	body.is-tablet .sub.orgs.hiteco #tabBusiness #hitecoBox04 .title-area .img-wrap{ max-width: none; }
}
@media all and (max-width: 1023px) {
	.sub.orgs.hiteco #tabBusiness .status-area .ko-list		{ flex-direction: column; }
	.sub.orgs.hiteco #tabBusiness .status-area .ko-list > li{ width: 100% !important; }

	.sub.orgs.hiteco #tabBusiness #hitecoBox04 .title-area .img-wrap{ max-width: none; }
}
@media all and (max-width: 767px) {
	.sub.orgs.hiteco #tabBusiness .status-area .title-area{ 
		flex-direction: column;
		align-items: flex-start;
	}
	.sub.orgs.hiteco #tabBusiness .status-area .btn{ height: var(--small); }
	.sub.orgs.hiteco #tabBusiness .status-area .local-wrap{ padding-inline: 20px; }
	.sub.orgs.hiteco #tabBusiness .status-area .local-wrap li{ padding-inline: 10px; }
	.sub.orgs.hiteco #tabBusiness .status-area .local-wrap .local-01{ width: 38%; }
	.sub.orgs.hiteco #tabBusiness .status-area .local-wrap .local-02{ width: 32%; }
	.sub.orgs.hiteco #tabBusiness .status-area .local-wrap .local-03{ width: 30%; word-break: keep-all; }
}



/* {Depth02 - TAMS} 그룹사소개 - TAMS */
.sub.orgs.tams{}
.sub.orgs.tams .section.titles .img-wrap			{ width: max(270px,14.06vw); aspect-ratio: 270/120; }
@media all and (max-width: 767px) {
	.sub.orgs.tams .section.titles .img-wrap		{ width: 140px; }
}
/* <About> - 레이아웃 - 소개 */
.sub.orgs.tams .orgs-about 	{}
.sub.orgs.tams #tabAbout 	{}
/* <History> - 레이아웃 - 연혁 */
.sub.orgs.tams .orgs-history 	{}
.sub.orgs.tams #tabHistory 	{}
/* <Business> - 레이아웃 - 비지니스 */
.sub.orgs.tams .orgs-business{}
.sub.orgs.tams #tabBusiness{}

.sub.orgs.tams #tabBusiness .cts-area{}
.sub.orgs.tams #tabBusiness .cts-area li		{ height: clamp(400px,52.08vw,680px);}
.sub.orgs.tams #tabBusiness .cts-area li > div	{ height: 100%; }
.sub.orgs.tams #tabBusiness .cts-area .img-wrap	{ width: clamp(200px,26.04vw,340px); aspect-ratio: 1/1; }
.sub.orgs.tams #tabBusiness .cts-area .img-03	{ width: clamp(300px,39.06vw,488px); aspect-ratio: 488/346; }

@media all and (min-width: 1024px) {
	body.is-desktop .sub.orgs.tams #tabBusiness {}
}
@media all and (max-width: 767px) {
	.sub.orgs.tams #tabBusiness{}
	.sub.orgs.tams #tabBusiness .cts-area li{ width: 100%; height: auto;  aspect-ratio: 1/1; }
	.sub.orgs.tams #tabBusiness .cts-area .img-03{ width: 260px; }
}



/* {Depth02 - NLT} 그룹사소개 - NLT */
.sub.orgs.nlt{}
.sub.orgs.nlt .section.titles .img-wrap			{ width: max(225px,14.06vw); aspect-ratio: 225/120; }
@media all and (max-width: 767px) {
	.sub.orgs.nlt .section.titles .img-wrap		{ width: 140px; }
}

/* <About> - 레이아웃 - 소개 */
.sub.orgs.nlt .orgs-about .marquee .text::before{ background-color: var(--danger2) !important; }
.sub.orgs.nlt .orgs-about .box-02 .img-wrap		{ max-width: 1145px; width: 100%; margin: 0 auto; }
.sub.orgs.nlt .orgs-about .box-03 .img-area ul,
.sub.orgs.nlt .orgs-about .box-05 .icon-wrap .grid-wrap{ gap: 18px var(--gap-48-24); }
/* <History> - 레이아웃 - 연혁 */
/* <Business> - 레이아웃 - R&D */
.sub.orgs.nlt .orgs-rnd .nlt-swiper-rnd .swiper-pagination.normal{ position: static; margin-top: 16px; }
@media all and (min-width: 1024px){
	body.is-tablet .sub.orgs.nlt .orgs-rnd .mo-hide		{ display: none !important; }
	body.is-tablet .sub.orgs.nlt .orgs-rnd .grid-wrap.col-2-1{
		grid-template-columns: repeat(1, 1fr);
	}
}
@media all and (max-width: 1023px){
	.sub.orgs.nlt .orgs-rnd .mo-hide	{ display: none !important; }
	.sub.orgs.nlt .orgs-rnd .grid-wrap.col-2-1{
		grid-template-columns: repeat(1, 1fr);
	}
}
/* <Product> - 레이아웃 - 제품 */




/* // () => [SUB - PAGE FAMILY END] 서브 그룹사소개 종료 */



/* ========================================
= [SUB - PAGE SUSTAIN] (Depth03)
= Description: Depth03 지속가능경영 소개
======================================== */
/* {Depth03 - ESG 개요} 지속가능경영 - ESG 개요 */
#content.sub.sustain.esg { padding-top: 0px !important; }
.sub.sustain.esg {}

.sub.sustain.esg .section			{ height: var(--vh100); }
.sub.sustain.esg .section .bg-area	{
	position: absolute; inset: 0 0 0 0;
	width: 100%; height: 100%;
	background-repeat: no-repeat; background-size: cover;
	background-position: center center;
}
.sub.sustain.esg .section .content-area	{ position: relative; z-index: 1; }
.sub.sustain.esg .section .title-wrap	{ position: relative; }
.sub.sustain.esg .section .cursor-link	{
	position: absolute; 
	bottom: calc(-1 * var(--gap-160)); left: 0; right: 0; 
	margin: 0 auto;
}

.sub.sustain.esg .section.intro{ }
.sub.sustain.esg .section.intro .bg-area{
	background-image: url("../images/esg/esg-00.jpg");
}
.sustain.esg .section.intro .split-overline		{ flex-direction: column; }
.sub.sustain.esg .section.intro .img-wrap		{ width: 180px; }
.sub.sustain.esg .section.intro .qr-wrap		{ 
	position: absolute; bottom: clamp(40px,5.21vw,80px); right: clamp(40px,5.21vw,80px);
	width: 68px; aspect-ratio: 1/1;
}


.sub.sustain.esg .section.env{}
.sub.sustain.esg .section.env .bg-area{ background-image: url("../images/esg/esg-01.jpg"); }
.sub.sustain.esg .section.soc{}
.sub.sustain.esg .section.soc .bg-area{ background-image: url("../images/esg/esg-02.jpg"); }
.sub.sustain.esg .section.gov{}
.sub.sustain.esg .section.gov .bg-area{	background-image: url("../images/esg/esg-03.jpg"); }
/* [RWD Section Common] 반응형 */
@media all and (min-width: 1024px){
	body.is-desktop .sub.sustain.esg #cursorLinkPc{
		top: 0; left: 0; transform: translate3d(-50%,-50%,0); z-index: 2;
		will-change: transform, opacity;
	}
	body.is-desktop .sub.sustain.esg .section .title-wrap	{ 
		width: 100%; height: 100%;
		justify-content: center;
	}
	body.is-desktop .sub.sustain.esg .section.intro .page-txt { align-items: flex-start; text-align: left; }
	
	body.is-desktop .sub.sustain.esg .section .cursor-link,
	body.is-tablet .sub.sustain.esg .section.intro .qr-wrap,
	body.is-tablet .sub.sustain.esg #cursorLinkPc{ display: none !important; }

	body.is-tablet .sub.sustain.esg .section.intro .text-area{ flex-direction: column; }

}
@media all and (max-width: 1023px) {
	.sub.sustain.esg .section.intro .qr-wrap,
	.sub.sustain.esg #cursorLinkPc{ display: none !important; }

	.sub.sustain.esg .section.intro .text-area{ flex-direction: column; }
}
@media all and (max-width: 767px) {
	.sub.sustain.esg .section.intro .img-wrap		{ width: 110px; }
}


/* // {Depth03 - ESG 개요 End} 지속가능경영 - ESG 개요 종료 */


/* {Depth03 - E/S/G 공통} 지속가능경영 - E/S/G 공통 */
.sub.sustain.pillar{
	width: 100%; padding-bottom: var(--gap-240-160);
	background-color: var(--gray-light2);
}
.sub.sustain.pillar .page-header{ padding-block: clamp(114px,11.13vw,186px); }
.sub.sustain.pillar .page-header .title{ letter-spacing: -0.04em; }

.sub.sustain.pillar .page-label{}
.sub.sustain.pillar .page-label span{ padding-left: 0; color: var(--n-900); }
.sub.sustain.pillar .page-label span::after{ left: auto; right: -18px; }
/* [RWD 공통] */
@media all and (max-width: 767px) {
	.sub.sustain.pillar .page-header{ padding-block: var(--gap-84); }
	.sub.sustain.pillar .page-label span::after{ right: -12px; }
}

/* E/S/G 공통: Section Visual */
.sub.sustain.pillar .section.visual { 
	overflow: hidden;
	width: 100%; height: 600px;
}
.sub.sustain.pillar .section.visual .visual-bg{
	position: absolute; inset: 0 0 0 0;
	width: 100%; height: 110%;
	background-repeat: no-repeat; background-size: cover;
	background-position: center center;
}

/* E/S/G 공통: Section Esg */
.sub.sustain.pillar .section.esg { padding-top: var(--gap-160-84); }
.sub.sustain.pillar .section.esg .box-area,
.sub.sustain.pillar .section.esg .item-group{
	display: flex; flex-direction: column;
	gap: var(--gap-84);
}
.sub.sustain.pillar .section.esg .box-wrap{ 
	display: flex; justify-content: space-between;
	gap: var(--gap-48-24);
}
.sub.sustain.pillar .section.esg .customer-box + .customer-box{ 
	padding-top: var(--gap-48);
	border-top: 1px solid var(--gray-light);
}

.sub.sustain.pillar .section.esg .item-group,
.sub.sustain.pillar .section.esg .item.card{
	max-width: max(1077px,56.09vw); width: 100%;
}
.sub.sustain.pillar .section.esg .dot-list{}
.sub.sustain.pillar .section.esg .dot-list span{
	position: relative; display: block;
	padding-left: 20px;
}
.sub.sustain.pillar .section.esg .dot-list span::after{
	content: ""; position: absolute; top: clamp(8px,1.04vw,10px); left: 8px;
	width: 4px; height: 4px;
	background-color: var(--n-600); border-radius: 50%;
}
.sub.sustain.pillar .section.esg .btn.learn .ico{ transform: rotate(-180deg); }
.sub.sustain.pillar .section.esg .btn.learn.active .ico{transform: rotate(0deg);}
/* [RWD 공통] */
@media all and (min-width: 1024px) {
	body.is-desktop .sub.sustain.pillar .section.esg .box-wrap .title-wrap{
		position: sticky; top: calc(var(--header) + var(--gap-48-24));
		padding-bottom: var(--gap-48);
	}

	body.is-tablet .sub.sustain.pillar .section.esg .box-wrap	{ flex-direction: column; }
	body.is-tablet .sub.sustain.pillar .section.esg .item-group,
	body.is-tablet .sub.sustain.pillar .section.esg .item.card	{ max-width: none; width: 100%; }
}
@media all and (max-width: 1023px) {
	.sub.sustain.pillar .section.esg .box-wrap	{ flex-direction: column; }
	.sub.sustain.pillar .section.esg .item-group,
	.sub.sustain.pillar .section.esg .item.card	{ max-width: none; width: 100%; }
}
/* // {Depth03 -  E/S/G 공통 End} 지속가능경영 -  E/S/G 공통 종료 */


/* {Depth03 - Environmental} 지속가능경영 - 환경 */
/* 환경: Section Visual */
.sub.sustain.enviro .section.visual .visual-bg{ background-image: url("../images/esg/env-01.jpg"); }
/* [RWD Section Visual] 반응형 */
@media all and (max-width: 767px) {}

/* 환경: Section ESG */
.sub.sustain.enviro .section.esg .customer-wrap{}
.sub.sustain.enviro .section.esg .customer-box{
	padding-top: var(--gap-48);
	border-top: 1px solid var(--gray-light);
}
.sub.sustain.enviro .section.esg .customer-box dl{ width: calc(100% - 175px); }
.sub.sustain.enviro .section.esg .customer-box dt{ max-width: clamp(140px,13.67vw,178px); width: 100%; }

.sub.sustain.enviro .section.esg .box-01{}
.sub.sustain.enviro .section.esg .box-01 .img-wrap{
	width: clamp(145px,18.88vw,175px);
	aspect-ratio: 175/80;
}
.sub.sustain.enviro .section.esg .box-04{}
.sub.sustain.enviro .section.esg .box-04 .img-wrap{
	width: clamp(160px,20.83vw,240px); 
	aspect-ratio: 240/340;
}
/* [RWD Section ESG] 반응형 */
@media all and (min-width: 1024px) {
	body.is-tablet .sub.sustain.enviro .section.esg .customer-box,
	body.is-tablet .sub.sustain.enviro .section.esg .customer-box dl	{
		width: 100%; flex-direction: column; align-items: flex-start;
	}
	body.is-tablet .sub.sustain.enviro .section.esg .customer-box dt	{ max-width: none; }
}
@media all and (max-width: 767px) {
	.sub.sustain.enviro .section.esg .box-01 .img-wrap{ width: 132px; }
	.sub.sustain.enviro .section.esg .box-04 .img-wrap{ width: 120px; }

	.sub.sustain.enviro .section.esg .customer-box,
	.sub.sustain.enviro .section.esg .customer-box dl{
		width: 100%; flex-direction: column; align-items: flex-start;
	}
	.sub.sustain.enviro .section.esg .customer-box dt{ max-width: none; }
}
/* // {Depth03 - Environmental End} 지속가능경영 - 환경 종료 */


/* {Depth03 - Social} 지속가능경영 - Social */
/* Social: Section Visual */
.sub.sustain.social .section.visual .visual-bg{ background-image: url("../images/esg/social-01.jpg"); }
/* [RWD Section Visual] 반응형 */
@media all and (max-width: 767px) {
}

/* Social: Section ESG */
.sub.sustain.social{}
.sub.sustain.social .section.esg #socialSwiper01{  }
.sub.sustain.social .section.esg #socialSwiper01 ul{}
.sub.sustain.social .section.esg #socialSwiper01 li{width: clamp(277px,36.07vw,377px) !important;}

.sub.sustain.social .section.esg .box-02{}
.sub.sustain.social .section.esg .box-02 .icon-wrap{
	height: clamp(180px,23.44vw,214px); padding: var(--gap-24-16);
	display: flex; flex-direction: column;
	align-items: center; text-align: center;
	background-color: var(--gray-light2);
}

.sub.sustain.social .section.esg .box-02 .btn.line-b .ico{ width: 20px; }
/* [RWD Section ESG] 반응형 */
@media all and (max-width: 767px) {
	.sub.sustain.social .section.esg #socialSwiper01 li{width: 237px !important;}
	.sub.sustain.social .section.esg .box-02 .grid-wrap{ grid-template-columns: repeat(1, 1fr); }
	.sub.sustain.social .section.esg .box-02 .icon-wrap{ height: 170px; }
}
/* // {Depth03 - Social End} 지속가능경영 - Social 종료 */


/* {Depth03 - Governance} 지속가능경영 - Governance */
/* Governance: Section Visual */
.sub.sustain.govern .section.visual .visual-bg{ background-image: url("../images/esg/govern-01.jpg"); }
/* [RWD Section Visual] 반응형 */
@media all and (max-width: 767px) {}

/* Governance: Section ESG */
.sub.sustain.govern .section.esg .box-04 .btn.line-b .ico{ width: 20px; }
/* // {Depth03 - Governance End} 지속가능경영 - Governance 종료 */


/* {Depth03 - 자료실} 지속가능경영 - 자료실 */
.sub.sustain.archive{ padding-bottom: var(--gap-240-160); }
.sub.sustain.archive .page-header,
.sub.sustain.archive .page-header + .page-content{ padding-top: var(--gap-160-84); }
/* [RWD 페이지 헤더, 콘텐츠] 반응형 */
@media all and (min-width: 1024px) {
	body.is-desktop .sub.sustain.archive .page-header .title-wrap{
		justify-content: space-between;
		flex-direction: unset; align-items: center;
	}
	body.is-desktop .sub.sustain.archive .page-header .title-wrap .page-txt{ text-align: right; }
}

/* 자료실: 탭 */
.sub.sustain.archive .tabs{}
.sub.sustain.archive .tabs a{}
.sub.sustain.archive .tab-content ul{ display: flex; flex-direction: column; }
.sub.sustain.archive .items.archive{ 
	padding-block: 30px; justify-content: center;
}
.sub.sustain.archive .items.archive .btn.download{ border-radius: 2px; }
.sub.sustain.archive .items.archive .accordion-header{ 
	width: 60px; aspect-ratio: 1/1;
	display: flex; align-items: center;
	justify-content: center;
}

.sub.sustain.archive .items.archive .accordion-content{
	font-size: var(--fs-16-14); color: var(--n-600);
}
.sub.sustain.archive .items.archive .accordion-header{ display: none !important; }
@media all and (min-width: 1024px) {
	body.is-tablet .sub.sustain.archive .tab-content ul{ gap: var(--gap-48); }

	body.is-tablet .sub.sustain.archive .items.archive{ padding-block: var(--gap-24); }
	body.is-tablet .sub.sustain.archive .items.archive .title-wrap{ gap: 0px; }
	body.is-tablet .sub.sustain.archive .items.archive .accordion-header{ display: none; }
}
@media all and (max-width: 1023px) {
	.sub.sustain.archive .tab-content ul{ gap: var(--gap-48); }
	.sub.sustain.archive .items.archive{ padding-block: var(--gap-24); }
	.sub.sustain.archive .items.archive .title-wrap{ gap: 0px; }
	
}
@media all and (max-width: 767px) {
	.sub.sustain.archive #swiper01{ overflow: visible; }
}

/* // {Depth03 - 자료실 End} 지속가능경영 - 자료실 종료 */
/* // () => [SUB - PAGE SUSTAIN END] 서브 지속가능경영 종료 */



/* ========================================
= [SUB - PAGE MEDIA] (Depth04)
= Description: Depth04 미디어센터 소개
======================================== */
.sub.media:not(.detail)					{ padding-bottom: var(--gap-240-160); }
.sub.media .page-header,
.sub.media .page-header + .page-content	{ padding-top: var(--gap-160-84); }
.sub.media .page-content{}
/* [RWD 페이지 헤더, 콘텐츠] 반응형 */
@media all and (min-width: 1024px) {
	body.is-desktop .sub.media .page-header .title-wrap{
		justify-content: space-between;
		flex-direction: unset; align-items: center;
	}
	body.is-desktop .sub.media .page-header .page-txt	{ text-align: right; }

	body.is-tablet .sub.media .page-content .grid-wrap.col-3{
		grid-template-columns: repeat(2, 1fr);
	}
}
@media all and (max-width: 1023px) {
	.sub.media .page-content .grid-wrap.col-3{ grid-template-columns: repeat(2, 1fr); }
}
@media all and (max-width: 767px) {
	.sub.media .page-content .grid-wrap.col-3{ grid-template-columns: repeat(1, 1fr); }
}

/* {Depth04 - News} 미디어센터 - 뉴스 */
.sub.media.news{}

/* {Depth04 - Library} 미디어센터 - 라이브러리 */
.sub.media.library{}
.sub.media.library .tabs-header{}
.sub.media.library .select{
	display: none !important;
	border: 0; width: 80px; height: 32px;
	font-size: var(--fs-18); font-weight: 400;
}

.sub.media.library .item-box{ position: relative; }
.sub.media.library .item-box .btn.download-b{
	position: absolute; bottom: var(--gap-48-24); right: var(--gap-48-24);
	z-index: 2;
}

/* [RWD Library] 반응형 */
@media all and (min-width:1024px) {
	body.is-desktop .sub.media.library .select{ display: block !important; }
	body.is-tabelt .sub.media.library .tabs-header .pack-down.gap-24{ gap: var(--gap-48); }
}
@media all and (max-width:1023px) {
	.sub.media.library .tabs-header .pack-down.gap-24{ gap: var(--gap-48); }
}
@media all and (max-width: 767px) {
	.sub.media.library #swiper01{ overflow: visible; }
}

/* // () => [SUB - PAGE MEDIA END] 서브 미디어센터 종료 */



/* ========================================
= [SUB - PAGE CAREER] (Depth05)
= Description: Depth05 인재채용 소개
======================================== */
.sub.career{}
.sub.career.pillar{
	width: 100%; padding-bottom: var(--gap-240-160);
	background-color: var(--gray-light2);
}
.sub.career.pillar .page-header{ padding-block: clamp(114px,11.13vw,186px); }
.sub.career.pillar .page-header .title{ letter-spacing: -0.04em; }

.sub.career.pillar .page-label{}
.sub.career.pillar .page-label span{ padding-left: 0; color: var(--n-900); }
.sub.career.pillar .page-label span::after{ left: auto; right: -18px; }
/* [RWD 공통] */
@media all and (max-width: 767px) {
	.sub.career.pillar .page-header{ padding-block: var(--gap-84); }
	.sub.career.pillar .page-label span::after{ right: -12px; }
}

/* E/S/G 공통: Section Visual */
.sub.career.pillar .section.visual,
.sub.career.pillar .section.career .img-area	{ 
	overflow: hidden;
	width: 100%; height: 600px;
}
.sub.career.pillar .section.career .img-area	{ 
	position: relative; height: 400px
}

.sub.career.pillar .section.visual .visual-bg,
.sub.career.pillar .section.career .visual-bg	{
	position: absolute; inset: 0 0 0 0;
	width: 100%; height: 110%;
	background-repeat: no-repeat; background-size: cover;
	background-position: center center;
}
.sub.career.pillar .section.career .customer-box + .customer-box{ 
	padding-top: var(--gap-48-24);
	border-top: 1px solid var(--gray-light);
}

.sub.career.pillar .section.career .dot-list{}
.sub.career.pillar .section.career .dot-list span{
	position: relative; display: block;
	padding-left: 20px;
}
.sub.career.pillar .section.career .dot-list span::after{
	content: ""; position: absolute; top: clamp(8px,1.04vw,10px); left: 8px;
	width: 4px; height: 4px;
	background-color: var(--n-600); border-radius: 50%;
}
.sub.career.pillar .section.career .visual-bg	{ height: 120%; }

.sub.career.pillar .section.career .img-area .title-wrap{
	position: absolute; inset: 0 0 0 0; z-index: 1;
	width: 100%; height: 100%;
	align-items: center; justify-content: center;
}
@media all and (max-width: 767px) {
	.sub.career.pillar .section.career .img-area{ height: 340px; }
	.sub.career.pillar .section.career .title-area .title{  letter-spacing: -0.04em;}
}

/* // {Depth03 -  인재채용 공통 End} 인재채용 - 인재채용 종료 */


/* {Depth05 - About} 인재채용 - 인재 */
.sub.career.talent .section.visual .visual-bg	{ background-image: url("../images/recruit/talent-01.jpg"); }
.sub.career.talent .section.career .box-01 .visual-bg	{ background-image: url("../images/recruit/talent-02.jpg"); }
.sub.career.talent .section.career .box-02 .visual-bg	{ background-image: url("../images/recruit/talent-03.jpg"); }
.sub.career.talent .section.career .box-03 .visual-bg	{ background-image: url("../images/recruit/talent-04.jpg"); }

.sub.career.talent .section.career .grid-wrap.col-1			{
	border-top: 1px solid var(--gray-light); 
	border-bottom: 1px solid var(--gray-light);
}
.sub.career.talent .section.career .grid-wrap.col-1 li		{ padding-block: var(--gap-48-24); }
.sub.career.talent .section.career .grid-wrap.col-1 li + li	{ border-top: 1px solid var(--gray-light); }
.sub.career.talent .section.career .grid-wrap.col-1 .item-box	{ gap: var(--gap-48-24); }

.sub.career.talent .section.career .box-01 .grid-wrap.col-1{ border-top: none; }
.sub.career.talent .section.career .box-01 .grid-wrap.col-1 li:first-child{padding-top: 0;}
.sub.career.talent .section.career .box-02 .item.card{ padding-inline: var(--gap-48-24); }
.sub.career.talent .section.career .box-02 .item.card dd span{ display: block; }


.sub.career.talent .section.career .box-03 .grid-custom{ gap: var(--gap-84-48); }
.sub.career.talent .section.career .box-03 .grid-custom > li{
	border-top: 1px solid var(--gray-light);
	padding-top: var(--gap-84-48);
}

.sub.career.talent .section.career .box-03 .cir-list{
	display: flex; align-items: center;
}
.sub.career.talent .section.career .box-03 .circle-255{ 
	width: max(254px,13.23vw);
	display: flex; align-items: center;
	justify-content: center; border: 1px solid var(--n-200);
}

.sub.career.talent .section.career .box-03 .circle04{ 
	border-color: var(--gray-light2); 
	background-color: var(--gray-light2);
}
.sub.career.talent .section.career .box-03 .circle05{ 
	border-color: var(--gray-light); 
	background-color: var(--gray-light);
}
.sub.career.talent .section.career .box-03 .circle06{ 
	border-color: var(--gray-blue); 
	background-color: var(--gray-blue); color: var(--white);
}
.sub.career.talent .section.career .box-03 .cir-list li:not(:first-child) .circle-255{ margin-left: calc(-1 * var(--gap-48-24)); }

.sub.career.talent .section.career .box-03 .underline{ color: var(--n-900); }

/* [RWD Section Visual] 반응형 */
@media all and (max-width: 1560px) {
	.sub.career.talent .section.career .box-03 .circle-255{ width: clamp(180px,16.15vw,254px); }
}
@media all and (max-width: 1440px) {
	.sub.career.talent .section.career .box-02 .grid-wrap.col-3{ grid-template-columns: repeat(2, 1fr); }
}
@media all and (min-width: 1024px) {
	body.is-tablet .sub.career.talent .section.career .box-03 .cir-list	{
		display: grid; grid-template-columns: repeat(3, 1fr);
	}
	body.is-tablet .sub.career.talent .section.career .box-03 .circle-255	{ width: calc(100% + var(--gap-48-24)); }

	body.is-tablet .sub.career.talent .section.career .box-03 .circle04		{ margin-left: 0  !important; }
	body.is-tablet .sub.career.talent .section.career .box-03 .circle04,
	body.is-tablet .sub.career.talent .section.career .box-03 .circle05,
	body.is-tablet .sub.career.talent .section.career .box-03 .circle06		{ margin-top: calc(-1 * var(--gap-48-24)); }
}
@media all and (max-width: 1023px) {
	.sub.career.talent .section.career .box-03 .cir-list	{ display: grid; grid-template-columns: repeat(3, 1fr); }
	.sub.career.talent .section.career .box-03 .circle-255	{ width: calc(100% + var(--gap-48-24)); }

	.sub.career.talent .section.career .box-03 .circle04	{ margin-left: 0 !important; }
	.sub.career.talent .section.career .box-03 .circle04,
	.sub.career.talent .section.career .box-03 .circle05,
	.sub.career.talent .section.career .box-03 .circle06	{ margin-top: calc(-1 * var(--gap-48-24)); }
}

@media all and (max-width: 767px) {
	.sub.career.talent .section.visual .visual-bg{ background-image: url("../images/recruit/talent-01_mo.jpg"); }
	.sub.career.talent .section.career .grid-wrap.col-1 .item-box	{ flex-direction: column; align-items: flex-start; }
	.sub.career.talent .section.career .grid-wrap.col-1 .icon-wrap	{ margin-left: auto; }
	.sub.career.talent .section.career .box-02 .grid-wrap.col-3		{ grid-template-columns: repeat(1, 1fr); }

	.sub.career.talent .section.career .box-03 .grid-custom{ gap: var(--gap-84-48) 0; }
	.sub.career.talent .section.career .box-03 .grid-custom > li.col-6{ grid-column: span 12; }

	.sub.career.talent .section.career .box-03 .cir-list{ grid-template-columns: repeat(2, 1fr); }

	.sub.career.talent .section.career .box-03 .circle01,
	.sub.career.talent .section.career .box-03 .circle03,
	.sub.career.talent .section.career .box-03 .circle05{ margin-left: 0 !important; }
	.sub.career.talent .section.career .box-03 .circle02,
	.sub.career.talent .section.career .box-03 .circle04,
	.sub.career.talent .section.career .box-03 .circle06{ margin-left: calc(-1 * var(--gap-48-24)) !important; }

	.sub.career.talent .section.career .box-03 .circle03,
	.sub.career.talent .section.career .box-03 .circle04,
	.sub.career.talent .section.career .box-03 .circle05,
	.sub.career.talent .section.career .box-03 .circle06{ margin-top: calc(-1 * var(--gap-48-24)); }
	
}





/* {Depth05 - About} 인재채용 - 문화 */
.sub.career.culture .section.visual .visual-bg			{ background-image: url("../images/recruit/culture-01.jpg"); }
.sub.career.culture .section.career .box-01 .visual-bg	{ background-image: url("../images/recruit/culture-02.jpg"); }
.sub.career.culture .section.career .box-02 .visual-bg	{ background-image: url("../images/recruit/culture-03.jpg"); }
.sub.career.culture .section.career .grid-wrap.col-1			{
	border-top: 1px solid var(--gray-light); 
	border-bottom: 1px solid var(--gray-light);
}
.sub.career.culture .section.career .grid-wrap.col-1 li			{ padding-block: var(--gap-48-24); }
.sub.career.culture .section.career .grid-wrap.col-1 li + li	{ border-top: 1px solid var(--gray-light); }
.sub.career.culture .section.career .grid-wrap.col-1 .item-box	{ gap: var(--gap-48-24); }

.sub.career.culture .section.career .grid-wrap.col-3{ gap: var(--gap-84-48) var(--gap-84-48); }
.sub.career.culture .section.career .grid-wrap.col-3 li{
	padding-top: var(--gap-84-48); border-top: 1px solid var(--gray-light); 
}

.sub.career.culture .section.career .box-01 .grid-wrap.col-1{ border-bottom: none; }
/* [RWD Section Visual] 반응형 */
@media all and (max-width: 767px) {
	.sub.career.culture .section.visual .visual-bg					{ background-image: url("../images/recruit/culture-01_mo.jpg"); }
	.sub.career.culture .section.career .grid-wrap.col-1 .item-box	{ flex-direction: column; align-items: flex-start; }
	.sub.career.culture .section.career .grid-wrap.col-1 .icon-wrap	{ margin-left: auto; }
	.sub.career.culture .section.career .grid-wrap.col-3{ 
		gap: var(--gap-48-24) var(--gap-24-16);
		grid-template-columns: repeat(2, 1fr);
	}
	.sub.career.culture .section.career .grid-wrap.col-3 li{ padding-top: var(--gap-48-24);}
}


/* {Depth05 - About} 인재채용 - 채용 */
.sub.career.process{ padding-bottom: var(--gap-240-160); }
.sub.career.process .page-header,
.sub.career.process .page-header + .page-content{ padding-top: var(--gap-160-84); }

.sub.career.process .select{
	display: none !important;
	border: 0; width: 80px; height: 32px;
	font-size: var(--fs-18); font-weight: 400;
}

.sub.career.process .swiper-area{
	overflow: hidden; margin-inline: calc(-1 * var(--gutter)); padding-inline: var(--gutter);
	box-sizing: content-box;
}
.sub.career.process #swiper01{ overflow: visible; }
/* [RWD 페이지 헤더, 콘텐츠] 반응형 */
@media all and (min-width: 1024px) {
	body.is-desktop .sub.career.process .page-header .title-wrap{
		justify-content: space-between;
		flex-direction: unset; align-items: center;
	}
	body.is-desktop .sub.career.process .page-header .title-wrap .page-txt{ text-align: right; }
	body.is-desktop .sub.career.process .select{ display: block !important; }

	body.is-tabelt .sub.career.process .tabs-header .pack-down.gap-24{ gap: var(--gap-48); }
}
@media all and (max-width:1023px) {
	.sub.career.process .tabs-header .pack-down.gap-24{ gap: var(--gap-48); }
}


.sub.career.process .tab-content ul{
	display: flex; flex-direction: column;
}
.sub.career.process .items.archive{ }
.sub.career.process .items.archive .title-area{
	width: 100%;
}

.sub.career.process .items.archive .title-wrap .title{ width: 100%; }
.sub.career.process .items.archive .img-wrap img{
	width: 100%; height: 100%;
	object-fit: cover; object-position: center center;

}
/* [RWD Process] 반응형 */
@media all and (min-width:1024px) {
	body.is-desktop .sub.career.process .items.archive .title-wrap{
		width: calc(100% - 375px); align-items: baseline;
	}
	body.is-desktop .sub.career.process .items.archive .title-wrap .pack-down{ 
		width: calc(100% - clamp(130px,17.38vw,252px));
		gap: var(--gap-10);
	}
	body.is-desktop .sub.career.process .items.archive .img-wrap{ max-width: 327px; aspect-ratio: 327/167; }

	body.is-tablet .sub.career.process .tab-content ul{ gap: var(--gap-48); }
	
}
@media all and (max-width:1023px) {
	.sub.career.process .tab-content ul{ gap: var(--gap-48); }
	.sub.career.process .items.archive .img-wrap{}
}

/* // () => [SUB - PAGE CAREER END] 서브 인재채용 종료 */



/* ========================================
= [SUB - PAGE CONTACT] (Others)
= Description: Others 문의하기, 신고하기
======================================== */
#content.sub.contact{ 
	padding-top: calc(var(--header) + var(--gap-160-84));
	padding-bottom: var(--gap-240-160);
}
.sub.contact{}
.sub.contact .sect-header 	{}
.sub.contact .sect-header .page-tit	{ 
	font-size: var(--h2-48-24); 
	line-height: var(--lh125-140);
}

.sub.contact .section.forms .form-wrap,
.sub.contact .section.local .local-info{
	width: clamp(440px,42.97vw,702px);
}
/* [RWD Common] 반응형 */
@media all and (min-width: 1024px) {
	body.is-tablet .sub.contact .section .sect-content{ width: 100%; }

	body.is-tablet .sub.contact .section.forms .sect-wrap,
	body.is-tablet .sub.contact .section.local .sect-header	{align-items: flex-start; flex-direction: column;}

	body.is-tablet .sub.contact .section.forms .form-wrap,
	body.is-tablet .sub.contact .section.local .local-info	{ width: 100%; }
}
@media all and (max-width: 1023px) {
	.sub.contact .section .sect-content{ width: 100%; }

	.sub.contact .section.forms .sect-wrap,
	.sub.contact .section.local .sect-header{ align-items: flex-start; flex-direction: column; }

	.sub.contact .section.forms .form-wrap,
	.sub.contact .section.local .local-info	{ width: 100%; }
}

/* 문의하기: Section Forms */
.sub.contact .section.forms{}
.sub.contact:not(.help) .section.forms fieldset,
.sub.contact:not(.help) .section.forms .field-group{
	width: 100%; height: auto;
	gap: clamp(56px,7.29vw,140px);
}

.sub.contact .section.forms .upload-label #btnUpload{cursor: pointer;}
.sub.contact .section.forms .upload-label #btnUpload .ico.close{
	width: 18px; display: none;
	background-image: url("../images/@common/search-close.svg");
}
.sub.contact .section.forms .upload-label #btnUpload.active{}
.sub.contact .section.forms .upload-label #btnUpload.active span{ color: var(--n-900);}
.sub.contact .section.forms .upload-label #btnUpload.active .mask-check{ background-color: var(--n-900); }
.sub.contact .section.forms .upload-label #btnUpload.active .ico.close{ display: block; }

.sub.contact .section.forms .policy-label 		{ gap: 20px; transition: border-color 0.4s;  }
.sub.contact .section.forms .policy-label span,
.sub.contact .section.forms .policy-label .ico	{ transition: all 0.4s; }
.sub.contact .section.forms .policy-label .ico	{ width: 20px; }
.sub.contact .section.forms .policy-label:has(input:checked){ border-color: var(--n-900); }
.sub.contact .section.forms .policy-label:has(input:checked) span{ color: var(--n-900); }
.sub.contact .section.forms .policy-label:has(input:checked) .ico{ background-color: var(--n-900); }

.sub.contact .section.forms .policy-wrap .btn.policy{
	margin-top: 10px; gap: 0px;
	font-size: var(--fs-14); color: var(--n-600);
	font-weight: 400;
}
.sub.contact .section.forms .policy-wrap .btn.policy .ico{width: 18px;}

.sub.contact .section.forms .button-wrap .btn.config{ width: 100%; border-radius: 0; font-size: var(--fs-18);}
/* [RWD Section Forms] 반응형 */
@media all and (min-width: 1024px) {
	body.is-desktop .sub.contact .section.forms .sect-header{ 
		position: sticky; top: var(--header); padding-bottom: var(--gap-160);
	}
	body.is-desktop .sub.contact .section.forms .form-wrap .textarea{ height: 300px; }

	body.is-tablet .sub.contact .section.forms .sect-wrap{ gap: var(--gap-84); }
	body.is-tablet .sub.contact .section.forms .form-wrap .textarea{ height: 332px; }
}
@media all and (max-width: 1023px) {
	.sub.contact .section.forms .sect-wrap{ gap: var(--gap-84); }
	.sub.contact .section.forms .form-wrap .textarea{ height: 332px; }
}
@media all and (max-width: 768px) {
	.sub.contact .section.forms .field-group { gap: var(--gap-48); }
}


/* 문의하기: Section Local */
.sub.contact .section.local{}
.sub.contact .section.local .local-info		{}
.sub.contact .section.local .local-info a 	{
	display: flex; align-items: center;
	font-size: var(--fs-20-16); font-weight: 400;
	color: var(--n-600);
}
.sub.contact .section.local .maps-wrap{ width: 100%; height: clamp(580px,75.62vw,600px); }
.sub.contact .section.local .maps-wrap iframe{ width: 100%; height: 100%; }
/* [RWD Section Local] 반응형 */
@media all and (max-width: 767px) {}
/* // () => [SUB - PAGE CONTACT END] 서브 문의하기 종료 */



/* ========================================
= [SUB - PAGE POLICY] (Others)
= Description: Others 정책
======================================== */
#content.sub.others{ 
	padding-top: calc(var(--header) + var(--gap-160-84)); 
	padding-bottom: var(--gap-240-160);
}

.sub.others .page-header + .page-content{ padding-top: var(--gap-160-84); }
.sub.others .policies-layout,
.sub.others .policies-layout > ul,
.sub.others .policies-layout > ul > li{
	display: flex; flex-direction: column;
	gap: clamp(20px,5.33vw,24px);
} 
.sub.others .policies-layout *{font-size: var(--fs-16-14); }
.sub.others .policies-layout dl dd,
.sub.others .policies-layout dl dd span	{position: relative;}
.sub.others .policies-layout dl dd span	{ display: inline-block; }

.sub.others .policies-layout dl:is(.circle, .number) dd span{padding-left: clamp(16px,4.27vw,24px);}
.sub.others .policies-layout dl.circle dd span::after{
	content: ""; position: absolute; top: clamp(9px,2.4vw,10px); left: clamp(6px,1.6vw,10px);
	width: 4px; height: 4px; border-radius: 50%;
	background-color: var(--n-900);
	
}

/* {Others - Policies} 정책 - 개인정보 처리방침 */
.sub.others.policies{}


/* {Others - Error} 정책 - 개인정보 처리방침 */
#content.sub.others.error{ padding-block: var(--gap-120-84); }
.sub.others.error{ height: var(--vh100);}
.sub.others.error .page-content{
	width: 100%; height: 100%;
	display: flex; align-items: center;
	justify-content: center;
}
.sub.others.error .title-area{ position: relative; width: 100%; }
.sub.others.error .title-wrap{ position: relative; width: 100%; display: flex; flex-direction: column; align-items: center; }
.sub.others.error .page-tit{ font-size: max(380px,19.79vw); line-height: var(--lh125); }
.sub.others.error .page-tit span{ line-height: var(--lh125); }
.sub.others.error .text	{ 
	position: absolute; top: 50%; 
	width: fit-content; padding: 12px 24px; border-radius: 100px;
	background-color: var(--gray-blue); color: var(--white);
	font-size: var(--fs-24-14); transform: rotate(-15deg);
}
.sub.others.error .button-wrap{ margin-top: var(--gap-40-24); }
@media all and (min-width: 1024px) {
	body.is-tablet .sub.others.error .page-tit{ font-size: 37.11vw; }
}
@media all and (max-width: 1023px) {
	.sub.others.error .page-tit{ font-size: 37.11vw; }
}
@media all and (max-width: 767px) {
	.sub.others.error .page-tit{ font-size: 170px; }
}
/* // () => [SUB - PAGE POLICY END] 서브 정책 종료 */