@charset "utf-8";
/* 인사말 */
.gt-img { padding: 155px 0; width: 100%; background: url(../images/sub/sub1_1.jpg) center no-repeat; background-size: cover;}
.gt-img h3 { font-size: 34px; font-weight: 700; letter-spacing: -.04em ; line-height: 1.666em; color: #003069;}
.gt-img h3 span { background: #003069; color: #fff; padding: 0 0 0 10px;}
.gt-txtbox { margin-top: 60px;}
.gt-txt { font-size: 17px; font-weight: 400; letter-spacing: -.04em; line-height: 1.6em; color: #505050; margin-top: 25px;}

/* 회사소개 */
.about-box { display: flex; margin-bottom: 30px; background: #fafafa; }
.about-box:last-child { margin-bottom: 0;}
.about-left { width: 50%;}
.about-left img { width: 100%;}
.about-right { width: 50%; padding-left: 75px; padding-top: 55px;}
.about-right h4 { font-size: 17px; font-weight: 600; letter-spacing: -.04em; line-height: 1.1em; color: #1b3c88; margin-bottom: 10px;}
.about-right h3 { font-size: 28px; line-height: 1.2em; letter-spacing: -.04em; font-weight: 700; color: #2c2c2c;}
.about-txt { margin-top: 20px;}
.about-txt p { position: relative; font-size: 16px; font-weight: 400; letter-spacing: -.04em; line-height: 1.5em; color: #505050; padding-left: 15px; margin-bottom: 3px;}
.about-txt p:last-child {margin-bottom: 0;}
.about-txt p::before { content: ""; position: absolute; left: 0; top: 9px; width: 4px; height: 4px; border-radius: 100%; background: #505050;}
.about-list { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 25px;}
.about-list li { padding: 8px 15px; border-radius: 17px; background: #1b3c88; color: #fff; text-align: center; font-size: 15px; font-weight: 500; letter-spacing: -.04em; line-height: 1.2em; }

/* 경영이념 */
.mn-sec1 { padding-bottom: 100px;}
.mn-img { width: 100%; height: 350px; background: url(../images/sub/sub1_3.jpg) center no-repeat; background-size: cover; text-align: center;border-radius: 175px; color: #fff; display: flex; justify-content: center; align-items: center;}
.mn-img h3 { font-size: 32px; font-weight: 700; letter-spacing: -.04em; line-height: 1.2em;  position: relative; padding-left: 50px;}
.mn-img h3 span { color: #5787f6;}
.mn-img h3 strong { font-size: 70px; color: #ccc;  font-family: 'DWImpactamin'; font-weight: 200;  position: absolute; left: 0; top: 15px; display: block;}
.mn-img h4 { font-size: 32px; font-weight: 700; letter-spacing: -.04em; line-height: 1.2em;  position: relative; margin-top: 20px;}
.mn-img h4 strong { font-size: 70px; color: #ccc;  font-family: 'DWImpactamin'; font-weight: 200;  position: absolute; right: 100px; top: 18px; display: block;}
.mn-sec2 { padding: 75px 0 110px; background: #f5f5f5;}
.mn-box { margin-bottom: 95px;}
.mn-box:last-child { margin-bottom: 0;}
.mn-left { padding-left: 50px;}
.mn-left .num { font-size: 20px; font-weight: 700; letter-spacing: -.04em; line-height: 1em; color: #1b3c88; margin-bottom: 10px;}
.mn-left .tit { font-size: 34px; font-weight: 700; letter-spacing: -.04em; line-height: 1.2em; color: #2c2c2c;} 
.mn-right { font-size: 18px; font-weight: 300; letter-spacing: -.04em; line-height: 1.6em; color: #505050; width: 100%; margin-left: 40%;}

/* 주요 연혁 */
.hst-img { height: 440px; background: url(../images/sub/hst_bg.jpg) center no-repeat; background-size: cover; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 68px; font-weight: 700; letter-spacing: -.04em; line-height: 1em; z-index: -1; position: relative;}
.history { position: relative; padding-top: 220px; margin-top: -145px;}
.history::after { content: ""; position: absolute; left: 0; right: 0; margin: auto; top: 0; background: #a8a8a8; width: 1px; height: 91%; z-index: -1;}
.history::before { content: ""; position: absolute; top: -12px; left: 0; right: 1px; width: 16px; height: 16px; border-radius: 100%; border: 4px solid #fff; margin: auto;}
.history .group { position: relative; margin-bottom: 75px;}
.history .group:last-child { margin-bottom: 0;}
.history .group .group-ttl {font-size:34px; line-height:1em; color: #1b3c88; font-weight: 700; position: relative; letter-spacing: -.04em; z-index: 1;}
.history .group .groupbox::after { content:''; position:absolute; top:12px; width:9px; height:9px; background:#1b3c88; border-radius:100%; z-index: 1;}
.history .group:nth-of-type(odd) .groupbox::after { left: -4px;}
.history .group:nth-of-type(even) .groupbox::after { right: -5px;}
.history .group:nth-child(odd) .groupbox { width: 50%; position: relative; margin-left: 50%; padding-left: 35px;}
.history .group:nth-child(even) .groupbox { width: 50%; position: relative; margin-left: 0; padding-right: 35px;}
.history .group ul {position: relative; width:100%; margin-top: 30px;}
.history .group:nth-child(even) ul {text-align:right;}
.history .group ul li {position: relative; text-align: left; margin-bottom: 18px; font-size: 18px; letter-spacing: -.04em; line-height: 1.3em; color: #505050; font-weight: 400; padding-left: 15px;}
.history .group ul li::before { content: ""; position: absolute; left: 0; top: 9px; width: 4px; height: 4px; border-radius: 100%; background: #a8a8a8;}
.history .group ul li:last-child {margin-bottom: 0;}
.history .group:nth-of-type(even) ul li { padding-left: 0; padding-right: 15px;}
.history .group:nth-of-type(even) ul li::before { left: auto; right: 0;}
.history .group:nth-child(even) ul li {text-align: right;}
.history .group:nth-child(even) .group-ttl { text-align: right;}

/* 인재상 */
.pp-tit { font-size: 26px; font-weight: 400; letter-spacing: -.04em; line-height: 1.444em; color: #2c2c2c; text-align: center;}
.pp-tit span { font-weight: 700;}
.pp-list { border-top: 1px solid #888888; margin-top: 100px;}
.pp-list li { position: relative; border-bottom: 1px solid #ddd; padding: 50px 0;}
.pp-list li img { position: absolute; left: 80px; top: 75px;}
.pp-list li .pp-txt { padding-left: 260px;}
.pp-list li .pp-txt .title-sub { font-size: 16px; font-weight: 600; letter-spacing: -.04em; line-height: 1.2em; color: #888; margin-bottom: 15px;}
.pp-list li .pp-txt .title { font-size: 28px; font-weight: 700; letter-spacing: -.04em; line-height: 1.2em; color: #1b3c88; margin-bottom: 25px;}
.pp-list li .pp-txt .txt { font-size: 17px; font-weight: 400; letter-spacing: -.04em; line-height: 1.6em; color: #505050;}

/* 주요고객사 */
.op-sec1 { padding-bottom: 100px;}
.optit { font-size: 34px; font-weight: 700; letter-spacing: -.04em; line-height: 1em; color: #222; margin-bottom: 60px; text-align: center;}
.op-list { display: flex; flex-wrap: wrap; gap: 24px;}
.op-list li { width: calc(100%/5 - 20px); text-align: center;}
.op-list li .thumb {display:block; position:relative; padding-bottom:35%; overflow:hidden; }
.op-list li .thumb img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:contain;}
.op-sec2 { padding: 100px 0; background: #fafafa;}
.op-sec3 { padding-top: 100px;}

/* sub2 공통 */
.sub2-pd { padding-bottom: 100px;}
.sub2-pd2 { padding: 100px 0;}
.sub2-pd3 { padding-top: 100px;}
.sub2-tit { font-size: 34px; font-weight: 700; letter-spacing: -.04em; line-height: 1.2em; color: #2c2c2c;margin-bottom: 35px;}
.sub2-txt { font-size: 17px; font-weight: 400; line-height: 1.6em; letter-spacing: -.04em; color: #505050;margin-bottom: 45px;}
.sub2-list { display: flex; gap: 30px;}
.sub2-list li { flex: 1;}
.sub2-list li img { width: 100%;}
.sub2-bg { background: #fafafa;}

/* 바이오케미컬사업 */
.bio-box { margin-bottom: 30px; display: flex;}
.bio-box.al { align-items: center;}
.bio-box:last-child { margin-bottom: 0;}
.bio-left { width: 34%;}
.bio-right { padding-top: 20px; padding-left: 60px; width: 66%;}
.bio-right .tit { font-size: 24px; font-weight: 700; letter-spacing: -.04em; line-height: 1.2em; color: #2c2c2c; margin-bottom: 20px;}
.bio-right .sub2-tit { margin-bottom: 15px; }
.bio-right .txt { font-size: 17px; font-weight: 400; letter-spacing: -.04em; line-height: 1.666em; color: #505050;}
.bio-sec2 { background: url(../images/sub/bio_bg.jpg) center no-repeat; background-size: cover; text-align: center; font-size: 26px; line-height: 1.4em; color: #fff; letter-spacing: -.04em; font-weight: 700;}
.bio-right .group { margin-bottom: 35px; }
.bio-right .group:last-child { margin-bottom: 0;}

/* ploymer사업 */
.ploy-sec {background: url(../images/sub/ploy_bg.jpg) center no-repeat; background-size: cover; }
.ploy-sec .sub2-tit { color: #fff;}
.ploy-sec .sub2-txt { margin-bottom:12px; color: #fff;}

/* 친환경 재생수지 사업 */
.mech-img { height: 420px; background: url(../images/sub/mech_bg.jpg) center no-repeat; background-size: cover; color: #fff; padding-left: 100px; display: flex; align-items: center;}
.mech-img .tit { font-size: 28px; font-weight: 700; line-height: 1.5em; letter-spacing: -.04em;}
.mech-img .txt { font-size: 17px; font-weight: 400; line-height: 1.66em; letter-spacing: -.04em; margin-top: 20px;}
.mech-list { display: flex; gap: 30px;}
.mech-list li { width: calc(100%/4); position: relative; color: #fff; text-align: center;}
.mech-list li .tit { font-size: 18px; font-weight: 500; line-height: 1.2em; letter-spacing: -.04em; position: absolute; right: 0; bottom: 30px; left: 0; margin: auto;}
.mech-box { display: flex;}
.mech-left { background: #fff; display: flex; align-items: center; justify-content: center; width: 50%;}
.mech-right { width: 50%; padding-left: 60px;}
.mech-txtlist { border-top: 1px solid #a8a8a8;}
.mech-txtlist li { border-bottom: 1px solid #dfdfdf; padding: 40px 0;}
.mech-txtlist li .tit { font-size: 24px; font-weight: 700; line-height: 1.2em; letter-spacing: -.04em; color: #2c2c2c; margin-bottom: 25px;}
.mech-txtlist li p { position: relative; font-size: 17px; font-weight: 400; letter-spacing: -.04em; line-height: 1.2em; padding-left: 15px; margin-bottom: 15px;}
.mech-txtlist li p:last-child { margin-bottom: 0;}
.mech-txtlist li p::before { content: ""; position: absolute; left: 0; top: 7px; width: 5px; height: 5px; border-radius: 100%; background: #1b3c88;}
.mech-imgwrap { width: 100%; position: relative; border: 1px solid #ddd;}
.mech-imgbox { position: relative; display: flex; align-items: center; justify-content: center; padding: 90px 0; width: 100%;}
.mech-txtbox { margin-top: 35px; position: relative; padding-left: 60px; padding-top: 7px; }
.mech-txtbox::before { content: ""; position: absolute; left: 0; width: 40px; height: 34px; background: url(../images/sub/mech-chk.png) center no-repeat; background-size: contain; top: 0; }
.mech-txtbox h4 { font-size: 24px; font-weight: 700; line-height: 1.2em; color: #2c2c2c; letter-spacing: -.04em; margin-bottom: 15px;}
.mech-txtbox p { font-size: 17px; line-height: 1.666em; letter-spacing: -.04em; font-weight: 300; color: #505050; }

/* application */
.app-tbl-wrap { width: 100%;}
.app-tbl { width: 100%; border-collapse: collapse; border-top: 1px solid #a8a8a8;}
.app-tbl tr { border-bottom: 1px solid #ddd; text-align: center;}
.app-tbl tr th { border-right: 1px solid #ddd; padding: 22px 5px; background: #f4f4f4; font-size: 16px; font-weight: 500; letter-spacing: -.04em; line-height: 1.2em; color: #2c2c2c;}
.app-tbl tr th:last-child { border-right: none;}
.app-tbl tr td { border-right: 1px solid #ddd; padding: 22px 5px; font-size: 16px; font-weight: 400; letter-spacing: -.04em; line-height: 1.2em; color: #505050;}
.app-tbl tr td:last-child { border-right: none;}
.app-tbl tr td.sub-tbl { background: #fafafa; color: #2c2c2c; font-weight: 500;}
.app-tbl tr td.clr { background: #f4f4f4; font-weight: 500; color: #2c2c2c;}

/* 철강/소재사업 */
.ion-txt { margin-bottom: 45px;}
.ion-txt p { position: relative; padding-left: 15px; margin-bottom: 10px; font-size: 17px; font-weight: 400; letter-spacing: -.04em; line-height: 1.2em; color: #505050;}
.ion-txt p span { font-weight: 600;}
.ion-txt p:last-child {margin-bottom: 0;}
.ion-txt p::before { content: ""; position: absolute; left: 0; top: 7px; width: 5px; height: 5px; border-radius: 100%; background: #1b3c88;}
.ion-txt p.txt {padding-left: 0;}
.ion-txt p.txt::before { display: none; }
.ion-txt p .clr1 { font-weight: 400; color: #2e58b9;}
.ion-txt p a { color: #2e58b9; text-decoration: underline; font-weight: 700; text-underline-position: under;}
.ion-txt2 p { margin-bottom: 20px;}
.ion-txt3 p { line-height: 2em; }
.ion-txt3 p::before { top: 14px; }
.ion-box { margin-bottom: 30px; background: #fff; padding: 30px 0; padding-left: 65px; font-size: 18px; font-weight: 700; display: flex; align-items: center; color: #2c2c2c; letter-spacing: -.04em; position: relative; gap: 70px;}
.ion-box::before { content: ""; position: absolute; left: 0; width: 3px; height: 100%; background: #1b3c88; top: 0;}
.ion-box:last-child { margin-bottom: 0;}
.ion-box .imgbox { display: flex; gap: 70px; align-items: center;}
.ion-box2 { border: 1px solid #ddd;}
.ion-img {text-align: center;}

/* 프로젝트 개발 */
.pj-sec2 { background-image: url(../images/sub/pj_bg.jpg);}
.pj-sec2 .tit { position: relative; display: inline-block;}
.pj-sec2 .tit::before { content: ""; background: #fff; width: 6px; height: 6px; border-radius: 100%; position: absolute; left: -10px; top: 0;}

/* 국제운송서비스 */
.for-box { margin-top: 30px;}
.ion-list { display: flex; align-items: center; flex-wrap: wrap; gap: 40px 0; }
.ion-list li { width: calc(100%/5); text-align: center;}
.mech-fx { flex-direction: row-reverse;}
.mech-fx .mech-left { display: block;}
.mech-fx .mech-left img { margin-bottom: 30px; display: block;}
.mech-fx .mech-right { padding-left: 0; padding-right: 60px;}
.mech-fx .mech-right .tit { font-size: 24px; letter-spacing: -.04em; color: #2c2c2c;}
.mech-fx .mech-right .titsub { font-size: 17px; font-weight: 600; letter-spacing: -.04em; color: #1b3c88; line-height: 1.2em; margin-bottom: 15px;}
.mech-fx .mech-txtlist li { padding: 44px 0;}
.mech-fx .mech-right p { color: #505050;}

.price-list { display: flex; gap: 30px;}
.price-list li { width: calc(100%/4); text-align: center;}
.price-list li .thumb {position:relative; padding-bottom:138%; margin-bottom:18px; overflow:hidden; }
.price-list li .thumb img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:contain;}
.price-list li .thumb:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #ddd;}
.price-list li .tit { font-size: 16px; font-weight: 600; line-height: 1.2em; color: #2c2c2c;}

/* sub3 공통 */
.sub3-tit { font-size: 28px; font-weight: 700; letter-spacing: -.04em; line-height: 1.5em; color: #1b3c88; margin-bottom: 50px; text-align: center;}  
.sub3-tit.clr1 { color: #fff;}
.sub3-subtit { font-size: 18px; font-weight: 700; letter-spacing: -.04em; line-height: 1.6em; color: #505050; text-align: center; margin-top: 95px;}
.sub3-list li { border: 1px solid #ddd; padding: 40px 0; padding-left: 70px; position: relative; margin-bottom: 30px;}
.sub3-list li::before { content: ""; position: absolute; left: 0; width: 3px; height: 100%; background: #1b3c88; top: 0;}
.sub3-list li:last-child { margin-bottom: 0;}
.sub3-list li .imgbox { position: absolute; display: flex; align-items: center; left: 70px; top: 35px; gap: 40px;}
.sub3-list li .imgbox .tit { font-size: 18px; font-weight: 700; letter-spacing: -.04em; line-height: 1.2em; color: #2c2c2c;}
.sub3-list li .txtbox { font-size: 16px; line-height: 1.556em; letter-spacing: -.04em; font-weight: 400; color: #505050; padding-left: 32%;}

/* 윤리경영 */
.sub3-img { height: 500px; background: url(../images/sub/esg_bg.jpg) center no-repeat; background-size: cover; display: flex; align-items: center;}
.sub3-img b { display: block; margin-bottom: 20px; font-size: 16px; font-weight: 700; letter-spacing: -.04em; line-height: 1em; color: #508b3e;}
.sub3-img .sub3-tit { margin-bottom: 30px; text-align: left;}
.sub3-img p { font-size: 17px; font-weight: 300; line-height: 1.666em; letter-spacing: -.04em; color: #fff; }