@charset "utf-8";


/* ===================================================== */
/* 콘텐츠 공통 */

/* 공통 슬라이드 - 썸네일 타입 */
.thumb-slide {overflow: hidden;position: relative;max-height: 40rem;}
.thumb-slide img {width: 100%;}
.thumb-slide .slide-btn {--size:60px;width:var(--size);height:var(--size);background: #fff url('../images/sub/slide-thumb-arrow.png') no-repeat center / 14px 12px;border:1px solid #ddd;
  position: absolute;bottom:0;right:0;z-index: 1;cursor: pointer;transition: 0.5s;filter: grayscale(1);}
.thumb-slide .slide-btn.prev {right:calc(var(--size) - 1px);transform: rotate(180deg);}
.thumb-slide .slide-btn:hover {filter:grayscale(0);}

@media (max-width: 768px){
  .thumb-slide .slide-btn {--size:50px;}
}


/* 공통 상단 텍스트 영역 */
.sub-common__top {text-align: center;margin-top: 3rem;}
.sub-common__top .point {color:var(--color-main)!important;}
.sub-common__top .color-dark {--text-color:#222;color:#222;}
.sub-common__top .title {font-weight: bold;font-size: 3.2rem;color:#222;margin-bottom: 3rem;line-height: 1.6}
.sub-common__top .desc {font-size: 2.2rem;line-height: 1.6;color:var(--text-color, #666);font-weight: 500;}
.sub-common__top .desc strong {font-weight: 600;}

@media (max-width: 768px) {
  .sub-common__top {margin-top: 0;}
  .sub-common__top .desc {font-size: 2rem;}
}



@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){
}
/* 콘텐츠 공통 */
/* ===================================================== */


/* ===================================================== */
/*  */

@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){
}
/*  */
/* ===================================================== */

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


/* ===================================================== */
/* 제품 뷰페이지 : S */
.prod-wrap {padding-bottom:33rem;}
@media (max-width: 768px) {
  .prod-wrap {padding-bottom:10rem;}
}

/* 제품 상단영역 */
.prod-intro {margin-top: 3rem;margin-bottom: 7rem;background: url('../images/sub/prod-intro-bg01.jpg') no-repeat center / cover;text-align: center;word-break:auto-phrase;}
.prod-intro .point {color:var(--color-main)!important;}
.prod-intro strong {font-weight: bold;}

.prod-intro.type01 {--color-main:#e27910;background-image: url('../images/sub/prod-intro-bg02.jpg');}

.prod-intro .intro-top .box-img {max-width: 350px;margin:0 auto;}
.prod-intro .intro-top .box-img img {display: block;}
.prod-intro .intro-top .box-txt {padding-top:7rem;margin-bottom:2rem;color:#222;}
.prod-intro .intro-top .title {font-size: 3.2rem;}
.prod-intro .intro-top .desc {font-size: 2rem;line-height: 1.6;margin-top:1.5rem;font-weight: 500;}
.prod-intro .intro-top .desc strong {font-weight: 600;}

.prod-intro .intro-line {position: relative;height:6.3rem;margin:3.5rem 0;background: url('../images/sub/prod-intro-line-deco.png') no-repeat center / auto 100%;}
.prod-intro .intro-line::before,
.prod-intro .intro-line::after {content: '';position: absolute;top:calc(50% - 1px);width:calc(50% - 5rem);height:1px;background: #ccc;}
.prod-intro .intro-line::before {left:0;}
.prod-intro .intro-line::after {right:0;}

.prod-intro .intro-bottom {padding-bottom: 7.3rem;font-size: 1.8rem;color:#666;line-height: 1.7;}
.prod-intro .intro-bottom strong {color:#222;font-weight: 600;}

@media (max-width: 1024px) {
  .prod-intro .intro-top .title {font-size: 3rem;}
}

@media (max-width: 768px) {
  .prod-intro {margin-top: 0;margin-bottom:6rem;}
  .prod-intro .intro-top .box-img {width: 50%;}
  .prod-intro .intro-top .box-txt {padding-top: 5rem;margin-bottom: 2.5rem;}

  .prod-intro .intro-line {height: 5rem;margin:2.5rem 0;}
  .prod-intro .intro-line::before,
  .prod-intro .intro-line::after {width:calc(50% - 4rem)}

  .prod-intro .intro-bottom {padding-bottom: 5rem}
}

/* 제품 카테고리 */
@media (max-width: 768px) {
  .prod-tab.sub-content-tab {margin-bottom: 3rem}
}

/* 제품 리스트 */
.prod-list {overflow-x: auto;width: 100%; margin-bottom: 7rem;}
.prod-list:focus {outline:none;}
.prod-list::-webkit-scrollbar {height: 6px; background-color: #fff;}
.prod-list::-webkit-scrollbar-thumb {border: 0px solid transparent; border-radius: 1rem; background-color: #999; background-clip: content-box;}

.prod-list ul {display: flex;align-items: baseline;justify-content: flex-start;}
.prod-list ul li {position: relative;flex:1;max-width: 280px}
.prod-list ul li a {font-size: 1.8rem;color:#666;position: relative;padding:3rem; text-align: center;font-weight: 500;transition: 0.3s;white-space: nowrap;}
.prod-list ul li:not(:last-child) a::after {content: '';position: absolute;top:50%; right:-2px; margin-top: -2px;width:5px;height:5px;background: #222;border-radius: 100%;}
.prod-list ul li::before {content: '';position: absolute;bottom:0;left:0;width: 100%;height: 5px;background: #ddd;}

.prod-list ul li.on a {color:#222;font-weight: 800;}
.prod-list ul li.on::before {background-color: #222;}

.prod-list ul li:not(.on) a::before {content: '';position: absolute;bottom:0;left:50%;width: 0;height: 5px;background: #222;transition: 0.3s;transform: translateX(-50%);}
.prod-list ul li:not(.on) a:hover::before {width: 100%;}
.prod-list ul li:not(.on) a:hover {color:#222;}

@media (max-width: 768px) {
  .prod-list {margin-bottom: 5rem;}
  .prod-list ul li a {font-size: 2rem;}
}


/* 제품 상세 */
.prod-cont {margin-top: 7rem;}
.prod-cont .cont-top {display: flex;gap:6.5rem 5.5rem;justify-content: space-between;align-items: center;}
.prod-cont .top-thumb {width: 100%;max-width: 60rem;position: relative;background: #ccc;min-width:40rem;}
.prod-cont .top-thumb::after {content: '';position: absolute;z-index: -1;width:100%;height: 100%;right:-10px;bottom:-10px;background: #222;}

.prod-cont .top-desc {max-width: 695px;}
.prod-cont .top-desc .box-title {margin-bottom: 3rem;}
.prod-cont .top-desc .box-title h4 {font-size: 3.6rem;font-weight: 800;color:var(--color-main)}
.prod-cont .top-desc .box-title .subtxt {font-size: 1.8rem;font-weight: 500;color:#222;margin-top: 1rem;}
.prod-cont .top-desc .box-desc {padding-top: 2.8rem;font-size: 1.6rem;color:#666;line-height: 1.7;width:92%;border-top:1px solid #e6e6e6}

@media (max-width: 768px) {
  .prod-cont {margin-top: 5rem;}
  .prod-cont .cont-top {flex-wrap: wrap;}
  .prod-cont .top-thumb {width: calc(100% - 10px);margin-left: auto;margin-right: auto;transform: translateX(-5px);}

  .prod-cont .top-desc .box-title {margin-bottom: 2rem;}
  .prod-cont .top-desc .box-title h4 {font-size: 3rem}
  .prod-cont .top-desc .box-title .subtxt {font-size: 2.2rem;}
  .prod-cont .top-desc .box-desc {font-size: 2rem;width:100%;padding-top: 2rem}
}

.prod-cont .cont-detail {margin-top: 7rem;}
.prod-cont .detail-item {margin-top: 20px;background: #f6f6f6;padding:0 5rem;}
.prod-cont .detail-header {padding: 3.6rem 0;position: relative;cursor: pointer;}
.prod-cont .detail-header::before,
.prod-cont .detail-header::after {content:'';position: absolute;right:0;width:2.1rem;height:3px;background: #1f1f1f;
  transition: 0.5s cubic-bezier(0.4, 0, 0.2, 1);top:50%;margin-top:-2px;}
.prod-cont .detail-header::before {transform: rotate(90deg);}
.prod-cont .detail-item.active .detail-header::before {transform: rotate(0deg);}
.prod-cont .detail-item.active .detail-header::after {transform: rotate(-90deg);opacity: 0}

.prod-cont .detail-header .detail-tit {display: flex; font-size: 2.2rem;align-items: center;gap:1.3rem;font-weight: 600;color:#222;}
.prod-cont .detail-header .detail-tit .icon {width: 2.2rem;height:2.8rem;display: block;background: url('../images/sub/prod-detail-icon-effect.png') no-repeat left center / 100% auto;}
.prod-cont .detail-header .detail-tit .icon.info {background-image: url('../images/sub/prod-detail-icon-info.png');}

@media (max-width: 768px) {
  .prod-cont .cont-detail {margin-top: 5rem}
  .prod-cont .detail-item {padding: 0 2.5rem;margin-top: 15px}
  .prod-cont .detail-header {padding:2.8rem 0;}
  .prod-cont .detail-header::before,
  .prod-cont .detail-header::after {height:2px;margin-top: -1px;}
}

.prod-cont .detail-body {padding-bottom:5rem;display: none;}
.prod-cont .prod-effect {border-top: 3px solid #222;}
.prod-effect .effect-item {display: flex;gap:1rem 3rem;width: 100%;padding:5.5rem 3rem;align-items: center;position: relative;}
.prod-effect .effect-item:not(:first-child)::before {content:'';position: absolute;top:0;left:0;width:100%;height:1px;background-image: repeating-linear-gradient(to right,#ddd 0,#ddd 4px,transparent 4px,transparent 6px);}
.prod-effect .effect-item .effect-tit {font-size: 2rem;line-height: 1.6;color:var(--color-main);font-weight: bold;display: flex;align-items: center;gap:1.5rem;max-width: 43rem;width: 35%;flex-shrink: 0;}
.prod-effect .effect-item .effect-tit .num {font-size: 1.5rem;color:#fff;background: var(--color-main);width:4rem;height:3.9rem;border-radius: 100%;display: inline-flex;
  align-items: center;justify-content: center;font-weight: 600;flex-shrink: 0}
.prod-effect .effect-item .effect-desc {font-size: 1.7rem;line-height: 1.6;max-width: 50%;font-weight: 500;}

@media (max-width: 1280px) {
  .prod-effect .effect-item .effect-desc {max-width: unset;}
}

@media (max-width: 768px) {
  .prod-cont .detail-body {padding-bottom: 4rem}
  .prod-cont .prod-effect {border-width: 2px;}
  .prod-effect .effect-item {flex-wrap: wrap;padding: 2.5rem 0;}
  .prod-effect .effect-item .effect-tit {width: 100%;max-width: unset;gap:1.2rem;font-size:2.3rem;}
  .prod-effect .effect-item .effect-tit .num {font-size: 1.6rem;width:23px;height: 22px}
  .prod-effect .effect-item .effect-desc {font-size: 2rem;line-height: 3.2rem;padding-left: 32px;}
  .prod-effect .effect-item .effect-desc br {display: none;}
}

.prod-info {overflow: auto;}
.prod-info table {width: 100%;min-width: 450px;}
.prod-info table tr th,
.prod-info table tr td {padding:2.8rem 5rem}
.prod-info table tr th {font-size: 2rem;font-weight: bold;color:#fff;background: var(--color-main);text-align: left;border-bottom:1px solid #f9f9f9;}
.prod-info table tr td {font-size: 1.8rem;font-weight: 500;background: #fff;border-bottom:1px solid #ddd;}

@media (max-width: 768px) {
  .prod-info table tr th,
  .prod-info table tr td {font-size: 1.8rem;line-height: 2.5rem;padding:2rem 2.2rem}
}


/* 제품 뷰페이지 : E */
/* ===================================================== */










/* ===================================================== */
/* 0101_회사소개 */
.company { text-align: center; background: url(../images/sub/0101_bg01.jpg) no-repeat, url(../images/sub/0101_bg02.jpg) no-repeat ;  background-position: left 50% top 0, right 0 bottom 0; padding: 12rem 0 20rem; }
.company .intro { padding-bottom: 12.5rem; margin-bottom: 8rem; position: relative; }
.company .intro:after { position: absolute; bottom: 0; left: 50%; content: ""; width: 1px; height: 50px; background-color: #222; }
.company .intro h4 { font-size: 5.2rem; font-weight: 700; color: #222; margin-bottom: 3rem; }
.company .intro h4 b { color: var(--color-main); }
.company .intro p { font-size: 3.6rem; font-weight: 400; color: #222; }
.company .c-main { color: var(--color-main); font-weight: 600; }
.company .c-black { color: #222; font-weight: 600; }
.company .bottom p { font-size: 2rem; font-weight: 400; color: #666; line-height: 1.7; margin-top: 4.5rem; }
/* 0101_회사소개 */
/* ===================================================== */










/* ===================================================== */
/* 0102_연혁 */
.history { display: flex; gap: 0 13rem; line-height: 1.5; }
.history .left { position: sticky; align-self: start; align-content: start; top: 10rem; height: fit-content; }
.history .left .bottom { background: linear-gradient(to right, #004483, #003669 ); padding: 3rem 4rem 3rem 3rem; display: flex; justify-content: flex-end; bottom: 0; position: absolute; width: 100%; }
.history .right { flex-grow: 1; }
.history ol > li { margin-top: 8rem; border-bottom: 1px solid #ddd; }
.history ol > li:first-child { margin-top: 0; }
.history ol > li:last-child { border-bottom: 0; }
.history ol > li h4 { font-size: 4rem; font-weight: 500; color: var(--color-main); }
.history ol > li > ul { padding: 4rem 0 8rem 0; }
.history ol > li > ul > li { font-size: 2rem; font-weight: 400; color: #666; margin-top: 2rem; position: relative; padding-left: 1.7rem; }
.history ol > li > ul > li:before { position: absolute; left: 0; top: 15px; width: 3px; height: 3px; border-radius: 50%; background-color: #666; content: ""; }
.history ol > li > ul > li:first-child { margin-top: 0; }

@media (max-width:1024px) {
.history { gap: 0 7rem; }
.history ol > li > ul > li:before { top: 12px; }
 }
@media (max-width:768px) {
.history .left .bottom img { height: 50px; }
.history ol > li > ul > li:before { top: 10px; }
 }
@media (max-width:650px) {.history { flex-direction: column; }
.history .left { position: relative; top: 0; }
.history .right { margin-top: 5rem; }
.history ol > li > ul > li:before { top: 11px; }
 }
@media (max-width:480px){
.history ol > li > ul > li:before { top: 9px; }
 }
/* 0102_연혁 */
/* ===================================================== */










/* ===================================================== */
/* 0103_비전 */
.vision .sec01 { padding: 9rem 4rem; background: url(../images/sub/0103_visual.jpg) no-repeat 50% 70%; color: #fff; display: flex; flex-direction: column; align-items: center; text-align: center; }
.vision .sec01 h4 { font-size: 4rem; font-weight: 800; }
.vision .sec01 p { width: 70%; font-size: 2.2rem; font-weight: 500; margin-top: 3.5rem; padding: 3.5rem 0; border-top: 1px solid rgb(255, 255, 255, .5); border-bottom: 1px solid rgb(255, 255, 255, .5); }
.vision .sec02 { margin-top: 15rem; }
.vision .sec02 h5 { margin-bottom: 10rem; font-size: 4rem; font-weight: 800; color: var(--color-main); text-align: center; }
.vision .sec02 ul li { display: flex; align-items: center; justify-content: space-between; gap: 0 20rem; margin-top: 8rem; }
.vision .sec02 ul li .circle { width: 20rem; height: 20rem; border-radius: 50%; aspect-ratio: 1/1; background-color: var(--color-main); display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; font-size: 2rem; font-weight: 600; row-gap: 2rem; position: relative; text-align: center; z-index: 0;}
.vision .sec02 ul li .circle.item02 { background-color: #333; }
.vision .sec02 ul li .circle.item03 { background-color: #e37a10; }
.vision .sec02 ul li .circle:before { position: absolute; right: calc(190px * -1); top: 50%; transform: translateY(-50%); width: 85%; height: 1px; background-color: #ddd; content: ""; z-index: -1; }
.vision .sec02 ul li .circle:after { position: absolute; right: calc(200px * -1); top: 50%; transform: translateY(-50%); width: 5px; height: 5px; background-color: #ddd; content: ""; }
.vision .sec02 ul li .box { padding: 7rem 6rem; background-color: #f6f6f6; width: 70%; margin-left: 2rem; position: relative; }
.vision .sec02 ul li .box p { color: #222; font-size: 2rem; font-weight: 500; line-height: 2; }
.vision .sec02 ul li .box p strong { font-weight: 700; }

@media (max-width:1280px) {.vision .sec02 ul li .circle:before { right: calc(170px * -1); }
.vision .sec02 ul li .circle:after { right: calc(180px * -1); }
 }
@media (max-width:1024px) {.vision .sec01 p { width: 100%; }
.vision .sec01 { padding: 9rem 8rem; }
 }
@media (max-width:768px) {.vision .sec02 ul li { gap: 0 10rem; }
.vision .sec02 ul li .circle:before { right: calc(80px * -1); width: 40%; }
.vision .sec02 ul li .circle:after { right: calc(80px * -1); }
 }
@media (max-width:576px) {.vision .sec02 ul li { flex-direction: column; }
.vision .sec02 ul li .box { width: 100%; margin-left: 0; margin-top: 3rem; }
.vision .sec02 ul li .circle:before { top: auto; bottom: -1.6rem; left: 50%; transform: translateX(-50%) rotate(90deg); z-index: -1; width: 15%;}
.vision .sec02 ul li .circle:after { display: none; }
.vision .sec02 ul li .box p { text-align: center; }
 }
@media (max-width:480px) {.vision .sec01 { padding: 9rem 4rem; }
 }
/* 0103_비전 */
/* ===================================================== */









/* ===================================================== */
/* 0104_오시는길 */
.directions .sec01 { display: flex; justify-content: space-between; align-items: center; padding: 6rem; border: 1px solid #ddd; margin-bottom: 5rem; }
.directions .sec01 .info h4 { font-size: 4.2rem; font-weight: 800; color: #222; margin-bottom: 3rem; }
.directions .sec01 .info ul { border-top: 1px solid #ddd; padding-top: .5rem; }
.directions .sec01 .info ul li { display: flex; flex-direction: column; margin-top: 3rem; gap: 1.5rem 0;}
.directions .sec01 .info ul li h5 { font-size: 1.8rem; font-weight: 600; color: #222; position: relative; padding-left: 4rem; }
.directions .sec01 .info ul li p:last-child,
.directions .sec01 .info ul li a:last-child { font-size: 1.6rem; font-weight: 400; color: #666; }
.directions .sec01 .info ul li h5:before { position: absolute; left: 0; top: 50%; transform: translateY(-50%); content: ""; width: 30px; height: 30px; background: url(../images/sub/0104_ico01.png) no-repeat; background-size: contain; }
.directions .sec01 .info ul li:nth-child(2) h5:before { background: url(../images/sub/0104_ico02.png) no-repeat; background-size: contain;}
.directions .sec01 .info ul li:nth-child(3) h5:before { background: url(../images/sub/0104_ico03.png) no-repeat; background-size: contain;}
.directions .sec01 .img { margin-left: 9rem; width: 50%; height: 35rem; }
.directions .sec01 .img img { width: 100%; height: 100%; display: block; object-fit: cover; }
.directions-map { height: 50rem; 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; }

@media (max-width: 768px){
.directions .sec01 { flex-direction: column; align-items: flex-start; row-gap: 5rem; }
.directions .sec01 .img { width: 100%; margin-left: 0; }
.directions .sec01 .info { width: 100%; }
.directions .sec01 .info ul li h5 { padding-left: 4.5rem; }
}
@media (max-width:576px){
.directions .sec01 .info ul li { flex-direction: column; align-items: flex-start; row-gap: 1.5rem; }
 }
@media (max-width:480px){
.directions .sec01 { padding: 4rem; }
.directions .sec01 .img { height: unset; }
.directions .sec01 .img img { width: unset; height: unset; display: unset; object-fit: unset; }
.directions .sec01 .info ul li h5 { padding-left: 4rem; }
.directions .sec01 .info ul li h5:before,
.directions .sec01 .info ul li:nth-child(2) h5:before,
.directions .sec01 .info ul li:nth-child(3) h5:before
 {
 width: 22px; height: 22px; }
 }
/* 0104_오시는길 */
/* ===================================================== */









/* ===================================================== */
/* 0201_연구개발 : S */

/* 인트로 */
.rndcont-wrap .rndcont-intro {background: #f6f6f6;padding:9.7rem 0;}
.rndcont-intro .intro-inner {display: flex;align-items: flex-start;justify-content: space-between;gap:5%;}
.rndcont-intro .intro-text {max-width: 690px;width: 55%;}
.rndcont-intro .title {font-size: 4rem;color:#222}
.rndcont-intro .title strong {font-weight: bold;color:var(--color-main)}
.rndcont-intro .desc {font-size: 1.8rem;line-height: 1.6;border-top: 1px solid #ddd;padding-top: 3.3rem;margin-top: 3rem;}
.rndcont-intro .desc strong {font-weight: 600;color:#222;}
.rndcont-intro .intro-img {width: 40%;}
.rndcont-intro .intro-img .img-inner {box-shadow: 1.2rem 3.3rem 8.7rem 0px rgb(0 0 0 / 15%);max-width: 538px;}

@media (min-width: 1025px) {
  .rndcont-wrap {padding-top: 9rem;}
  .rndcont-intro .intro-img {margin-top: -19rem;}
}

@media (max-width: 1024px) {
  .rndcont-wrap .rndcont-intro {padding:7rem 0 9.7rem}
  .rndcont-intro .intro-inner {flex-wrap: wrap;gap:5rem;}
  .rndcont-intro .intro-text {width: 100%;}
  .rndcont-intro .intro-img {width:100%;}
  .rndcont-intro .intro-img .img-inner {margin-left: auto;width: 40%;max-width: 400px;}
}

@media (max-width: 768px) {
  .rndcont-wrap .rndcont-intro {padding:5rem 0 6rem}
  .rndcont-intro .intro-inner {gap:4rem}
  .rndcont-intro .title {font-size: 3.2rem;}
  .rndcont-intro .desc {padding-top: 2.5rem;margin-top: 2.5rem;}
  .rndcont-intro .intro-img .img-inner {width:65%;}
}

/* 프로세스 */
.rndcont-process {margin-top: 14.5rem;padding-bottom: 30rem;}
.rndcont-process .process-top {font-size: 2.2rem;font-weight: 500; text-align: center;}
.rndcont-process .process-top p {line-height: 1.6;}
.rndcont-process .process-top .desc {color:#222;}
.rndcont-process .process-top .desc strong {color:var(--color-main);font-weight: 600;}
.rndcont-process .process-cont {margin-top: 8.5rem;counter-reset:processItem;}

.rndcont-process .process-item {--item-spacing-y:1.8rem; --item-spacing-x:3.7rem; display: flex;align-items: flex-end;width: 100%;position: relative;
   counter-increment: processItem;}
.rndcont-process .process-item:not(:last-child) {--gap-y:8.5rem;margin-bottom: var(--gap-y);}
.rndcont-process .process-item:not(:last-child)::after {content: '';position: absolute;top:calc(100% + (var(--gap-y)/2) + (1.9rem / 3));right:34%; width:2.7rem;height: 1.9rem;
  background: url('../images/sub/rndcont-process-arrow.png') no-repeat center top / 100% auto;}

.rndcont-process .process-item .item-label {--item-color:#668fb4;width:40%;max-width: 50rem;position: relative;padding-left:12rem;flex-shrink: 0}
.rndcont-process .process-item .item-label .box-icon {--size:16vw; --max-size:15.8rem; width:var(--size); height:var(--size); max-width:var(--max-size);max-height:var(--max-size);position: absolute;z-index: 2;
  left:0;top:50%;border:2px solid var(--item-color);background: #fff;display: flex;align-items: center;justify-content: center;border-radius: 100%;box-sizing: content-box;transform: translateY(-50%);}
.rndcont-process .process-item .item-label .box-icon img {max-width: 40%;}
.rndcont-process .process-item .item-label .box-title {background: var(--item-color);color:#fff;font-size: 2rem;font-weight: 600;
  line-height: 3.4rem;padding: 3.1rem 2rem 3.3rem 7rem;position: relative;z-index: 1;flex:1 auto;}
.rndcont-process .process-item .item-label .box-title::after {content: '';position: absolute;top:100%;right:0;width:var(--item-spacing-x);height: var(--item-spacing-y);
  background: url('../images/sub/rndcont-process-deco.png') no-repeat center top / 100% auto;}

.rndcont-process .process-item .item-desc {margin-bottom:-1.8rem; margin-left: calc(var(--item-spacing-x) * -1); background: #f3f6f9;flex:1 auto;padding-left:8%;
  font-size: 1.8rem;font-weight: 500;color:#222;position: relative;height: 13rem;display: flex;align-items: center;overflow: hidden;}
.rndcont-process .process-item .item-desc::before { content: counter(processItem); position: absolute;z-index: 0;
  font-size: 10rem;font-weight: 900;color:#565f9f;opacity: 0.1;right: 3.5rem;bottom: -2.8rem;text-align: center;}
.rndcont-process .process-item .item-desc p {line-height: 1.5;margin:0.5rem 0;}

.rndcont-process .process-item:nth-child(2) .item-label {--item-color:#4d7ca8}
.rndcont-process .process-item:nth-child(3) .item-label {--item-color:#33699b}
.rndcont-process .process-item:nth-child(4) .item-label {--item-color:#1a578f}
.rndcont-process .process-item:nth-child(5) .item-label {--item-color:#004482}

@media (min-width: 1025px) {
  .rndcont-process .process-item:not(:last-child) .item-label .box-icon::before {content: '';position: absolute;left:50%;top:calc(100% + 2px);width:1px;height:0;z-index: -1;background: #004482;
    transition: 0.5s cubic-bezier(0.65, 0.05, 0.36, 1) 0.5s;}
  .rndcont-process .process-item:not(:last-child):not([data-aos]) .item-label .box-icon::before,
  .rndcont-process .process-item:not(:last-child).aos-animate .item-label .box-icon::before {height: 50%;}
}

@media (max-width: 1024px) {
  .rndcont-process {padding-bottom: 18rem;margin-top: 12rem;}
  .rndcont-process .process-item {flex-wrap: wrap;}
  .rndcont-process .process-item:not(:last-child) {--gap-y:10rem;}
  .rndcont-process .process-item:not(:last-child)::after {top:calc(100% + 5rem);right:calc(50% - (2.2rem / 2));width:2.2rem;}
  .rndcont-process .process-item .item-label {width: 100%;max-width: unset;}
  .rndcont-process .process-item .item-label .box-title {padding:2.5rem 2rem 2.8rem 7rem;margin-right:calc(var(--inner-padding) * -1);font-size: 2.2rem}
  .rndcont-process .process-item .item-label .box-title::after {width:var(--inner-padding)}
  .rndcont-process .process-item .item-desc {margin-top: 0;margin-left:calc(var(--inner-padding) * -1);height:unset;min-height: 14rem;padding:3rem 2rem 3rem 4rem;}
  .rndcont-process .process-item .item-desc p {margin: 1rem 0;}

}

@media (max-width: 768px) {
  .rndcont-process .process-item .item-label {padding-left: 75px}
  .rndcont-process .process-item .item-label .box-icon {--size:105px}
  .rndcont-process .process-item .item-label .box-icon img {max-width: unset;max-height: 48%;}
}


/* 0201_연구개발 : E */
/* ===================================================== */

/* ===================================================== */
/* 0202_성과 : S */
.board-rndcont .sub-common__top {margin-bottom: 11rem}
.board-rndcont .sub-common__top img {margin: 0 auto;}
.board-rndcont .sub-common__top .title {position: relative;margin-bottom: 5.5rem;}
.board-rndcont .sub-common__top .title img {max-width: 6.4rem;}
.board-rndcont .sub-common__top .title::after {content: '';position: absolute;left:50%;--top:1.7rem;--height:2.5rem;top:calc(100% + var(--top));width:1px;height:0;
  background: #222;transition: 0.5s cubic-bezier(0.65, 0.05, 0.36, 1) 0.3s;margin-left:-1px;}
.board-rndcont .sub-common__top .title:not([data-aos])::after,
.board-rndcont .sub-common__top .title.aos-animate::after {height:var(--height);}
.board-rndcont .sub-common__top .desc {font-weight: 400;}

@media (max-width: 768px) {
  .board-rndcont .sub-common__top {margin-bottom: 5rem}
  .board-rndcont .sub-common__top .title {margin-bottom: 7rem;}
  .board-rndcont .sub-common__top .title img {max-width: 7rem;}
  .board-rndcont .sub-common__top .title::after {--top:2.2rem;--height:3rem;}
}

/* 0202_성과 : E */
/* ===================================================== */


/* ===================================================== */
/* 0401_제조시설 : S */
.factory-plant .plant-slide {display: flex;align-items: flex-start;justify-content: space-between;gap:13rem 5rem;
  margin-top: 13.4rem;flex-wrap: wrap;padding-bottom: 33.5rem;}
.factory-plant .slide-item {--deco-space:1.8rem;position: relative;max-width: 62rem;width:45%;}
.factory-plant .slide-item:nth-child(odd) {margin-left:var(--deco-space);}
.factory-plant .slide-item::before {content: '';position: absolute;left:calc(var(--deco-space) * -1);top:calc(var(--deco-space) * -1);width:22rem;height:14.1rem;background: #e37a10;}
.factory-plant .slide-text {padding:2.5rem 0 2.3rem;}
.factory-plant .slide-text .label {font-size: 2.2rem;line-height: 3.6rem;color:#222;font-weight: 800;}
.factory-plant .slide-text .desc {font-size: 2rem;line-height: 3.2rem;font-weight: 600;margin-top: 0.6rem;}

@media (max-width: 1280px) {
  .factory-plant .slide-item:nth-child(even) {margin-right: calc(var(--deco-space) / 2);}
}

@media (max-width: 768px) {
  .factory-plant .plant-slide {margin-top: 9rem;row-gap:8rem;padding-bottom: 18rem;justify-content: center;}
  .factory-plant .slide-item {--deco-space:1.2rem;width: calc(100% - calc(var(--deco-space) / 2)); margin-left:calc(var(--deco-space) / 2)!important;}
  .factory-plant .slide-text {padding:2rem 0;}
  .factory-plant .slide-text .label {font-size: 2rem;line-height: 3.4rem;}
  .factory-plant .slide-text .desc {font-size: 1.8rem;line-height: 3rem;margin-top: 0.3rem;}
}

/* 0401_제조시설 : E */
/* ===================================================== */


/* ===================================================== */
/* 0402_품질시스템 : S */
.factory-qsystem .sub-common__top .desc {margin-bottom: 17rem;position: relative;}
.factory-qsystem .sub-common__top .desc::after {--height:6.5rem;content: '';position: absolute;left:50%; top:calc(100% + 5rem); margin-left: -1px;width:1px;height:0;
  background: #222;transition: 0.3s cubic-bezier(0.65, 0.05, 0.36, 1) 0.5s;}
.factory-qsystem .sub-common__top .desc:not([data-aos])::after,
.factory-qsystem .sub-common__top .desc.aos-animate::after {height:var(--height);}

@media (max-width: 768px) {
  .factory-qsystem .sub-common__top .desc {margin-bottom: 13rem;}
  .factory-qsystem .sub-common__top .desc::after {top:calc(100% + 2.8rem)}
}

/* 배경이미지 컨텐츠 */
.factory-qsystem .qsystem-bgcont {background: url('../images/sub/factory-qsystem-bgcont.jpg') no-repeat center / cover;padding: 4.3rem 4.6rem;
  font-size: 1.8rem;line-height: 1.5;color:#fff;}
.factory-qsystem .qsystem-bgcont .cont-inner {background: rgba(255,255,255,0.1);border:1px solid #ddd;padding:9rem 6rem 9.1rem;}
.factory-qsystem .qsystem-bgcont strong {font-weight: 600;}
.factory-qsystem .qsystem-bgcont p {font-weight: 500;}
.factory-qsystem .qsystem-bgcont ol + p {margin-top: 4rem;}
.factory-qsystem .qsystem-bgcont ol li {margin:1.5rem 0;}

@media (max-width: 1024px) {
  .factory-qsystem .qsystem-bgcont {padding:2rem;}
}

@media (max-width: 768px) {
  .factory-qsystem .qsystem-bgcont {line-height: 3rem;background-image: url('../images/sub/factory-qsystem-bgcont-m.jpg');}
  .factory-qsystem .qsystem-bgcont .cont-inner {padding:5rem 4rem}
  .factory-qsystem .qsystem-bgcont ol + p {margin-top: 4.5rem;}
  .factory-qsystem .qsystem-bgcont li {margin: 2rem 0;}
  .factory-qsystem .qsystem-bgcont li:first-child {margin-top: 0;}
  .factory-qsystem .qsystem-bgcont li:last-child {margin-bottom: 0;}
}

/* 슬라이드 */
.factory-qsystem .qsystem-slider {margin-top: 5.7rem;padding:9.4rem 0 24.7rem;position: relative;display: flex;gap:18rem;align-items: center;justify-content: space-between;
  overflow: hidden;background: #fff url('../images/sub/factory-qsystem-slidebg.png') no-repeat left bottom / auto 100%;}
.qsystem-slider .wrap-text {margin-left:var(--inner-padding);flex-shrink: 0;margin-top: -9rem;}
.qsystem-slider .wrap-text .title {font-size: 4.8rem;color:#222;font-weight: 800;}

.qsystem-slider .wrap-text .box-btn {--arrow-size:10.9rem; --arrow-spacing:1.3rem;margin-top: 4.5rem;display: flex;align-items: center;gap:3rem;margin-left: calc((var(--arrow-spacing) - 0.2rem) * -1);}
.qsystem-slider .slide-btn {position: relative; width:calc(var(--arrow-size) + var(--arrow-spacing));height:4.5rem;cursor: pointer;transition: 0.5s;z-index: 1;}
.qsystem-slider .slide-btn.prev {transform: rotate(180deg);}
.qsystem-slider .slide-btn::before {--size:4.5rem;content: '';position: absolute;top:calc(50% - calc(var(--size) / 2));
  left:30%;width: var(--size);height: var(--size);background: #e27910;border-radius: 100%;opacity: 0;z-index: -1;transition: 0.3s;}
.qsystem-slider .slide-btn:hover::before {opacity: 1;left:calc(100% - var(--size))}

.qsystem-slider .slide-btn::after {content: '';position: absolute;left:0;width:100%;height: 100%;background: url('../images/sub/slide-arrow-long.png') no-repeat left center / var(--arrow-size) auto;z-index: 0;}

.qsystem-slider .wrap-slide {overflow: hidden;flex: 1 auto;padding-bottom: 8rem;}
.qsystem-slider .swiper-slide {max-width: 60rem;max-height: 40rem;width: 70%;margin-right:8%; transition:transform 0.5s;transform: translateY(0);position: relative;}
.qsystem-slider .swiper-slide:not(.swiper-slide-active) {transform: translateY(8rem);}
.qsystem-slider .swiper-slide::before {content:'';position: absolute;width: 100%;height: 100%;background: #222;z-index: -1;right:0;bottom: 0;opacity: 0;
  transition: 0.3s ease-in-out 0.1s;}
.qsystem-slider .swiper-slide.swiper-slide-active::before {right:-1.8rem;bottom:-1.8rem;opacity: 1;}

@media (max-width: 1440px) {
  .factory-qsystem .qsystem-slider {gap:9%}
  .qsystem-slider .wrap-text {padding-left: 5rem;}
}

@media (max-width: 1024px) {
  .factory-qsystem .qsystem-slider {gap: 6rem;flex-wrap: wrap;padding-bottom: 14rem;background-size: auto 110%;background-position: left top;}
  .qsystem-slider .wrap-text {margin-top: 0;padding-left: 0;}
}

@media (max-width: 768px) {
  .qsystem-slider .wrap-text .title {font-size: 4rem;}
  .qsystem-slider .wrap-text .box-btn {margin-top: 2.5rem;}
  .qsystem-slider .swiper-slide {width: 80%;}
  .qsystem-slider .swiper-slide:not(.swiper-slide-active) {transform: translateY(5rem);}
  .qsystem-slider .swiper-slide.swiper-slide-active::before {right:-1.5rem;bottom:-1.5rem;}
}



/* 0402_품질시스템 : E */
/* ===================================================== */










/* ===================================================== */
/* 0501_환경경영 */
.esg .visual { background: url(../images/sub/0501_img01.jpg) 50% 50% no-repeat; padding: 12rem 3rem; text-align: center; color: #fff; margin-bottom: 10rem; }
.esg .visual h4 { font-size: 2.8rem; font-weight: 800; }
.esg .visual h5 { font-size: 4rem; font-weight: 700; margin-top: 1rem; }
.esg .goal p { font-size: 2.2rem; font-weight: 500; color: #222; text-align: center; margin-bottom: 7rem; }
.esg .goal p b { font-weight: 600; color: var(--color-main); }
.esg .goal ol > li { display: flex; margin-top: 3rem; height: 23rem; }
.esg .goal ol > li > .ico-box { background-color: #f3f6f9; width: 28rem; padding: 6rem 3rem; display: flex; justify-content: center; position: relative; }
.esg .goal ol > li > .ico-box:after { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: ""; background: url(../images/sub/0501_ico01.png) no-repeat; width: 120px; height: 120px; }
.esg .goal ol > li.item02 .ico-box:after { background: url(../images/sub/0501_ico02.png) no-repeat; }
.esg .goal ol > li.item03 .ico-box:after { background: url(../images/sub/0501_ico03.png) no-repeat; }
.esg .goal ol > li.item04 .ico-box:after { background: url(../images/sub/0501_ico04.png) no-repeat; }
.esg .goal ol > li.item05 .ico-box:after { background: url(../images/sub/0501_ico05.png) no-repeat; }
.esg .goal ol > li > .ico-box span { position: absolute; top: 0; left: 0; width: 4rem; height: 4rem; display: flex; justify-content: center; align-items: center; background-color: var(--color-main); color: #fff; }
.esg .goal ol > li > .desc { background-color: #f9f9f9; width: 100%; padding: 0 3rem 0 7rem; display: flex; align-items: center; line-height: 1.5;}
.esg .goal ol > li > .desc h6 { font-size: 2.4rem; font-weight: 600; color: #222; }
.esg .goal ol > li > .desc ul { margin-top: 2rem; }
.esg .goal ol > li > .desc ul li { font-size: 1.8rem; font-weight: 400; color: #666; margin-top: 1rem; }

@media (max-width: 1024px){
.esg .goal ol > li > .ico-box:after,
.esg .goal ol > li.item02 .ico-box:after,
.esg .goal ol > li.item03 .ico-box:after,
.esg .goal ol > li.item04 .ico-box:after,
.esg .goal ol > li.item05 .ico-box:after { width: 100px; height: 100px; background-size: contain; }
.esg .goal ol > li > .ico-box span { width: 3rem; height: 3rem; font-size: 1.4rem; }
 }
@media (max-width: 768px){
.esg .goal ol > li { height: auto; }
.esg .goal ol > li > .ico-box:after,
.esg .goal ol > li.item02 .ico-box:after,
.esg .goal ol > li.item03 .ico-box:after,
.esg .goal ol > li.item04 .ico-box:after,
.esg .goal ol > li.item05 .ico-box:after { width: 80px; height: 80px; }
.esg .goal ol > li > .desc { padding: 5rem; }
 }
@media (max-width: 576px){
.esg .goal ol > li > .ico-box { width: 0; padding: 0; }
.esg .goal ol > li > .ico-box:after { display: none; }
 }
/* 0501_환경경영 */
/* ===================================================== */










/* ===================================================== */
/* 0502_사회공헌 */
.esg02 .visual { background: url(../images/sub/0502_visual.jpg) 50% 50% no-repeat; }
.esg02 .goal ol > li.item01 .ico-box:after { background: url(../images/sub/0502_ico01.png) no-repeat; }
.esg02 .goal ol > li.item02 .ico-box:after { background: url(../images/sub/0502_ico02.png) no-repeat; }
.esg02 .goal ol > li.item03 .ico-box:after { background: url(../images/sub/0502_ico03.png) no-repeat; }
.esg02 .goal ol > li.item04 .ico-box:after { background: url(../images/sub/0502_ico04.png) no-repeat; }

@media (max-width:1024px) {.esg02 .goal ol > li.item01 .ico-box:after,
.esg02 .goal ol > li.item02 .ico-box:after,
.esg02 .goal ol > li.item03 .ico-box:after,
.esg02 .goal ol > li.item04 .ico-box:after { width: 100px; height: 100px; background-size: contain; }
 }
@media (max-width:768px) {.esg02 .goal ol > li.item01 .ico-box:after,
.esg02 .goal ol > li.item02 .ico-box:after,
.esg02 .goal ol > li.item03 .ico-box:after,
.esg02 .goal ol > li.item04 .ico-box:after { width: 80px; height: 80px; }
 }
/* 0502_사회공헌 */
/* ===================================================== */










/* ===================================================== */
/* 0503_윤리경영 */
.esg03 .visual { background: url(../images/sub/0503_visual.jpg) 50% 50% no-repeat; }
.esg03 .goal ol > li.item01 .ico-box:after { background: url(../images/sub/0503_ico01.png) no-repeat; }
.esg03 .goal ol > li.item02 .ico-box:after { background: url(../images/sub/0503_ico02.png) no-repeat; }
.esg03 .goal ol > li.item03 .ico-box:after { background: url(../images/sub/0503_ico03.png) no-repeat; }
.esg03 .goal ol > li.item04 .ico-box:after { background: url(../images/sub/0503_ico04.png) no-repeat; }

@media (max-width:1024px) {.esg03 .goal ol > li.item01 .ico-box:after,
.esg03 .goal ol > li.item02 .ico-box:after,
.esg03 .goal ol > li.item03 .ico-box:after,
.esg03 .goal ol > li.item04 .ico-box:after { width: 100px; height: 100px; background-size: contain; }
 }
@media (max-width:768px) {.esg03 .goal ol > li.item01 .ico-box:after,
.esg03 .goal ol > li.item02 .ico-box:after,
.esg03 .goal ol > li.item03 .ico-box:after,
.esg03 .goal ol > li.item04 .ico-box:after { width: 80px; height: 80px; }
 }
/* 0503_윤리경영 */
/* ===================================================== */










/* ===================================================== */
/* 0504_ 안전보건 */
.esg04 .visual { background: url(../images/sub/0504_visual.jpg) 50% 50% no-repeat; }
.esg04 .goal ol > li.item01 .ico-box:after { background: url(../images/sub/0504_ico01.png) no-repeat; }
.esg04 .goal ol > li.item02 .ico-box:after { background: url(../images/sub/0504_ico02.png) no-repeat; }
.esg04 .goal ol > li.item03 .ico-box:after { background: url(../images/sub/0504_ico03.png) no-repeat; }
.esg04 .goal ol > li.item04 .ico-box:after { background: url(../images/sub/0504_ico04.png) no-repeat; }
.esg04 .goal ol > li.item05 .ico-box:after { background: url(../images/sub/0504_ico05.png) no-repeat; }

@media (max-width:1024px) {.esg04 .goal ol > li.item01 .ico-box:after,
.esg04 .goal ol > li.item02 .ico-box:after,
.esg04 .goal ol > li.item03 .ico-box:after,
.esg04 .goal ol > li.item04 .ico-box:after { width: 100px; height: 100px; background-size: contain; }
 }
@media (max-width:768px) {.esg04 .goal ol > li.item01 .ico-box:after,
.esg04 .goal ol > li.item02 .ico-box:after,
.esg04 .goal ol > li.item03 .ico-box:after,
.esg04 .goal ol > li.item04 .ico-box:after { width: 80px; height: 80px; }
 }
/* 0504_ 안전보건 */
/* ===================================================== */










/* ===================================================== */
/* 0604_재무정보 */
.finance > span {text-align: right; display: block;}
.financial-table { width: 100%; border-collapse: collapse; text-align: center; font-size: 1.8rem; margin-top: 1rem;}
.financial-table th,
.financial-table td { border: 1px solid #ddd; padding: 25px; }
.financial-table td { color: #666; font-weight: 500; }
.financial-table thead th { background-color: #333; color: #fff; font-weight: 600; border-bottom: none; }
.financial-table tbody th { background-color: #f6f6f6; font-weight: 600; color: #222; }

@media (max-width: 768px){
.finance { overflow-x: auto; }
.finance > span {text-align: left;}
.financial-table { min-width: 768px; }
 }
/* 0604_재무정보 */
/* ===================================================== */