@charset "utf-8";
/* Info
 ========================================================================== */
/**
 * 1. Writer: Ajin Lee. (Weaverloft Corp.)
 * 2. Production Date: 2025-04
 * 3. Client: COWAY Co.,Ltd
 */

/*========== [환경경영] Management ==========*/
.management-sec .common-table.company-iso-table td img {max-width: 157px; margin: 0 auto;}
.management-sec .common-table.employees-result-table td {height: 82px;}
.management-sec .content-txt-visual.mg-activity .txt-visual-cont.image {width: 12em;margin-left: 1.63em;}
.management-sec .ev-mg .list-icon-style.progress {gap: 12px;}
.management-sec .ev-mg .list-icon-style.progress > li.icon-step {padding: 2.25em 20px 20px 1.50em;}
.management-sec .ev-mg .list-icon-style.progress > li.icon-step .list-dl {min-height: 132px;padding: 0 0 3.92em;background-size: 64px auto;}
.management-sec .ev-mg .list-icon-style.progress > li.icon-step.step01 .list-dl {background-image: url('../images/sub/governance/jeongdo/jeongdo-progress-icon-02.svg');}
.management-sec .ev-mg .list-icon-style.progress > li.icon-step.step02 .list-dl {background-image: url('../images/sub/environmental/management/management-progress-icon-01.svg');}
.management-sec .ev-mg .list-icon-style.progress > li.icon-step.step03 .list-dl {background-image: url('../images/sub/environmental/management/management-progress-icon-02.svg');}
.management-sec .ev-mg .list-icon-style.progress > li.icon-step.step04 .list-dl {background-image: url('../images/sub/social/safety/safety-progress-icon-07.svg');}
.management-sec .ev-mg .list-icon-style.progress > li.icon-step.step05 .list-dl {background-image: url('../images/sub/environmental/management/management-progress-icon-03.svg');}
.management-sec .ev-mg .list-icon-style.progress > li.icon-step .list-dt {font-size: 1.38rem;}
.management-sec .visual-img-wrap.diagram.img-desc .img-desc-cont .schematic-box.line + .number-list {margin: 20px 0 0;}
.management-sec .visual-img-wrap.vision-ver .list-style > li.indent {margin: 2px 0 0;}
.management-sec .visual-img-wrap.vision-ver .list-style > li.dash + li.circle {margin: 6px 0 0;}
.management-sec .visual-img-wrap.diagram.img-desc .ratio208-1 {width: 31.25em;}
.management-sec .mission-vision-cont.list-box .list-box-wrap .mv-cont-text {align-items: flex-start;}
@media (max-width: 1520px) {
    .management-sec .ev-mg .list-icon-style.progress > li.icon-step .list-dt {font-size: clamp(1.250rem, 1.45vw,1.38rem);}
}
@media (max-width: 1280px) {
    .management-sec .common-table.company-iso-table thead tr th:nth-child(2).w25p {width: 225px;}
    .management-sec .common-table.employees-result-table td {height: 73px;}
}
@media (max-width: 1024px) {
    .management-sec .content-txt-visual.mg-activity .txt-visual-cont.image {width: 335px;margin-left: 0;}
    .management-sec .ev-mg .list-icon-style.progress {flex-wrap: wrap;}
    .management-sec .ev-mg .list-icon-style.progress > li:nth-child(1) {width: calc(100% / 2 - 6px);}
    .management-sec .ev-mg .list-icon-style.progress > li:nth-child(2) {width: calc(100% / 2 - 6px);}
    .management-sec .ev-mg .list-icon-style.progress > li:nth-child(2)::after {display: none;}
    .management-sec .ev-mg .list-icon-style.progress > li:nth-child(3) {width: calc(100% / 3 - 8px);}
    .management-sec .ev-mg .list-icon-style.progress > li:nth-child(4) {width: calc(100% / 3 - 8px);}
    .management-sec .ev-mg .list-icon-style.progress > li:nth-child(5) {width: calc(100% / 3 - 8px);}
}
@media (max-width: 768px) {
    .management-sec .common-table.company-iso-table thead tr th:nth-child(2).w25p {width: 210px;}
    .management-sec .ev-mg .list-icon-style.progress {gap: 16px;}
    .management-sec .ev-mg .list-icon-style.progress > li.icon-step {padding: 1.71em 20px 30px 30px;}
    .management-sec .ev-mg .list-icon-style.progress > li:nth-child(1) {width: 100%;}
    .management-sec .ev-mg .list-icon-style.progress > li:nth-child(2) {width: 100%;}
    .management-sec .ev-mg .list-icon-style.progress > li:nth-child(2)::after {display: block;}
    .management-sec .ev-mg .list-icon-style.progress > li:nth-child(3) {width: 100%;}
    .management-sec .ev-mg .list-icon-style.progress > li:nth-child(4) {width: 100%;}
    .management-sec .ev-mg .list-icon-style.progress > li:nth-child(5) {width: 100%;}
    .management-sec .ev-mg .list-icon-style.progress > li.icon-step .list-dl {min-height: auto;padding: 0 0 3em;background-size: 58px auto;}
    .management-sec .ev-mg .list-icon-style.progress > li.icon-step:nth-child(2) .list-dl {padding: 0 0 15px;}
    .management-sec .ev-mg .list-icon-style.progress > li.icon-step:not(:nth-child(2)) .list-dt br {display: none;}
    .management-sec .visual-img-wrap.diagram.img-desc .img-desc-cont .schematic-box.line + .number-list {margin: 1.43em 0 0;}
}

/*========== [기후변화 대응] Climate ==========*/
.climate-sec .visual-img-wrap.diagram.pd-30 {padding: 30px;}

.climate-sec .content-visual-climate { padding: 20px; border-radius:10px; background-color: #F8F8F8;}
.climate-sec .content-visual.col2.climate {gap: 10px; margin: 0;}

.climate-sec .content-visual.col2.climate .content-visual-climate {padding: 0;}
.climate-sec .content-visual.col2.climate .visual-img-wrap.jpg.col2 {display: flex;gap: 10px;}
.climate-sec .content-visual.col2.climate .content-visual-list {width: 66.4%;}
.climate-sec .content-visual.col2.climate .content-visual-list.single {width: 32.5%; min-width: 365px;}
.climate-sec .content-visual.col2.climate .visual-img-wrap.jpg figure { border-radius:0; gap: 10px;}
.climate-sec .content-visual.col2.climate .visual-img-wrap.jpg figure img { border-radius:0;}
.climate-sec .content-visual.col2.climate .content-visual-list .visual-title {text-align: center;}
.climate-sec .content-visual-climate .sub-list {margin: 28px 0 0;}
@media screen and (max-width: 1024px) {
    .climate-sec .scroll-x-sec .content-visual.col2.climate .visual-img-wrap {min-width: auto;}
    .climate-sec .content-visual.col2.climate {flex-direction: row;}
    .climate-sec .scroll-x-sec .content-visual-climate.w1160 {min-width: 1024px;}
}


/*========== [자원순환 및 폐기물] Circulation ==========*/
.circulation-sec .scroll-x-sec .visual-img-wrap.w1160 .w-1036 {margin: 0; margin-left: auto;}

/*========== [제품 책임] Responsibility ==========*/
.respon-slide-area .swiper-wrapper { display: flex; align-items: center; justify-content: space-between; gap: 1.88em; font-size: var(--h-basic-text); } 
.respon-slide-area .swiper-slide { overflow: hidden; position: relative; flex: 1; max-width: 18.75em; height: 21.88em; border-radius: 10px; background: #fff; font-size: var(--h-basic-text); cursor: pointer; transition: all 400ms ease-in-out; will-change: max-width, background-color, background-image; } 
.respon-slide-area .swiper-slide.on { max-width: 500px; background: linear-gradient(45deg, #53CBFF 0%, #4AB2F5 50%, #349DF7 100%); will-change: max-width, background-color, background-image; } 
.respon-slide-area .swiper-pagination { display: none; justify-content: center; bottom: 0;left: 0; width: 100%; margin-top: 16px; } 
.respon-slide-area .swiper-pagination-bullet { opacity: 1; width: 6px; height: 6px; margin: 0 3px; border-radius: 50%; background-color: #BFE4F7; transition: all 400ms; } 
.respon-slide-area .swiper-pagination-bullet-active { width: 16px; background-color: var(--main-color); border-radius: 3px;} 
.respon-slide-area .swiper-slide .slide-inner { position: relative; width: 100%; height: 100%; } 
.respon-slide-area .swiper-slide .slide-inner::after { content: ''; position: absolute; right: 20px; background-repeat: no-repeat; background-position: bottom right; background-size: contain; transform: translate(4%, 0); transition: transform 400ms ease-in-out; will-change: transform, background-image; backface-visibility: hidden; transform-style: preserve-3d; } 
.respon-slide-area .swiper-slide.respon01 .slide-inner::after { bottom: -4.75em; width: 8.31em; aspect-ratio: 133 / 290; background-image: url("../images/sub/environmental/responsibility/respon-slide-img01.svg"); } 
.respon-slide-area .swiper-slide.respon02 .slide-inner::after { bottom: -10em; width: 8.15em; aspect-ratio: 140 / 414; background-image: url("../images/sub/environmental/responsibility/respon-slide-img02.svg"); } 
.respon-slide-area .swiper-slide.respon03 .slide-inner::after { bottom: -2.13em; width: 13.44em; aspect-ratio: 215 / 248; background-image: url("../images/sub/environmental/responsibility/respon-slide-img03.svg"); } 
.respon-slide-area .swiper-slide.respon01.on .slide-inner::after { background-image: url("../images/sub/environmental/responsibility/respon-slide-img01-active.svg"); } 
.respon-slide-area .swiper-slide.respon02.on .slide-inner::after { background-image: url("../images/sub/environmental/responsibility/respon-slide-img02-active.svg"); } 
.respon-slide-area .swiper-slide.respon03.on .slide-inner::after { background-image: url("../images/sub/environmental/responsibility/respon-slide-img03-active.svg"); } 
.respon-slide-area .swiper-slide .slide-inner .slide-cont { position: relative; z-index: 10; width: 100%; height: 100%; padding: 2.50em 1.25em 2.50em 2.13em; border: 2px solid #BFE4F7; border-radius: 10px; font-size: var(--h-basic-text); will-change: border-color; } 
.respon-slide-area .swiper-slide.on .slide-inner .slide-cont { border: 2px solid transparent; } 
.respon-slide-area .swiper-slide .badge { margin: 0 0 15px; padding: 0.32em 0.75em; background-color: #E5F3FA; border-color: #E5F3FA; border-radius: 16px; font-size: var(--text18-16); color: var(--main-color); font-weight: 600; font-variation-settings: 'wght' 600; } 
.respon-slide-area .swiper-slide.on .badge { background-color: #fff; border-color: #fff; } 
.respon-slide-area .swiper-slide .slide-tit { font-size: 1.88rem; font-weight: 700; font-variation-settings: 'wght' 700; color: var(--text-dark-color); } 
.respon-slide-area .swiper-slide.on .slide-tit { color: #fff; } 
.respon-slide-area .swiper-slide .slide-txt { opacity: 0; display: inline-block; position: relative; width: auto; margin: 4.38em 0 0; padding: 20px 0 0; font-size: var(--text18-16); color: var(--main-color); font-weight: 600; font-variation-settings: 'wght' 600; color: #fff; transform: translateX(10%); will-change: opacity, transform; } 
.respon-slide-area .swiper-slide.on .slide-txt { opacity: 1; transition: all 400ms; transform: translateX(0); transition-delay: 30ms; } 
.respon-slide-area .swiper-slide .slide-txt::before { content: ''; position: absolute; top: 0; left: 0; width: 26px; height: 2px; background-color: #fff; } 
.respon-slide-area .swiper-slide .swiper-notification { display: none; } 
.respon-slide-area.resizing .swiper-wrapper,
.respon-slide-area.resizing .swiper-slide { transition: none !important; } 
.responsibility-sec .visual-img-wrap.code .diagram-box {padding-bottom: 15px;}
.responsibility-sec .visual-img-wrap.code .diagram-box dd {height: auto;min-height: auto;}
.responsibility-sec .visual-img-wrap.code .diagram-box dd .list-style {align-items: flex-start;}
@media (max-width: 1520px){
    .respon-slide-area .swiper-slide { max-width: 260px; } 
    .respon-slide-area .swiper-slide.on { max-width: 540px; } 
    .respon-slide-area .swiper-slide .slide-tit { font-size: clamp(22px, 1.97vw, 1.88rem); } 
}
@media (max-width: 1280px){
    .respon-slide-area .swiper-slide { max-width: clamp(240px, 23.44vw, 300px); height: clamp(300px, 27.34vw, 350px); } 
    .respon-slide-area .swiper-slide.on { max-width: 42.19vw; } 
}
@media (max-width: 1024px){
    .respon-slide-area { margin: 40px clamp(20px, 3.933vw, 72px) 0; padding: 0 0 24px; } 
    .respon-slide-area .swiper-wrapper { gap: clamp(12px,2.34vw,24px); } 
    .respon-slide-area::-webkit-scrollbar { display: none; } 
    .respon-slide-area .swiper-pagination { display: flex; } 
    .respon-slide-area .swiper-slide .slide-txt { transform: translateX(0); } 
    .respon-slide-area .swiper-slide.on .slide-txt { transform: translateX(0); transition-delay: 0; } 
}
@media (max-width: 980px){
    .respon-slide-area .swiper-slide.on { max-width: 37.55vw; } 
    .respon-slide-area .swiper-slide .slide-inner .slide-cont { padding: 30px 15px 30px 25px; } 
    .respon-slide-area .swiper-slide .slide-inner::after { right: 28px; } 
    .respon-slide-area .swiper-slide.respon01 .slide-inner::after { bottom: -1.25em; width: 5.86em; aspect-ratio: 81 / 189; } 
    .respon-slide-area .swiper-slide.respon02 .slide-inner::after { bottom: -5.85em; width: 6.16em; aspect-ratio: 86 / 272; } 
    .respon-slide-area .swiper-slide.respon03 .slide-inner::after { bottom: 0.57em; width: 9.35em; aspect-ratio: 130 / 160; } 
    .respon-slide-area .swiper-slide.on .slide-inner::after { background-image: none; } 
    .respon-slide-area .swiper-slide.respon01.on .slide-inner::after { background-image: none; } 
    .respon-slide-area .swiper-slide.respon02.on .slide-inner::after { background-image: none; } 
    .respon-slide-area .swiper-slide.respon03.on .slide-inner::after { background-image: none; } 
}
@media (max-width: 890px){
    .respon-slide-area { position: relative; overflow-x: auto; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; scrollbar-width: none; -ms-overflow-style: none; will-change: scroll-position; margin: 40px 0 0; padding: 0 clamp(20px, 3.933vw, 72px) 24px; } 
    .respon-slide-area .slide-wrap {width: 100%;}
    .respon-slide-swiper { overflow: visible; position: static; } 
    .respon-slide-swiper .swiper-wrapper { justify-content: center; gap: 0; width: fit-content; padding: 0 20px 0 10px; margin-left: -5px; } 
    .respon-slide-swiper .swiper-wrapper:has(.swiper-slide.respon03.on) { margin-left: 15px; } 
    .respon-slide-area .swiper-slide { flex: initial; max-width: none; width: 240px; height: 260px; margin-left: -5px; transform: scale(0.834, 0.833); transform-origin: center; } 
    .respon-slide-area .swiper-slide.on { opacity: 1; flex: initial; max-width: none; transform: scale(1); background: linear-gradient(45deg, #53CBFF 0%, #45B6FC 50%, #36A0F8 100%); } 
    .respon-slide-area:has(.swiper-slide.respon01.on) .swiper-slide.respon03 { margin-left: -20px; } 
    .respon-slide-area:has(.swiper-slide.respon03.on) .swiper-slide.respon01 { margin-right: -20px; } 
    .respon-slide-area .swiper-slide.on .slide-txt { margin: 42px 0 0; padding: 20px 0 0; word-break: keep-all; } 
    .respon-slide-area .swiper-slide.on .slide-txt br { display: none; } 
    .respon-slide-area .swiper-slide .badge { margin-bottom: 10px; } 
}
.responsibility-sec .visual-img-wrap.code:has(.diagram-box) { width: 1160px; } 
.responsibility-sec .respon-index .index-step-list.index-list01 .list-dl { background-image: url('../images/sub/environmental/responsibility/respon-index-icon-01.svg'); } 
.responsibility-sec .respon-index .index-step-list.index-list02 .list-dl { background-image: url('../images/sub/environmental/responsibility/respon-index-icon-02.svg'); } 
.responsibility-sec .respon-index .index-step-list.index-list03 .list-dl { background-image: url('../images/sub/environmental/responsibility/respon-index-icon-03.svg'); } 
.responsibility-sec .visual-img-wrap.code .diagram-box dd {align-items: flex-start;}

/*========== [환경영향 관리] Impact ==========*/
.impact-sec .visual-img-wrap.code.pb6040 .mv-cont-list.title {min-width: 62px;font-size: 1rem; font-weight: 600; font-variation-settings: 'wght' 600;color: #8AA7B4;}
.impact-sec .visual-img-wrap.code.pb6040 .schematic-wrap .mv-cont-list.title {align-self: center;}
.impact-sec .visual-img-wrap.code.pb6040 .schematic-wrap {display: flex;gap: 20px;}
.impact-sec .visual-img-wrap.code.pb6040 .schematic-box-title { width: calc(100% / 3 - 10px);padding: 0.78em; border-radius:100px;}
.impact-sec .visual-img-wrap.code.pb6040 .diagram-box-wrap {display: flex;gap: 20px;}
.impact-sec .visual-img-wrap.code.pb6040 .diagram-box-list {display: flex; gap: 10px; width: calc(100% / 3 - 10px);}
.impact-sec .visual-img-wrap.code.pb6040 .diagram-box-list .diagram-box {width: calc(100% / 2 - 5px);}
.impact-sec .visual-img-wrap.code.pb6040 .diagram-box-list .diagram-box dt {padding: 15px 5px;}
.impact-sec .visual-img-wrap.code.pb6040 .diagram-box-list .diagram-box dd {align-items: flex-start; height: auto; margin: 10px 0 0; font-size: 1rem; font-weight: 400; font-variation-settings: 'wght' 400;color: var(--text-dark-color); text-align: left; word-break: keep-all; line-height: 1.5;}
