@charset "utf-8";

@charset "utf-8";

.sub-tab {background:#f4f4f4;}
.sub-tab ul {justify-content:center;}
.sub-tab ul li {width:auto; margin-right:var(--space-60);}
.sub-tab ul li:last-child {margin-right:0;}
.sub-tab ul li a {height:clamp(40px, calc(65 / var(--inner) * 100vw), 65px); display:flex; align-items:center; justify-content:center; text-align:center; font-size:var(--font-size-18); font-weight:700; letter-spacing:-.03em; line-height:1.4em; color:#878787;}
.sub-tab ul li.active a {color:var(--color-primary);}

.sub-tab-2 {margin-bottom:var(--space-80);}
.sub-tab-2 ul li {width:auto; flex:1; margin-right:var(--space-10);}
.sub-tab-2 ul li:last-child {margin-right:0;}
.sub-tab-2 ul li a {padding:0 12px; white-space:nowrap; border:1px solid #ddd; display:flex; align-items:center; justify-content:center; height:clamp(40px, calc(60 / var(--inner) * 100vw), 60px); border-radius:40px; font-weight:600; letter-spacing:-.03em; line-height:1.4em; color:#878787;}
.sub-tab-2 ul li.active a {color:#fff; border-color:var(--color-primary); background:var(--color-primary);}

.gray-bg {background:#F4F4F4;}

.doc-cnt {padding:var(--space-150) 0 var(--space-180);}

.biz-slogan {margin-bottom:var(--space-80);}
.biz-slogan h2 {font-size:var(--font-size-48); font-weight:700; line-height:1.25em; color:#121212; margin-bottom:var(--space-80);}
.biz-slogan:after {content:""; display:block; width:100%; height:1px; background:#dddddd;}

.biz-heading {margin-bottom:var(--space-60);}
.biz-heading .title {font-size:var(--font-size-32); font-weight:600; line-height:1.4em; color:#121212;}
.biz-heading .text {margin-top:var(--space-10); font-size:var(--font-size-20); line-height:1.4em; color:#505050;}

.biz-heading-2 {margin-bottom:var(--space-60);}
.biz-heading-2 .title {font-size:var(--font-size-40); font-weight:700; line-height:1.3em; color:#121212; margin-bottom:var(--space-30);}
.biz-heading-2 .text {font-size:var(--font-size-18); line-height:1.67em; color:#505050;}

.galvanizing-img {text-align:center; margin-bottom:var(--space-180);}

.tank-list {display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-20);}
.tank-list .item .img {margin-bottom:var(--space-25);}
.tank-list .item .info h5 {margin-bottom:var(--space-10); font-size:var(--font-size-18); font-weight:700; line-height:1.4em; color:#121212;}
.tank-list .item .info p {line-height:1.4em; color:#505050;}

.press-desc {margin-bottom:var(--space-100); display:grid; gap:var(--space-10); grid-template-columns:repeat(3, 1fr); text-align:center;}
.press-desc .item {border:1px solid #ddd; padding:var(--space-30);}
.press-desc .item .tit {margin:var(--space-10) 0 var(--space-15); font-size:var(--font-size-18); font-weight:600; letter-spacing:-.03em; line-height:1.4em;}
.press-desc .item .txt {font-size:var(--font-size-16); font-weight:400; color:#505050; letter-spacing:-.03em; line-height:1.63em;}

.press-picture {display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-40);}

.hot-desc {margin-bottom:var(--space-180);}
.hot-desc .text {margin-top:var(--space-20); padding:var(--space-15) var(--space-30); background:#F4F4F4; display:flex; flex-wrap:wrap; justify-content:center;}
.hot-desc .text p {width:33.33%;} 
.hot-desc .text p span {margin-right:var(--space-10); color:#fff; border-radius:24px; background:var(--color-primary); display:inline-block; font-size:var(--font-size-14); font-weight:600; letter-spacing:-.03em; line-height:clamp(26px, calc(30 / var(--inner) * 100vw), 30px); padding:0 var(--space-15);}

.production-items {display:grid; grid-template-columns:repeat(5, 1fr); gap:var(--space-20);}

.road-intro {margin-bottom:var(--space-80);}
.road-intro .title {font-size:var(--font-size-32); line-height:1.4em; color:#121212; margin-bottom:var(--space-40);}
.road-intro .image {margin-bottom:var(--space-60);}
.road-intro .text {display:flex;}
.road-intro .text h3 {width:50%; font-size:var(--font-size-40); font-weight:700; line-height:1em; color:#121212; margin-bottom:var(--space-10);}
.road-intro .text .cnt {flex:1;}
.road-intro .text .cnt .txt-1 {font-size:var(--font-size-20); line-height:1.67em; letter-spacing:-.03em; color:#505050;}
.road-intro .text .cnt .txt-2 {margin-top:var(--space-10); font-size:var(--font-size-16); line-height:1.5em; color:#878787;}

.road-cnt {margin-bottom:var(--space-100);}
.road-cnt:last-child {margin-bottom:0;}

.road-title {font-size:var(--font-size-32); font-weight:700; line-height:1.3em; margin-bottom:var(--space-25);}

.road-text {font-size:var(--font-size-18); line-height:1.67em; color:#505050;}

.road-table {margin-top:var(--space-60);}
.road-table table {width:100%; border-collapse:collapse; border-top:2px solid var(--color-primary);}
.road-table thead {background:#e6f2f9;}
.road-table thead th {padding:var(--space-15) var(--space-20); font-weight:600; line-height:1.4em; letter-spacing:-.03em; text-align:center; border:1px solid #ddd; border-top:none;}
.road-table tbody td {background:#fff; padding:var(--space-15) var(--space-20); font-size:var(--font-size-14); line-height:1.57em; color:#505050; text-align:center; border:1px solid #dddddd; border-top:none;}

.road-table.type2 tbody td {text-align:left;}
.road-table.type2 tbody td:first-child {text-align:center; color:#121212;}
.road-table.type2 tbody td:nth-child(2) {font-weight:600; color:#121212;}
.road-table.type2 thead th:first-child {color:#121212;}
.road-table.type2 thead th:nth-child(2) {color:var(--color-primary);}
.road-table.type2 thead th:nth-child(3) {color:#505050;}

.road-photo {display:grid; grid-template-columns:repeat(2, 1fr); gap:var(--space-40);}

.road-feature {display:grid; grid-template-columns:repeat(2, 1fr); gap:var(--space-10);}
.road-feature .item {background:#fff; border:1px solid #dddddd; padding:var(--space-25) var(--space-30); display:flex; align-items:center; gap:var(--space-20);}
.road-feature .item .num {background:var(--color-primary); color:#fff; font-size:var(--font-size-16); font-weight:700; line-height:1em; width:40px; height:40px; border-radius:100%; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.road-feature .item p {font-size:var(--font-size-16); line-height:1.5em; color:#505050;}

.road-noise {display:grid; grid-template-columns:repeat(2, 1fr); gap:var(--space-80);}
.road-noise .text {margin-top:var(--space-25);}
.road-noise .text h5 {font-size:var(--font-size-20); font-weight:700; line-height:1.4em; color:var(--color-primary); margin-bottom:var(--space-12);}
.road-noise .text p {font-size:var(--font-size-16); line-height:1.5em; color:#505050;}

.grating {display:flex; flex-direction:column; gap:var(--space-120);}
.grating .item {display:flex; align-items:center; gap:var(--space-80);}
.grating .item.reverse {flex-direction:row-reverse;}
.grating .item .image {width:50%;}
.grating .item .text {flex:1;}
.grating .item .text .num {position:absolute; left:0; bottom:var(--space-10); font-size:var(--font-size-88); font-weight:700; line-height:1em; color:#f4f4f4; z-index:-1;}
.grating .item .text h2 {position:relative; font-size:var(--font-size-40); font-weight:700; line-height:1.2em; margin-top:var(--space-50); z-index:1;}
.grating .item .text .sub {margin-top:var(--space-10); font-weight:600; line-height:1.4em; color:var(--color-primary);}
.grating .item:nth-child(even) .text .sub {color:var(--color-secondary);}
.grating .item .text .desc {margin-top:var(--space-50); font-size:var(--font-size-20); line-height:1.6em; color:#505050;}

.manufacturing-title {margin-bottom:var(--space-80);}
.manufacturing-title p {font-size:var(--font-size-32); line-height:1.3em; color:#121212;}
.manufacturing-title p strong {font-size:var(--font-size-40); font-weight:700; color:var(--color-primary);}
.manufacturing-title p span {font-size:var(--font-size-24); color:#878787;}

.manufacturing-process .items {display:flex; flex-wrap:wrap; margin:calc(var(--space-60) * -1) calc(var(--space-30) * -1);}
.manufacturing-process .items .item {position:relative; width:33.3333%; padding:var(--space-60) var(--space-30);}
.manufacturing-process .items .item:after {content:''; position:absolute; right:0; top:50%; margin:-14px -25px 0 0; width:50px; height:30px; background:url('/images/sub/process-arrow.png') no-repeat center center / contain;}
.manufacturing-process .items .label {margin-top:var(--space-30); background:#121212; color:#fff; font-size:var(--font-size-14); font-weight:600; line-height:1em; padding:var(--space-8) var(--space-15); border-radius:24px; display:inline-block; width:fit-content;}
.manufacturing-process .items .tit {margin-top:var(--space-20); font-size:var(--font-size-24); font-weight:700; line-height:1.4em;}
.manufacturing-process .items .item:nth-child(3n):after {display:none;}
.manufacturing-process .items .item:last-child:after {display:none;}

.brochure {padding-left:18%; display:flex; align-items:center;gap:var(--space-80);}
.brochure .image {width:35.5%; max-width:400px; box-shadow:10px 10px 20px rgba(0,0,0,0.2); overflow:hidden;}
.brochure .content {flex:1;}
.brochure .content h2 {margin-bottom:var(--space-40); font-size:var(--font-size-48); font-weight:700; line-height:1.33em; color:#121212; letter-spacing:-1.44px;}
.brochure .content .txt {margin-bottom:var(--space-80); font-size:var(--font-size-24); line-height:1.5em; color:#505050; letter-spacing:-0.72px;}

.ceo-top {text-align:center;}
.ceo-top h2 {font-size:var(--font-size-56); font-weight:700; line-height:1.2em; margin-bottom:var(--space-80);}
.ceo-top .txt {margin-bottom:-3px;}

.ceo-msg {position:relative; margin-bottom:var(--space-180); display:flex;}
.ceo-msg .content {padding:var(--space-100) var(--space-160) var(--space-100) 30px; flex:1; background:#f4f4f4; display:flex; align-items:center; justify-content:flex-end;}
.ceo-msg .inner {max-width:691px;}
.ceo-msg h3 {font-size:var(--font-size-40); font-weight:700; line-height:1.4em; margin-bottom:var(--space-60);}
.ceo-msg .txt {font-size:var(--font-size-18); line-height:1.67em; color:#505050; display:flex; flex-direction:column; gap:var(--space-30);}
.ceo-msg .txt p {margin:0;}
.ceo-msg .ceo-sign {display:flex; align-items:center; gap:var(--space-30); margin-top:var(--space-60);}
.ceo-msg .ceo-sign p {font-size:var(--font-size-20); font-weight:700; line-height:1.4em;}
.ceo-msg .ceo-sign img {height:clamp(28px, calc(46 / var(--inner) * 100vw), 46px);}
.ceo-msg .image {width:42.18%; overflow:hidden;}
.ceo-msg .image img {width:100%; height:100%; object-fit:cover;}

.philosophy {background:url('/images/sub/map-bg.png') no-repeat center 100%;}
.philosophy .contain {max-width:1260px;}
.philosophy h2 {font-size:var(--font-size-48); font-weight:700; line-height:1.2em; margin-bottom:var(--space-70); text-align:center;}
.philosophy .text {font-size:var(--font-size-20); line-height:1.6em; color:#505050; text-align:center; margin-bottom:var(--space-100);}
.philosophy .text span {font-weight:600; color:var(--color-primary);}
.philosophy .list ul {display:flex; margin:0 calc(var(--space-30) * -1);}
.philosophy .list ul li {width:33.333%; padding:0 var(--space-30);}
.philosophy .list ul li:nth-child(2) {margin-top:var(--space-80);}
.philosophy .list .item {padding:var(--space-80) 0; display:flex; align-items:flex-end; justify-content:center; color:#fff; background-size:cover; background-repeat:no-repeat; background-position:center center; height:clamp(200px, calc(550 / var(--inner) * 100vw), 550px); border-radius:300px; text-align:center;}
.philosophy .list .item .txt .ko {margin-bottom:var(--space-15); font-size:var(--font-size-18); font-weight:700; line-height:1.4em;}
.philosophy .list .item .txt .en {font-size:var(--font-size-32); font-weight:700; line-height:1.44em;}

.history-page {position:relative;}
.history-page .progress-container {position:absolute; left:50%; top:1em; height:98%; width:1px; background:#ddd; z-index:-1;}
.history-page .progress-bar {width:1px; background:#1c99d9; height:0;}

.history-cnt {margin-bottom:var(--space-250); display:flex;}
.history-cnt:last-child {margin-bottom:0;}
.history-cnt .content {width:50%; padding-right:80px;}
.history-cnt .content .inner {position:sticky; top:calc(var(--header-height) + var(--header-top-height) + var(--space-10));}
.history-cnt .period {font-size:var(--font-size-32); font-weight:700; line-height:1.4em; margin-bottom:var(--space-20);}
.history-cnt h2 {font-size:var(--font-size-48); font-weight:700; line-height:1.17em; margin-bottom:var(--space-40);}
.history-cnt .items {flex:1; padding-left:80px;}
.history-cnt .item {margin-bottom:var(--space-100);}
.history-cnt .item:last-child {margin-bottom:0;}
.history-cnt .year {font-size:var(--font-size-40); font-weight:700; line-height:1.2em; margin-bottom:var(--space-25); position:relative;}
.history-cnt .year .dot {position:absolute; top:50%; left:-80px; margin-left:-10px; transform:translateY(-50%); background-color:var(--color-primary); border-radius:50%; width:20px; height:20px; z-index:2;}
.history-cnt .list li {margin-bottom:var(--space-18); display:flex; font-size:var(--font-size-20); line-height:1.6em; color:#505050;}
.history-cnt .list li:last-child {margin-bottom:0;}
.history-cnt .list li strong {min-width:57px; color:#121212;}
.history-cnt.active .year .dot {animation:marker 1.5s linear infinite;}

@keyframes marker {
    0% {box-shadow:0 0 0 0 rgba(54, 151, 212, 0.3);}
    50% {box-shadow:0 0 0 20px rgba(54, 151, 212, 0);}
    100% {box-shadow:0 0 0 0 rgba(54, 151, 212, 0);}
}

.affiliate-group {margin-bottom:var(--space-200); display:flex; gap:var(--space-120); align-items:flex-end;}
.affiliate-group:last-child {margin-bottom:0;}
.affiliate-group .slider {width:41.42%;}
.affiliate-group .slider .slick-dots {position:absolute; bottom:var(--space-20); left:0; width:100%; text-align:center;}
.affiliate-group .slider .slick-dots li {line-height:0; display:inline-block; margin:0 var(--space-8);}
.affiliate-group .slider .slick-dots li button {background-color:transparent; width:16px; height:16px; border-radius:100%; border:4px solid rgba(255, 255, 255, 0.50); font-size:0;}
.affiliate-group .slider .slick-dots li.slick-active button {border-color:#fff; background:#fff;}
.affiliate-group .content {flex:1;}
.affiliate-group .content h2 {font-size:var(--font-size-40); font-weight:700; line-height:1.3em; padding-bottom:var(--space-30); margin-bottom:var(--space-35); border-bottom:1px solid #ddd;}
.affiliate-group .content .info ul {display:flex; flex-direction:column; gap:var(--space-30);}
.affiliate-group .content .info ul li {word-break:break-all; display:flex; align-items:center; font-size:var(--font-size-20); line-height:1.6em; color:#505050;}
.affiliate-group .content .info ul li .ico {margin-right:var(--space-20);}
.affiliate-group .content .info ul li .ico img {min-width:48px;}
.affiliate-group .content .info ul li strong {margin-right:var(--space-10); white-space:nowrap; font-weight:700; color:#121212;}
.affiliate-group .content .info ul li a {color:var(--color-primary); text-decoration:underline;}
.affiliate-group .content .info ul li a:hover {text-decoration:none;}

.certi-group {margin-bottom:var(--space-150);}
.certi-group:last-child {margin-bottom:0;}
.certi-group h2 {font-size:var(--font-size-40); font-weight:700; line-height:1.3em; margin-bottom:var(--space-40);}
.certi-group .list ul {text-align:center; display:flex; flex-wrap:wrap; margin:calc(var(--space-20) * -1);}
.certi-group .list ul li {padding:var(--space-20);}
.certi-group .list ul li a {display:block;}
.certi-group .list ul li .img {display:block; position:relative;}
.certi-group .list ul li .img:after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid var(--color-primary); opacity:0; transition:.3s; z-index:1; background:url('/images/sub/certi-view.png') no-repeat center center;}
.certi-group .list ul li p {margin-top:var(--space-20); font-size:var(--font-size-18); line-height:1.5em;}
.certi-group .list ul li a:hover .img:after {opacity:1;}

.pop-certi {width:90vw !important; max-width:700px;}
.pop-certi .fancybox-outer {width:90vw !important; max-width:700px; height:auto !important;}
.pop-certi .fancybox-outer {width:90vw !important; max-width:700px; height:auto !important;}
.pop-certi .fancybox-inner {width:90vw !important; max-width:700px; height:auto !important;}
.pop-certi .fancybox-skin {width:90vw !important; max-width:700px; height:auto !important;}
.pop-certi .fancybox-close {right:-32px; top:-32px; width:64px; height:64px; background:url('/images/sub/fancy-close-icon.png') no-repeat center center / contain;}

.location-map {margin-bottom:var(--space-80); display:flex; gap:var(--space-40); align-items:stretch;}
.location-map .map-area {flex:1;}
[lang="en"] .location-map .map-area iframe,
[lang="zh-CN"] .location-map .map-area iframe,
[lang="ja"] .location-map .map-area iframe {height:100%; width: 100%;}
.location-map .root_daum_roughmap .wrap_map {height:clamp(250px, calc(390 / var(--inner) * 100vw), 390px) !important;}
.location-map .root_daum_roughmap_landing {width:100% !important;}
.root_daum_roughmap .cont {display:none;}
.location-map .info-area {border:1px solid #ddd; width:32.8%; background:#f4f4f4; padding:var(--space-45) var(--space-40);}
.location-map .info-area h2 {font-size:var(--font-size-40); font-weight:700; line-height:1.3em; margin-bottom:var(--space-50);}
.location-map .info-area h3 {font-size:var(--font-size-20); font-weight:700; line-height:1.4em; color:#121212; margin-bottom:var(--space-15);}
.location-map .info-area .address {margin-bottom:var(--space-30);}
.location-map .info-area .address p {line-height:1.6em; color:#505050;}
.location-map .info-area .info ul {display:flex; flex-direction:column; gap:var(--space-10);}
.location-map .info-area .info ul li {line-height:1.4em; color:#505050;}
.location-map .info-area .info ul li strong {color:#121212; margin-left:var(--space-30);}

.location-use {border-top:1px solid #121212;}
.location-use .item {padding:var(--space-50) 0; display:flex; border-bottom:1px solid #ddd;}
.location-use .item .icon {width:150px; text-align:center; padding-top:1em;}
.location-use .item .content {flex:1;}
.location-use .item .content h3 {font-size:var(--font-size-20); font-weight:700; line-height:1.4em; margin-bottom:var(--space-15);}
.location-use .item .desc {display:flex; align-items:center; line-height:1.6em; color:#505050;}
.location-use .item .desc .badge {display:inline-block; padding:0 var(--space-10); background:var(--color-primary); color:#fff; font-size:var(--font-size-12); font-weight:700; border-radius:4px; margin-right:var(--space-10);}
.location-use .item .route {line-height:1.6em; color:#505050;}
.location-use .item .route li {margin-bottom:var(--space-10);}
.location-use .item .route li:last-child {margin-bottom:0;}
.location-use .item .route strong {color:var(--color-primary);}

.table01 {margin-bottom:var(--space-80);}
.table01 table {width:100%; border-top:2px solid #121212; background:#fff; border-spacing:0; border-collapse:collapse;}
.table01 table thead th {padding:var(--space-25) var(--space-10); background:#f4f4f4; border-bottom:1px solid #ddd; border-right:1px solid #ddd; font-size:var(--font-size-18); font-weight:600; line-height:1.4em; color:#121212; text-align:center; letter-spacing:-0.03em; vertical-align:middle;}
.table01 table thead th:last-child {border-right:0;}
.table01 table tbody td {padding:var(--space-20) var(--space-10); border-bottom:1px solid #ddd; border-right:1px solid #ddd; font-size:var(--font-size-16); line-height:1.4em; color:#505050; text-align:center; letter-spacing:-0.03em; vertical-align:middle;}
.table01 table tbody td:last-child {border-right:0;}
.table01 table tbody tr:last-child td {border-bottom:0;}