@charset "utf-8"; /* ===================================================== */
/* 콘텐츠 공통 */
.color-b { color:#222 !important; } 
.color-g { color:#666 !important; } 
.color-1 { color:#0868ac !important; } 
.color-2 { color:#63b32e !important; } 
.color-3 { color:#e00031 !important; } 
.color-4 { color:#0091d4 !important; } 

.fw-1 { font-weight: 100; } 
.fw-2 { font-weight: 200; } 
.fw-3 { font-weight: 300; } 
.fw-4 { font-weight: 400; } 
.fw-5 { font-weight: 500; } 
.fw-6 { font-weight: 600; } 
.fw-7 { font-weight: 700; } 
.fw-8 { font-weight: 800; } 
.fw-9 { font-weight: 900; } 


.alignC { text-align:center !important; } 
.alignL { text-align:left !important; } 
.alignR { text-align:right !important; } 

.upper { text-transform: uppercase; } 

strong { font-weight: 700; } 



/*타이틀*/
.title-wrap { margin-bottom:3rem; line-height: 1.15; } 
.title-wrap .tit-type1 { font-size:max(4rem, 28px); color:#222; font-weight: 700; } 
.title-wrap .tit-type1 .stxt { display: block; font-size:max(2rem, 16px); color:var(--color-sub1); font-weight: 800; } 

.title-wrap .tit-type2 { font-size:max(3rem, 20px); color:#222; font-weight: 700; padding-left:1.8rem; position: relative; } 
.title-wrap .tit-type2::before { content:''; display: block; width:0.6rem; height:2.6rem; border-radius: 1rem; background-color: var(--color-sub1); position: absolute; left:0; top:0.4rem; } 

@media (max-width: 1023px){
 .tb__scroll { position: relative; padding-top:25px; margin-top:-2rem; } 
.tb__scroll::after { content: ''; display: block; width:24px; height:24px; background:url('../images/common/ico_scrollx.gif') center top no-repeat; position: absolute; top:0; right:0; } 
.tb__scroll-inner { overflow-x:auto; padding-bottom:1rem; } 
.tb__scroll-inner::-webkit-scrollbar { height: 6px; background-color: #fff; } 
.tb__scroll-inner::-webkit-scrollbar-thumb { border: 1px solid transparent; background-color: var(--color-main); background-clip: content-box; } 
 }





.sub-content-wrap { --inout-padding:calc(var(--inner-padding) - var(--outer-padding)); } 
@media (max-width: 1540px){
 .sub-content-wrap { --inout-padding:var(--outer-padding); } 
 }


@media (hover: hover) and (pointer: fine) { } 
@media (max-width: 1280px) { } 
@media (max-width: 1024px) { } 
@media (max-width: 768px) { } 
@media (max-width: 576px) { } 
@media (max-width: 480px) { } 
/* 콘텐츠 공통 */
/* ===================================================== */


.gql-cnt { margin-bottom: 20rem; } 

/* ===================================================== */
/* 010101_회사소개 : S */
.company .sec01 { margin-bottom: 7rem; position: relative; padding: 9rem 0; } 
.company .sec01:before { position: absolute; content: ""; width: 313px; height: 81px; left: 50%; transform: translateX(-50%); top: 0; background: url(../images/sub/010101_logo.png) no-repeat 50% 50%; } 
.company .sec01:after { position: absolute; content: ""; width: 1px; height: 74px; left: 50%; bottom: 0; background-color: #222; } 
.company .sec01 h3 { font-size: 3rem; font-weight: 600; color: #a4a4a4; font-family: "Lexend"; text-align: center; } 
.company .sec01 h3 b { color: var(--color-main); } 
.company .sec01 .desc { text-align: center; } 
.company .sec01 .desc h4 { color: #222; font-size: 4rem; font-weight: 700; margin: 3rem 0; position: relative; display: inline-block; } 
.company .sec01 .desc h4:before { position: absolute; content: ""; bottom: -2px; left: 50%; transform: translateX(-50%); width: 105%; height: 2.2rem; background-color: #cdefed; z-index: -1000; } 
.company .sec01 .desc p { font-size: 1.8rem; line-height: 1.7; font-weight: 600; color: #666; letter-spacing: -0.025em; } 
.company .sec01 .desc p strong { color: #222; font-weight: 700; } 
.company .sec02 .tit h5 { color: #222; font-size: 4rem; font-weight: 700; margin-bottom: 3rem; } 
.company .sec02 > ul > li { display: flex; flex-wrap: wrap; background-color: #e7edec; border-radius: 0 0 20px 0; position: relative; margin-top: 10rem; } 
.company .sec02 > ul > li:first-child { margin-top: 0; } 
.company .sec02 > ul > li:after { position: absolute; content: ""; bottom: 0; right: 0; width: 163px; height: 90px; background: url(../images/sub/010101_before.png) no-repeat; } 
.company .sec02 > ul > li .img { flex: 1; width: 45%; height: 385px; } 
.company .sec02 > ul > li .img img { width: 100%; height: 100%; display: block; object-fit: cover; } 
.company .sec02 > ul > li .info { padding: 4.5rem 7rem; flex: 1; width: 55%; } 
.company .sec02 > ul > li .info h6 { font-size: 3.5rem; font-weight: 700; color: #222; } 
.company .sec02 > ul > li .equip { margin: 2rem 0 3rem 0; } 
.company .sec02 > ul > li .equip p { font-size: 1.9rem; color: #222; font-weight: 700; margin-top: .5rem; } 
.company .sec02 > ul > li .equip p:first-child { margin-top: 0; } 
.company .sec02 > ul > li .equip p b { color: var(--color-main); } 
.company .sec02 > ul > li em span { color: #fff; font-size: 1.8rem; border-radius: 50px; background-color: var(--color-main); padding: 1rem 2rem; max-width: 115px; } 
.company .sec02 > ul > li em { position: relative; display: block; z-index: 2; margin-bottom: 3rem; } 
.company .sec02 > ul > li em:before { position: absolute; content: ""; width: 100%; height: 1px; background-color: #b3ccca; top: 50%; z-index: 0; } 
.company .sec02 > ul > li em span { color: #fff; font-size: 1.8rem; border-radius: 50px; background-color: var(--color-main); padding: 1rem 2rem; max-width: 115px; z-index: 1; position: relative; } 
.company .sec02 > ul > li .info ul li { font-size: 1.8rem; font-weight: 700; color: #666; position: relative; padding-left: 1rem; margin-top: 1rem; } 
.company .sec02 > ul > li .info ul li:before { width: 4px; height: 4px; background-color: #222; border-radius: 50%; content: ""; position: absolute; left: 0; top: 8px; } 
@media (max-width:1024px) {.company .sec02 > ul > li:after { bottom: 0; right: -22px; width: 133px; height: 60px; background-size: contain; } 
.company .sec01:before { width: 293px; height: 61px; background-size: contain; } 
.company .sec01:after { width: 1px; height: 54px; } 
 }
@media (max-width:768px) {.company .sec01 { flex-direction: column; } 
.company .sec01 .desc p { font-weight: 500; } 
.company .sec01 h3 br { display: none; } 
.company .sec01 .desc { margin-left: 0; padding-left: 0; margin-top: 3rem; border-left: unset; text-align: center; } 
.company .sec02 .tit h5 { text-align: center; } 
.company .sec02 > ul > li { flex-direction: column; } 
.company .sec02 > ul > li .img,
.company .sec02 > ul > li .info { width: 100%; } 
.company .sec02 > ul > li .info { padding: 4.5rem; } 
.company .sec02 > ul > li .info ul li { font-weight: 500; } 
.company .sec02 > ul > li .info ul li:before { top: 7px; } 
 }
@media (max-width:480px) {.company .sec02 > ul > li:after { right: -40px; width: 113px; height: 40px; } 
.company .sec02 > ul > li .info ul li:before { top: 5px; } 
 }
/* 010101_회사소개 : E */
/* ===================================================== */










/* ===================================================== */
/* 010201_연혁 : S */
.history { display: flex; align-items: flex-start; gap: 0 9rem; } 
.history .left { position: relative; border-radius: 0 0 0 30px; overflow: hidden; } 
.history .left .img img { display: block; } 
.history .left .bottom { position: absolute; bottom: 0; padding: 3rem; display: flex; justify-content: flex-end; width: 100%; background: linear-gradient(to left, #171C61 0%, #0BA29A 100%); } 
.history .right > ul > li { margin-top: 9rem; } 
.history .right > ul > li:first-child { margin-top: 0; } 
.history .right > ul > li > h3 { font-size: 5rem; color: var(--color-main); font-weight: 700; margin-bottom: 2rem; } 
.history .right > ul > li > h3 span { font-family: "Lexend"; } 
.history .right > ul > li > ul > li { font-size: 1.8rem; font-weight: 600; color: #666; margin-top: 1.3rem; display: flex; align-items: center; } 
.history .right > ul > li > ul > li b { color: #222; font-size: 2.5rem; font-weight: 600; font-family: "Lexend"; margin-right: 1.5rem; display: block; } 

@media (max-width: 1024px) {.history .left .bottom img { max-width: 50%; } 
.history .right > ul > li > ul > li { line-height: 1.5; } 
 }
@media (max-width: 768px) {.history { flex-direction: column; row-gap: 5rem; } 
.history .left { left: 50%; transform: translateX(-50%); } 
 }
/* 010201_연혁 : E */
/* ===================================================== */










/* ===================================================== */
/* 010301_조직도 : S */
.organiz img:last-child { display: none; } 

@media (max-width: 768px) {.organiz img:last-child { display: block; } 
.organiz img:first-child { display: none; } 
 }
/* 010301_조직도 : E */
/* ===================================================== */








/* ===================================================== */
/* ==== 사업분야 페이지 공통 : S ==== */

/* - 타이틀 공통 */
.gql-prod .wrap-title {text-align: center;margin-bottom: 9rem;}
.gql-prod .wrap-title h3 {font-size: 3.5rem;font-weight: bold;color:#222;line-height: 4.5rem;letter-spacing: -0.5px;}
.gql-prod .wrap-title .point {color: #00a29a;}

@media (max-width: 1280px) {
    .gql-prod .wrap-title {margin-bottom: 7rem;}
}

@media (max-width: 768px) {
    .gql-prod .wrap-title {margin-bottom: 5rem;}
    .gql-prod .wrap-title h3 {font-size: 3rem;line-height: 4rem;}
}

/* - 프로세스 공통 */
.gql-prod .wrap-process {display: flex;width: 100%;justify-content: center;align-items: center;min-height:260px;border-bottom-right-radius: 50px;border:1px solid #e6e6e6;
    position: relative;padding-left: 14px;box-sizing: border-box;background: url('../images/sub/prod_bg.jpg') no-repeat right top / cover;padding:4% 3%;}
.gql-prod .wrap-process::before,
.gql-prod .wrap-process::after {content: '';position: absolute;z-index: 1;}
.gql-prod .wrap-process::before {left:0;top:-1px;width:14px;height: calc(100% + 2px);background: #00a29a;}
.gql-prod .wrap-process::after {right:0;bottom:-1px;width:163px;height: 90px;background: url('../images/sub/010101_before.png') no-repeat bottom right / auto 100%;}

.gql-prod .wrap-process.bg01 {background-image: url('../images/sub/prod_bg_QTZ.jpg');}

.gql-prod .wrap-process .process-inner {--gapX:50px;display: flex;gap:35px var(--gapX);align-items: center;flex-wrap: wrap;justify-content: center;}
.gql-prod .wrap-process .box-item {counter-increment: item;display: flex;flex-direction: column;gap:18px;position: relative;}
.gql-prod .wrap-process .box-item:not(:first-child)::before {position: absolute;content: '';width:21px;height: 10px;background: url('../images/sub/prod_arrow-sm.png') no-repeat center / 100% auto;
    top:50%;transform: translate(-50%, -50%);left:calc((var(--gapX) / 2) * -1);}
.gql-prod .wrap-process .box-item.item-col:not(:first-child)::before,
.gql-prod .wrap-process .box-item.item-col + .box-item::before {width:25px;height:53px;background-image: url('../images/sub/prod_arrow-lg.png');}
.gql-prod .wrap-process .box-item.item-col + .box-item::before {transform: translate(-50%, -50%) rotate(-180deg);}

.gql-prod .wrap-process .item {--box-width: 130px; --item-size:calc(var(--box-width) + var(--gapX));
    width:var(--box-width);padding:13px 0;box-sizing: border-box;font-family: var(--font-lexe);font-size: 2rem;
    color:#fff;font-weight: 500;text-align: center; border-radius: 5px;box-shadow: 0px 4px 23px 0 rgb(34 34 34 / 33%);
    background: linear-gradient(to right, #00b1a9, #1b206e);background-size: calc(var(--cnt, 7) * var(--item-size) - var(--gapX)) 100%;
    background-position: calc(-1 * var(--item-idx) * var(--item-size)) 0;}

@media (max-width: 1280px) {
    .gql-prod .wrap-process {padding: 5% 3% 6%;}
    .gql-prod .wrap-process::after {height:80px;}
    .gql-prod .wrap-process .process-inner {row-gap: 40px;}
}

@media (max-width: 768px) {
    .gql-prod .wrap-process {padding:6rem 2rem;width:80%;max-width:370px;background-image: url('../images/sub/prod_bg-s.jpg');margin-left: auto;margin-right: auto;}
    .gql-prod .wrap-process::after {width:118px;height: 65px;}
    .gql-prod .wrap-process::before {left:-1px;top:0;width:calc(100% + 2px);height:14px;}
    .gql-prod .wrap-process.bg01 {background-image: url('../images/sub/prod_bg-s.jpg');}
    .gql-prod .wrap-process .item {font-size: 2.2rem;}
    .gql-prod .wrap-process .process-inner {flex-direction: column;--gapX:60px;row-gap: var(--gapX);}
    .gql-prod .wrap-process .box-item:not(:first-child)::before {width:20px!important;left:50%;top:calc((var(--gapX) / 2) * -1);transform: translate(-50%, -50%) rotate(90deg);}
    .gql-prod .wrap-process .box-item.item-col + .box-item::before {transform: translate(-50%, -50%) rotate(-90deg);}
    .gql-prod [data-aos-delay] + .wrap-process {transition-delay: 1s !important;}
    .gql-prod [data-aos-delay] + .wrap-process .process-inner [data-aos] {transition-delay: 0s !important;}
}

.gql-prod .wrap-process .box-item:nth-child(1) {--item-idx:0;}
.gql-prod .wrap-process .box-item:nth-child(2) {--item-idx:1;}
.gql-prod .wrap-process .box-item:nth-child(3) {--item-idx:2;}
.gql-prod .wrap-process .box-item:nth-child(4) {--item-idx:3;}
.gql-prod .wrap-process .box-item:nth-child(5) {--item-idx:4;}
.gql-prod .wrap-process .box-item:nth-child(6) {--item-idx:5;}
.gql-prod .wrap-process .box-item:nth-child(7) {--item-idx:6;}
.gql-prod .wrap-process .box-item:nth-child(8) {--item-idx:7;}


/* - 그리드 공통 */
.gql-prod .wrap-grid {margin-top: 10rem;}
.gql-prod .wrap-grid .grid-inner {display: grid; grid-gap:3rem 2.5rem; grid-template: auto / repeat(4, 1fr);justify-items: center;}
.gql-prod .wrap-grid .item {--col:1; --row:1; grid-column: span var(--col);grid-row: span var(--row);border-radius: 10px;overflow: hidden;
    width: fit-content;height: fit-content;}
.gql-prod .wrap-grid .item img {display: block;}

@media (max-width: 1280px) {
    .gql-prod .wrap-grid {margin-top: 8rem;}
}

@media (max-width: 1024px) {
    .gql-prod .wrap-grid .grid-inner {grid-template-columns: auto;grid-gap:2rem;}
}

@media (max-width: 768px) {
    .gql-prod .wrap-grid {margin-top: 6rem;}
    .gql-prod .wrap-grid [data-aos] {transition-delay: 0s !important;}
}

.gql-prod .wrap-grid .item.col-2 {--col:2;}
.gql-prod .wrap-grid .item.row-2 {--row:2;}
.gql-prod .wrap-grid .item.col-3 {--col:3;}
.gql-prod .wrap-grid .item.row-3 {--row:3;}
.gql-prod .wrap-grid .item.col-4 {--col:4;}
.gql-prod .wrap-grid .item.row-4 {--row:4;}

/* - 라벨 그리드 공통 */
.gql-prod .wrap-grid.grid-label .grid-inner {grid-gap: 7rem 5%;grid-template-columns: repeat(3, 1fr);}
.gql-prod .grid-label .item {position: relative;overflow: visible;border:1px solid #e6e6e6;}
.gql-prod .grid-label .item.view-mo {display: none;}
.gql-prod .grid-label .label {--labelH:60px;position: absolute;left:-1px;top:0;transform: translateY(-50%);font-family: var(--font-lexe);z-index: 1;text-align: center;
    font-size:2.2rem; line-height:29px; font-weight: 500; color:#fff; width:15vw; max-width:193px;min-width: 110px;height:var(--labelH);padding:15px;box-sizing: border-box;
    background: linear-gradient(13deg, #212564 15%, #019d98 73%);}
.gql-prod .grid-label .label::after {content:""; position: absolute;top:0;left:100%;width:37px;height: var(--labelH);background: url('../images/sub/prod_label.png') no-repeat left top / auto 100%;
    display: block;}
.gql-prod .grid-label .item-img {border-radius: 10px;overflow: hidden;}

.gql-prod .grid-label .item.item-txt {border: 0;letter-spacing: -0.8px;align-self: center;justify-self: flex-start;}
.gql-prod .grid-label .item-txt h3 {font-size: 5rem;font-weight: bold;color:#00a29a;letter-spacing: -1px;}
.gql-prod .grid-label .item-txt .txt-line .line {position: relative;display: block;padding-left: 0.5rem;}
.gql-prod .grid-label .item-txt .txt-line .line::before {content: "";display: block;position: absolute;
    left:0;bottom:0;width:100%;height:45%;max-height: 2rem;background-color: #cdefed;z-index: -1;}
.gql-prod .grid-label .item-txt .txt-line .line.short {display: inline-block;padding-right: 1rem;}
.gql-prod .grid-label .item-txt .desc {font-size: 3.5rem;color:#222;font-weight: bold;margin-top: 3rem;line-height: 5rem;}

@media (max-width: 1420px) {
    .gql-prod .grid-label .item-txt h3 {font-size: 3.12vw;}
    .gql-prod .grid-label .item-txt .desc {font-size: 2.08vw;line-height: 2.77vw;margin-top: 2.08vw;}
}

@media (max-width: 1280px) {
    .gql-prod .grid-label .label {--labelH:50px;font-size: 2rem;line-height: 18px;width:16vw;}
}

@media (max-width: 1024px) {
    .gql-prod .wrap-grid.grid-label .grid-inner {grid-gap:6rem 4%;}
    .gql-prod .grid-label .label {--labelH:43px;font-size: 1.8rem;line-height: 1.4rem;}

    .gql-prod .grid-label .item-txt h3 {font-size: 3rem;}
    .gql-prod .grid-label .item-txt .desc {font-size: 2rem;line-height: 3rem;margin-top: 1.5rem;}
}

@media (max-width: 768px) {
    .gql-prod .grid-label .item.view-pc {display: none;}
    .gql-prod .grid-label .item.view-mo {display: block;}
    .gql-prod .wrap-grid.grid-label .grid-inner {grid-template-columns: repeat(2, 1fr);}
}

@media (max-width: 576px) {
    .gql-prod .grid-label .label {--labelH:35px; width:27vw;font-size: 2rem;line-height: 0.6rem;min-width: 100px;}
}

/* ==== 사업분야 페이지 공통 : E ==== */
/* ===================================================== */


/* ===================================================== */
/* 020401_CVD-SIC-임가공 : S */

/* wrap-grid.type01 */
.gql-prod .wrap-grid.type01 .grid-inner {grid-template-columns: 1.67fr 1fr 1fr; grid-gap:2rem 4rem;}

@media (min-width: 1281px) {
    .gql-prod .wrap-grid.type01 .item:nth-child(4),
    .gql-prod .wrap-grid.type01 .item:nth-child(5) {align-self: flex-end;}
}

@media (max-width: 1024px) {
    .gql-prod .wrap-grid.type01 .grid-inner {grid-gap:2rem;}
}

@media (max-width: 768px) {
    .gql-prod .wrap-grid.type01 .grid-inner {grid-template-columns: 1fr 1fr;}
    .gql-prod .wrap-grid.type01 .item.row-2 {--row:1;--col:2;}
    .gql-prod .wrap-grid.type01 [data-aos]:nth-child(3),
    .gql-prod .wrap-grid.type01 [data-aos]:nth-child(5) {transition-delay: 0.1s !important;}
}
/* 020401_CVD-SIC-임가공 : E */
/* ===================================================== */










/* ===================================================== */
/* 020201_si소재부품 : S */
.si { padding-bottom: 20rem; background: url(../images/sub/si_bg.jpg) no-repeat; background-position: 0 100%; } 
.si .wrap-process { display: flex; width: 100%; justify-content: center; align-items: center; border-bottom-right-radius: 50px; position: relative; padding-left: 14px; box-sizing: border-box; background-image: url('../images/sub/prod_si-bg01.jpg'); border: 1px solid #ddd; } 
.si .wrap-process-img { background-color: #171c61; border-radius: 0 30px 30px 30px; padding: 5.5rem 8rem; margin: 10rem 0 15rem 0; display: flex; justify-content: space-between; gap: 0 13rem; } 
.si .wrap-process-img .img { position: relative; } 
.si .wrap-process-img .img img { border-radius: 20px; } 
.si .wrap-process-img .img:after { position: absolute; content: ""; width: 23px; height: 38px; right: -80px; top: 40%; transform: translateY(-40%); background: url(../images/sub/020201_arrow.png) no-repeat; } 
.si .wrap-process-img .img:last-child:after { display: none; } 
.si .wrap-process-img .img p { text-align: center; margin-top: 3rem; font-size: 2.3rem; font-weight: 600; color: #fff; font-family: "Lexend"; } 
.si .desc { border-radius: 30px; border: 1px solid var(--color-main); overflow: hidden; } 
.si .desc .item { display: flex; } 
.si .desc .item:first-child h3 { border-bottom: 1px solid #26b0a9; } 
.si .desc .item:first-child p { border-bottom: 1px solid #e2e2e2; } 
.si .desc .item h3 { background-color: var(--color-main); padding: 4.5rem 3rem; color: #fff; min-width: 440px; font-size: 2.5rem; font-weight: 700; text-align: center; } 
.si .desc .item h3 span { font-size: 1.7rem; font-weight: 500; font-family: "Lexend"; display: block; margin-top: 1rem; } 
.si .desc .item p { width: 100%; font-size: 2.2rem; font-weight: 700; font-family: "Lexend"; color: #666; padding: 4.5rem 3rem 4.5rem 17rem; background-color: #fff; } 
.si .desc .item:last-child p { width: 100%; font-size: 2.2rem; font-weight: 700; font-family: "Lexend"; color: #222; } 
.si .desc .item p .green { color: var(--color-main); } 
.si .desc .item P .light { font-size: 1.8rem; font-weight: 500; display: block; margin-top: 1rem; } 

@media (max-width: 1280px) {.si .desc .item h3 { min-width: 400px; } 
.si .desc .item p { padding: 4.5rem; } 
 }
@media (max-width: 1024px) {.si .wrap-process-img .img:after { width: 13px; height: 28px; right: -40px; background-size: contain; } 
.si .wrap-process-img .img p { margin-top: 1rem; } 
.si .wrap-process-img { gap: 0 7rem; } 
.si .desc .item h3 { min-width: 300px; } 
 }
@media (max-width: 768px){
.si .wrap-process { padding: 6rem 2rem; max-width: 370px; background-image: url(../images/sub/prod_bg-s.jpg); margin-left: auto; margin-right: auto; } 
.si .wrap-process-img { flex-direction: column; align-items: center; gap: 10rem 0; } 
.si .wrap-process-img .img:after { width: 18px; height: 21px; right: auto; left: 45%; top: auto; bottom: -50px; transform: rotate(90deg); } 
.si .desc .item { flex-direction: column; } 
.si .desc .item h3 { border: unset; } 
.si .desc .item p { text-align: center; border: unset; } 
 }
/* 020201_si소재부품 : S */
/* ===================================================== */










/* ===================================================== */
/* 030101_친환경 : S */
.environment { line-height: 1.5; } 
.environment .top { margin-bottom: 4rem; } 
.environment .top h3 { font-size: 3.5rem; font-weight: 700; color: #222; position: relative; display: inline-block; margin-bottom: 2rem; } 
.environment .top h3::before { position: absolute; content: ""; bottom: 2px; left: 50%; transform: translateX(-50%); width: 105%; height: 2.2rem; background-color: #cdefed; z-index: -1000; } 
.environment .top > p { font-weight: 700; font-size: 2rem; color: #666; } 
.environment .bottom li { margin-top: 1.5rem; display: flex; align-items: center; border-radius: 5px; overflow: hidden; border: 1px solid var(--color-main); } 
.environment .bottom li h4 { font-size: 2.5rem; font-weight: 700; color: var(--color-main); background-color: #fff; min-width: 200px; text-align: center; } 
.environment .bottom li p { color: #fff; font-weight: 700; font-size: 2rem; padding: 2rem 2rem 2rem 4.5rem; background-color: var(--color-main); width: 100%; letter-spacing: -0.025em; border: 1px solid var(--color-main); } 
.environment .sec02 { margin-top: 10rem; } 
.environment .sec02 .bottom { margin-top: 9rem; display: flex; justify-content: center; } 
.environment .sec02 .bottom .img img:last-child { display: none; } 

@media (max-width: 1024px){
 .environment .bottom li h4 { min-width: 150px; } 
 }
@media (max-width: 768px){
 .environment .bottom li h4 { min-width: 120px; } 
 }
@media (max-width: 480px){
 .environment .bottom li h4 { padding: 2rem; } 
 .environment .bottom li { flex-direction: column; margin-top: 3rem; } 
 .environment .bottom li p { font-weight: 500; padding: 4rem 2rem; text-align: center; } 
 .environment .top { text-align: center; } 
 .environment .top > p { font-weight: 500; } 
 .environment .sec02 .bottom .img img:last-child { display: block; } 
 .environment .sec02 .bottom .img img:first-child { display: none; } 
 }
/* 030101_친환경 : E */
/* ===================================================== */










/* ===================================================== */
/* 030201_사회공헌 : S */
.social { display: flex; align-items: center; } 
.social .left { position: relative; flex: 1.1; } 
.social .left:after { position: absolute; content: ""; width: 296px; height: 164px; right: 0; bottom: 0; background: url(../images/sub/030201_symbol.png) no-repeat; } 
.social .left .img img { border-radius: 0 0 50px 50px; display: block; } 
.social .left header { position: absolute; right: 12rem; bottom: 9rem; color: #a4a4a4; font-family: "Lexend"; font-size: 5rem; font-weight: 600; } 
.social .left header b { color: var(--color-main); } 
.social .right { flex: 1; margin-left: 7rem; line-height: 1.4; letter-spacing: -0.025em; } 
.social .right h3 { font-weight: 700; font-size: 7.5rem; color: #222; position: relative; line-height: 0.9; display: flex; justify-content: flex-end; } 
.social .right h3:after { content: ""; flex: 1; width: 58%; height: 2px; margin: 6.5rem 0 0 1rem; background-color: #222; } 
.social .right h3 .green { color: var(--color-main); } 
.social .right h3 .navy { color: #171c61; } 
.social .right p:nth-child(2) { font-size: 3.2rem; font-weight: 700; color: #222; margin: 4.5rem 0; } 
.social .right p:last-child { font-size: 2rem; font-weight: 600; color: #666; } 

@media (max-width:1280px){
 .social .right h3 { font-size: 6.5rem; } 
.social .right p:nth-child(2) { font-size: 2.6rem; } 
 }
@media (max-width:1024px) {.social { flex-direction: column; row-gap: 5rem; align-items: flex-start; } 
.social .left header { right: 16rem; } 
.social .right { margin-left: 0; width: 100%; } 
.social .right p:nth-child(2) br,
.social .right p:last-child br { display: none; } 
.social .right p:nth-child(2) { margin: 4.5rem 0 2.5rem 0; } 
.social .right p:nth-child(2),
.social .right p:last-child { line-height: 1.5; } 
 }
@media (max-width:768px) {.social .left:after { width: 256px; height: 124px; right: -4rem; background-size: contain; } 
.social .left header { right: 11rem; } 
 }
@media (max-width:480px) {.social .left:after { display: none; } 
.social .left header { right: auto; left: 50%; transform: translateX(-50%); bottom: 4rem; font-size: 3rem; letter-spacing: .5rem; } 
.social .left header br { display: none; } 
.social .left .img img { border-radius: 0 0 25px 25px; } 
 }
/* 030201_사회공헌 : E */
/* ===================================================== */










/* ===================================================== */
/* 030301_복지문화 : S */
.welfare .top { text-align: center; margin-bottom: 6rem; padding-bottom: 12rem; position: relative; } 
.welfare .top:after { position: absolute; content: ""; left: 50%; bottom: 0; width: 1px; height: 64px; background-color: #222; } 
.welfare .top h3 { color: #222; font-size: 5.5rem; font-weight: 800; margin-bottom: 2rem; } 
.welfare .top p { color: #666; font-size: 2.5rem; font-weight: 600; line-height: 1.5; } 
.welfare .bottom .img { display: flex; justify-content: center; } 
.welfare .bottom ul li { position: relative; padding-left: 15rem; line-height: 1.5; border-bottom: 1px solid #ddd; padding-bottom: 4rem; } 
.welfare .bottom ul li:before { position: absolute; content: ""; left: 0; top: 0; background: url(../images/sub/030301_ico01.png) no-repeat; width: 110px; height: 110px; } 
.welfare .bottom ul li:nth-child(2):before { background: url(../images/sub/030301_ico02.png) no-repeat; } 
.welfare .bottom ul li:nth-child(3):before { background: url(../images/sub/030301_ico03.png) no-repeat; } 
.welfare .bottom ul li:nth-child(4):before { background: url(../images/sub/030301_ico04.png) no-repeat; } 
.welfare .bottom ul li:nth-child(5):before { background: url(../images/sub/030301_ico05.png) no-repeat; } 
.welfare .bottom ul li h4 { font-weight: 800; font-size: 3rem; color: #007a9f; margin-bottom: 1rem; } 
.welfare .bottom ul li:nth-child(2) h4 { color: #1c7b94; } 
.welfare .bottom ul li:nth-child(3) h4 { color: #0f273a; } 
.welfare .bottom ul li:nth-child(4) h4 { color: #0f263a; } 
.welfare .bottom ul li:nth-child(5) h4 { color: #283458; } 
.welfare .bottom ul li p { font-size: 1.8rem; font-weight: 600; color: #666; } 

@media (min-width:1025px){
 .welfare .bottom ul { display: none; } 
 }
@media (max-width:1024px){
 .welfare .bottom .img { display: none; } 
 .welfare .bottom ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 7rem 10rem; } 
 }
@media (max-width:768px){
 .welfare .bottom ul { grid-template-columns: repeat(1, 1fr); } 
 .welfare .bottom ul li { padding-left: 12rem; } 
 .welfare .bottom ul li:before,
 .welfare .bottom ul li:nth-child(2):before,
 .welfare .bottom ul li:nth-child(3):before,
 .welfare .bottom ul li:nth-child(4):before,
 .welfare .bottom ul li:nth-child(5):before
 {
 background-size: contain; width: 80px; height: 80px; } 
 }
@media (max-width:480px){
 .welfare .bottom ul li { padding-left: 11rem; } 
 .welfare .bottom ul li:before,
 .welfare .bottom ul li:nth-child(2):before,
 .welfare .bottom ul li:nth-child(3):before,
 .welfare .bottom ul li:nth-child(4):before,
 .welfare .bottom ul li:nth-child(5):before
 {
 width: 60px; height: 60px; } 
 }
/* 030301_복지문화 : E */
/* ===================================================== */










/* ===================================================== */
/* 050301_오시는길 : S */
.directions { position: relative; margin-top: 10rem; } 
.directions:first-child { margin-top: 0; } 
.directions .tit { margin-bottom: 4rem; } 
.directions .tit h3 { font-size: 3.5rem; color: #222; font-weight: 700; position: relative; display: inline-block; } 
.directions .tit h3:before { position: absolute; content: ""; bottom: -5px; left: 50%; transform: translateX(-50%); width: 110%; height: 2.2rem; background-color: #cdefed; z-index: -1000; } 
.directions-map { height: 50rem; border-radius: 0 50px 0 0; overflow: hidden; } 
.directions-map .item { height: 100%; position: relative; } 
.directions-map .item iframe { width: 100%; height: 100%; border: 0; aspect-ratio: 16 / 5; position: relative; z-index: 1; } 
.directions .info-box { background-color: #171c61; padding: 4rem; color: #fff; font-size: 2rem; font-weight: 600; display: flex; gap: 0 10rem; border-radius: 0 0 50px 50px; } 
.directions .info-box a.call,
.directions .info-box a.mail { font-family: "Lexend"; } 
.directions .info-box > * { position: relative; padding-left: 6rem; } 
.directions .info-box > *:before { position: absolute; width: 47px; height: 47px; content: ""; left: 0; top: 50%; transform: translateY(-50%); } 
.directions .info-box .location:before { background: url(../images/sub/050301_ico-location.png) no-repeat; } 
.directions .info-box .call:before { background: url(../images/sub/050301_ico-call.png) no-repeat; } 
.directions .info-box .mail:before { background: url(../images/sub/050301_ico-mail.png) no-repeat; } 

@media (max-width:1024px) {.directions .info-box { gap: 0 3rem; } 
.directions .info-box > *:before { width: 37px; height: 37px; } 
.directions .info-box .location:before,
.directions .info-box .call:before,
.directions .info-box .mail:before { background-size: contain; } 
 }
@media (max-width: 768px){
 .directions .info-box { flex-direction: column; gap: 4rem 0; font-weight: 400; } 
 .directions .info-box > * { padding-left: 5rem; } 
 .directions .info-box > *:before { width: 30px; height: 30px; } 
 }
/* 050301_오시는길 : E */
/* ===================================================== */