@charset "utf-8";
/* 공통 */
.sub-pd { padding: 100px 0;}
.sub-pd.first { padding-top: 0; }
.sub-pd.last { padding-bottom: 0; }
.sub-pd.bg { background: #fafafa; }
.sub-subtit { font-size: var(--font-size20); font-weight: 500; line-height: 1.7em; color: var(--color-primary); margin-bottom: 20px;}
.sub-subtit.tc { text-align: center; }
.title-group { margin-bottom: 60px; text-align: center; }
.subtit { font-size: var(--font-size40); line-height: 1.35em; color: #2c2c2c; margin-bottom: 32px; }
.subtit.tc { text-align: center; }
.subtit.mg { margin-bottom: 0; }
.subtit2 { padding-left: 18px; position: relative; font-size: var(--font-size32); font-weight: 600; line-height: 1.43em; color: #2c2c2c; margin-bottom: 40px; }
.subtit2::before { content: ""; position: absolute; left: 0; top: 6px; width: 2px; height: 32px; background: #8c9bb2; }
.subtit2.mg { margin-bottom: 60px; }
.subtxt { font-size: var(--font-size20); line-height: 1.7em; }
.subtxt.tc { text-align: center; }
.sub-flex { display: flex; align-items: flex-start;}
.sub-flex.mt { margin-top: 100px; }
.sub-flex .subtit2 { width: 440px; margin-bottom: 0; }
.sub-flex .info { flex: 1 1 auto; min-width: 0; width: 1%; }

/* 인사말 */
.gt { display: flex; align-items: center;}
.gt .img { width: 50%; padding-right: 60px; }
.gt .info { width: 50%; padding-left: 40px; }
.gt .info .txt p { margin-bottom: 24px; font-size: var(--font-size18); font-weight: 400; line-height: 1.55em; }
.gt .info .txt p:last-child { margin-bottom: 0; }
.gt .info .txt p.fw { font-size: var(--font-size20); line-height: 1.7em; font-weight: 600; color: #2c2c2c; margin: 40px 0;} 
.gt .info .sign { margin-top: 40px; display: flex; align-items: center; gap: 24px; }
.gt .info .sign strong { display: inline-block; font-size: var(--font-size20); font-weight: 600; line-height: 1.7em; color: #2c2c2c; }

/* 회사소개 */
.it-list { display: flex; flex-wrap: wrap; gap: 16px; }
.it-list .item { background: #fff; border: 1px solid #eee; padding: 24px; width: calc(100%/4 - 12px);}
.it-list .item .ctr { font-weight: 500; line-height: 1.5em; color: var(--color-primary); }
.it-list .item .tt { font-size: var(--font-size20); line-height: 1.7em; font-weight: 500; color: #2c2c2c; margin: 8px 0 24px;}
.it-list .item .icon { text-align: right; }
.it-img { display: flex; gap: 40px; }
.it-img .item { flex: 1; }
.it-img .item .img { position: relative; margin-bottom: 16px; }
.it-img .item .img img { width: 100%; height: 100%; object-fit: cover; }
.it-img .item .img::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px solid #eee;}
.it-img .item .tt { font-size: var(--font-size20); line-height: 1.7em; font-weight: 500; color: #2c2c2c; }
.ci-bg { text-align: center; height: 360px; border: 1px solid #eee; display: flex; align-items: center; justify-content: center; background: url(../images/sub/ci-bg.jpg) center no-repeat; background-size: cover; margin-bottom: 60px; }
.ci-flex { display: flex; flex-wrap: wrap; gap: 8px; }
.ci-flex > div { width: calc(100%/2 - 4px); padding: 18px 24px; color: #fff; }
.ci-flex > div.bg1 { background: var(--color-primary);}
.ci-flex > div.bg2 { background: var(--color-secondary);}
.ci-flex > div .tt { font-size: var(--font-size24); font-weight: 600; line-height: 1.66em; margin-bottom: 20px; }
.ci-flex > div .txt { text-align: right; color: #ccc; font-weight: 400; line-height: 1.5em; }

/* 경영철학/정책 */
.mn-icon-list { display: flex; flex-wrap: wrap; gap: 15px; }
.mn-icon-list .item { width: calc(100%/3 - 10px); text-align: center; padding: 48px 10px; border: 1px solid #EEE;
background: #F4F6F8; transition: .2s;}
.mn-icon-list .item .icon { display: inline-block; width: 48px; height: 48px; margin: auto; background-repeat: no-repeat; background-position: center; background-size: contain; transition: .2s;}
.mn-icon-list .item .icon.bg1 { background-image: url(../images/sub/sub1-3-icon1.png);}
.mn-icon-list .item .icon.bg2 { background-image: url(../images/sub/sub1-3-icon2.png);}
.mn-icon-list .item .icon.bg3 { background-image: url(../images/sub/sub1-3-icon3.png);}
.mn-icon-list .item .tt { color: #2c2c2c; font-size: var(--font-size22); line-height: 1.63em; font-weight: 600; margin: 28px 0 4px; transition: .2s;}
.mn-icon-list .item .en-tt { font-size: var(--font-size18); font-weight: 400; line-height: 1.55em; color: #a8a8a8; font-weight: 400; transition: .2s;}
.mn-icon-list .item:hover { border-color: var(--color-primary); background: var(--color-primary);}
.mn-icon-list .item:hover .tt { color: #fff; }
.mn-icon-list .item:hover .en-tt { color: rgba(255, 255, 255, 0.32); }
.mn-icon-list .item:hover .icon.bg1 { background-image: url(../images/sub/sub1-3-icon1-w.png);}
.mn-icon-list .item:hover .icon.bg2 { background-image: url(../images/sub/sub1-3-icon2-w.png);}
.mn-icon-list .item:hover .icon.bg3 { background-image: url(../images/sub/sub1-3-icon3-w.png);}
.mn-bg-list { margin-bottom: 60px; }
.mn-bg-list .col { background-repeat: no-repeat; color: #fff; background-position: center; background-size: cover; padding: 56px; display: flex; align-items: center;}
.mn-bg-list .col.bg1 { background-image: url(../images/sub/sub1-3-img1.jpg);}
.mn-bg-list .col.bg2 { background-image: url(../images/sub/sub1-3-img2.jpg);}
.mn-bg-list .col.bg3 { background-image: url(../images/sub/sub1-3-img3.jpg);}
.mn-bg-list .col .tt { font-size: var(--font-size32); font-weight: 600; line-height: 1.43em; width: 28%;}
.mn-bg-list .col .txt { width: 72%; font-size: var(--font-size20); line-height: 1.7em; }
.mn-list { display: flex; flex-wrap: wrap; gap: 9px; }
.mn-list li { width: calc(100%/3 - 6px); padding: 15px; border: 1px solid #EEE; background: #FFF; }
.mn-list li span { display: block; padding-left: 14px; position: relative; font-size: var(--font-size18); line-height: 1.55em; color: #2c2c2c; }
.mn-list li span::before { content: ""; position: absolute; left: 0; width: 4px; height: 4px; background: var(--color-primary); border-radius: 4px; top: 11px; }
.mn-pc { position: relative; display: flex; flex-wrap: wrap; gap: 8px;}
.mn-pc::before { content: ""; display: block; width: 100%; height: 20px; background: url(../images/sub/sub1-3-arrow.png) center no-repeat; background-size: contain; }
.mn-pc li { width: calc(100%/4 - 6px); padding-top: 16px; }
.mn-pc li .num { line-height: 1.5em; font-weight: 600; color: var(--color-primary);}
.mn-pc li .en-tt { margin: 16px 0 8px; line-height: 1.5em; color: #a8a8a8; font-weight: 400; }
.mn-pc li .tt { font-size: var(--font-size18); color: #2c2c2c; font-weight: 500; line-height: 1.55em; }
.mn-num { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 9px; }
.mn-num .col { width: calc(100%/3 - 6px); padding: 18px; border: 1px solid #eee;}
.mn-num .col .num { line-height: 1.5em; color: var(--color-primary); font-weight: 600; margin-bottom: 16px; }
.mn-num .col .txt { font-size: var(--font-size18); line-height: 1.55em; color: #2c2c2c; }

/* 회사 연혁 */
.hst { position: relative; }
.hst::before { content: ""; position: absolute; left: 0; right: 0; margin: auto; top: 20px; background: #eee; width: 1px; height: 100%; }
.hst .group { display: flex; align-items: flex-start; gap: 112px; position: relative; margin-bottom: 100px; }
.hst .group:last-child { margin-bottom: 0; }
.hst .group::after { content: ""; position: absolute; left: 0; right: 0; margin: auto; top: 12px; width: 32px; height: 32px; background: url(../images/sub/hst-dot.png) center no-repeat; background-size: contain; }
.hst .group>div { width: calc(100%/2 - 56px); }
.hst .group .img { text-align: right; }
.hst .group .year { font-size: var(--font-size40); font-weight: 600; line-height: 1.35em; color: #2c2c2c; margin-bottom: 16px; }
.hst .group ul li { margin-bottom: 8px; }
.hst .group ul li span { display: inline-block; padding-left: 14px; position: relative; }
.hst .group ul li span::before { content: ""; position: absolute; left: 0; top: 15px; width: 4px; height: 4px; border-radius: 4px; background: var(--color-primary);}
.hst .group ul li:last-child { margin-bottom: 0; }
.hst .group:nth-of-type(even) { flex-direction: row-reverse;}
.hst .group:nth-of-type(even) .img { text-align: left; }
.hst .group:nth-of-type(even) .info { text-align: right; }

/* 주요고객사 */
.partner { display: flex; flex-wrap: wrap; gap: 15px; }
.partner .item { flex: 1; position: relative; text-align: center; }
.partner .item::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px solid #eee;}

/* 인증·특허 및 수상내역 */
.pt-group { margin-bottom: 60px; }
.pt-group:last-child { margin-bottom: 0; }
.pt-group h4 { display: inline-block; padding: 4px 16px; background: #f4f6f8; margin-bottom: 20px; color: var(--color-primary); font-size: var(--font-size20); line-height: 1.7em; font-weight: 500; }
.pt-wrap { display: flex; gap: 40px; flex-wrap: wrap;}
.pt-wrap .col { width: calc(100%/5 - 32px); }
.pt-wrap .col .img { position: relative; margin-bottom: 16px; }
.pt-wrap .col .img img { width: 100%; }
.pt-wrap .col .img::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px solid #eee; }
.pt-wrap .col .tt { position: relative; padding-left: 12px; font-size: var(--font-size20); line-height: 1.7em; color: #2c2c2c; font-weight: 500; }
.pt-wrap .col .tt::before { content: ""; position: absolute; left: 0; width: 4px; height: 4px; border-radius: 4px; background: var(--color-primary); top: 14px; }

/* 인재상 */
.rc-wrap .col { display: flex; flex-wrap: wrap; margin-bottom: 60px; align-items: center; gap: 120px; }
.rc-wrap .col:last-child { margin-bottom: 0; }
.rc-wrap .col>div { width: calc(100%/2 - 60px); }
.rc-wrap .col .img { border-radius: 0 0 96px 0; overflow: hidden;}
.rc-wrap .col .num { font-size: 100px; background: linear-gradient(180deg, #F4F6F8 0%, #DFE3EA 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; line-height: 1.14em; font-weight: 300; }
.rc-wrap .col .tt { margin: 20px 0 24px; font-size: 36px; font-weight: 600; line-height: 1.38em; color: #2c2c2c; }
.rc-wrap .col .tt span { color: var(--color-primary);}
.rc-wrap .col .txt { line-height: 1.55em; font-size: var(--font-size18);}
.rc-wrap .col:nth-of-type(even) { flex-direction: row-reverse;}
.rc-wrap .col:nth-of-type(even) .img { border-radius: 0 0 0 96px;}
.rc-link-wrap { margin-top: 80px; display: flex; justify-content: center; gap: 20px; flex-wrap: wrap;}
.rc-link-wrap a { display: inline-flex; height: 60px; border-radius: 10px; display: flex; align-items: center; padding: 0 20px; color: #fff; font-size: var(--font-size18); font-weight: 600; line-height: 1.66em; }
.rc-link-wrap a:first-child { background: var(--color-primary);}
.rc-link-wrap a:last-child { background: var(--color-secondary);}

/* Product Overview */
.sub2-titbox { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 80px; }
.sub2-titbox h3 { font-size: var(--font-size40); font-weight: 600; line-height: 1.35em; color: #2c2c2c; }
.sub2-titbox h3 span { color: var(--color-primary);}
.sub2-titbox p { font-size: var(--font-size20); line-height: 1.7em; }
.sub2-ov-wrap { display: flex; flex-wrap: wrap; gap: 16px; }
.sub2-ov-wrap .col { width: calc(100%/3 - 11px); }
.sub2-ov-wrap.wt .col { width: calc(100%/2 - 8px); }
.sub2-ov-wrap .col img { width: 100%; }
.sub2-ov-wrap .col a { display: block; position: relative; overflow: hidden; transition: .3s;}
.sub2-ov-wrap .col a::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.50); backdrop-filter: blur(12px); transition: .3s;}
.sub2-ov-wrap .col .abbox { position: absolute; left: 0; bottom: 0; padding: 40px; color: #fff; }
.sub2-ov-wrap .col .abbox h4 { font-size: var(--font-size36); font-weight: 600; line-height: 1.38em; margin-bottom: 40px; }
.sub2-ov-wrap .col .abbox .view { display: inline-flex; background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(12px); height: 56px; padding: 0 24px; padding-right: 52px; align-items: center; font-size: var(--font-size18); line-height: 1.77em; font-weight: 600; position: relative; }
.sub2-ov-wrap .col .abbox .view::after { content: ""; position: absolute; right: 24px; top: 0; bottom: 0; margin: auto; width: 18px; height: 18px; background: url(../images/sub/sub2-ov-view.png) center no-repeat; background-size: contain; }
.sub2-ov-wrap .col a:hover { border-radius: 0 120px 0 0;}
.sub2-ov-wrap .col a:hover::before { opacity: 0; }

/* sub2 공통 */
.sub2-big { background: #fafafa; padding: 72px; position: relative; display: flex; justify-content: center;}
.sub2-big .bg { text-align: center; display: inline-block; position: relative; }
.sub2-big .info { position: absolute; left: 72px; top: 72px; }
.sub2-big .info h5 { font-size: var(--font-size20); line-height: 1.7em; font-weight: 500; color: #878787; margin-bottom: 20px; }
.sub2-big .info h3 { font-size: var(--font-size40); line-height: 1.35em; font-weight: 600; color: #2c2c2c; }
.sub2-big .sketch { position: absolute; right: 72px; top: 72px; }
.sub2-big .sketch::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px dashed #ddd; }
.sub2-noti { padding: 16px 10px; display: flex; justify-content: center; align-items: center; gap: 10px; background: #121212; color: #fff; font-size: var(--font-size20); line-height: 1.7em; font-weight: 600; }
.sub2-big .btn { display: inline-block; position: absolute; width: 40px; height: 40px; z-index: 1; }
.sub2-big .btn span { width: 40px; height: 40px; background: url(../images/sub/sub2-more.png) center no-repeat; background-size: contain; display: inline-block; transition: .3s; border-radius: 40px; text-indent: -9999em; overflow: hidden; font-size: 0 !important;}
.sub2-big .btn::before { content: ""; position: absolute; top: 50%; left: 50%; width: 40px; height: 40px; border-radius: 50%; transform: translate(-50%, -50%); animation: ripple2 1s infinite; background: rgba(68, 114, 196,0.25); z-index: -1; }
.sub2-big .btn .ballon { display: inline-block; font-size: var(--font-size18); font-weight: 500; line-height: 1.77em; color: #2c2c2c; padding: 10px 16px; background: #fff; border: 1px solid #ddd; position: absolute; right: 60px; white-space: nowrap; top: -6px; transition: .3s; display: none; }
.sub2-big .btn .ballon.right { left: 60px; right: auto;}
@keyframes ripple2 { 0% { width: 40px; height: 40px; opacity: 1; } 100% { width: 60px; height: 60px; opacity: 0; } }
.sub2-big .btn.clr span { background-image: url(../images/sub/sub2-more-clr.png);}
.sub2-big .btn.clr::before { background: rgba(99, 47, 139,0.25);}
.sub2-big .btn.ab1-1 { left: 41%; top: 10%; }
.sub2-big .btn.ab1-2 { left: 30%; top: 24%; }
.sub2-big .btn.ab1-3 { left: 35%; top: 42%; }
.sub2-big .btn.ab1-4 { left: 47%; bottom: 44%; transform: translateX(-50%);}
.sub2-big .btn.ab1-5 { right: 49%; bottom: 15%; }
.sub2-big .btn.ab1-6 { right: 36%; top: 41%; }
.sub2-big .btn.ab2-1 { left: 32%; top: 35%; }
.sub2-big .btn.ab2-2 { left: 31%; bottom: 27%; }
.sub2-big .btn.ab2-3 { right: 52%; top: 43%; }
.sub2-big .btn.ab2-4 { right: 43%; top: 52%; }
.sub2-big .btn.ab2-5 { left: 47%; bottom: 14%; }
.sub2-big .btn.ab3-1 { left: 28%; top: 24%; }
.sub2-big .btn.ab3-2 { right: 37%; top: 16%; }
.sub2-big .btn.ab3-3 { right: 20%; bottom: 42%; }
.sub2-big .btn.ab4-1 { left: 30%; top: 40%; }
.sub2-big .btn.ab4-2 { left: 28%; bottom:28%; }
.sub2-big .btn.ab4-3 { left: 40%; top: 56%; }
.sub2-big .btn.ab4-4 { left: 51%; top: 40%; }
.sub2-big .btn.ab4-5 { left: 51%; top: 60%; }
.sub2-big .btn.ab5-1 { left: 54%; top: 55%; transform: translate(-50%, -50%);}
.sub2-big .btn.ab5-2 { right: 38%; bottom: 8%; }
.sub2-big .btn.ab6-1 { left: 50%; top: 22%; }
.sub2-big .btn.ab6-2 { left: 43%; top: 48%; }
.sub2-big .btn.ab6-3 { right: 32%; top: 28%; }
.sub2-big .btn.ab6-4 { right: 32%; bottom: 40%; }
.sub2-big .btn.ab6-5 { left: 44%; bottom: 22%; }
.sub2-big .wrap>img { max-width: 640px; margin: auto; }

/* SUB ASSY, PARTS 공통 */
.pd-search { display: flex; justify-content: flex-end; height: 68px; margin-bottom: 40px; border-bottom: 1px solid #dfdfdf;}
.pd-search .search { width: 320px; position: relative; height: 100%; }
.pd-search .search::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 100%; height: 2px; background: #121212; }
.pd-search .search input { width: 100%; height: 100%; border: none; padding: 10px 0; padding-right: 24px; font-size: var(--font-size18);}
.pd-search .search .btn { position: absolute; right: 0; top: 0; bottom: 0; margin: auto; width: 24px; height: 24px; background: url(../images/sub/sch.png) center no-repeat; background-size: contain; border: none; background-color: transparent; text-indent: -9999em;}
.product-list { margin-bottom: 40px; }
.product-list ul { display: flex; flex-wrap: wrap; gap: 40px 24px;}
.product-list ul li { width: calc(100%/4 - 18px); text-align: center; }
.product-list ul li a { display: block; }
.product-list ul li .thumb { padding-bottom: 100%; display: block; overflow: hidden; position: relative; margin-bottom: 16px; }
.product-list ul li .thumb>img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;}
.product-list ul li .thumb .view { background: rgba(0, 0, 0, 0.50); backdrop-filter: blur(6px); position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; gap: 10px; opacity: 0; transition: .2s; color: #fff; font-size: var(--font-size18); font-weight: 600; line-height: 1.77em; }
.product-list ul li .tt { font-size: var(--font-size20); color: #2c2c2c; font-weight: 600; line-height: 1.7em; transition: .2s;}
.product-list ul li a:hover .view { opacity: 1; }
.product-list ul li a:hover .tt { color: var(--color-primary);}
.product-list ul li.none {width:100%; padding:70px 0; margin:0; text-align:center; color:#767676;}

/* Facility Overview */
.ov-big { text-align: center; font-size: 120px; font-weight: 400; line-height: 0.71em; color: #eee; }
.ov-cont { padding-bottom: 120px; background: url(../images/sub/sub3-1-bg.jpg) center no-repeat; background-size: cover;}
.ov-wrap { display: flex; height: 640px; }
.ov-wrap .item { width: calc(100%/6); height: 100%; transition: .5s;}
.ov-wrap .item img { width: 100%; height: 100%; object-fit: cover;}
.ov-wrap .item a { display: block; position: relative; height: 100%; }
.ov-wrap .item .front { position: absolute; background: rgba(0,0,0,0.5); left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: #fff; font-size: var(--font-size20); line-height: 1.7em; font-weight: 600; }
.ov-wrap .item .back { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 36px; display: flex; align-items: flex-start; flex-direction: column; justify-content: flex-end; opacity: 0; transition: opacity 0s; }
.ov-wrap .item .back .tt { font-size: var(--font-size28); font-weight: 600; line-height: 1.5em; color: #fff; margin-bottom: 16px; }
.ov-wrap .item .back .txt { font-size: var(--font-size18); line-height: 1.77em; font-weight: 500; color: rgba(255, 255, 255, 0.8); }
.ov-wrap .item .back .view { position: absolute; right: 24px; top: 24px; width: 67px; height: 67px; background: url(../images/sub/sub3-1-view.png) center no-repeat; background-size: contain;}
.ov-wrap .item.active { width: 70%; }
.ov-wrap .item.active .front { opacity: 0; }
.ov-wrap .item.active .back { opacity: 1; transition: opacity 0s; }
.ov-wrap .item.active.is-enter .back { transition: opacity .3s .5s; }

/* sub3 공통 */
.sub3-wrap { position: relative; }
.sub3-big { position: relative; margin-bottom: 100px;  }
.sub3-big.mg { margin-bottom: 0; }
.sub3-big .img { position: relative; }
.sub3-big .img img { width: 100%; }
.sub3-big .noti { position: absolute; top: 0; left: 0; width: 100%; color: #fff; padding: 16px 24px; background: rgba(0, 0, 0, 0.32); backdrop-filter: blur(12px); font-size: var(--font-size20); font-weight: 600; line-height: 1.7em; }
.sub3-big .noti span { position: relative; padding-left: 34px; }
.sub3-big .noti span::before { content: ""; position: absolute; left: 0; width: 24px; height: 24px; background: url(../images/sub/noti-icon.png) center no-repeat; background-size: contain; top: 0; }
.sub3-big .btn { display: inline-block; position: absolute; width: 48px; height: 48px; z-index: 1; }
.sub3-big .btn span { width: 48px; height: 48px; background: url(../images/sub/sub3-more.png) center no-repeat; background-size: 19px; display: inline-block; transition: .3s; border-radius: 48px; background-color: var(--color-primary); text-indent: -9999em; overflow: hidden; font-size: 0 !important; }
.sub3-big .btn::before { content: ""; position: absolute; top: 50%; left: 50%; width: 48px; height: 48px; border-radius: 50%; transform: translate(-50%, -50%); animation: ripple 1s infinite; background: var(--color-primary); z-index: -1; }
@keyframes ripple { 0% { width: 48px; height: 48px; opacity: 1; } 100% { width: 66px; height: 66px; opacity: 0; } }
.sub3-big .wrap.small .btn { width: 36px; height: 36px; }
.sub3-big .wrap.small .btn span { width: 36px; height: 36px; background-size: 14px; }
.sub3-big .wrap.small .btn::before { width: 36px; height: 36px; animation: ani 1s infinite;}
@keyframes ani { 0% { width: 36px; height: 36px; opacity: 1; } 100% { width: 54px; height: 54px; opacity: 0; } }
.sub3-big .btn.ab1-1-1 { left: 25%; top: 50%; transform: translateY(-50%);}
.sub3-big .btn.ab1-1-2 { right: 40%; top: 43%; }
.sub3-big .btn.ab1-1-3 { right: 29%; top: 47%; }
.sub3-big .btn.ab1-1-4 { right: 16%; top: 38%; }
.sub3-big .btn.ab1-2-1 { left: 25%; top: 50%; transform: translateY(-50%);}
.sub3-big .btn.ab1-2-2 { left: 42%; top: 40%; }
.sub3-big .btn.ab1-2-3 { right: 39%; top: 42%; }
.sub3-big .btn.ab1-2-4 { right: 10%; bottom: 43%; }
.sub3-big .btn.ab1-3-1 { left: 45%; top: 50%; transform: translateY(-50%); }
.sub3-big .btn.ab1-3-2 { right: 17%; top: 50%; transform: translateY(-50%); }
.sub3-big .btn.ab1-4-1 { left: 13%; top: 42%; }
.sub3-big .btn.ab1-4-2 { left: 37%; top: 29%; }
.sub3-big .btn.ab1-4-3 { right: 31%; top: 35%; }
.sub3-big .btn.ab1-4-4 { right: 8%; top: 50%; }
.sub3-big .btn.ab1-4-5 { right: 1.5%; top: 45%; }
.sub3-big .btn.ab1-5-1 { left: 13%; top: 50%; transform: translateY(-50%);}
.sub3-big .btn.ab1-5-2 { right: 42%; top: 32%; }
.sub3-big .btn.ab1-5-3 { right: 13%; top: 29%; }
.sub3-big .btn.ab2-1 { left: 15%; bottom: 25%; }
.sub3-big .btn.ab2-2 { right: 34%; bottom: 18%; }
.sub3-big .btn.ab2-3 { left: 5%; bottom: 10%; }
.sub3-big .btn.ab2-4 { left: 31%; top: 38%; }
.sub3-big .btn.ab2-5 { right: 34%; top: 37%; }
.sub3-big .btn.ab2-6 { right: 22%; top: 50%; }
.sub3-big .btn.ab2-7 { right: 7%; top: 36%; }
.sub3-big .btn.ab2-8 { left: 43%; top: 32%; }
.sub3-big .btn.ab3-1 { right: 33%; bottom: 34%; }
.sub3-big .btn.ab3-2 { left: 26%; bottom: 31%; }
.sub3-big .btn.ab3-3 { left: 46%; bottom: 40%; }
.sub3-big .btn.ab3-4 { right: 35%; top: 45%; }
.sub3-big .btn.ab3-5 { right: 17%; bottom: 43%; }
.sub3-big .btn.ab4 { left: 12%; top: 50%; transform: translateY(-50%);}
.sub3-big .btn.ab5-1-1 { left: 21%; top: 45%; }
.sub3-big .btn.ab5-1-2 { left: 28%; top: 48%; }
.sub3-big .btn.ab5-1-3 { left: 34%; top: 43%; }
.sub3-big .btn.ab5-1-4 { left: 47%; top: 54%; transform: translateY(-50% );}
.sub3-big .btn.ab5-1-5 { right: 45%; bottom: 37%; }
.sub3-big .btn.ab5-1-6 { right: 36%; bottom: 35%; }
.sub3-big .btn.ab5-1-7 { right: 17%; bottom: 25%; }
.sub3-big .btn.ab5-1-8 { left: 40%; top: 48%; }
.sub3-big .btn.ab5-1-9 { left: 43%; top: 42%; }
.sub3-big .btn.ab5-2-1 { left: 6%; bottom: 37%; }
.sub3-big .btn.ab5-2-2 { left: 27%; bottom: 28%; }
.sub3-big .btn.ab5-2-3 { right: 13%; bottom: 37%; }
.sub3-big .btn.ab5-3-1 { left: 7%; bottom: 31%; }
.sub3-big .btn.ab5-3-2 { left: 36%; top: 38%; }
.sub3-big .btn.ab5-3-3 { left: 42%; bottom: 45%; }
.sub3-big .btn.ab5-3-4 { left: 48%; top: 47%; }
.sub3-big .btn.ab5-3-5 { right: 45.5%; top: 50%; transform: translateY(-50%);}
.sub3-big .btn.ab5-3-6 { right: 42.5%; top: 45%; }
.sub3-big .btn.ab5-3-7 { right: 39.5%; top:44%; }
.sub3-big .btn.ab5-3-8 { right: 36.5%; bottom: 50%; }
.sub3-big .btn.ab5-3-9 { right: 32%; bottom: 42%; }
.sub3-big .btn.ab5-3-10 { right: 18%; bottom: 49%; }
.sub3-big .btn.ab5-3-11 { right: 5%; top: 47%; }
.sub3-big .btn.ab5-3-12 { right: 1%; bottom: 15%; }
.sub3-big .btn.ab6-1 { left: 19.5%; top: 34%; }
.sub3-big .btn.ab6-2 { right: 38%; bottom: 40%; }
.sub3-big .btn.ab6-3 { right: 29%; bottom: 34%; }

/* 제전 및 차폐 */
.sub3-flex { display: flex; flex-wrap: wrap; gap: 24px; margin-bottom: 100px; }
.sub3-flex .sub3-big { width: calc(100%/2 - 12px); }

/* Business Area */
.ba-wrap { position: relative; }
.ba-titbox { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 120px; }
.ba-titbox h2 { font-size: var(--font-size40); font-weight: 600; color: #2c2c2c; line-height: 1.35em; }
.ba-titbox h2 span { color: var(--color-primary);}
.ba-titbox .noti-txt { display: inline-block; font-size: var(--font-size18); color: #878787; font-weight: 600; line-height: 1.77em; position: relative; padding-left: 28px; }
.ba-titbox .noti-txt::before { content: ""; position: absolute; width: 24px; height: 24px; background: url(../images/sub/noti-icon-c.png) center no-repeat; background-size: contain; left: 0; top: 4px; }
.ba-list { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 40px; }
.ba-list li { width: calc(100%/9 - 8px); }
.ba-list li a { padding: 16px; border: 1px solid #eee; display: block; }
.ba-list li .num { color: #2c7161; transition: .2s; font-weight: 600; line-height: 1.5em; }
.ba-list li .en-tit { margin: 80px 0 8px; color: #a8a8a8; font-size: 14px; line-height: 1.42em; font-weight: 500; }
.ba-list li .tit { font-size: var(--font-size18); line-height: 1.77em; font-weight: 600; color: #2c2c2c; transition: .2s;}
.ba-list li:nth-child(2) .num { color: #306875;}
.ba-list li:nth-child(3) .num { color: #336085;}
.ba-list li:nth-child(4) .num { color: #365896;}
.ba-list li:nth-child(5) .num { color: #3951A6;}
.ba-list li:nth-child(6) .num { color: #3D49B6;}
.ba-list li:nth-child(7) .num { color: #55468F;}
.ba-list li:nth-child(8) .num { color: #704360;}
.ba-list li:nth-child(9) .num { color: #8C402D;}
.ba-list li a:hover .num { color: #fff; }
.ba-list li a:hover .tit { color: #fff; }
.ba-list li:nth-child(1) a:hover { background: #2c7161; border-color: #2c7161;}
.ba-list li:nth-child(2) a:hover { background: #306875; border-color: #306875;}
.ba-list li:nth-child(3) a:hover { background: #336085; border-color: #336085;}
.ba-list li:nth-child(4) a:hover { background: #365896; border-color: #365896;}
.ba-list li:nth-child(5) a:hover { background: #3951A6; border-color: #3951A6;}
.ba-list li:nth-child(6) a:hover { background: #3D49B6; border-color: #3D49B6;}
.ba-list li:nth-child(7) a:hover { background: #55468F; border-color: #55468F;}
.ba-list li:nth-child(8) a:hover { background: #704360; border-color: #704360;}
.ba-list li:nth-child(9) a:hover { background: #8C402D; border-color: #8C402D;}
.ba-percent>div { position: relative; margin-bottom: 30px;}
.ba-percent>div:last-child { margin-bottom: 0; }
.ba-percent>div .line { border-top: 2px dashed #2C7161; width: 100%; position: relative; }
.ba-percent>div .line br { display: none; }
.ba-percent>div .line::before { content: ""; position: absolute; left: 0; top: -2px; bottom: 0; margin: auto; width: 10px; height: 10px; border-top: 2px solid #000; border-left: 2px solid #2c2c2c; transform: rotate(-45deg);}
.ba-percent>div .line::after { content: ""; position: absolute; right: 0; top: -2px; bottom: 0; margin: auto; width: 10px; height: 10px; border-top: 2px solid #000; border-right: 2px solid #2c2c2c; transform: rotate(45deg);}
.ba-percent .txt { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 12px; }
.ba-percent .txt p { font-size: 14px; line-height: 1.42em; color: #c7c7c7; font-weight: 600; }
.ba-percent .txt strong { font-size: var(--font-size18); font-weight: 600; line-height: 1.66em; text-align: center; }
.ba-percent .first { width: calc(66% + 5px); }
.ba-percent .first .line::before { border-color: #2c7161; }
.ba-percent .first .line::after { border-color: #2c7161; }
.ba-percent .first strong { color: #2c7161; }
.ba-percent .second { width: calc(66% + 5px); margin-left: calc(22% + 6px); }
.ba-percent .second .line { border-color: #3D48B9;}
.ba-percent .second .line::before { border-color: #3D48B9; }
.ba-percent .second .line::after { border-color: #3D48B9; }
.ba-percent .second strong { color: #3D48B9; }
.ba-percent .third { width: calc(33% + 2px); margin-left: calc(67% - 2px); }
.ba-percent .third .line { border-color: #A13E0A;}
.ba-percent .third .line::before { border-color: #A13E0A; }
.ba-percent .third .line::after { border-color: #A13E0A; }
.ba-percent .third strong { color: #A13E0A; }

/* 사업장 위치 및 지도 */
.lct-tab-wrap { margin-bottom: 100px; border-bottom: 1px solid #eee;}
.lct-tab-wrap ul { display: flex; gap: 48px; }
.lct-tab-wrap ul li { width: auto;}
.lct-tab-wrap ul li a { display: inline-block; padding-bottom: 20px; font-size: var(--font-size18); font-weight: 600; line-height: 1.55em; color: #a8a8a8; position: relative; }
.lct-tab-wrap ul li a::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 100%; height: 1px; background: var(--color-primary); opacity: 0; }
.lct-tab-wrap ul li.active a { color: var(--color-primary);}
.lct-tab-wrap ul li.active a::after { opacity: 1; }
.lct-tab-content .tab-item { display: none; position: relative; }
.lct-tab-content .tab-item.active { display: block; }
.lct-tab-content.lct-tab-changed .tab-item.active { animation-name: lctTabFadeUp; animation-duration: 0.55s; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); animation-fill-mode: both; }
.lct-fx { display: flex; align-items: center; margin-bottom: 80px; }
.lct-fx>div { width: calc(100%/2);}
.lct-fx .img { padding-right: 60px; }
.lct-fx .info { padding-left: 20px; }
.lct-fx .info h3 { font-size: var(--font-size40); font-weight: 600; line-height: 1.35em; color: #2c2c2c; }
.lct-fx .info .add { position: relative; padding-left: 26px; font-size: var(--font-size24); line-height: 1.66em; color: #2c2c2c; margin: 36px 0 48px;}
.lct-fx .info .add::before { content: ""; position: absolute; left: 0; top: 11px; width: 18px; height: 18px; background: url(../images/sub/add.png) center no-repeat; background-size: contain; }
.lct-fx .info .hash { display: flex; gap: 8px; flex-wrap: wrap; }
.lct-fx .info .hash span { display: inline-block; padding: 4px 16px; color: var(--color-primary); line-height: 1.7em; font-size: var(--font-size20); font-weight: 500; background: #f4f6f8; }

/* 조직별 연락처 */
.contact-wrap { display: flex; gap: 15px; flex-wrap: wrap;}
.contact-wrap .col { width: calc(100%/3 - 10px); padding: 28px; border: 1px solid #EEE; background: #FAFAFA; }
.contact-wrap .col .en-tt { font-weight: 500; line-height: 1.5em; color: var(--color-primary);}
.contact-wrap .col .tt { font-size: var(--font-size28); line-height: 1.5em; color: #2c2c2c; font-weight: 600; margin: 10px 0 40px;}
.contact-wrap .col ul { display: flex; flex-wrap: wrap; gap: 8px; }
.contact-wrap .col ul li { flex: 1; padding: 8px 24px; position: relative; background: #fff; display: flex; font-size: var(--font-size18); line-height: 1.55em; letter-spacing: -.04em;}
.contact-wrap .col ul li::before { content: ""; position: absolute; left: 0; width: 4px; top: 0; height: 100%; background: #a1adc1; }
.contact-wrap .col ul li .tit { width: 48px; font-weight: 600; color: #2c2c2c; }
.contact-wrap .col ul li .txt { flex: 1 1 auto; min-width: 0; width: 1%; letter-spacing: -.06em;}