@charset "utf-8";
/* 공통 */
.sub-pd { padding: 100px 0;}
.sub-pd.bd { border-top: 1px solid #eee;}
.sub-pd.first { padding-top: 0;}
.sub-pd.last { padding-bottom: 0;}
.sub-tbl-wrap { overflow: auto;}
.sub-tbl { width: 100%; border-collapse: collapse; border-top: 2px solid #2c2c2c;}
.sub-tbl tr { border-bottom: 1px solid #ccc;}
.sub-tbl tr th { border-right: 1px solid #ccc; font-size: var(--font-size18); line-height: 1.66em; color: #2c2c2c; font-weight: 600; padding: 16px 10px;}
.sub-tbl.fz tr { border-bottom: 1px solid #eee;}
.sub-tbl.fz tr th { font-size: 16px; line-height: 1.5em; padding: 13px 10px; border-right: 1px solid #eee;}
.sub-tbl tr th:last-child { border-right: none; }
.sub-tbl tr td { border-right: 1px solid #ccc; line-height: 1.75em; color: #505050; font-weight: 400; padding: 16px 10px; text-align: center; }
.sub-tbl.fz tr td { padding: 13px 10px; border-right: 1px solid #eee;}
.sub-tbl tr td:last-child { border-right: none; }
.sub-tbl.fz tr th.bd { border-right: 1px solid #eee;}
.sub-tbl.fz tr td.bd { border-right: 1px solid #eee;}
.sub-tbl.fz tr td.left { text-align: left; padding-left: 16px; }
.sub-tbl.fz tr td.fw { color: #2c2c2c; font-weight: 500; }
.sub-tbl-span { text-align: right; display: block; margin-top: 12px; font-size: 14px; color: #878787; font-weight: 500; line-height: 1.42em; }
.subtit { margin-bottom: 16px; display: flex; gap: 24px; align-items: center; font-size: var(--font-size40); line-height: 1.35em; color: #2c2c2c; font-weight: 600; flex-wrap: wrap;}
.subtit strong { font-weight: 600; color: var(--color-secondary);}
.subtit.mg { margin-bottom: 24px; }
.subtit.db { display: block; margin-bottom: 50px; }
.subtit span { padding: 8px 12px; display: inline-block; background: #eef5fe; color: var(--color-secondary); line-height: 1.7em; font-size: var(--font-size20); font-weight: 600; }
.subtit span.pl { margin-left: -16px; }
.subtxt { margin-bottom: 80px; font-size: var(--font-size20); line-height: 1.7em; }
.subtxt.mg { margin-bottom: 0; }

/* Our Fundamental */
.fund-sec1 { position: relative; text-align: center; border-bottom: 1px solid #eee; padding-bottom: 150px; }
.fund-sec1 .big { position: absolute; left: 0; bottom: -17px; right: 0; margin: auto; line-height: 1em; font-size: 120px; color: #f6f6f6; font-weight: 600; }
.fund-sec1 h2 { display: inline-block; color: #2c2c2c; font-weight: 600; font-size: var(--font-size48); line-height: 1.41em; position: relative; }
.fund-sec1 h2 span { color: var(--color-secondary);}
.fund-sec1 h2::before { content: ""; position: absolute; width: 248px; height: 248px; z-index: -1; background: url(../images/sub/sub1-1-circle.png) center no-repeat; background-size: contain; left: -124px; top: -80px; }
.fund-sec1 p { font-size: var(--font-size24); line-height: 1.66em; font-weight: 500; margin-top: 20px; }
.fund-sec2 .col { display: flex; padding: 20px 0; border-bottom: 1px solid #eee; align-items: flex-start; flex-wrap: wrap;}
.fund-sec2 .col:last-child { padding-bottom: 0; border: none; }
.fund-sec2 .col>div { width: calc(100%/2); }
.fund-sec2 .col .left h3 { margin-bottom: 16px; font-size: var(--font-size40); line-height: 1.35em; font-weight: 600; color: #2c2c2c; }
.fund-sec2 .col .left p { font-size: var(--font-size20); line-height: 1.7em; }
.fund-sec2 .col .right { display: flex; flex-wrap: wrap; gap: 4px; }
.fund-sec2 .col .right .item { width: calc(100%/2 - 2px); padding: 24px; background: #f6f6f6; }
.fund-sec2 .col .right .item .tt { margin: 50px 0 14px; font-size: var(--font-size20); line-height: 1.7em; font-weight: 600; color: #2c2c2c; }
.fund-sec2 .col .right .item .txt { line-height: 1.75em; } 
.fund-sec3 { text-align: center; }
.fund-sec3 h2 { font-size: var(--font-size40); line-height: 1.4em; color: #2c2c2c; font-weight: 600; }
.fund-sec3 h2 span { color: var(--color-secondary);}
.fund-sec3 p { font-size: var(--font-size20); line-height: 1.7em; margin: 32px 0 80px;}
.fund-bg { background: url(../images/sub/sub1-1-bg.jpg) center no-repeat; background-size: cover; color: #fff; display: flex; flex-wrap: wrap; margin-bottom: 40px; }
.fund-bg .col { width: calc(100%/3); padding: 86px 10px; border-right: 1px solid rgba(255, 255, 255, 0.12);}
.fund-bg .col:last-child { border: none; }
.fund-bg .col .txt { font-size: var(--font-size18); line-height: 1.66em; font-weight: 400; margin-top: 32px; }

/* 인사말 */
.gt-bg { padding: 100px 48px; margin-bottom: 48px; border-radius: 0 120px 0 0; position: relative; background: url(../images/sub/sub1-2-bg.jpg) center no-repeat; background-size: cover;}
.gt-bg img { position: absolute; right: 32px; bottom: 0; }
.gt-bg h3 { background: linear-gradient(90deg, #0C1E5A 0%, #2D3C70 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: var(--font-size40); line-height: 1.35em; font-weight: 600; margin-bottom: 16px;}
.gt-bg h5 { font-size: var(--font-size24); line-height: 1.66em; font-weight: 500; }
.gt-bg h5 span { color: var(--color-secondary);}
.gt p { font-size: var(--font-size18); line-height: 1.66em; margin-bottom: 24px; }
.gt p:last-child { margin-bottom: 0; }
.gt-sign { display: flex; align-items: center; justify-content: flex-end; margin-top: 40px; gap: 24px; }
.gt-sign strong { display: inline-block; font-size: var(--font-size20); color: #2c2c2c; line-height: 1.7em; font-weight: 600; }

/* 수행이력 */
.hst-txt { margin-bottom: 100px; font-size: var(--font-size24); font-weight: 500; line-height: 1.41em; }
.hst-txt span { color: var(--color-primary);}
.hst { position: relative; }
.hst::before { content: ""; position: absolute; left: 50%; top: 0; transform: translateX(-50%); width: 1px; height: 100%; background: #dfdfdf; z-index: -1; }
.hst .group { display: flex; gap: 40px 200px; flex-wrap: wrap; margin-bottom: 160px; position: relative; }
.hst .group::before { content: ""; position: absolute; left: 0; right: 0; margin: auto; top: 0; width: 32px; height: 32px; background: url(../images/sub/hst-dots.png) center no-repeat; background-size: contain; }
.hst .group:last-child { margin-bottom: 0; }
.hst .group>div { width: calc(100%/2 - 100px); }
.hst .group .left .year { font-size: var(--font-size48); line-height: 1.41em; color: var(--color-secondary); font-weight: 700; }
.hst .group .left h5 { font-size: var(--font-size20); line-height: 1.7em; font-weight: 500; color: #2c2c2c; margin: 24px 0 16px; }
.hst .group .left p { line-height: 1.75em; margin-bottom: 80px; }
.hst .group .right .info { margin-bottom: 50px; }
.hst .group .right .info:last-child { margin-bottom: 0; }
.hst .group .right .info h4 { margin-bottom: 16px; font-size: var(--font-size24); line-height: 1.41em; color: #2c2c2c; font-weight: 600; }
.hst .group .right .info ul li { padding: 17px 0; border-bottom: 1px solid #eee; display: flex; }
.hst .group .right .info ul li .tt { font-size: var(--font-size18); line-height: 1.66em; font-weight: 500; color: #2c2c2c; width: 140px; position: relative; padding-left: 14px; }
.hst .group .right .info ul li .tt::before { content: ""; position: absolute; left: 0; top: 13px; background: var(--color-secondary); width: 4px; height: 4px; }
.hst .group .right .info ul li .txt { flex: 1 1 auto; min-width: 0; width: 1%; display: flex; align-items: center; justify-content: space-between;}
.hst .group .right .info ul li .txt p { line-height: 1.75em; flex: 1 1 auto; min-width: 0; width: 1%; padding-right: 10px; }
.hst .group .right .info ul li .txt .ctr { display: flex; width: 140px; height: 32px; background: #f9f9f9; font-size: 14px; font-weight: 600; line-height: 1.42em; color: #878787; text-align: center; justify-content: center; align-items: center; }
.hst-swiper img { width: 100%; }
.hst-swiper .swiper-pagination { position: relative; top: auto !important; margin-top: 20px; }
.hst-swiper .swiper-pagination-bullet { width: 6px; height: 6px; }
.hst-swiper .swiper-pagination-bullet-active { background: var(--color-primary);}

/* 특허 및 인증 */
.patent { display: flex; flex-wrap: wrap; gap: 40px; }
.patent .col { width: calc(100%/4 - 30px); text-align: center; }
.patent .col .thumb { position: relative; padding-bottom: 142%; margin-bottom: 18px; display: block; overflow: hidden;}
.patent .col .thumb img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; }
.patent .col .thumb::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px solid #eee;}
.patent .col .tit { font-size: var(--font-size20); font-weight: 500; line-height: 1.7em; color: #2c2c2c; }

/* 사업장 소개 */
.factory .col { display: flex; align-items: flex-start; padding: 60px 0; border-bottom: 1px solid #eee;}
.factory .col:last-child { border: none; padding-bottom: 0; }
.factory .col:first-child { padding-top: 0; }
.factory .col .img { width: 42%; }
.factory .col .info { width: 58%; padding: 10px 0; padding-left: 64px; }
.factory .col .info h3 { color: #2c2c2c; font-size: var(--font-size36); line-height: 1.38em; font-weight: 600;  display: flex; gap: 10px 40px; flex-wrap: wrap; align-items: center;}
.factory .col .info h3 a { width: 90px; height: 36px; display: flex; align-items: center; border: 1px solid var(--color-secondary); color: var(--color-secondary); font-size: 14px; font-weight: 500; line-height: 1em; padding-left: 12px; position: relative;}
.factory .col .info h3 a::after { content: ""; position: absolute; right: 12px; top: 0; bottom: 0; margin: auto; width: 10px; height: 10px; background: url(../images/sub/lct-view.png) center no-repeat; background-size: contain; }
.factory .col .info ul { margin: 50px 0;}
.factory .col .info ul li { display: flex; font-size: var(--font-size18); line-height: 1.66em; margin-bottom: 18px; align-items: flex-start;}
.factory .col .info ul li:last-child { margin-bottom: 0;}
.factory .col .info ul li .tt { width: 128px; display: flex; align-items: center; }
.factory .col .info ul li .tt strong { flex: 1 1 auto; min-width: 0; width: 1%; padding-left: 10px; font-weight: 600; color: var(--color-primary);}
.factory .col .info ul li .txt { flex: 1 1 auto; min-width: 0; width: 1%; color: #2c2c2c; }
.factory .col .info .hash { display: flex; gap: 0 33px; flex-wrap: wrap;}
.factory .col .info .hash span { display: inline-block; line-height: 1.5em; color: #878787; position: relative; }
.factory .col .info .hash span::after { content: ""; position: absolute; right: -17px; top: 4px; width: 1px; height: 16px; background: #eee; }
.factory .col .info .hash span:last-child::after { display: none; }

/* 글로벌 네트워크 */
.global-bg { background: url(../images/sub/sub1-6-bg.jpg) center no-repeat; background-size: cover; color: #fff; padding: 60px; color: rgba(255, 255, 255, 0.70); font-size: var(--font-size32); font-weight: 600; line-height: 1.5em; height: 51vh; margin-bottom: 20px; }
.global-bg span { color: #fff; }
.global-ci { margin-bottom: 120px; }
.global-ci .col { display: flex; align-items: center; padding: 40px 0; border-bottom: 1px dashed #dfdfdf;}
.global-ci .col:last-child { border: none; padding-bottom: 20px; }
.global-ci .col .img { position: relative; width: 38%; }
.global-ci .col .info { width: 62%; padding-left: 42px; }
.global-ci .col .info h4 { line-height: 1.5em; font-size: var(--font-size28); font-weight: 600; color: #2c2c2c; margin-bottom: 20px; padding-left: 14px; position: relative; }
.global-ci .col .info h4::before { content: ""; position: absolute; left: 0; width: 2px; height: 20px; border-radius: 2px; top: 10px; background: var(--color-secondary);}
.global-ci .col .info p { font-size: var(--font-size18); line-height: 1.66em; }
.global-contact { display: flex; gap: 9px; flex-wrap: wrap; }
.global-contact .col { width: calc(100%/3 - 6px); }
.global-contact .col a { display: block; padding: 24px; border: 1px solid #eee;}
.global-contact .col .txt { margin: 50px 0 4px; font-size: var(--font-size18); line-height: 1.66em; color: #878787; font-weight: 500; }
.global-contact .col .tit { font-size: var(--font-size24); line-height: 1.66em; color: #2c2c2c; font-weight: 600; }

/* 오시는 길 */
.maptab { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 10px; }
.maptab li { width: calc(100%/3 - 6px); cursor: pointer;}
.maptab li a { display: flex; height: 68px; background: #f6f6f6; align-items: center; justify-content: center; font-size: var(--font-size18); font-weight: 600; line-height: 1.55em; color: #878787; pointer-events: none; cursor: pointer;}
.maptab li.active a, 
.maptab li a:hover { background: var(--color-secondary); color: #fff; }
.mapbox { margin-bottom: 40px; }
.map-b { position: relative; height: 770px;}
.map-ab { overflow: hidden;}
.dr-box { opacity: 0; position: absolute; left: 0; top: 0; width: 100%;}
.dr-box.active { opacity: 1;}
.root_daum_roughmap {width:100% !important;}
.directions h3 { font-size: var(--font-size36); line-height: 1.38em; color: #2c2c2c; font-weight: 600; }
.directions p { font-size: var(--font-size18); line-height: 1.66em; color: #2c2c2c; margin: 24px 0 6px;}
.directions .addr span { color: #878787; line-height: 1.5em; }
.directions ul { margin-top: 40px; display: flex; gap: 12px; flex-wrap: wrap;}
.directions ul li { width: calc(100%/3 - 8px); display: flex; align-items: center; }
.directions ul li .info { flex: 1 1 auto; min-width: 0; width: 1%; padding-left: 24px; }
.directions ul li .info strong { display: block; font-size: var(--font-size20); line-height: 1.7em; color: var(--color-primary); font-weight: 600; margin-bottom: 12px; }
.directions ul li .info span { font-size: var(--font-size18); line-height: 1.66em; color: #2c2c2c; }

/* 적용분야 */
.field-tab { display: flex; margin-bottom: 100px; gap: 10px; flex-wrap: wrap;}
.field-tab li { width: calc(100%/5 - 8px);}
.field-tab li a { display: block; text-align: center; padding: 24px 10px; background: #f6f6f6; color: #878787; font-size: var(--font-size18); line-height: 1.55em; font-weight: 600; }
.field-tab li .icon { display: inline-block; width: 28px; height: 28px; margin: 0 auto 12px; background-repeat: no-repeat; background-position: center; background-size: contain; transition: .2s;}
.field-tab li .icon.bg1 { background-image: url(../images/sub/tab-icon1.png);}
.field-tab li a:hover .icon.bg1 { background-image: url(../images/sub/tab-icon1-w.png);}
.field-tab li .icon.bg2 { background-image: url(../images/sub/tab-icon2.png);}
.field-tab li a:hover .icon.bg2 { background-image: url(../images/sub/tab-icon2-w.png);}
.field-tab li .icon.bg3 { background-image: url(../images/sub/tab-icon3.png);}
.field-tab li a:hover .icon.bg3 { background-image: url(../images/sub/tab-icon3-w.png);}
.field-tab li .icon.bg4 { background-image: url(../images/sub/tab-icon4.png);}
.field-tab li a:hover .icon.bg4 { background-image: url(../images/sub/tab-icon4-w.png);}
.field-tab li .icon.bg5 { background-image: url(../images/sub/tab-icon5.png);}
.field-tab li a:hover .icon.bg5 { background-image: url(../images/sub/tab-icon5-w.png);}
.field-tab li a:hover { background: var(--color-secondary); color: #fff; }
.field-tab li.active a { background: var(--color-secondary); color: #fff; }
.field-tab li.active a .icon.bg1 { background-image: url(../images/sub/tab-icon1-w.png);}
.field-tab li.active a .icon.bg2 { background-image: url(../images/sub/tab-icon2-w.png);}
.field-tab li.active a .icon.bg3 { background-image: url(../images/sub/tab-icon3-w.png);}
.field-tab li.active a .icon.bg4 { background-image: url(../images/sub/tab-icon4-w.png);}
.field-tab li.active a .icon.bg5 { background-image: url(../images/sub/tab-icon5-w.png);}
.field-tab-content [data-tab-content]{ display: none; }
.field-tab-content [data-tab-content].active { display: block; }
.field-bg { height: 43vh; background-repeat: no-repeat; background-position: center; background-size: cover; color: #fff; display: flex; align-items: flex-end; padding: 34px 40px; font-size: var(--font-size48); font-weight: 600; line-height: 1.29em; margin-bottom: 40px; }
.field-bg.bg1 { background-image: url(../images/sub/sub2-1-1-img.jpg);}
.field-bg.bg2 { background-image: url(../images/sub/sub2-1-2-img.jpg);}
.field-bg.bg3 { background-image: url(../images/sub/sub2-1-3-img.jpg);}
.field-bg.bg4 { background-image: url(../images/sub/sub2-1-4-img.jpg);}
.field-bg.bg5 { background-image: url(../images/sub/sub2-1-5-img.jpg);}
.field-list { display: flex; flex-wrap: wrap; gap: 9px; }
.field-list li { width: calc(100%/3 - 6px); padding: 16px 24px; border: 1px solid #eee;}
.field-list.wt { gap: 10px; }
.field-list.wt li { width: calc(100%/2 - 5px); }
.field-list li .info { position: relative; padding-left: 18px; }
.field-list li .info::before { content: ""; position: absolute; left: 0; top: 14px; width: 6px; height: 6px; background: var(--color-secondary);}
.field-list li .info .tt { font-size: var(--font-size20); line-height: 1.7em; font-weight: 500; color: #2c2c2c; margin-bottom: 4px; }
.field-list li .info .txt { line-height: 1.5em; color: #878787; }

/* sub2 공통 */
.sub2-en-tit { font-size: var(--font-size20); color: #a8a8a8; font-weight: 500; line-height: 1.7em; margin-bottom: 16px; }
.sub2-tit { position: relative; padding-left: 14px; margin-bottom: 25px; font-size: var(--font-size24); line-height: 1.66em; font-weight: 600; color: #2c2c2c; }
.sub2-tit::before { content: ""; position: absolute; left: 0; top: 10px; width: 2px; height: 20px; background: var(--color-secondary); border-radius: 2px; }
.sub2-group { margin-bottom: 80px; }
.sub2-group.mg { margin-bottom: 0; }
.sub2-img { display: flex; gap: 4px; flex-wrap: wrap;}
.sub2-img>div { position: relative; color: #fff; flex: 1;}
.sub2-img>div img { width: 100%; }
.sub2-img>div .tt { position: absolute; left: 0; top: 0; padding: 20px 28px; font-size: var(--font-size18); line-height: 1.66em; font-weight: 600; }
.sub2-img>div .tt.fz { font-size: 16px; }
.sub2-img .txt { color: #878787; font-size: 16px; font-weight: 400; line-height: 1.5em; left: 0; right: 0; margin: auto; bottom: 24px; position: absolute; text-align: center; }
.sub2-img .txt.white { color: #fff; }
.sub2-feature { display: flex; gap: 4px; }
.sub2-feature .col { flex: 1; padding: 24px; background: #fafafa; }
.sub2-feature .col .tt { margin: 36px 0 10px; font-size: var(--font-size20); line-height: 1.7em; color: #2c2c2c; font-weight: 600; }
.sub2-feature .col .txt { line-height: 1.75em; }
.sub2-feature.wt { flex-wrap: wrap;}
.sub2-feature.wt .col { flex: none; width: calc(100%/3 - 3px);}
.sub2-feature.wt .col .tt { margin-top: 0; }
.sub2-fx { display: flex; gap: 4px; flex-wrap: wrap;}
.sub2-fx>div { width: calc(100%/2 - 2px); }
.sub2-fx .left .col { border: 1px solid #eee; padding: 23px 24px; margin-bottom: 4px; }
.sub2-fx .left .col.height { min-height: 173px; }
.sub2-fx .left .col:last-child { margin-bottom: 0;}
.sub2-fx .left .col .info { position: relative; padding-left: 18px; }
.sub2-fx .left .col .info::before { content: ""; position: absolute; left: 0; top: 14px; width: 6px; height: 6px; background: var(--color-secondary);}
.sub2-fx .left .col .info .tt { font-size: var(--font-size18); line-height: 1.66em; font-weight: 500; color: #2c2c2c; margin-bottom: 8px; }
.sub2-fx .left .col .info .txt { line-height: 1.75em; margin-bottom: 8px; }
.sub2-fx .left .col .info .txt:last-child { margin-bottom: 0;}
.sub2-noti { padding: 16px 24px; background: #fafafa; margin-top: 24px; }
.sub2-noti.mg { margin-top: 4px; }
.sub2-noti span { padding-left: 30px; line-height: 1.75em; position: relative; display: block; }
.sub2-noti span::before { content: ""; position: absolute; left: 0; top: 4px; width: 18px; height: 18px; background: url(../images/sub/noti-icon.png) center no-repeat; background-size: contain; }
.sub2-num { display: flex; flex-wrap: wrap; padding-top: 25px; border-top: 2px solid #2c2c2c; align-items: flex-start;}
.sub2-num .image { border: 1px solid #eee; text-align: center; width: 50%; }
.sub2-num .info { width: 50%; padding-left: 24px; display: flex; gap: 0 24px; flex-wrap: wrap; align-items: flex-start;}
.sub2-num .info .col { width: calc(100%/2 - 12px); border-bottom: 1px solid #eee; padding: 27px 16px; display: flex; align-items: flex-start;}
.sub2-num.pd .info .col { padding: 17px 16px;}
.sub2-num .info .col .num { width: 42px; font-size: var(--font-size20); line-height: 1.7em; color: #2c2c2c; font-weight: 600; }
.sub2-num .info .col .txtbox { flex: 1 1 auto; min-width: 0; width: 1%; padding-top: 2px; }
.sub2-num .info .col .txtbox .tt { margin-bottom: 8px; font-size: var(--font-size18); line-height: 1.66em; }
.sub2-num .info .col .txtbox .en-txt { color: #878787; line-height: 1.5em; }
.sub2-num .info .col .txtbox .txt { font-size: var(--font-size18); line-height: 1.66em; }
.sub2-num .info .col .txtbox .txt span { font-size: 16px; color: #878787; line-height: 1.5em; display: inline-block; padding-left: 3px; top: -1px; position: relative; }
.sub2-num .info .col.ended .num { color: #878787; }
.sub2-num .info .col.ended .txt { color: #878787; }
.sub2-func { display: flex; flex-wrap: wrap; border-top: 2px solid #2C2C2C; gap: 0 24px; }
.sub2-func .col { width: calc(100%/2 - 12px); border-bottom: 1px solid #eee; padding: 24px 0;}
.sub2-func.fx .col { width: calc(100%/3 - 16px); }
.sub2-func .col .num { color: var(--color-secondary); line-height: 1.7em; font-size: var(--font-size20); font-weight: 600; margin-bottom: 8px; }
.sub2-func .col .tit { font-size: var(--font-size18); line-height: 1.66em; color: #2c2c2c; font-weight: 600; }
.sub2-func .col .txt { line-height: 1.75em; padding-top: 12px; min-height: 150px;}
.sub2-func .col .txt.height { min-height: auto; padding-bottom: 24px; }
.sub2-func.fx .col .txt { padding-top: 0; }
.sub2-func .col .bd { position: relative; }
.sub2-func .col .bd::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px solid #eee;}

/* 복식형 필터프레스 */
.db-flex { display: flex; padding-top: 24px; border-top: 2px solid #2c2c2c; align-items: flex-end;}
.db-flex .left { width: 240px; margin-right: 24px; }
.db-flex .col { width: 100%; padding: 10px 16px; border-bottom: 1px solid #eee; min-height: 66px; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}
.db-flex .left .col { font-size: var(--font-size18); font-weight: 600; line-height: 1.66em; color: var(--color-secondary);}
.db-flex .left .col:first-child { color: #2c2c2c; }
.db-flex .left .col.height2 { min-height: 241px; }
.db-flex .col.height1 { min-height: 92px; }
.db-flex .right { display: flex; gap: 24px; flex-wrap: wrap; flex: 1 1 auto; min-width: 0; width: 1%; }
.db-flex .right .group { width: calc(100%/2 - 12px);}
.db-flex .right .col { justify-content: flex-start;}
.db-flex .right .col:first-child { color: #2c2c2c; font-size: var(--font-size18); font-weight: 600; line-height: 1.66em; justify-content: center;}
.db-flex .right .col.image { padding: 0; }
.db-flex .right .col span { color: #2c2c2c; font-weight: 600; display: none; width: 100%; padding-bottom: 5px; }

/* 자동화 필터프레스 */
.auto-spec { display: flex; flex-wrap: wrap; gap: 3px; }
.auto-spec .col { border: 1px solid #eee; padding: 24px; width: calc(100%/3 - 2px);}
.auto-spec .col .info { position: relative; padding-left: 18px; }
.auto-spec .col .info::before { content: ""; position: absolute; left: 0; top: 14px; width: 6px; height: 6px; background: var(--color-secondary);}
.auto-spec .col .info .tt { font-size: var(--font-size18); line-height: 1.66em; font-weight: 500; color: #2c2c2c; margin-bottom: 8px; }
.auto-spec .col .info .txt { line-height: 1.75em; margin-bottom: 8px; }
.auto-spec .col .info .txt:last-child { margin-bottom: 0;}
.auto-gray { background: #f6f6f6; padding: 24px; margin-bottom: 24px; }
.auto-gray h5 { margin-bottom: 8px; font-size: var(--font-size18); line-height: 1.66em; color: #2c2c2c; font-weight: 600; }
.auto-gray p { line-height: 1.75em; }

/* 부대설비 */
.fc-txt { font-size: var(--font-size18); line-height: 1.66em; margin-bottom: 24px; }
.fc-tab { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 4px; }
.fc-tab li { width: calc(100%/5 - 8px); text-align: center; }
.fc-tab li a { display: block; padding: 20px 10px; border: 1px solid #eee; }
.fc-tab li .tt { color: #878787; font-size: var(--font-size20); line-height: 1.7em; font-weight: 600; margin-bottom: 4px; transition: .2s;}
.fc-tab li .en-txt { color: #a8a8a8; line-height: 1.5em; transition: .2s;}
.fc-tab li a:hover { border-color: var(--color-secondary); background: var(--color-secondary);}
.fc-tab li a:hover .tt { color: #fff;}
.fc-tab li a:hover .en-txt { color: #fff;}
.fc-tab li.active a { border-color: var(--color-secondary); background: var(--color-secondary);}
.fc-tab li.active a .tt { color: #fff;}
.fc-tab li.active a .en-txt { color: #fff;}
.fc-prev::after, .fc-next::after { display: none; }
.fc-prev, .fc-next { top: 50%; transform: translateY(-50%); margin-top: 0; background-color: rgba(0, 0, 0, 0.12);  backdrop-filter: blur(4px); background-repeat: no-repeat; background-position: center; background-size: 12px; width: 48px; height: 48px; }
.fc-prev { left: 32px; background-image: url(../images/sub/fc-prev.png);}
.fc-next { right: 32px; background-image: url(../images/sub/fc-next.png);}

/* sub3 공통 */
.sub3-list { display: flex; flex-wrap: wrap; gap: 9px;}
.sub3-list li { width: calc(100%/3 - 6px); padding: 16px 24px; border: 1px solid #eee;}
.sub3-list li strong { display: block; position: relative; padding-left: 18px; font-size: var(--font-size18); font-weight: 600; line-height: 1.66em; color: #2c2c2c; }
.sub3-list li strong::before { content: ""; position: absolute; left: 0; width: 6px; height: 6px; background: #396db5; top: 11px; }
.sub3-list li strong span { font-size: 14px; font-weight: 500; color: #878787; position: relative; top: -2px; }
.sub3-list.wt { gap: 8px; }
.sub3-list.wt li { width: calc(100%/4 - 6px);}
.sub3-list.wt li .txt { margin-top: 8px; line-height: 1.75em; padding-left: 18px; }

/* 여과포 */
.filter-download-btns { display: flex; justify-content: flex-end; gap: 12px; margin-top: 24px; }
.filter-download-btns a { display: inline-flex; height: 44px; align-items: center; border: 1px solid var(--color-secondary); padding-left: 22px; color: var(--color-secondary); font-weight: 600; line-height: 1em; position: relative; padding-right: 48px; }
.filter-download-btns a::after { content: ""; position: absolute; right: 22px; top: 0; bottom: 0; margin: auto; width: 14px; height: 14px; background: url(../images/sub/download.png) center no-repeat; background-size: contain; }

/* 여과지 */
.pp-fx { display: flex; gap: 4px; flex-wrap: wrap; }
.pp-fx>div { width: calc(100%/2 - 2px);}
.pp-fx .info { border: 1px solid #eee; padding: 24px; }
.pp-fx .info .txtbox { position: relative; padding-left: 18px; }
.pp-fx .info .txtbox::before { content: ""; position: absolute; left: 0; top: 11px; width: 6px; height: 6px; background: var(--color-secondary);}
.pp-fx .info .txtbox .tt { font-size: var(--font-size18); line-height: 1.66em; font-weight: 500; color: #2c2c2c; margin-bottom: 8px; }
.pp-fx .info .txtbox .txt { line-height: 1.75em; }

/* 여과패드 */
.pad-list { border-top: 2px solid #2C2C2C;}
.pad-list li { border-bottom: 1px solid #eee; padding: 24px 16px;}
.pad-list li span { display: block; padding-left: 18px; line-height: 1.75em; position: relative; }
.pad-list li span::before { content: ""; position: absolute; left: 0; top: 10px; width: 6px; height: 6px; background: var(--color-secondary); } 
.pad-gray { padding: 24px; background: #f6f6f6; margin-top: 40px; }
.pad-gray .tt { font-size: var(--font-size20); font-weight: 600; line-height: 1.7em; color: #2c2c2c; margin-bottom: 16px; }
.pad-gray ul { display: flex; gap: 8px 9px; flex-wrap: wrap;}
.pad-gray ul li { width: calc(100%/3 - 6px); padding-left: 18px; color: #2c2c2c; font-weight: 500; line-height: 1.5em; position: relative; }
.pad-gray ul li::before { content: ""; position: absolute; left: 0; top: 8px; width: 6px; height: 6px; background: var(--color-secondary); }
.pad-gray ul li span { color: #878787; font-size: 14px; }
.pad-fx { display: flex; flex-wrap: wrap; gap: 24px; }
.pad-fx > div { width: calc(100%/3 - 16px);}

/* 담당자 정보 */
.contact-info { display: flex; flex-wrap: wrap; gap: 40px; }
.contact-info .col { width: calc(100%/2 - 20px); padding: 40px; border: 1px solid #eee;}
.contact-info .col h3 { font-size: var(--font-size36); color: #2c2c2c; font-weight: 600; line-height: 1.38em; }
.contact-info .col .txt { margin: 40px 0;}
.contact-info .col .txt p { font-size: var(--font-size20); line-height: 1.7em; padding-left: 18px; position: relative; margin-bottom: 12px;}
.contact-info .col .txt p::before { content: ""; position: absolute; left: 0; top: 13px; width: 6px; height: 6px; background: var(--color-secondary); }
.contact-info .col .txt p:last-child { margin-bottom: 0; }
.contact-info .col ul { background: #fafafa; padding: 24px; }
.contact-info .col ul li { display: flex; margin-bottom: 18px; align-items: flex-start;}
.contact-info .col ul li:last-child { margin-bottom: 0; }
.contact-info .col ul li .tt { width: 120px; display: flex; align-items: center; }
.contact-info .col ul li .tt strong { display: inline-block; flex: 1 1 auto; min-width: 0; width: 1%; padding-left: 10px; line-height: 1.75em; color: #2c2c2c; font-weight: 600; }
.contact-info .col ul li .text { flex: 1 1 auto; min-width: 0; width: 1%; }
.contact-info .col ul li .text p { line-height: 1.75em; margin-bottom: 8px; }
.contact-info .col ul li .text p:last-child { margin-bottom: 0; }
.contact-info .col ul li .text p a { display: inline-block; font-size: 13px; font-weight: 500; line-height: 1.23em; color: var(--color-secondary); border: 1px solid #EEE; background: #FFF; padding: 6px 8px; margin-left: 12px; }

/* 카탈로그 */
.catalog { display: flex; flex-wrap: wrap; gap: 60px 40px;}
.catalog .col { width: calc(100%/4 - 30px); text-align: center; }
.catalog .col .thumb { position: relative; padding-bottom: 141%; display: block; overflow: hidden; }
.catalog .col .thumb img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; }
.catalog .col .thumb::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px solid #eee;}
.catalog .col .tit { margin: 20px 0; font-size: var(--font-size20); color: #2c2c2c; font-weight: 500; line-height: 1.7em; }
.download-btn { display: inline-flex; height: 44px; align-items: center; border: 1px solid var(--color-secondary); padding-left: 22px; color: var(--color-secondary); font-weight: 600; line-height: 1em; position: relative; padding-right: 48px; background: #fff; }
.download-btn::after { content: ""; position: absolute; right: 22px; top: 0; bottom: 0; margin: auto; width: 14px; height: 14px; background: url(../images/sub/download.png) center no-repeat; background-size: contain; }

/* CI 안내 */
.ci-sec1 { text-align: center; }
.ci-sec1 .subtit { margin-bottom: 32px;}
.ci-big { position: relative; height: 44vh; background: url(../images/sub/sub5-3-bg.png) center no-repeat; background-size: cover; display: flex; align-items: center; justify-content: center; margin: 50px 0;}
.ci-big .download-btn { position: absolute; right: 24px; bottom: 24px; }
.ci-fx { display: flex; flex-wrap: wrap; gap: 100px; align-items: center;}
.ci-fx>div { width: calc(100%/2 - 50px); }
.ci-fx .image { background: #fafafa; padding: 165px 15px;}
.ci-fx .info p { margin-bottom: 25px; font-size: var(--font-size18); line-height: 1.66em; text-align: left; }
.ci-fx .info p:last-child { margin-bottom: 0; }
.ci-sec2 { text-align: center; background: #fafafa; }
.ci-sec3 { text-align: center; }
.ci-white { position: relative; background: #fff; padding: 100px 0; border: 1px solid #eee; margin-bottom: 10px; display: flex; flex-wrap: wrap; align-items: center; height: 44vh;}
.ci-white::after { content: ""; position: absolute; width: 1px; height: calc(100% - 200px); background: #eee; left: 0; right: 0; margin: auto; top: 50%; transform: translateY(-50%);}
.ci-white p { position: absolute; color: #a8a8a8; font-size: var(--font-size18); line-height: 1.66em; left: 24px; top: 24px; }
.ci-white > div { width: calc(100%/2); }
.color-fx { display: flex; flex-wrap: wrap; gap: 10px; }
.color-fx > div { width: calc(100%/2 - 5px); padding: 32px; color: #fff; text-align: left; }
.color-fx > div:first-child { background: var(--color-primary);}
.color-fx > div:last-child { background: var(--color-secondary);}
.color-fx > div .tt { font-size: var(--font-size32); line-height: 1.43em; font-weight: 600; margin-bottom: 100px; }
.color-fx > div .txt { display: flex; gap: 4px 24px; flex-wrap: wrap; }
.color-fx > div .txt span { line-height: 1.75em; font-weight: 500; }
.color-fx > div .txt span strong { color: rgba(255,255,255,0.4); font-weight: 600; display: inline-block; padding-right: 5px; }

/* 인재채용 */
.rc-fx { display: flex; align-items: flex-start;}
.rc-fx .subtit { margin-bottom: 0; width: 36%; }
.rc-fx .contents { width: 64%; }
.talent { display: flex; }
.talent .col { margin-left: -30px; width: calc(100%/3 + 20px); border-radius: 100%; height: 320px; background-repeat: no-repeat; background-position: center; background-size: cover; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.talent .col:first-child { margin-left: 0; }
.talent .col.bg1 { background-image: url(../images/sub/sub5-4-bg1.jpg);}
.talent .col.bg2 { background-image: url(../images/sub/sub5-4-bg2.jpg);}
.talent .col.bg3 { background-image: url(../images/sub/sub5-4-bg3.jpg);}
.talent .col h5 { color: rgba(255,255,255,0.5); line-height: 1.75em; font-weight: 400; }
.talent .col h3 { color: #fff; font-size: var(--font-size24); font-weight: 600; line-height: 1.66em; }
.talent .col h4 { color: rgba(255,255,255,0.8); font-size: var(--font-size18); line-height: 1.66em; margin: 6px 0 24px; font-weight: 400; }
.upgrade-group.mg { margin-bottom: 50px; }
.upgrade-group h3 { font-size: var(--font-size24); line-height: 1.66em; font-weight: 600; color: #2c2c2c; margin-bottom: 24px; }
.upgrade-group ul { display: flex; padding-top: 52px; flex-wrap: wrap; position: relative; }
.upgrade-group ul::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 20px; background: url(../images/sub/sub5-4-way.png) center no-repeat; background-size: contain; }
.upgrade-group ul li { width: calc(100%/7); text-align: center; }
.upgrade-group ul li .num { width: 36px; height: 36px; border-radius: 100%; display: flex; align-items: center; justify-content: center; line-height: 1em; color: #fff; margin: 0 auto 16px; font-size: 14px; font-weight: 600; background: #ccc; }
.upgrade-group ul li .tit { font-size: var(--font-size20); line-height: 1.7em; font-weight: 500; color: #878787; }
.upgrade-group ul li:nth-child(2) .num { background: #9da1b0; }
.upgrade-group ul li:nth-child(3) .num { background: #7C839D; }
.upgrade-group ul li:nth-child(4) .num { background: #5B6689; }
.upgrade-group ul li:nth-child(5) .num { background: #414F81; }
.upgrade-group ul li:nth-child(6) .num { background: #2C3B71; }
.upgrade-group ul li:nth-child(7) .num { background: #0C1D53; }
.upgrade-group ul li:nth-child(2) .tit { color: #676767; }
.upgrade-group ul li:nth-child(3) .tit { color: #505050; }
.upgrade-group ul li:nth-child(4) .tit { color: #2C2C2C; }
.upgrade-group ul li:nth-child(5) .tit { color: #121212; }
.upgrade-group ul li:nth-child(6) .tit { color: #121212; }
.upgrade-group ul li:nth-child(7) .tit { color: #000; }
.edu-wrap { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 50px; }
.edu-wrap .col { width: calc(100%/5 - 8px); text-align: center; padding: 48px 10px 42px; background: #f9f9f9; }
.edu-wrap .col .tt { margin-top: 16px; font-size: var(--font-size18); color: #2c2c2c; font-weight: 600; line-height: 1.66em; }
.edu-list { margin-top: 50px; }
.edu-list li { border: 1px solid #eee; margin-bottom: 10px; padding: 24px; }
.edu-list li:last-child { margin-bottom: 0; }
.edu-list li .info { padding-left: 18px; position: relative; }
.edu-list li .info::before { content: ""; position: absolute; left: 0; width: 6px; height: 6px; top: 11px; background: var(--color-secondary); }
.edu-list li .info .tt { color: #2c2c2c; font-size: var(--font-size18); font-weight: 500; line-height: 1.66em; margin-bottom: 12px; }
.edu-list li .info .txt { line-height: 1.75em; }
.edu-list li .info .gray-txt { font-size: 14px; font-weight: 500; line-height: 2em; color: #878787; margin-top: 12px; }
.rc-bg { color: #fff; padding: 94px 0; background: url(../images/sub/sub5-4-big.jpg) center no-repeat; background-size: cover;}
.rc-bg .subtit { color: #fff; }
.rc-bg .btns { display: flex; gap: 24px; margin-top: 64px; }
.rc-bg .btns a { display: inline-flex; height: 66px; align-items: center; border: 1px solid rgba(255, 255, 255, 0.16); background: rgba(255, 255, 255, 0.16); backdrop-filter: blur(12px); padding-left: 30px; color: #fff; font-weight: 600; line-height: 1em; position: relative; padding-right: 66px; font-size: var(--font-size20);}
.rc-bg .btns a::after { content: ""; position: absolute; right: 30px; top: 0; bottom: 0; margin: auto; width: 12px; height: 12px; background: url(../images/sub/sub5-4-view.png) center no-repeat; background-size: contain; }