@charset "utf-8";
/* *******************************************************
 * filename : content.css
 * description : 서브페이지 컨텐츠 CSS
 * date : 2025-09-08
******************************************************** */


/* ****************** 공통 ********************** */
/* 서브 인트로 */
.cm-top-intro{position: relative; inset:0; display: flex; align-items:center; justify-content:center; margin-top: -15rem; margin-bottom: 10vh; height:80vh;/*  z-index:9; */ background:#0e1014; transition:var(--transition-custom2); overflow:hidden; opacity: 0;}
.cm-top-intro .intro-circle-box{position: absolute; width:46rem; height:46rem; margin:auto;}
.cm-top-intro .intro-scroll-down{position: absolute; bottom:2rem; left:50%; transform:translateX(-50%); height:40px; overflow:hidden; opacity: 0; transition: var(--transition-custom); transition-delay: 1.5s;}
.cm-top-intro .intro-scroll-down span{position: relative; display: block; width:7px; height:7px; border-radius:50%; background:var(--main-color); animation:subIntroUpDown 1.5s linear infinite;}
.cm-top-intro .intro-scroll-down span:before{position:absolute; content:''; top:-150%; left:0; right:0; height:200%; background: linear-gradient(to bottom, rgba(243,111,33,0) 0%,rgba(243,111,33,0.5) 90%,rgba(243,111,33,1) 100%);}
@keyframes subIntroUpDown{
	from { transform:translateY(-14px);}
	to { transform:translateY(calc(100% + 40px));}
}

.cm-top-intro.animated {opacity: 1;}
.cm-top-intro.animated .intro-scroll-down {opacity: 1;}

.cm-top-intro .intro-txt-box{position: relative; z-index:1; text-align:center;}
.cm-top-intro .intro-txt-box .intro-tit{font-size:6rem; line-height:1.5; letter-spacing:-0.04em; color:#fff; font-weight:700; transition:color 1s ease-in-out; opacity:0; transform:translateY(100%);}
.cm-top-intro .intro-txt-box .intro-txt{font-size:2.4rem; line-height:1.5; letter-spacing:-0.04em; color:rgba(255,255,255,0.4); transition:color 1s ease-in-out; transform:translateY(100px); opacity:0; margin-top:2rem;}
.cm-top-intro .intro-txt-box .intro-tit .effect{color:#fff; font-weight:700;}

@keyframes text-active-animation {
	0% {
		opacity:0;filter:Alpha(opacity=0);
		transform:translateY(100px);
	}
	100% {
		opacity:1.0;filter:Alpha(opacity=100);
		transform:translateY(0px);
	}
}
/* 서브 인트로 :: active */
.animated.cm-top-intro .intro-txt-box .intro-tit{animation: text-active-animation 1.5s 0.4s cubic-bezier(0.4, 0, 0.2, 1) both; transition-delay: 2s;}
.animated.cm-top-intro .intro-txt-box .intro-txt{transform:translateY(0); opacity:1; animation: text-active-animation 1.5s 0.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
.cm-top-intro.animated .intro-txt-box .intro-tit{color:rgba(255,255,255,0.2);}
/* 서브 인트로 :: end */
/* .intro-end.cm-top-intro{transform:translateY(-100vh); height:0;} */

@media all and (max-width:1280px){
	.cm-top-intro {margin-top: -10rem}
	.cm-top-intro .intro-txt-box .intro-tit{font-size:4.5rem;}
}
/* @media all and (max-width:800px){
	.cm-top-intro{position: relative; height: calc(100vw - (2 * var(--area-padding))) !important; margin: 0 calc(-1 * var(--area-padding)) 10rem !important; transform: translateY(0) !important;}
	.cm-top-intro .intro-circle-box{width:calc(100vw - (2 * var(--area-padding))); height:calc(100vw - (2 * var(--area-padding))) !important;}
	.cm-top-intro .intro-circle-box .cm-circle {}
	.cm-top-intro .intro-txt-box{padding:0 var(--area-padding); box-sizing:border-box;}
	.cm-top-intro .intro-txt-box .intro-tit{font-size:3.2rem;}
	.cm-top-intro .intro-scroll-down {bottom: 12rem;}
} */
@media all and (max-width:800px){
	.cm-top-intro{display: flex; flex-direction: column-reverse; position: relative; height: calc(100vw - (2 * var(--area-padding))) !important; margin: 0 0 10rem !important; transform: translateY(0) !important; overflow: visible;}
	.cm-top-intro .intro-circle-box{display: flex; justify-content: center; position: static; width:calc(100vw - (2 * var(--area-padding))); height: auto; margin: 0}
	.cm-top-intro .intro-circle-box .cm-circle {}
	.cm-top-intro .intro-scroll-down {position: static; transform: translateX(0);}
	.cm-top-intro .intro-txt-box{padding:0 var(--area-padding); box-sizing:border-box;}
	.cm-top-intro .intro-txt-box .intro-tit{font-size:3.2rem;}
	.cm-top-intro .intro-scroll-down {bottom: 12rem;}
}
@media all and (max-width:480px){
	.cm-top-intro .intro-scroll-down {bottom: 2rem;}
}

/* ****************** 사업소개 ********************** */
/* 사업소개 :: 산업별 화스너 제품 */
/* 상단 */
.business-prd-top-box{}

.business-prd-top-con{display: flex; justify-content:space-between; align-items:center; margin-bottom:8rem;}
/* 상단 :: 좌우 항목 */
.business-prd-top-con .side-box{position: relative; width:30rem; height:30rem; border-radius:50%; opacity:0; transition:var(--transition-custom2); transition-delay:0.5s}
.business-prd-top-con .side-box .cm-circle{z-index:2}
.business-prd-top-con .side-box .arrow{position: absolute; top:50%; transform:translateY(-50%); width:4rem; height:4rem; display: flex; align-items:center; justify-content:center; font-size:2rem; color:#fff; background:var(--main-color); border-radius:50%; z-index:1;}
.business-prd-top-con .side-box .arrow:before{position: absolute; content:''; width:120%; height:100%; top:0; }
.business-prd-top-con .side-box .icon{position: relative; display: flex; align-items:center; justify-content:center; width:100%; height:100%; z-index:3}
/* 상단 :: 좌우 항목 :: 좌 */
.business-prd-top-con .side-box.left{transform:translateX(-50px);}
.business-prd-top-con .side-box.left .arrow:before{right:50%; background: linear-gradient(to right, rgba(243,111,33,0) 0%,rgba(243,111,33,0.2) 90%,rgba(243,111,33,1) 100%);}
@keyframes businessPrdArrowLeft{
	from { right:2px;}
	to { right:-300px;}
}
/* 상단 :: 좌우 항목 :: 우 */
.business-prd-top-con .side-box.right{transform:translateX(50px);}
.business-prd-top-con .side-box.right .arrow:before{left:50%; background: linear-gradient(to right, rgba(243,111,33,1) 0%,rgba(243,111,33,0.2) 10%,rgba(243,111,33,0) 100%);}
@keyframes businessPrdArrowRight{
	from { left:2px;}
	to { left:-300px;}
}

/* 상단 :: 가운데 항목 */
.business-prd-top-con .center-box{position: relative; width:40rem; height:40rem; border-radius:50%; border:3rem solid rgba(255,255,255,0.05); box-sizing:border-box; display: flex; align-items:center; justify-content:center; background:#0e1014; z-index:3; opacity:0; transition:var(--transition-custom2);}
.business-prd-top-con .center-box .inner-box{position: relative; width:32rem; height:32rem; border-radius:50%; border:2px solid var(--main-color); box-sizing:border-box; display: flex; align-items:center; justify-content:center;}

/* animated */
.animated.business-prd-top-con .side-box{opacity:1; transform:translateX(0) !important;}

.animated.business-prd-top-con .side-box.right .arrow{left:2px; animation:businessPrdArrowRight 2s 1s linear infinite;}
.animated.business-prd-top-con .side-box.left .arrow{right:2px; animation:businessPrdArrowLeft 2s 1s linear infinite;}
.animated.business-prd-top-con .center-box{opacity:1;}


/* 하단 */
/* .business-prd-bottom-box{margin-top:22rem;} */
.business-prd-bottom-box .cm-sub-tit-box{margin-bottom:10rem;}

/* 하단 :: 컨텐츠(gsap) */
.business-prd-list{position: relative; }
.business-prd-item{position: relative; width:100%; height:66rem;}
.business-prd-item .business-prd-inner{position: relative; width:100%; height:66rem;}
.business-prd-list .business-prd-item {position: sticky; top: calc(((100vh - 66rem + var(--sub-menu-height) + 20px)/2));left: 0;width: 100%;height: 66rem;transform-origin: top;}
.business-prd-item + .business-prd-item{margin-top: 30rem;}
.business-prd-item .img-box { position: absolute;top: 0;  left: 0; width: 100%; height: 66rem;  border-radius: 1rem; opacity: 1; display: block; overflow: hidden;}
.business-prd-item .img-box::before {position: absolute; content: ""; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3); z-index: 1;}
.business-prd-item .img-box span {display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; transform: scale(1.12); transition:transform 0.8s ease-in-out; }
.business-prd-item.active-item .img-box span {transform:  scale(1.0);}
.business-prd-item .txt-box {position: absolute; bottom:8rem; left: 8rem; width: calc(100% - 16rem); text-align: left; box-sizing: border-box; opacity: 0; z-index: 2; display: flex; align-items:center; justify-content:space-between;}
.business-prd-item .txt-box .tit {font-size: 1.6rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.4;}
.business-prd-item .txt-box .tit-en {font-size: 6rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.2; padding-top: 2rem;}
.business-prd-item .txt-box .cm-btn{margin:0; backdrop-filter: blur(5px);}

@media (min-width:1281px) and (max-width:1380px){
	.business-prd-top-con,
	.business-prd-bottom-box{padding: 0 var(--area-padding); box-sizing: border-box;}
}
@media all and (max-width:1280px){
	.business-prd-top-con .side-box{width:20rem; height:20rem;}
	.business-prd-top-con .side-box .cm-circle {top: 0; left: 0; width: auto; height: auto; margin-left: 0;}
	.business-prd-top-con .side-box .icon img{max-width:20%;}

	.business-prd-top-con .center-box{width:30rem; height:30rem; border-width:2rem;}
	.business-prd-top-con .center-box .inner-box{width:24rem; height:24rem; text-align:center;}
	.business-prd-top-con .center-box .inner-box img{max-width:60%; margin:auto;}


	.business-prd-item{height:50rem;}
	.business-prd-item .business-prd-inner{height:50rem;}
	.business-prd-list .business-prd-item {top: calc(((100vh - 50rem + var(--sub-menu-height) + 20px)/2)); height:50rem;}
	.business-prd-item + .business-prd-item{margin-top: 25rem;}
	.business-prd-item .img-box {height:50rem;}
	.business-prd-item .txt-box{bottom:4rem; left:4rem;}
	/* .business-prd-item .txt-box .tit {font-size: 2rem;} */
	.business-prd-item .txt-box .tit-en {font-size: 4rem; padding-top: 1rem;}
}
@media all and (max-width:800px){
	.business-prd-top-con{flex-direction: column; margin-bottom:4rem;}
	.business-prd-top-con .center-box{margin:10rem 0;}
	.business-prd-top-con .side-box .arrow{width:3rem; height:3rem; font-size:1.6rem; right: auto !important; left: 50% !important; transform: translateX(-50%) rotate(90deg);}
	.business-prd-top-con .side-box.left .arrow{}
	@keyframes businessPrdArrowLeft{
		from { top:calc(100% - 3rem);}
		to { top:calc(100% + 20rem);}
	}
	@keyframes businessPrdArrowRight{
		from { top:3rem;}
		to { top:-20rem;}
	}

	/* .business-prd-bottom-box{margin-top:15rem;} */
	.business-prd-bottom-box .cm-sub-tit-box{margin-bottom:7rem;}
	.business-prd-item{height:calc(60vw - var(--area-padding));}
	.business-prd-item .business-prd-inner{height:calc(60vw - var(--area-padding));}
	.business-prd-list .business-prd-item {height:calc(60vw - var(--area-padding));}
	.business-prd-list .business-prd-item:last-child{display: none;}
	.business-prd-item + .business-prd-item{margin-top: 3rem;}
	.business-prd-item .img-box{height: calc(60vw - var(--area-padding));}
	.business-prd-item .img-box span img{max-width:100%; height:100%; object-fit:cover;}

	.business-prd-item .txt-box{opacity:1; left:var(--area-padding); bottom:2rem; width: calc(100% - var(--area-padding) * 2);}
	.business-prd-item .txt-box .cm-btn {width: 15rem; height: 5rem; padding: 0 2rem;}
	.business-prd-item .txt-box .inner {width: calc(100% - 17rem); margin-right: 2rem;}
	.business-prd-item .txt-box .tit-en{font-size:3rem;}
}
@media all and (max-width:480px){
	.business-prd-top-con .side-box{width:10rem; height:10rem;}
	.business-prd-top-con .side-box .icon img{max-width:25%;}

	.business-prd-top-con .center-box{width:20rem; height:20rem; margin:5rem 0;}
	.business-prd-top-con .center-box .inner-box{width:14rem; height:14rem;}
	.business-prd-top-con .center-box .inner-box img{max-width:50%;}
	.business-prd-item .txt-box .tit-en {font-size: 2.6rem;}
}

/***** 251113 수정 *****/
.product-page {padding-bottom: 24rem;}
.product-page .cm-fixed-tab-container-JS {display: flex; align-items: stretch; max-width: 1840px; margin: 0 auto;}
.product-page .sub-tab-content-style {width: calc(100% - 26rem); margin: 0; padding: 0;}
.product-page .sub-tab-con {margin-bottom: 14.5rem;}
.product-page .sub-tab-con:last-child {margin-bottom: 0;}


.custom-style01 .sub-tab-list-style {position: sticky !important; top: calc(var(--header-height) + 3rem) !important; background-color: #1a1c20; border-radius: 1rem;}

@media all and (min-width: 801px) {
	.custom-style01 {width: 20.5rem; margin-right: 5.5rem; height: auto; margin-bottom: 0;}
	.custom-style01 .sub-tab-list-style:before {display: none;}
	.custom-style01 .sub-tab-list-style ul {display: flex; flex-direction: column; width: 20.5rem; margin-right: 5.5rem;}
	.custom-style01 .sub-tab-list-style ul li {width: 100%; background-color: transparent; border: none; border-radius: 0.6rem; transition: background-color 0.3s;}
	.custom-style01 .sub-tab-list-style ul li a {min-height: 5.6rem; height: auto;}
	.custom-style01 .sub-tab-list-style ul li a em {text-align: left; padding: 1.12rem 2.5rem; font-size: 1.7rem; font-weight: 600; letter-spacing: -0.04em; line-height: 1.4; color: rgba(255, 255, 255, 0.6); transition: color 0.3s; box-sizing: border-box;}
	.custom-style01 .sub-tab-list-style ul li.selected {background-color: var(--main-color);}
	.custom-style01 .sub-tab-list-style ul li.selected a em {color: #fff;}

	.custom-style01 .sub-tab-list-style.top-fixed {left: var(--area-padding); height: auto;}
}


.prd-industry-wrap .tit-inner {display: flex; align-items: flex-end; justify-content: space-between; padding-bottom: 1.5rem; margin-bottom: 3rem; border-bottom: 1px solid rgba(255, 255, 255, 0.25);}
.prd-industry-wrap .industry-wrap-st {font-size: 1.8rem; font-weight: 700; letter-spacing: -0.04em; line-height: 1.4; color: var(--main-color);}
.prd-industry-wrap .industry-wrap-tit {font-size: 6.2rem; font-weight: 700; letter-spacing: -0.01em; line-height: 1.4; color: #fff;}
.prd-industry-wrap .cm-btn {width: 22rem; margin: 0 0 1.5rem 0;}
.prd-industry-wrap .prd-industry-txt {font-size: 1.8rem; font-weight: 400; letter-spacing: -0.04em; line-height: 1.66; color: #fff;}
.prd-industry-wrap .img-box {position: relative; width: 100%; height: 0; margin-top: 4.5rem; padding-top: 50rem;/* padding-top: 37.879%; */ background-color: #fff; border-radius: 1rem;}
.prd-industry-wrap .img-box img {position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; max-width: 100%; max-height: 100%; padding: 4rem 2rem; box-sizing: border-box;}

@media all and (max-width: 1280px) {
	.product-page .cm-fixed-tab-container-JS {max-width: none; padding: 0 var(--area-padding);}
}

@media all and (max-width: 800px) {
	.custom-style01 .sub-tab-list-style ul li a em br {display: none;}

	.product-page {padding-bottom: 12rem;}
	.product-page .cm-fixed-tab-container-JS {display: block;}
	.product-page .sub-tab-content-style {width: 100%; margin-top: 5rem;}
	.custom-style01 {margin-bottom: 0;}
	.custom-style01 {position: sticky; top: var(--header-height); z-index: 10; margin-bottom: 0;}

	.product-page .sub-tab-con {margin-bottom: 7rem;}
	.prd-industry-wrap .industry-wrap-tit {font-size: 4rem;}
	.prd-industry-wrap .tit-inner {display: block;}
	.prd-industry-wrap .tit-inner .box {width: 100%; margin-bottom: 2rem;}
	.prd-industry-wrap .img-box {padding-top: 35rem;}
}

@media all and (max-width: 480px) {
	.prd-industry-wrap .img-box {padding-top: 25rem;}
}

/* 사업소개 :: SJF Project */
.project-page .quality-img-list{margin-top:6rem;}
.project-page .quality-img-list .list-item:nth-child(1){transform: translateY(3rem);}
.project-page .quality-img-list .list-item:nth-child(2){transform: translateY(-3rem);}
.project-page .quality-img-list .list-item:nth-child(3){transform: translateY(3rem);}

.project-page .animated .quality-img-list .list-item:nth-child(1){transform: translateY(-3rem);}
.project-page .animated .quality-img-list .list-item:nth-child(2){transform: translateY(3rem);}
.project-page .animated .quality-img-list .list-item:nth-child(3){transform: translateY(-3rem);}

.project-list-wrap{margin-top:14rem;}
.project-list{display: flex; flex-wrap:wrap; margin:-1rem; margin-top:2.5rem;}
.project-list .list-item{display: flex; flex-direction: column; align-items: center; justify-content: center; width:calc(25% - 2rem); min-height: 18.1rem; margin:1rem; background:rgba(255,255,255,0.05); border-radius:1rem; text-align:center; padding:4.2rem 1rem; box-sizing:border-box; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.project-list .list-item:nth-child(1){transition-delay:0.2s;}
.project-list .list-item:nth-child(2){transition-delay:0.3s;}
.project-list .list-item:nth-child(3){transition-delay:0.4s;}
.project-list .list-item:nth-child(4){transition-delay:0.5s;}
.project-list .list-item:nth-child(5){transition-delay:0.6s;}
.project-list .list-item:nth-child(6){transition-delay:0.7s;}
.project-list .list-item:nth-child(7){transition-delay:0.8s;}
.project-list .list-item:nth-child(8){transition-delay:0.9s;}
.project-list .list-item .num{font-size:1.6rem; line-height:1.5; letter-spacing:-0.04em; color:var(--main-color); font-weight:700;}
.project-list .list-item .txt{font-size:2rem; line-height:1.65; letter-spacing:-0.04em; color:#fff; font-weight:600; margin-top:0.7rem;}
.project-list .list-item .txt .plus-txt{display: block; font-size:1.5rem; font-weight: 400; color:rgba(255,255,255,0.75); margin-top: 0.5rem;}

/* animated */
.animated .project-list .list-item{opacity:1; transform:translateY(0);}

@media all and (max-width:800px){
	.project-page .quality-img-list {margin-top: 3rem;}
	.project-list .list-item{width:calc(50% - 2rem);}
}
@media all and (max-width:480px){
	.project-list .list-item{width:calc(100% - 2rem);}
}

/* 사업소개 :: 핵심역량 */
.core-content {padding-bottom: 16rem;}
.core-list-con:first-child {margin-bottom: 15rem;}
.core-list-con .cm-tit {text-align: center;}
.core-list-con .core-list {margin-top: 3rem; border-top: 1px solid #fff; border-bottom: 1px solid rgba(255, 255, 255, 0.5);}
.core-list-con .core-list .list-item {display: flex; align-items: center; padding: 3rem; box-sizing: border-box;}
.core-list-con .core-list .list-item:first-child {border-bottom: 1px solid rgba(255, 255, 255, 0.1);}
.core-list-con .core-list .list-item .icon-box {display: flex; align-items: center; justify-content: center; width: 18rem; height: 18rem; border-radius: 1rem; padding: 3rem; background-color: rgba(255, 255, 255, 0.05); box-sizing: border-box;}
.core-list-con .core-list .list-item .icon-box img {max-width: 100%;}
.core-list-con .core-list .list-item .txt-box {width: calc(100% - 22rem); margin-left: 4rem;}
.core-list-con .core-list .list-item .core-list-item-tit {margin-bottom: 1.5rem; font-size: 2.8rem; font-weight: 600; letter-spacing: -0.04em; line-height: 1.6em; color: #fff;}
.core-list-con .core-list .list-item .core-list-item-txt {position: relative; display: flex; font-size: 1.8rem; font-weight: 400; letter-spacing: -0.04em; line-height: 1.83em; color: rgba(255, 255, 255, 0.4);}
.core-list-con .core-list .list-item .core-list-item-txt.flex {display: flex; flex-wrap: wrap; gap: 1.5rem 3rem;}
.core-list-con .core-list .list-item .core-list-item-txt span {position: relative; padding-left: 2.2rem;}
.core-list-con .core-list .list-item .core-list-item-txt span::before {position: absolute; content: "\e929"; left: 0; font-family: "xeicon"; font-size: 1.8rem; color: rgba(255, 255, 255, 0.4);}

.core-content.cm-intro-next {opacity: 0; transform: translate3d(0, 30px, 0); transition: var(--transition-custom2);}
.core-content.cm-intro-next.intro-end {opacity: 1; transform: translate3d(0, 0, 0);}
    
@media all and (max-width: 800px) {
	.core-content {padding-bottom: 8rem;}
	.core-list-con:first-child {margin-bottom: 7rem;}
	.core-list-con .core-list .list-item {padding: 2rem;}
	.core-list-con .core-list .list-item .icon-box {width: 12rem; height: 12rem;}
	.core-list-con .core-list .list-item .txt-box {width: calc(100% - 14rem); margin-left: 2rem;}
	.core-list-con .core-list .list-item .core-list-item-tit {font-size: 2.2rem;}
	.core-list-con .core-list .list-item .core-list-item-txt.flex {gap: 1rem 2rem;}
	.core-list-con .core-list .list-item .core-list-item-txt {line-height: 1.4em;}
}

@media all and (max-width: 480px) {
	.core-list-con .core-list .list-item .icon-box{width: 9rem; height: 9rem; padding: 2.5rem;}
	.core-list-con .core-list .list-item .txt-box {width: calc(100% - 11rem);}
}

/* ****************** 품질 경영 ********************** */
/* 품질경영 :: 품질경영 */
/* 이미지 리스트 */
.quality-img-list{display: flex; align-items:center; justify-content:center; margin:0rem -3rem 0;}
.quality-img-list .list-item{position: relative; width:calc(33.33% - 6rem); margin:3rem; overflow:hidden; transition:var(--transition-custom2); opacity:0;}
.quality-img-list .list-item .bg{}
.quality-img-list .list-item .bg img{width:100%; border-radius:1rem;}
.quality-img-list .list-item .txt{position: absolute; bottom:3.5rem; left:0; right:0; text-align:center; font-size:2.4rem; line-height:1.375; letter-spacing:-0.04em; color:#fff; font-weight:700;}
.quality-img-list .list-item .txt-box{text-align:center; margin-top:5rem;}
.quality-img-list .list-item .txt-box .item-tit{font-size:3.2rem; line-height:1.1; letter-spacing:-0.04em; color:#fff; font-weight:700;}
.quality-img-list .list-item .txt-box .item-txt{font-size:1.8rem; line-height:1.83; letter-spacing:-0.04em; color:rgba(255,255,255,0.7); margin-top:1.5rem;}

.quality-img-list .list-item:nth-child(1){transform:translateY(5rem);}
.quality-img-list .list-item:nth-child(2){transform:translateY(6rem);}
.quality-img-list .list-item:nth-child(3){transform:translateY(-1rem);}

/* animated */
.animated .quality-img-list .list-item{opacity:1;}
/* 인트로 이후 active */
/* .cm-intro-next{min-height:100vh;} */
.quality-img-list.animated .list-item {opacity:1;}
.project-img-wrap.animated .quality-img-list .list-item{opacity:1;}

.quality-img-list.animated .list-item:nth-child(1){transform:translateY(0rem);}
.quality-img-list.animated .list-item:nth-child(2){transform:translateY(11rem);}
.quality-img-list.animated .list-item:nth-child(3){transform:translateY(-6rem);}
/* .project-img-wrap.animated .quality-img-list .list-item:nth-child(1){transform:translateY(0rem);}
.project-img-wrap.animated .quality-img-list .list-item:nth-child(2){transform:translateY(11rem);}
.project-img-wrap.animated .quality-img-list .list-item:nth-child(3){transform:translateY(-6rem);} */


/* 품질경영 :: 인증서 배경 */
.quality-certi-con{position: relative; margin:37rem auto 0; text-align:center;}
.quality-certi-con .bg{position: relative;}
.quality-certi-con .bg span:before{position: absolute; content:''; width:100%; height:100%; inset:0; margin:auto; background:#0e1014; transition:all 1.5s ease-in-out;}
.quality-certi-con .bg span img{max-width:100%;}
.quality-certi-con .cm-sub-tit-box{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); z-index:9; width:100%;}

/* animated */
.animated.quality-certi-con .bg span:before{background: radial-gradient(ellipse at center,  rgba(14,16,20,0.88) 0%,rgba(14,16,20,0.98) 40%,rgba(14,16,20,0.98) 100%);}

/* 품질경영 :: 이념 */
.quality-philosophy-con{margin-top:24rem;}
.quality-philosophy-item{position: relative; margin:14rem auto 30rem; text-align:center;}
.quality-philosophy-item .img-box{position: relative; z-index:9; transition:var(--transition-custom2); opacity:0; transform:translateY(50px); max-width:471px; margin:auto;}
.quality-philosophy-item .img-box img{width:100%;}
.quality-philosophy-item .icon-list{}
.quality-philosophy-item .icon-list .list-item{position: absolute; top:50%; left:50%; transform:translate(-50%, calc(-50% + 50px)); border:2px solid rgba(255,255,255,0.3); background:#0e1014; box-sizing:border-box; border-radius:50%; width:22rem; height:22rem; display: flex; align-items:center; justify-content:center; flex-direction: column; transition:var(--transition-custom2); opacity:0;}
.quality-philosophy-item .icon-list .list-item:before{position: absolute; content:''; width:100%; height:100%; border-radius:50%; border: 2.2rem solid rgba(255, 255, 255, 0.025);}
.quality-philosophy-item .icon-list .list-item .dots{position: absolute; top:50%; width:9px; height:9px; border-radius:50%; background:#fff; transition:var(--transition-custom2); opacity:0;}
.quality-philosophy-item .icon-list .list-item .dots:before{position: absolute; content:''; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:100%; border-radius:50%; border: 5px solid rgba(255, 255, 255, 0.1);}
.quality-philosophy-item .icon-list .list-item .dots .line{position: absolute; top:50%; height:1px; background:rgba(255,255,255,0.3); transition:0.2s width linear; width:0;}
.quality-philosophy-item .icon-list .list-item .txt{font-size:2rem; line-height:1.65; letter-spacing:-0.04em; color:#fff; font-weight:700; margin-top:1rem;}

/* animated */
.animated.quality-philosophy-item .img-box{opacity:1; transform:translateY(0);}
.animated.quality-philosophy-item .icon-list .list-item{opacity:1; transform:translate(-50%, -50%);}
.animated.quality-philosophy-item .icon-list .dots{opacity:1;}


@media all and (min-width:801px){
	/* 첫번째 */
	.quality-philosophy-item .icon-list .list-item:nth-child(1){margin-left:-44rem; margin-top:1rem; transition-delay:0.4s;}
	.quality-philosophy-item .icon-list .list-item:nth-child(1) .dots{right:0; transform:translate(50%, -50%); transition-delay:0.6s;}
	.quality-philosophy-item .icon-list .list-item:nth-child(1) .dots .line1{left:100%; /* width:14.4rem; */ transform:translateY(-50%); transition-delay:0.8s;}
	.quality-philosophy-item .icon-list .list-item:nth-child(1) .dots .line2{left:calc(100% + 9.4rem); /* width:7.4rem; */ transform:translateY(-50%) rotate(-57deg); transform-origin: left; transition-delay:1s;}
	/* 두번째 */
	.quality-philosophy-item .icon-list .list-item:nth-child(2){margin-left:37rem; margin-top:-8rem; transition-delay:0.6s;}
	.quality-philosophy-item .icon-list .list-item:nth-child(2) .dots{left:0; transform:translate(-50%, -50%); transition-delay:0.8s;}
	.quality-philosophy-item .icon-list .list-item:nth-child(2) .dots .line1{right:100%; /* width:19.4rem; */ transform:translateY(-50%); transition-delay:1s;}
	.quality-philosophy-item .icon-list .list-item:nth-child(2) .dots .line2{right:calc(100% + 19.4rem); /* width:5.6rem; */ transform:translateY(-50%) rotate(-40deg); transform-origin: right; transition-delay:1.2s;}
	/* 세번째 */
	.quality-philosophy-item .icon-list .list-item:nth-child(3){margin-left:-16rem; margin-top:23rem; transition-delay:0.8s;}
	.quality-philosophy-item .icon-list .list-item:nth-child(3) .dots{right:0; transform:translate(50%, -50%); transition-delay:1s;}
	.quality-philosophy-item .icon-list .list-item:nth-child(3) .dots .line1{left:100%; /* width:6rem; */ transform:translateY(-50%); transition-delay:1.2s;}
	.quality-philosophy-item .icon-list .list-item:nth-child(3) .dots .line2{left:calc(100% + 6rem); /* width:13rem; */ transform:translateY(-50%) rotate(-67deg); transform-origin: left; transition-delay:1.4s;}

	.animated.quality-philosophy-item .icon-list .list-item:nth-child(1) .dots .line1{width:9.4rem;}
	.animated.quality-philosophy-item .icon-list .list-item:nth-child(1) .dots .line2{width:7.4rem;}
	.animated.quality-philosophy-item .icon-list .list-item:nth-child(2) .dots .line1{width:19.4rem;}
	.animated.quality-philosophy-item .icon-list .list-item:nth-child(2) .dots .line2{width:5.6rem;}
	.animated.quality-philosophy-item .icon-list .list-item:nth-child(3) .dots .line1{width:6rem;}
	.animated.quality-philosophy-item .icon-list .list-item:nth-child(3) .dots .line2{width:13rem;}
}
@media all and (min-width:1281px){
	.quality-philosophy-item .icon-list .list-item:nth-child(1){margin-left:-51rem;}
	.animated.quality-philosophy-item .icon-list .list-item:nth-child(1) .dots .line1{width:14.4rem;}
	.quality-philosophy-item .icon-list .list-item:nth-child(1) .dots .line2{left:calc(100% + 14.4rem);}

	.quality-philosophy-item .icon-list .list-item:nth-child(2){margin-left:39rem;}

	.quality-philosophy-item .icon-list .list-item:nth-child(3){margin-top:25rem;}
}
@media all and (max-width:1280px){
	.quality-philosophy-item .icon-list .list-item{width:18rem; height:18rem;}
}
@media all and (max-width:800px){
	/* 이미지 리스트 */
	.quality-img-list{margin:0rem -1rem 0;}
	.quality-img-list .list-item{width:calc(33.33% - 1rem); margin:0 1rem;}
	.quality-img-list .list-item .txt{bottom:2rem; font-size:1.8rem;}

	.quality-img-list .list-item:nth-child(1){transform:translateY(2rem);}
	.quality-img-list .list-item:nth-child(2){transform:translateY(3rem);}
	.quality-img-list .list-item:nth-child(3){transform:translateY(-1rem);}

	/* 인트로 이후 active */
	.cm-intro-next.intro-end.quality-img-list .list-item{opacity:1;}
	.cm-intro-next.intro-end.quality-img-list .list-item:nth-child(1){transform:translateY(0rem);}
	.cm-intro-next.intro-end.quality-img-list .list-item:nth-child(2){transform:translateY(5rem);}
	.cm-intro-next.intro-end.quality-img-list .list-item:nth-child(3){transform:translateY(-3rem);}


	.quality-certi-con{margin-top:6rem;}
	.quality-certi-con .bg span{width:137rem; display: block; position: relative; left: 50%; transform: translateX(-50%);}

	.quality-philosophy-con{margin-top:0rem;}
	.quality-philosophy-item{display: flex; flex-direction: column-reverse; margin:5rem auto 8rem auto;}
	.quality-philosophy-item .img-box img{max-width:70%; margin:auto;}
	.quality-philosophy-item .icon-list{display: flex; flex-wrap: wrap; justify-content:center; margin:3rem 0 8rem 0; gap: 3rem 6rem;}
	.quality-philosophy-item .icon-list .list-item{position: relative; transform:none !important; inset:auto !important; width:calc(50vw - 7rem); height:calc(50vw - 7rem);}
	.quality-philosophy-item .icon-list .list-item .dots{display: none;}
}
/* @media all and (max-width:640px){
	.quality-philosophy-item .icon-list .list-item{width:calc(33.33vw - 5rem); height:calc(33.33vw - 5rem);}
} */
@media all and (max-width:480px){
	.quality-img-list{flex-direction: column; margin: 0;}
	.quality-img-list .list-item{transform:none !important; margin:2rem auto; width: 100%;}

	.quality-certi-con {margin-top: 0;}
	.quality-certi-con .bg span{width:80rem; }

	.quality-philosophy-con{margin-top:4rem;}
	.quality-philosophy-item .icon-list .list-item .icon img {max-width: 88%;}
	.quality-philosophy-item .icon-list .list-item .txt {font-size: 1.6rem;}
	/* .quality-philosophy-item .icon-list{flex-direction:column;} */
	/* .quality-philosophy-item .icon-list .list-item{width:50vw; height:50vw; margin:3rem auto;} */
}


/* 품질경영 :: 인증현황 */
.certi-list{display: flex; flex-wrap:wrap; margin:8rem -1.5rem -4rem;}
.certi-list .list-item{margin:4rem 1.5rem; width:calc(20% - 3rem);}
.certi-list .list-item .img-box{}
.certi-list .list-item .img-box span{display: block; position: relative; width:100%; height:0; padding-top:141.66%; border-radius:1rem; overflow:hidden;}
.certi-list .list-item .img-box span img{position: absolute; inset:0; margin:auto; max-width:100%; max-height:100%; border-radius:1rem;}
.certi-list .list-item .txt{font-size:1.8rem; line-height:1.5; letter-spacing:-0.04em; color:#fff; font-weight:700; text-align:center; margin-top:2.5rem;}

@media all and (max-width:800px){
	.certi-list{margin:2rem -1rem -4rem;}
	.certi-list .list-item{margin:3rem 1rem; width:calc(25% - 2rem);}
}
@media all and (max-width:640px){
	.certi-list .list-item{width:calc(50% - 2rem);}
}

/* 품질경영 :: 생산공정 */
.process-list-con {padding-bottom: 16rem; }
.process-list-con .process-list-tit-box {margin-bottom: 7.5rem; text-align: center;}
.process-list-con .process-list-tit-box .process-list-tit02 {margin-top: 1rem;}
.process-list-con .process-list-tit02 {font-size: 1.8rem; font-weight: 400; letter-spacing: -0.04em; line-height: 1.5; color: rgba(255, 255, 255, 0.4);}
.process-list {display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 6rem 4rem;}
.process-list .list-item {position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem 2rem 4rem 2rem; background-color: rgba(255, 255, 255 ,0.05); border-radius: 1rem; box-sizing: border-box; transition: var(--transition-custom2); opacity: 0;}

.process-list-con .process-list .list-item:nth-child(2) {transition-delay: 0.2s; transform: translate3d(-30px, 0, 0);}
.process-list-con .process-list .list-item:nth-child(3) {transition-delay: 0.4s; transform: translate3d(-30px, 0, 0);}
.process-list-con .process-list .list-item:nth-child(4) {transition-delay: 0.6s; transform: translate3d(-30px, 0, 0);}
.process-list-con .process-list .list-item:nth-child(8) {transition-delay: 0.8s; transform: translate3d(0, -30px, 0);}
.process-list-con .process-list .list-item:nth-child(7) {transition-delay: 1s; transform: translate3d(30px, 0, 0);}
.process-list-con .process-list .list-item:nth-child(6) {transition-delay: 1.2s; transform: translate3d(30px, 0, 0);}
.process-list-con .process-list .list-item:nth-child(5) {transition-delay: 1.4s; transform: translate3d(30px, 0, 0);}

.process-list-con.animated .process-list .list-item {opacity: 1; transform: translate3d(0, 0, 0) !important;}

.process-list .list-item:nth-child(4)::before {top: auto; bottom: -3.95rem; right: 50%; transform: translateX(50%); background: center / cover no-repeat url("/images/content/process_list_arrow03.png");}
.process-list .list-item:nth-child(8)::before {display: none;}
.process-list .list-item:nth-child(5)::before, .process-list .list-item:nth-child(6)::before, .process-list .list-item:nth-child(7)::before {background: center / cover no-repeat url("/images/content/process_list_arrow04.png");}

.process-list .list-item::before {position: absolute; top: 50%; right: -3rem; content: ""; width: 2rem; height: 1.9rem; transform: translateY(-50%); background: center / cover no-repeat url("/images/content/process_list_arrow02.png");}
.process-list .list-item.orange-color::before {background: center / cover no-repeat url("/images/content/process_list_arrow01.png");}
.process-list .list-item.orange-color {background-color: #f36f21;}

/* .process-list-con.cm-intro-next {opacity: 0; transform: translate3d(0, 30px, 0); transition: var(--transition-custom2);}
.process-list-con.cm-intro-next.intro-end {opacity: 1; transform: translate3d(0, 0, 0);} */

.process-list .list-item .icon {margin-bottom: 3rem;}
.process-list .list-item .process-list-logo {margin-bottom: 2rem;}
.process-list .list-item .process-list-radius-txt {display: flex; align-items: center; justify-content: center; width: 20rem; height: 4rem; border-radius: 2rem; background-color: #fff; font-size: 1.8rem; font-weight: 700; letter-spacing: -0.04em; line-height: 1.4; color: #f36f21;}
.process-list .list-item .img-box {width: 100%; height: 100%; margin-bottom: 3.5rem;}
.process-list .list-item img {width: 100%; height: 100%; border-radius: 1rem;}
.process-list .list-item .txt-box {text-align: center;}
.process-list .list-item .process-list-step {margin-bottom: 1rem; font-size: 1.6rem; font-weight: 700; letter-spacing: -0.04em; line-height: 1.4; color: #fff;}
.process-list .list-item .process-list-tit {margin-bottom: 1.2rem; font-size: 2.6rem; font-weight: 700; letter-spacing: -0.04em; line-height: 1.26; color: #fff;}
.process-list .list-item .process-list-txt {font-size: 1.6rem; font-weight: 400; letter-spacing: -0.04em; line-height: 1.4; color: rgba(255, 255, 255, 0.5);}

@media (min-width: 481px) and (max-width: 800px) {
	.process-list {display: flex; flex-wrap: wrap;}
	.process-list-con .process-list-tit-box {margin-bottom: 4rem;}
	.process-list-con .process-list .list-item {width: calc(50% - 2rem);}

	.process-list-con .process-list .list-item:nth-child(1) {order: 1; transform: translate3d(-30px, 0, 0);}
	.process-list-con .process-list .list-item:nth-child(2) {order: 2;}
	.process-list-con .process-list .list-item:nth-child(3) {order: 4; transform: translate3d(0, -30px, 0);}
	.process-list-con .process-list .list-item:nth-child(4) {order: 3; transform: translate3d(30px, 0, 0);}
	.process-list-con .process-list .list-item:nth-child(5) {order: 7;}
	.process-list-con .process-list .list-item:nth-child(6) {order: 8; transform: translate3d(0, -30px, 0);}
	.process-list-con .process-list .list-item:nth-child(7) {order: 6; transform: translate3d(-30px, 0, 0);}
	.process-list-con .process-list .list-item:nth-child(8) {order: 5;}

	.process-list-con .process-list .list-item:nth-child(2)::before, .process-list-con .process-list .list-item:nth-child(4)::before, .process-list-con .process-list .list-item:nth-child(7)::before {top: auto; bottom: -3.95rem; right: 50%; transform: translateX(50%); background: center / cover no-repeat url("/images/content/process_list_arrow03.png");}
	.process-list-con .process-list .list-item:nth-child(3)::before, .process-list-con .process-list .list-item:nth-child(6)::before {top: 50%; bottom: auto; left: -3rem; right: auto; transform: translateY(-50%); background: center / cover no-repeat url("/images/content/process_list_arrow04.png");}
	.process-list-con .process-list .list-item:nth-child(5)::before {display: none;}
	.process-list-con .process-list .list-item:nth-child(8)::before {display: block; top: 50%; right: -3rem; content: ""; transform: translateY(-50%); background: center / cover no-repeat url("/images/content/process_list_arrow02.png");}
}

@media all and (max-width: 480px) {
	.process-list {grid-template-columns: repeat(1, 1fr);}
	.process-list-con.intro-end .process-list .list-item, .process-list-con .process-list .list-item {transform: translate3d(0, -30px, 0) !important;}

	.process-list-con .process-list .list-item:nth-child(1) {order: 1;}
	.process-list-con .process-list .list-item:nth-child(2) {order: 2;}
	.process-list-con .process-list .list-item:nth-child(3) {order: 3;}
	.process-list-con .process-list .list-item:nth-child(4) {order: 4;}
	.process-list-con .process-list .list-item:nth-child(5) {order: 8;}
	.process-list-con .process-list .list-item:nth-child(6) {order: 7;}
	.process-list-con .process-list .list-item:nth-child(7) {order: 6;}
	.process-list-con .process-list .list-item:nth-child(8) {order: 5;}

	.process-list-con .process-list .list-item::before {display: block !important; top: auto !important; bottom: -3.95rem !important; left: auto !important; right: 50% !important; transform: translateX(50%) !important; background: center / cover no-repeat url("/images/content/process_list_arrow03.png") !important;}
	.process-list-con .process-list .list-item:nth-child(5)::before {display: none !important;}
}

/* 품질경영 :: 검사 및 실험장비 */
.equipment-list{border-top:1px solid #fff; opacity:0; transition:var(--transition-custom2);}
.equipment-item{display: flex; align-items:center; padding:4rem 2rem; box-sizing:border-box; border-bottom:1px solid rgba(255,255,255,0.1); opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.equipment-item .img-box{position: relative; width:31.25%; background:rgba(255,255,255,0.05); border-radius:1rem; overflow:hidden;}
.equipment-item .img-box span{display: block; position: relative; width:100%; height:0; padding-top:100%; border-radius:1.1rem; overflow:hidden;}
.equipment-item .img-box span img{position: absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.equipment-item .img-box .change-box{position: absolute; inset:0; background:rgba(0,0,0,0.8); display: flex; align-items:center; justify-content:center; font-size:2rem; line-height:1.65; letter-spacing:-0.04em; color:#fff; font-weight:700;}
.equipment-item .txt-box{width:68.75%; padding-left:6rem; box-sizing:border-box;}
.equipment-item .txt-box .sub-tit{display: block; font-size:1.6rem; line-height:1.5; letter-spacing:-0.04em; color:var(--main-color); font-weight:700; margin-bottom:2rem;}
.equipment-item .txt-box .tit{font-size:4rem; line-height:1.2; letter-spacing:-0.04em; color:#fff; font-weight:700; margin-bottom:4.5rem;}
.equipment-item .txt-box .info{display: flex; margin-bottom:1.2rem;}
.equipment-item .txt-box .info dt{position: relative; width:22rem; font-size:2rem; line-height:1.65; letter-spacing:-0.04em; color:#fff; font-weight:700; padding-left:1.5rem;}
.equipment-item .txt-box .info dt:before{position: absolute; content:''; width:5px; height:5px; border-radius:50%; background:#fff; left:0; top:1.6rem;}
.equipment-item .txt-box .info dd{width:calc(100% - 22rem); font-size:1.8rem; line-height:1.83; letter-spacing:-0.04em; color:rgba(255,255,255,0.5);}
.equipment-item .txt-box .info dd span{display: inline-block;}

/* animated */
.equipment-list{;opacity:1}
.equipment-item.animated{opacity:1; transform:translateY(0);}

@media all and (max-width:800px){
	.equipment-item{display: block; padding:3rem 0;}
	.equipment-item .img-box{width:100%; max-width:480px; margin:auto;}
	.equipment-item .txt-box{width:100%; padding-left:0; margin-top:3rem;}
	.equipment-item .txt-box .sub-tit{margin-bottom:1rem;}
	.equipment-item .txt-box .tit{font-size:3rem; margin-bottom:2rem;}
	.equipment-item .txt-box .info{margin-bottom:0.6rem;}
	.equipment-item .txt-box .info dt{font-size:1.8rem; width:20rem; padding-left:1rem;}
	.equipment-item .txt-box .info dt:before{width:4px; height:4px; top:1.4rem;}
	.equipment-item .txt-box .info dd{font-size:1.6rem; width:calc(100% - 20rem);}
}
@media all and (max-width:480px){
	.equipment-item .txt-box .info{display: block;}
	.equipment-item .txt-box .info dt{width:100%;}
	.equipment-item .txt-box .info dd{width:100%; padding-left:1rem;}
}


/* ****************** ESG ********************** */
/* ESG :: ESG */
/* 이미지 리스트 */
.esg-top-con{}
.esg-top-con .cm-sub-tit-box{margin-top:8.5rem;}
.esg-top-con .cm-sub-tit-box .cm-txt{color:rgba(255,255,255,0.4);}
.esg-img-list{display: flex; align-items:center; justify-content:center; margin:0rem -3rem 0;}
.esg-img-list .list-item{position: relative; width:calc(33.33% - 6rem); margin:3rem; border-radius:1rem; overflow:hidden; transition:var(--transition-custom2); opacity:0;}
.esg-img-list .list-item .bg{}
.esg-img-list .list-item .bg img{width:100%;}
.esg-img-list + .cm-sub-tit-box .cm-txt{transform:translateY(50px); opacity:0; transition:var(--transition-custom2); transition-delay:0.1s;}

.esg-down-btn-box {display: flex; justify-content: center; gap: 0 2rem; margin-top: 6rem; transform:translateY(50px); opacity: 0; transition: var(--transition-custom2); transition-delay: 0.2s;}
.esg-down-btn-box .cm-fill-btn {width: 24rem; margin: 0;}
.esg-top-con.animated .esg-down-btn-box {transform: translateY(0); opacity: 1;}

/* .esg-img-list .list-item:nth-child(1){transform:translateY(-4.5rem);}
.esg-img-list .list-item:nth-child(2){transform:translateY(4.5rem);}
.esg-img-list .list-item:nth-child(3){transform:translateY(-4.5rem);} */

/* 하단 리스트 */
.esg-list{border-top:1px solid #fff; margin-top:14rem;}
.esg-list .list-item{display: flex; align-items:center; border-bottom:1px solid rgba(255,255,255,0.1);}
.esg-list .list-item .icon-box{display: flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; width:22rem; padding:3rem; min-height:24rem; box-sizing:border-box;}
.esg-list .list-item .icon-box .icon-txt{font-size:1.8rem; line-height:1.83; letter-spacing:-0.04em; color:var(--main-color); margin-top:2rem;}
.esg-list .list-item .txt-box{padding:3rem; padding-left:0; box-sizing:border-box;}
.esg-list .list-item .txt-box .tit{font-size:4rem; line-height:1.2; letter-spacing:-0.04em; color:#fff; font-weight:700;}
.esg-list .list-item .txt-box .txt{font-size:1.8rem; line-height:1.5; letter-spacing:-0.04em; color:rgba(255,255,255,0.4); margin-top:1.5rem;}


/* 인트로 이후 active */
.esg-top-con.animated .esg-img-list .list-item{opacity:1;}
.esg-top-con.animated .esg-img-list .list-item:nth-child(1){transform:translateY(-4.5rem);}
.esg-top-con.animated .esg-img-list .list-item:nth-child(2){transform:translateY(4.5rem);}
.esg-top-con.animated .esg-img-list .list-item:nth-child(3){transform:translateY(-4.5rem);}
.esg-top-con.animated .esg-img-list + .cm-sub-tit-box .cm-txt{transform:translateY(0); opacity:1;}

@media all and (max-width:800px){
	/* 이미지 리스트 */
	.esg-top-con .cm-sub-tit-box{margin-top:4rem;}
	.esg-img-list{margin: 0;}
	.esg-img-list .list-item{width:calc(33.33% - 1rem); margin:0 1rem;}
	.esg-img-list .list-item .txt{bottom:2rem; font-size:1.8rem;}

	.esg-down-btn-box {flex-wrap: wrap; gap: 2rem;}
	.esg-down-btn-box .cm-fill-btn {width: calc(50% - 1rem);}

	/* 인트로 이후 active */
	.cm-intro-next.intro-end .esg-img-list .list-item{opacity:1;}
	.cm-intro-next.intro-end .esg-img-list .list-item:nth-child(1){transform:translateY(-2rem);}
	.cm-intro-next.intro-end .esg-img-list .list-item:nth-child(2){transform:translateY(2rem);}
	.cm-intro-next.intro-end .esg-img-list .list-item:nth-child(3){transform:translateY(-2rem);}

	.esg-list {margin-top: 7rem;}
	.esg-list .list-item{flex-direction: column;}
	.esg-list .list-item .icon-box{min-height:auto; padding:0; padding-top:3rem; width:100%; align-items: center;}
	.esg-list .list-item .icon-box .icon-txt{margin-top:0.3rem;}
	.esg-list .list-item .txt-box{text-align: center; padding-top:1rem; padding-right: 0;}
}
@media all and (max-width:480px){
	.esg-img-list{flex-direction: column;}
	.esg-img-list .list-item{transform:none !important; margin:2rem auto; width:100%;}

	.esg-down-btn-box {flex-wrap: wrap; gap: 2rem 0;}
	.esg-down-btn-box .cm-fill-btn {width: 100%;}
}



/* ****************** 제품소개 ********************** */
/* 리스트 페이지 */
.prd-list-wrap{display: flex; flex-wrap:wrap; margin:9rem -2rem 0;}
.prd-list-wrap .prd-item{width:calc(25% - 4rem); margin:2rem;}
.prd-list-wrap .prd-item a{display: block; border-radius:1rem; background:Rgba(255,255,255,0.03); padding:1.5rem 0; height: 100%; box-sizing: border-box;}
.prd-list-wrap .prd-item .img-box{position: relative; padding: 3rem; box-sizing: border-box;}
.prd-list-wrap .prd-item .img-box span{display: block; position: relative; width:100%; height:0; padding-top:100%;}
.prd-list-wrap .prd-item .img-box span img{position: absolute; inset:0; margin:auto; max-width:100%; max-height:100%; object-fit:cover;}
.prd-list-wrap .prd-item .txt-box{position: relative; display: flex; align-items:center; justify-content:center; width:100%; min-height:7rem; text-align:center; padding:0 5.5rem; box-sizing:border-box;}
.prd-list-wrap .prd-item .txt-box .tit{font-size:2rem; line-height:1.4; letter-spacing:-0.04em; color:#fff; font-weight:700;}

@media all and (max-width:1280px){
	.prd-list-wrap .prd-item .txt-box{padding:0 3rem;}
}
@media all and (max-width:800px){
	.prd-list-wrap {margin-top: 2rem;}
	.prd-list-wrap .prd-item{width:calc(50% - 4rem); }
	.prd-list-wrap .prd-item .txt-box .tit {font-size: 1.6rem;}
}
@media all and (max-width:480px){
	.prd-list-wrap{margin:2rem -1rem -1rem;}
	.prd-list-wrap .prd-item{width:calc(50% - 2rem); margin:1rem;}
	.prd-list-wrap .prd-item .txt-box{padding:0 1.5rem; min-height: 8.5rem;}
}

/* 뷰페이지 */
.prd-view-wrap{display: flex; justify-content:space-between;}
.prd-view-wrap .left-box{width:calc(50% - 6rem);}
.prd-view-wrap .right-box{width:calc(50% - 6rem);}

.prd-view-img-slide{position: relative; border-radius:1rem; background:rgba(255,255,255,0.03);}
.prd-view-img-slide .slide-item{}
.prd-view-img-slide .slide-item span{display: block; position: relative; width:100%; height:0; padding-top:100%;}
.prd-view-img-slide .slide-item span img{position: absolute; inset:0; margin:auto; max-width:75%; max-height:75%; object-fit:cover;}

.prd-view-img-slide .slick-arrow{position: absolute; top:50%; transform:translateY(-50%); font-size:3.2rem; color:#fff; z-index:9;}
.prd-view-img-slide .slick-arrow.slick-prev{left:3rem;}
.prd-view-img-slide .slick-arrow.slick-next{right:3rem;}

.prd-view-slide-bar{position: relative; margin:4rem auto 0; max-width:320px; height:5px; width:100%; background:rgba(255,255,255,0.05); border-radius:3px;}
.prd-view-slide-bar span{position: absolute; left:0; top:0; height:100%; background:#fff; transition:var(--transition-custom); border-radius:3px;}

.prd-view-tit-box{margin-bottom:3.5rem;}
.prd-view-tit-box .tit-en{font-size:2.4rem; line-height:1.375; letter-spacing:-0.04em; font-weight:700; color:var(--main-color);}
.prd-view-tit-box .tit{font-size:6rem; line-height:1.375; letter-spacing:-0.04em; font-weight:700; color:#fff;}

.prd-view-category-box{display: flex; flex-wrap:wrap; margin-bottom:3rem;}
.prd-view-category-box .category{position: relative; padding-left:2.5rem; box-sizing:border-box; margin-right:3.5rem; font-size:2rem; line-height:1.65; letter-spacing:-0.04em; color:#fff; font-weight:700;}
.prd-view-category-box .category:last-child{margin-right:0;}
.prd-view-category-box .category:before{position: absolute; content:'\e929'; font-family:'xeicon'; font-size:2.4rem; font-weight:400; top:-1px; left:-1px;}

.prd-view-info-box{border-top:1px solid #fff; border-bottom:1px solid #fff; padding:3rem 0; box-sizing:border-box; margin-bottom:4rem;}
.prd-view-info-box .info-item{display: flex; margin-bottom:1.3rem;}
.prd-view-info-box .info-item:last-child{margin-bottom:0;}
.prd-view-info-box .info-item dt{width:11rem; font-size:2.4rem; line-height:1.375; letter-spacing:-0.04em; color:#fff; font-weight:700;}
.prd-view-info-box .info-item dd{width:calc(100% - 11rem); font-size:2rem; line-height:1.65; letter-spacing:-0.04em; color:rgba(255,255,255,0.5);}

.prd-view-detail-box{}
.prd-view-detail-box .detail-item{display: flex; align-items:center; margin-bottom:1rem;}
.prd-view-detail-box .detail-item:last-child{margin-bottom:0;}
.prd-view-detail-box .detail-item dt{display: flex; align-items:center; justify-content:center; width:16rem; min-height:5rem; padding:1rem; box-sizing:border-box; text-align:center; font-size:1.8rem; line-height:1.83; letter-spacing:-0.04em; color:#fff; background:rgba(255,255,255,0.03); border-radius:1rem;}
.prd-view-detail-box .detail-item dd{display: flex; flex-wrap:wrap; width:calc(100% - 16rem); padding-left:2rem; box-sizing:border-box;}
.prd-view-detail-box .detail-item dd span{position: relative; padding-left:0.8rem; box-sizing:border-box; font-size:1.8rem; line-height:1.83; letter-spacing:-0.04em; color:rgba(255,255,255,0.5); margin-right:1.8rem;}
.prd-view-detail-box .detail-item dd span:before{position: absolute; content:'·'; left:0; top:0;}

.prd-view-btn-box{margin-top:15rem;}


@media all and (max-width:1280px){
	.prd-view-wrap .left-box{width:calc(50% - 3rem);}
	.prd-view-wrap .right-box{width:calc(50% - 3rem);}

	.prd-view-img-slide .slide-item span img{max-width:60%; max-height:60%;}
}
@media all and (max-width:800px){
	.prd-view-wrap{display: block;}
	.prd-view-wrap .left-box{width:100%; margin-bottom:5rem;}
	.prd-view-wrap .right-box{width:100%;}
	
	.prd-view-tit-box{margin-bottom:2rem;}
	.prd-view-tit-box .tit-en{font-size:2rem;}
	.prd-view-tit-box .tit{font-size:4rem;}
	
	.prd-view-category-box{margin-bottom:2rem;}
	.prd-view-category-box .category{padding-left:2rem; margin-right:2rem; font-size:1.6rem;}
	.prd-view-category-box .category:before{font-size:1.8rem; top:-2px}
	
	.prd-view-info-box{padding:2rem 0; margin-bottom:2rem;}
	.prd-view-info-box .info-item{margin-bottom:0.8rem;}
	.prd-view-info-box .info-item dt{width:9rem; font-size:2rem;}
	.prd-view-info-box .info-item dd{width:calc(100% - 9rem); font-size:1.8rem;}
	
	.prd-view-detail-box .detail-item dt{padding:1rem; font-size:1.6rem; min-height:4.5rem;}
	.prd-view-detail-box .detail-item dd{padding-left:2rem; box-sizing:border-box;}
	.prd-view-detail-box .detail-item dd span{padding-left:0.7rem; font-size:1.6rem; margin-right:1.5rem;}

	.prd-view-btn-box{margin-top:5rem;}
}

/* 기술 서비스 */
.tech-service-list{display: flex; margin:-2rem; margin-top:4rem;}
.tech-service-list .list-item{position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width:calc(25% - 4rem); margin:2rem; min-height:30rem; text-align:center; background:rgba(255,255,255,0.05); border-radius:1rem; opacity:0; transform:translateY(50px);}
.tech-service-list .list-item .icon{margin-bottom:4.5rem;}
.tech-service-list .list-item .txt-box{}
.tech-service-list .list-item .txt-box dt{font-size:2.4rem; line-height:1.375; letter-spacing:-0.04em; color:#fff; font-weight:600; margin-bottom:1.4rem;}
.tech-service-list .list-item .txt-box dd{font-size:1.6rem; line-height:1.375; letter-spacing:-0.04em; color:rgba(255,255,255,0.3); transition:var(--transition-custom);}

.tech-service-list .list-item:nth-child(1){transition:all 0.8s 0.2s ease-in-out, background 0.4s 0s ease-in-out; }
.tech-service-list .list-item:nth-child(2){transition:all 0.8s 0.4s ease-in-out, background 0.4s 0s ease-in-out; }
.tech-service-list .list-item:nth-child(3){transition:all 0.8s 0.6s ease-in-out, background 0.4s 0s ease-in-out; }
.tech-service-list .list-item:nth-child(4){transition:all 0.8s 0.8s ease-in-out, background 0.4s 0s ease-in-out; }
/* animated */
.animated.tech-service-list .list-item{opacity:1; transform:translateY(0px);}

/* active */
.tech-service-list .list-item.active{background:var(--main-color);}
.tech-service-list .list-item.active .txt-box dd{color:rgba(255,255,255,0.7);}

/* 맞춤 생산 서비스 */
.custom-service-wrap{margin-top:23rem;}
.custom-service-item{position: relative;}
.custom-service-mid{position: relative; margin:10rem 0;}
.custom-service-mid .custom-circle{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%);}
.custom-service-mid .custom-circle .circle01{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%) rotate(145deg); width:26rem; height:26rem; border-radius:50%; background:rgba(255,255,255,0.3); animation: serviceScrollRolling1 5s linear infinite;}
.custom-service-mid .custom-circle .circle01:before{position: absolute; content:''; width:100%; height:100%; top:50%; left:50%; transform:translateX(-50%); background: linear-gradient(to right,  rgba(14,16,20,0) 0%,rgba(14,16,20,1) 15%,rgba(14,16,20,1) 100%);}
.custom-service-mid .custom-circle .circle01:after{position: absolute; content:''; width:0.6rem; height:0.6rem; top:50%; right:0; transform:translate(calc(50% - 1px), -50%); background:#fff; border-radius:50%;}
.custom-service-mid .custom-circle .circle01 .bg{position: absolute; content:''; width:calc(26rem - 2px); height:calc(26rem - 2px); border-radius:50%; background:#0e1014; top:50%; left:50%; transform:translate(-50%, -50%);}

.custom-service-mid .custom-circle .circle02-wrap{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:22.2rem; height:22.2rem; overflow:hidden; border-radius:50%;}
.custom-service-mid .custom-circle .circle02{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:22rem; height:22rem; border-radius:50%; background:var(--main-color); z-index:2; animation: serviceScrollRolling2 7.5s linear infinite;}
.custom-service-mid .custom-circle .circle02:before{position: absolute; content:''; width:100%; height:100%; top:50%; left:50%; transform:translateX(-50%); background: linear-gradient(to right,  rgba(14,16,20,0) 0%,rgba(14,16,20,1) 35%,rgba(14,16,20,1) 100%);}
.custom-service-mid .custom-circle .circle02:after{position: absolute; content:''; width:1rem; height:1rem; top:50%; right:0; transform:translateY(-50%); background:var(--main-color); border-radius:50%;}
.custom-service-mid .custom-circle .circle02 .bg{position: absolute; content:''; width:20rem; height:20rem; border-radius:50%; background:#0e1014; top:50%; left:50%; transform:translate(-50%, -50%);}

@keyframes serviceScrollRolling1 {
	0% {transform:translate(-50%, -50%) rotate(145deg);}
	100% {transform:translate(-50%, -50%) rotate(505deg);}
}
@keyframes serviceScrollRolling2 {
	0% {transform:translate(-50%, -50%) rotate(0deg);}
	100% {transform:translate(-50%, -50%) rotate(360deg);}
}

.custom-service-mid .img-box{position: relative; display: block; width:31.7rem; height:37.7rem; margin:auto; z-index:9;}
.custom-service-mid .img-box img{max-width:100%; max-height:100%; object-fit:cover;}

.custom-service-list{}
.custom-service-list .list-item{position: absolute; top:50%; left:50%; transform:translate(-50%, calc(-50% + 50px)); width:36rem; height:15rem; background:rgba(255,255,255,0.05); border-radius:1rem; display: flex; align-items:center; justify-content:center; text-align:center; opacity:0; }
.custom-service-list .list-item .dots{position: absolute; content:''; width:8px; height:8px; border-radius:50%; background:#fff; top:50%; }
.custom-service-list .list-item .dots:before{position: absolute; content:''; width:20px; height:20px; border:1px solid #fff; border-radius:50%; box-sizing:border-box; top:50%; left:50%; transform:translate(-50%, -50%);}
.custom-service-list .list-item .txt-box{}
.custom-service-list .list-item .txt-box dt{font-size:2.4rem; line-height:1.375; letter-spacing:-0.04em; color:#fff; font-weight:600;}
.custom-service-list .list-item .txt-box dd{font-size:1.6rem; line-height:1.5; letter-spacing:-0.04em; color:rgba(255,255,255,0.3); margin-top:1rem; transition:var(--transition-custom);}

.custom-service-list .list-item.left .dots{right:0; transform:translate(50%, -50%);}
.custom-service-list .list-item.right .dots{left:0; transform:translate(-50%, -50%);}

.custom-service-list .list-item:nth-child(1){margin-top:-18.2rem; margin-left:40rem;}
.custom-service-list .list-item:nth-child(2){margin-top:2rem; margin-left:48rem;}
.custom-service-list .list-item:nth-child(3){margin-top:22rem; margin-left:40rem;}
.custom-service-list .list-item:nth-child(4){margin-top:22rem; margin-left:-40rem;}
.custom-service-list .list-item:nth-child(5){margin-top:2rem; margin-left:-48rem;}
.custom-service-list .list-item:nth-child(6){margin-top:-18.2rem; margin-left:-40rem;}

.custom-service-list .list-item:nth-child(1){transition:all 0.8s 0s ease-in-out, background 0.4s 0s ease-in-out;}
.custom-service-list .list-item:nth-child(2){transition:all 0.8s 0.2s ease-in-out, background 0.4s 0s ease-in-out;}
.custom-service-list .list-item:nth-child(3){transition:all 0.8s 0.4s ease-in-out, background 0.4s 0s ease-in-out;}
.custom-service-list .list-item:nth-child(4){transition:all 0.8s 0.6s ease-in-out, background 0.4s 0s ease-in-out;}
.custom-service-list .list-item:nth-child(5){transition:all 0.8s 0.8s ease-in-out, background 0.4s 0s ease-in-out;}
.custom-service-list .list-item:nth-child(6){transition:all 0.8s 1s ease-in-out, background 0.4s 0s ease-in-out;}
/* animated */
.animated + .custom-service-list .list-item{opacity:1; transform:translate(-50%, -50%);}

/* active */
.custom-service-list .list-item.active{background:var(--main-color);}
.custom-service-list .list-item.active .txt-box dd{color:rgba(255,255,255,0.7);}

/* 공급망 지원 (VMI) */
.vmi-service-wrap{margin-top:33rem;}
.vmi-service-wrap .quality-img-list{margin-top:10rem;}
.vmi-service-wrap .quality-img-list .list-item:nth-child(1){transform: translateY(5rem);}
.vmi-service-wrap .quality-img-list .list-item:nth-child(2){transform: translateY(-5rem);}
.vmi-service-wrap .quality-img-list .list-item:nth-child(3){transform: translateY(5rem);}

.vmi-service-wrap.animated .quality-img-list .list-item:nth-child(1){transform: translateY(-5rem);}
.vmi-service-wrap.animated .quality-img-list .list-item:nth-child(2){transform: translateY(5rem);}
.vmi-service-wrap.animated .quality-img-list .list-item:nth-child(3){transform: translateY(-5rem);}

@media all and (max-width: 1280px) {
	.custom-service-item {margin-top: 14rem;}
	.custom-service-mid .img-box {width: 25.7rem; height: 31.7rem;}

	.custom-service-list .list-item {padding: 0 2rem; box-sizing: border-box;}
	.custom-service-list .list-item:nth-child(1), .custom-service-list .list-item:nth-child(3) {margin-left: 32.4rem;}
	.custom-service-list .list-item:nth-child(2) {margin-left: 37.4rem;}
	.custom-service-list .list-item:nth-child(4), .custom-service-list .list-item:nth-child(6) {margin-left: -32.4rem;}
	.custom-service-list .list-item:nth-child(5) {margin-left: -37.4rem;}
}

@media all and (max-width: 800px) {
	.tech-service-list {flex-wrap: wrap; margin: 2rem -1rem 0;}
	.tech-service-list .list-item {width: calc(50% - 2rem); margin: 1rem;}

	.custom-service-wrap {margin-top: 10rem;}
	.custom-service-item {margin-top: 7rem;}
	.custom-service-list .list-item {position: static; width: 100%; margin: 2rem 0 0 0 !important;}
	.custom-service-list .list-item:nth-child(1) {margin-top: 0;}
	.custom-service-list .list-item .dots {top: 0 !important; left: 50% !important; right: auto !important;}
	.animated + .custom-service-list .list-item {transform: translate(0, 0)}

	.custom-service-mid {margin: 10rem 0 5rem 0;}
	.custom-service-mid .img-box {width: 22.7rem; height: 28.7rem;}
	.custom-service-mid .custom-circle .circle01 {width: 22rem; height: 22rem;}
	.custom-service-mid .custom-circle .circle01 .bg {width: calc(22rem - 2px); height: calc(22rem - 2px);}
	.custom-service-mid .custom-circle .circle02-wrap {width: 19.2rem; height: 19.2rem;}
	.custom-service-mid .custom-circle .circle02 {width: 20rem; height: 20rem;}
	.custom-service-mid .custom-circle .circle02 .bg {width: 18rem; height: 18rem;}

	.vmi-service-wrap {margin-top: 10rem;}
	.vmi-service-wrap .quality-img-list {margin-top: 2rem;}
	.vmi-service-wrap.animated .quality-img-list .list-item:nth-child(2) {transform: translateY(2rem);}
	.quality-img-list .list-item .txt-box {margin-top: 2.5rem;}
	.quality-img-list .list-item .txt-box .item-tit {font-size: 2.1rem;}
	.quality-img-list .list-item .txt-box .item-txt {font-size: 1.4rem;}
}

@media all and (max-width: 480px) {
	.tech-service-list {margin: 2rem 0;}
	.tech-service-list .list-item {width: 100%; min-height: 22rem; margin: 1rem 0;}
	.tech-service-list .list-item .icon {margin-bottom: 2rem;}
}

/* ****************** 홍보센터 ********************** */
/* 홍보동영상 */
.pr-video-list{display: flex; flex-wrap:wrap; margin:6rem -3rem -4rem;}
.pr-video-list .list-item{width:calc(33.33% - 6rem); margin:4rem 3rem;}
.pr-video-list .list-item .img-box{background:#000; border-radius:1rem;}
.pr-video-list .list-item .img-box span{display: block; position: relative; width:100%; height:0; padding-top:58.25%;}
.pr-video-list .list-item .img-box span img{position: absolute; inset:0; margin:auto; max-width:100%; max-height:100%; object-fit:cover;}
.pr-video-list .list-item .txt{font-size:1.6rem; line-height:1.75; letter-spacing:-0.04em; color:rgba(255,255,255,0.5); text-align:center; margin-top:2.5rem; padding:0 5.5rem}

@media all and (max-width:1280px){
	.pr-video-list .list-item .txt{padding:0 1.5rem;}
}
@media all and (max-width:800px){
	.pr-video-list{margin:4rem -2rem -2rem;}
	.pr-video-list .list-item{width:calc(50% - 4rem); margin:2rem;}
}
@media all and (max-width:480px){
	.pr-video-list{margin:4rem -1rem -2rem;}
	.pr-video-list .list-item{width:calc(100% - 2rem); margin:2rem 1rem;}
}

/* 디지털 브로슈어 */
.catalogs-list-con02 .catalogs-list-wrap {margin-top:10rem;}
.catalogs-list-con02 .catalogs-list {display: flex; flex-wrap: wrap; margin: -2rem;}
.catalogs-list-con02 .catalogs-list .catalogs-list-item {width: calc(50% - 4rem); margin: 2rem; background: rgba(255,255,255,0.05); padding: 3rem; border-radius: 1rem; box-sizing: border-box;}
.catalogs-list-con02 .catalogs-list-item {display: flex; align-items: center; justify-content:space-between;}
.catalogs-list-con02 .catalogs-list-item .item-img {width:46.552%;}
.catalogs-list-con02 .catalogs-list-item .item-img span{position: relative; display: block; width:100%; height:0; padding-top:148.148%; background:#000; border-radius:1rem; overflow:hidden;}
.catalogs-list-con02 .catalogs-list-item .item-img span img {position: absolute; inset:0; margin:auto; max-width:100%; max-height:100%; object-fit:cover;}
.catalogs-list-con02 .catalogs-list-item .item-info {width:46.552%;}
.catalogs-list-con02 .catalogs-list-item .item-info .category {display: block; font-size:2rem; line-height:1.4; letter-spacing:-0.04em; color:#fff; font-weight:500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom:0.5rem;}
.catalogs-list-con02 .catalogs-list-item .item-info .tit {font-size:3.2rem; line-height:1.3; letter-spacing:-0.04em; color:#fff; font-weight:700; overflow: hidden; display: block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.catalogs-list-con02 .catalogs-list-item .item-info .btn-box {margin-top: 4rem;}
.catalogs-list-con02 .catalogs-list-item .item-info .btn-box .cm-btn{margin-left:0; margin-bottom:1.5rem;}
.catalogs-list-con02 .catalogs-list-item .item-info .btn-box .cm-btn:last-child{margin-bottom:0;}

@media all and (max-width:800px){
	.catalogs-list-con02 .catalogs-list .catalogs-list-item {width: calc(100% - 4rem);}
	.catalogs-list-con02 .catalogs-list-item .item-info .category {font-size:1.8rem;}
	.catalogs-list-con02 .catalogs-list-item .item-info .tit {font-size:2.6rem;}
}
@media all and (max-width:480px){
	.catalogs-list-con02 .catalogs-list-item{flex-wrap:wrap;}
	.catalogs-list-con02 .catalogs-list-item .item-img{width:100%; margin-bottom:3rem;}
	.catalogs-list-con02 .catalogs-list-item .item-info {width: 100%;}
	.catalogs-list-con02 .catalogs-list-item .item-info .btn-box {margin-top: 2rem;}
	.catalogs-list-con02 .catalogs-list-item .item-info .btn-box .cm-btn{width:100%;}
}

/********** 251110 :: 제품 뷰 마크 추가 **********/
.prd-view-tit-box .tit {line-height: 1.5;}
.prd-view-tit-box .tit .prd-mark {display: inline-flex; align-items: center; justify-content: center; min-width: 6rem; height: 5rem; max-height: 5rem; vertical-align: middle; line-height: 1; margin-bottom: 1.7rem; margin-left: 0.5rem; box-sizing: border-box;}
.prd-view-tit-box .tit .prd-mark img {max-width: 100%; max-height: 100%;}

@media all and (max-width: 800px) {
	.prd-view-tit-box .tit .prd-mark {margin-bottom: 1rem;}
	.prd-view-tit-box .tit .prd-mark img {max-width: 75%;}
}

@media all and (max-width: 480px) {
	.prd-view-tit-box .tit .prd-mark img {max-width: 50%;}
}