@charset "utf-8";
/* *******************************************************
 * filename : product.css
 * description : 제품 레이아웃 및 컨텐츠 CSS
 * date : 2022-10-06
******************************************************** */

/* ******************  제품 비주얼 ********************** */
#productVisual1, #productVisual2{overflow:hidden; width:100%; height:1000px;  position:relative;}	/* 비주얼높이값 이미지에맞게 수정 */
#productVisual1 .area{max-width: 1207px;} 
#productVisual2 .area{max-width: 1207px;} 

.product-visual-con .slick-track,
.product-visual-con .slick-list {
	 -webkit-perspective: 2000;
	-webkit-backface-visibility: hidden;
}
.product-visual-wrap,
.product-visual-con, 
.product-visual-con .slick-list,  
.product-visual-con .slick-track, 
.product-visual-item{
	height:100%; 
}
.product-visual-con{z-index:1;}
/* 제품 비주얼 :: 이미지 */
.product-visual-item{position:relative;}
.product-visual-item .product-visual-pc-img{
	width:100%;
	height:100%;
	background-size:cover !important;
    -webkit-transform: scale(1.05,1.05);
     transform: scale(1.05,1.05);
	-webkit-transition:transform 5000ms  ease-in-out ;
    transition:transform 5000ms ease-in-out ;	
}
.product-visual-item .product-visual-m-img{display:none;}
.product-visual-img-con {position:absolute; top:42%; right:0; width:56.655vw; max-width:1088px; transform:translateY(-50%);}
#productVisual2 .product-visual-img-con {position:absolute; top:44%; right:0; width:49.479vw; max-width:1045px; transform:translateY(-50%);}

.product-visual-img-con .inner-box {position:relative;}
.product-visual-img-con .inner-box .bg img {width:100%;}
.product-visual-img-con .inner-box .bg.m {display:none;}
.product-visual-img-con .icon-box {position:absolute; width:100%; height:100%; right: -114px;}
.product-visual-img-con .icon-box .inner {position:relative; width:100%; height:100%;}
/* 제품비주얼 :: 아이콘 */
.product-visual-img-con .icon-box .icon {position:absolute; top:50%; left:50%; }
.product-visual-item.first .product-visual-img-con .icon-box .icon:not(.ai) {/* transition-delay:0.5s; */}
.product-visual-img-con .icon-box .icon img {width:100%;}
/* 제품비주얼01-1 */
/* .product-visual-item01 .icon-box.visual01 .icon01 {margin-top: -10.46vw;left:0; width:45.89vw;} */
.product-visual-item01 .icon-box.visual01 .icon01 {margin-top: -212px;margin-left:-548px; width:881px;}
/* .product-visual-item01 .icon-box.visual01 .icon02 {margin-top:-12.37vw; margin-left:-18.33vw;width: 16.64vw; } */
.product-visual-item01 .icon-box.visual01 .icon02 {margin-top:-236px; margin-left:-354px;width: 320px; }
/* .product-visual-item01 .icon-box.visual01 .icon03 {margin-top:-11.06vw; margin-left:-4.11vw; width:22.5vw;} */
.product-visual-item01 .icon-box.visual01 .icon03 {margin-top:-213px; margin-left:-79px; width:433px;}
/* .product-visual-item01 .icon-box.visual01 .icon04 {margin-top:-7.94vw; margin-left:-1.7vw; width:17.14vw; } */
.product-visual-item01 .icon-box.visual01 .icon04 {margin-top:-144px; margin-left:-32px; width:329px; }
/* .product-visual-item01 .icon-box.visual01 .icon05 {margin-top:3.57vw; margin-left:2.61vw; width:8.84vw; } */
.product-visual-item01 .icon-box.visual01 .icon05 {margin-top:68px; margin-left:46px; width:170px; }
/* 제품비주얼01-2 */
/* .product-visual-item01 .icon-box.visual02 .icon01 {margin-top:-1.15vw; margin-left:-23.61vw; width:16.76vw; } */
.product-visual-item01 .icon-box.visual02 .icon01 {margin-top:-22px; margin-left:-453px; width:322px; }
/* .product-visual-item01 .icon-box.visual02 .icon02 {margin-top:6.56vw; margin-left:-20.73vw; width:6.78vw; } */
.product-visual-item01 .icon-box.visual02 .icon02 {margin-top:126px; margin-left:-398px; width:130px; }
/* .product-visual-item01 .icon-box.visual02 .icon03 {margin-top:-11.6vw; margin-left:-13.97vw; width:19.38vw; } */
.product-visual-item01 .icon-box.visual02 .icon03 {margin-top:-223px; margin-left:-269px; width:372px; }
/* .product-visual-item01 .icon-box.visual02 .icon04 {margin-top:-8.79vw; margin-left:-8.49vw; width:12.51vw} */
.product-visual-item01 .icon-box.visual02 .icon04 {margin-top:-169px; margin-left:-163px; width:240px;}
/* .product-visual-item01 .icon-box.visual02 .icon05 {margin-top:-14.93vw; margin-left:-7.20vw; width:15.72vw;} */
.product-visual-item01 .icon-box.visual02 .icon05 {margin-top:-287px; margin-left:-138px; width:302px;}
/* .product-visual-item01 .icon-box.visual02 .icon06 {margin-top:3.53vw; margin-left:-27.15vw; width:16.54vw;} */
.product-visual-item01 .icon-box.visual02 .icon06 {margin-top:67px; margin-left:-521px; width:318px;}

.product-visual-item .icon.move {animation: imgupDown 3s ease-in-out 1.1s infinite;}
.product-visual-item .main-visual-img-con .icon-box.active-item .icon {opacity:1;filter:Alpha(opacity=100);}
.ie-browser .product-visual-item .icon.move {animation:none;}

/* 제품 비주얼 :: 텍스트 */
.product-visual-item .product-visual-txt-con{
	position:absolute; 
	top:50%; left:0px; top:6.29vw;
	width:100%; 
}
.product-visual-item .product-visual-txt-con .product-visual-txt-inner {width: 65.16%;}
#productVisual2 .product-visual-item .product-visual-txt-con .product-visual-txt-inner {width: 83.16%;}
/* #productVisual2 .product-visual-item .product-visual-txt-con .product-visual-txt-inner {width: 57.16%;} */
.product-visual-item .product-visual-txt-con .product-visual-txt2{display:block; font-size:56px; font-weight:400; letter-spacing:-1px; color:#3d3939; margin-bottom:1.25vw; line-height:1.25; }
.product-visual-item .product-visual-txt-con .product-visual-txt2 em{font-weight:700;}
.product-visual-item .product-visual-txt-con .product-visual-txt1{font-size:18px; letter-spacing:-0.25px; color:#00BF8F; margin-bottom:1vw; margin-top:2vw; font-weight:600; }
.product-visual-item .product-visual-txt-con .product-visual-txt3{font-size:18px; color:#333333; font-weight:bold; margin-bottom: 19px; margin-top: 48px;}
.product-visual-item .product-visual-txt-con .product-visual-txt3 em{font-weight:bold;}
.product-visual-item .product-visual-txt-con .product-visual-txt4{font-size:16px; color:#646464; line-height:1.9; margin-bottom:52px; }
.product-visual-item .product-visual-txt-con .product-visual-txt4 .margin {margin-top:20px;}

/* 제품 비주얼 :: active효과 */
.product-visual-item.active-item .product-visual-pc-img{
    -webkit-transform: scale(1.0,1.0) rotate(0.002deg);
     transform: scale(1.0,1.0) rotate(0.002deg);
}
/* .main-visual-item .main-visual-txt1.splitting .char{ */
/* 	-webkit-animation: text-fade-out 1s cubic-bezier(0.4, 0, 0.2, 1) both; */
/* 	animation: text-fade-out 1s cubic-bezier(0.4, 0, 0.2, 1) both; */
/* } */
/* .main-visual-item.active-item .main-visual-txt1.splitting .char{ */
/* 	-webkit-animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; */
/* 	animation: text-active-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both; */
/* } */

.product-visual-item .product-visual-txt-con .txt-wrap {display:block; overflow:hidden; }
.product-visual-item .txt-wrap em {display:inline-block; }
/* .main-visual-item.active-item .txt-wrap em { */
/* 	-webkit-animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; */
/* 	animation: text-up 1.5s cubic-bezier(0.4, 0, 0.2, 1) both; */
/* } */

/* ******************  특장점 비주얼 ********************** */
#meritVisual {overflow:hidden; width:100%; height:1000px;  position:relative; background: #F7F7F6;}	/* 비주얼높이값 이미지에맞게 수정 */
#meritVisual .area{max-width: 1440px;} 

.merit-visual-wrap,
.merit-visual-con, 
.merit-visual-item{
	height:100%; 
}
.merit-visual-con{z-index:1;}
/* 특장점 비주얼 :: 이미지 */
.merit-visual-item{position:relative;}

/* 특장점 비주얼 :: 텍스트 */
.merit-visual-item .merit-visual-txt-con{
	position:absolute; 
	top:50%; left:0px; top:0.79vw;
	width:100%; 
}
.merit-visual-item .merit-visual-txt-con .merit-visual-txt-inner {width: 100%;}
.merit-visual-item .merit-visual-txt-con .merit-visual-txt1{display:block; font-size:40px; font-weight:400; letter-spacing:-1px; color:#3d3939; margin-bottom:1.25vw; margin-top: 1.25vw; line-height:1.25; }
.merit-visual-item .merit-visual-txt-con .merit-visual-txt1 em{font-weight:700;}
.merit-visual-item .merit-visual-txt-con .merit-visual-txt2{font-size:24px; color:#000000;}


.merit-visual-item .merit-visual-txt-con .txt-wrap {display:block; overflow:hidden; text-align:center;}
.merit-visual-item .txt-wrap em {display:inline-block; }


.merit-visual-item-wrap{width:1440px; height:508px;}
.merit-visual-item-wrap .merit-post-wrap{padding-right:20px; padding-left:20px; width:fit-content; margin:0 auto;}
.merit-visual-item-wrap .merit-post{width:1181px; height:208px; -webkit-box-shadow: 3px 7px 7px #00000038; border-radius:18px; border: 1px solid #00000038; margin-bottom: 25px;}
.merit-visual-item-wrap .merit-post .merit-post-image-wrap{width:150px; height:100%; display:inline-block; margin-left: 85px; vertical-align: top;}
.merit-visual-item-wrap .merit-post .merit-post-image-wrap .merit-post-image{display: flex;align-items: center;justify-content: center;height: 100%;}

.merit-visual-item-wrap .merit-post .merit-post-txt-wrap{height:100%; display:inline-block; line-height: 208px; width: 465px;}
.merit-visual-item-wrap .merit-post .merit-post-txt-wrap .txt-wrap em{font-size:24px; font-weight:bold; color:#333333;}

.merit-visual-item-wrap .merit-post .merit-post-list-wrap{height:100%; display:inline-block; vertical-align: top; position:relative; width:475px;}
.merit-visual-item-wrap .merit-post .merit-post-list-wrap .span-wrap{position:absolute; top:50%; transform: translate(0, -50%);}
.merit-visual-item-wrap .merit-post .merit-post-list-wrap .txt-wrap{text-align:left; margin-bottom:7px;}
.merit-visual-item-wrap .merit-post .merit-post-list-wrap .txt-wrap em{font-size:18px; color:#181818;}

/* ******************  제품구성 비주얼 ********************** */
#compositionVisual {overflow:hidden; width:100%; height:1000px;  position:relative;}	/* 비주얼높이값 이미지에맞게 수정 */
#compositionVisual .area{max-width: 1440px;} 

.composition-visual-wrap,
.composition-visual-con, 
.composition-visual-item{
	height:100%; 
}
.composition-visual-con{z-index:1;}
/* 제품구성 비주얼 :: 이미지 */
.composition-visual-item{position:relative;}

/* 제품구성 비주얼 :: 텍스트 */
.composition-visual-item .composition-visual-txt-con{
 
	top:50%; left:0px; top:0.79vw;
	width:100%; 
}
.composition-visual-item .composition-visual-txt-con .composition-visual-txt-inner {width: 100%;}
.composition-visual-item .composition-visual-txt-con .composition-visual-txt1{display:block; font-size:40px; font-weight:400; letter-spacing:-1px; color:#3d3939; margin-bottom:5.25vw; margin-top: 1.25vw; line-height:1.25; }
.composition-visual-item .composition-visual-txt-con .composition-visual-txt1 em{font-weight:700;}
.composition-visual-item .composition-visual-txt-con .composition-visual-txt2{font-size:24px; color:#000000;}


.composition-visual-item .composition-visual-txt-con .txt-wrap {display:block; overflow:hidden; text-align:center;}
.composition-visual-item .txt-wrap em {display:inline-block;}


.composition-visual-item-wrap{width:1440px; height:508px;}
.composition-visual-item-wrap .composition-post-wrap{display:inline-block; width:33%;}
.composition-visual-item-wrap .composition-post{position:relative; width:359px; height:580px; -webkit-box-shadow: 3px 7px 7px #00000038; border-radius:18px; border: 1px solid #00000038; margin-bottom: 25px; margin:auto;}
.composition-visual-item-wrap .composition-post .compisition-post-order{background:black; position:absolute; width:60px; height:60px; border-radius:30px; text-align:center; left:50%; transform:translate(-50%, 0); top:-30px;}
.composition-visual-item-wrap .composition-post .compisition-post-order span{color:white; font-size:36px; line-height:60px;}
.composition-visual-item-wrap .composition-post .composition-post-image-wrap{height:46%; margin-bottom:52px;}
.composition-visual-item-wrap .composition-post .composition-post-image-wrap .composition-post-image{display: flex;align-items: end;justify-content: center;height: 100%;}

.composition-visual-item-wrap .composition-post .composition-post-txt-wrap{width:100%; margin-bottom:20px;}
.composition-visual-item-wrap .composition-post .composition-post-txt-wrap .txt-wrap em{font-size:24px; font-weight:bold; color:#333333;}

.composition-visual-item-wrap .composition-post .composition-post-list-wrap{position:relative; width:100%; height:109px;}
.composition-visual-item-wrap .composition-post .composition-post-list-wrap .span-wrap{position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); line-height:26px;}
.composition-visual-item-wrap .composition-post .composition-post-list-wrap .txt-wrap{text-align:left;}
.composition-visual-item-wrap .composition-post .composition-post-list-wrap .txt-wrap em{font-size:18px; color:#181818;width:max-content;}

/* ******************  프로세스 비주얼 ********************** */
#processVisual {overflow:hidden; width:100%; height:1000px;  position:relative; background: #F7F7F6;}	/* 비주얼높이값 이미지에맞게 수정 */
#processVisual .area{max-width: 1034px;} 

.process-visual-wrap,
.process-visual-con, 
.process-visual-item{
	height:100%; 
}
.process-visual-con{z-index:1;}
/* 프로세스 비주얼 :: 이미지 */
.process-visual-item{position:relative;}

/* 프로세스 비주얼 :: 텍스트 */
.process-visual-item .process-visual-txt-con{
	top:50%; left:0px; top:0.79vw;
	width:100%; 
}
.process-visual-item .process-visual-txt-con .process-visual-txt-inner {width: 100%;}
.process-visual-item .process-visual-txt-con .process-visual-txt1{display:block; font-size:40px; font-weight:400; letter-spacing:-1px; color:#3d3939; margin-bottom:1.25vw; margin-top: 1.25vw; line-height:1.25; }
.process-visual-item .process-visual-txt-con .process-visual-txt1 em{font-weight:700;}
.process-visual-item .process-visual-txt-con .process-visual-txt2{font-size:24px; color:#000000;}


.process-visual-item .process-visual-txt-con .txt-wrap {display:block; overflow:hidden; text-align:center;}
.process-visual-item .txt-wrap em {display:inline-block; }


.process-visual-item-wrap, .process-visual-item-wrap img{width:1034px; height:725px;}

/* ******************  적용분야 비주얼 ********************** */
#fieldVisual {overflow:hidden; width:100%; height:1000px;  position:relative;}	/* 비주얼높이값 이미지에맞게 수정 */
#fieldVisual .area{max-width: 1285px;} 

.field-visual-wrap,
.field-visual-con, 
.field-visual-item{
	height:100%; 
}
.field-visual-con{z-index:1;}
/* 적용분야 비주얼 :: 이미지 */
.field-visual-item{position:relative;}

/* 적용분야 비주얼 :: 텍스트 */
.field-visual-item .field-visual-txt-con{
	top:50%; left:0px; top:0.79vw;
	width:100%; 
}
.field-visual-item .field-visual-txt-con .field-visual-txt-inner {width: 100%;}
.field-visual-item .field-visual-txt-con .field-visual-txt1{display:block; font-size:40px; font-weight:400; letter-spacing:-1px; color:#3d3939; margin-bottom:1.25vw; margin-top: 1.25vw; line-height:1.25; }
.field-visual-item .field-visual-txt-con .field-visual-txt1 em{font-weight:700;}
.field-visual-item .field-visual-txt-con .field-visual-txt2{font-size:24px; color:#000000;}


.field-visual-item .field-visual-txt-con .txt-wrap {display:block; overflow:hidden; text-align:center;}
.field-visual-item .txt-wrap em {display:inline-block; }


.field-visual-item-wrap{width:1285px; height:346px;}
.field-visual-item-wrap .field-post-wrap{display:inline-block; width:33%;}
.field-visual-item-wrap .field-post{position:relative; width:414px; height:331px; -webkit-box-shadow: 3px 7px 7px #00000038; border-radius:18px; border: 1px solid #00000038; margin-bottom: 25px; margin:auto;}
.field-visual-item-wrap .field-post .field-post-image-wrap{margin-bottom:20px;}
.field-visual-item-wrap .field-post .field-post-image-wrap .field-post-image{display: flex;align-items: end;justify-content: center;height: 100%;}
.field-visual-item-wrap .field-post .field-post-image-wrap .field-post-image img{border-top-right-radius: 17px;border-top-left-radius: 17px;}

.field-visual-item-wrap .field-post .field-post-txt-wrap{width:100%; margin-bottom:20px;}
.field-visual-item-wrap .field-post .field-post-txt-wrap .txt-wrap em{font-size:24px; font-weight:bold; color:#333333;}

.field-visual-item-wrap .field-post .field-post-list-wrap{position:relative; width:100%; height:62px;}
.field-visual-item-wrap .field-post .field-post-list-wrap .span-wrap{position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); line-height:26px;}
.field-visual-item-wrap .field-post .field-post-list-wrap .txt-wrap{text-align:left;}
.field-visual-item-wrap .field-post .field-post-list-wrap .txt-wrap em{font-size:18px; color:#181818;width:max-content;}

/* ******************  구축사례 비주얼 ********************** */
#exampleVisual {overflow:hidden; width:100%; height:1000px;  position:relative; background: #F7F7F6;}	/* 비주얼높이값 이미지에맞게 수정 */
#exampleVisual .area{max-width: 1164px;} 

.example-visual-wrap,
.example-visual-con, 
.example-visual-item{
	height:100%; 
}
.example-visual-con{z-index:1;}
/* 구축사례 비주얼 :: 이미지 */
.example-visual-item{position:relative;}

/* 구축사례 비주얼 :: 텍스트 */
.example-visual-item .example-visual-txt-con{
	position:absolute; 
	top:50%; left:0px; top:0.79vw;
	width:100%; 
}
.example-visual-item .example-visual-txt-con .example-visual-txt-inner {width: 100%;}
.example-visual-item .example-visual-txt-con .example-visual-txt1{display:block; font-size:40px; font-weight:400; letter-spacing:-1px; color:#3d3939; margin-bottom:1.25vw; margin-top: 1.25vw; line-height:1.25; }
.example-visual-item .example-visual-txt-con .example-visual-txt1 em{font-weight:700;}
.example-visual-item .example-visual-txt-con .example-visual-txt2{font-size:24px; color:#000000;}


.example-visual-item .example-visual-txt-con .txt-wrap {display:block; overflow:hidden; text-align:center;}
.example-visual-item .txt-wrap em {display:inline-block; }

/* 원혁 수정 */

/* ******************  구축사례 비주얼 ********************** */
#exampleVisual2 {overflow:hidden; width:100%; height:1000px;  position:relative; background: #F7F7F6;}	/* 비주얼높이값 이미지에맞게 수정 */
#exampleVisual2 .area{max-width: 1620px;} 

#exampleVisual2 .example-visual-item-wrap{width:1620px; height:644px;}
#exampleVisual2 .example-visual-item-wrap img{height:644px;}

/* ******************  주요기능 비주얼 ********************** */
#functionVisual {overflow:hidden; width:100%; height:1000px;  position:relative;}	/* 비주얼높이값 이미지에맞게 수정 */
#functionVisual .area{max-width: 1281px;} 

.function-visual-wrap,
.function-visual-con, 
.function-visual-item{
	height:100%; 
}
.function-visual-con{z-index:1;}
/* 제품구성 비주얼 :: 이미지 */
.function-visual-item{position:relative;}

/* 제품구성 비주얼 :: 텍스트 */
.function-visual-item .function-visual-txt-con{
	top:50%; left:0px; top:0.79vw;
	width:100%; 
}
.function-visual-item .function-visual-txt-con .function-visual-txt-inner {width: 100%;}
.function-visual-item .function-visual-txt-con .function-visual-txt1{display:block; font-size:40px; font-weight:400; letter-spacing:-1px; color:#3d3939; margin-bottom:1.25vw; margin-top: 1.25vw; line-height:1.25; }
.function-visual-item .function-visual-txt-con .function-visual-txt1 em{font-weight:700;}
.function-visual-item .function-visual-txt-con .function-visual-txt2{font-size:24px; color:#000000;}


.function-visual-item .function-visual-txt-con .txt-wrap {display:block; overflow:hidden; text-align:center;}
.function-visual-item .txt-wrap em {display:inline-block;}


.function-visual-item-wrap{width:1281px; height:508px;}
.function-visual-item-wrap .function-post-wrap{display:inline-block;}
.function-visual-item-wrap .function-post{position:relative; width:620px; height:325px; -webkit-box-shadow: 3px 7px 7px #00000038; border-radius:18px; border: 1px solid #00000038; margin-bottom: 25px; margin:auto;}
.function-visual-item-wrap .function-post .function-post-order{background:black; position:absolute; width:60px; height:60px; border-radius:30px; text-align:center; left:50%; transform:translate(-50%, 0); top:-30px;}
.function-visual-item-wrap .function-post .function-post-order span{color:white; font-size:36px; line-height:60px;}
.function-visual-item-wrap .function-post .function-post-image-wrap{display:inline-block; width:260px; height:200px;}
.function-visual-item-wrap .function-post .function-post-image-wrap .function-post-image{display: flex;align-items: center;justify-content: center;height: 100%;}
.function-visual-item-wrap .function-post .function-post-image-wrap .function-post-image img{height: 200px;}

.function-visual-item-wrap .function-post .function-post-txt-wrap{width:100%; margin-bottom:20px; margin-top:57px;}
.function-visual-item-wrap .function-post .function-post-txt-wrap .txt-wrap em{font-size:24px; font-weight:bold; color:#333333;}

.function-visual-item-wrap .function-post .function-post-list-wrap{position:relative; width:calc(100% - 263px); height:200px; display:inline-block;}
.function-visual-item-wrap .function-post .function-post-list-wrap .span-wrap{position:absolute; top:50%; transform: translate(0%, -50%); line-height:26px;}
.function-visual-item-wrap .function-post .function-post-list-wrap .txt-wrap{text-align:left;}
.function-visual-item-wrap .function-post .function-post-list-wrap .txt-wrap em{font-size:18px; color:#181818;width:max-content;}

@media all and (max-width:1710px){
	.main-nav-list .main-nav-btn span {display:none;}
}
@media all and (max-width:1410px){
	#mainNav {display:none !important;}
}

.area {
    max-width: 1110px;
    margin: 0px auto;
}

#productContainer{
/* 	margin-top: 100px; */
    height: 100vh;
    overflow: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    transition-duration: 0.2s;
    overflow-x: hidden;
    margin-right: 7px;
}

#productContainer::-webkit-scrollbar{
	width:9px;
}

#productContainer::-webkit-scrollbar-thumb{
	background-color:#00BF8F;
	height:53px;
	border-radius : 10px;
}

#productContainer::-webkit-scrollbar-track{
	background-color:#d8d8d8;
}

#productContainer .submenu-container-fixed{
	position:fixed;
	width:100%;
	top :0;
	background-color: #F8F8F9;
	z-index:99;
}

body{
	overflow-y:hidden;
}

#news-visual-item-list{
	width:100%;
	height:100%;
}

.button-wrap{
	position: relative;
	height: 74px;

}

/* 원혁 추가 구축사례 변경 관련 css */

/* ******************  aadsProject 비주얼 ********************** */
#aads-projectVisual {width:100%; height:1000px; max-height:2000px; position:relative;}	/* 비주얼높이값 이미지에맞게 수정 */
#aads-projectVisual .area{max-width: 1440px;} 

#height60px {
	height: 60px;
}

.aads-project-visual-con .slick-track,
.aads-project-visual-con .slick-list {
	 -webkit-perspective: 2000;
	-webkit-backface-visibility: hidden;
}
.aads-project-visual-con .slick-list{
	padding-top:16px;
}
.aads-project-visual-wrap,
.aads-project-visual-con, 
.aads-project-visual-con .slick-list,  
.aads-project-visual-con .slick-track, 
.aads-project-visual-item{
	height:100%; 
}

.aads-project-visual-con{z-index:1;}
/* aadsProject 비주얼 :: 이미지 */
.aads-project-visual-item{position:relative;}

/* aadsProject 비주얼 :: 텍스트 */
.aads-project-visual-item .aads-project-visual-txt-con{
	position:absolute; 
	left:0px;
	width:100%; 
	z-index:1;
}
.aads-project-visual-item .aads-project-big-txt{position:absolute; bottom:0; left: 50%;transform: translate(-50%,0); background:url("/resources/image/common/text/aads-project_EDIT.svg"); fill:E6E6E6; width: 97vh;height:16vh;background-size: cover;}

.aads-project-visual-item .aads-project-visual-txt-con .aads-project-visual-txt-inner {width: 100%; text-align:center;}
.aads-project-visual-item .aads-project-visual-txt-con .aads-project-visual-txt1{display:block; font-size:48px; font-weight:400; letter-spacing:-1px; color:#333333; margin-bottom:1.25vw; line-height:1.25; }
.aads-project-visual-item .aads-project-visual-txt-con .aads-project-visual-txt1 em{font-weight:700;}
.aads-project-visual-item .aads-project-visual-txt-con .aads-project-visual-txt2{font-size:24px; color:#000000;margin-bottom: 15px;}
.aads-project-visual-item .aads-project-visual-txt-con .aads-project-visual-txt2 em{font-weight:600; padding-right: 10px;}
.aads-project-visual-item .aads-project-visual-txt-con .aads-project-visual-txt3{font-size:18px; color:#000000;margin-bottom: 20px;}

.aads-project-visual-item .aads-project-visual-txt-con .txt-wrap {display:block; overflow:hidden; }
.aads-project-visual-item .txt-wrap em {display:inline-block; }
.aads-project-visual-txt3 .preTxt {font-family : Pretendard Variable Subset; font-size: 18px; color : #000000; margin-bottom: 29px; }

/* .aads-project-visual-item-wrap{width:1440px; height:508px;} */
.aads-project-visual-item-wrap{width:100%; height:508px;}
.aads-project-visual-item-wrap .aads-project-post-wrap{padding-right:20px; padding-left:20px;}
.aads-project-visual-item-wrap .aads-project-post{width:330px;}
.aads-project-visual-item-wrap .aads-project-post .aads-project-post-image{width:100%; height:58px;}
.aads-project-maintenance-btn .small {font-size: 14px;}
.basic-btn:hover{ color:#00BF8F; }
.basic-btn.red:hover{ color: red; }


/* slick-slide */
.aads-project-post-txt-wrap{
	display: block; height: 578px; overflow-y: auto;
}

.aads-project-post-txt-wrap::-webkit-scrollbar {  width: 10px;  /* 스크롤바의 너비 */}
.aads-project-post-txt-wrap::-webkit-scrollbar-thumb {  height: 30%; /* 스크롤바의 길이 */  background: #999999; /* 스크롤바의 색상 */  border-radius: 10px;} 
.aads-project-post-txt-wrap::-webkit-scrollbar-track {  background: #F2F2F2;  /*스크롤바 뒷 배경 색상*/}

#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-visual-line-wrap{
	height: 208px;
    display: flex;
    align-items: center;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-visual-line-wrap.right{
	flex-direction : row-reverse;
	width:1400px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-line-img-wrap{
	position: relative;
	transform: scale(1.1);
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-right-curve-img-wrap{
    top: 104px;
    position: relative;
    left: 6px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-left-curve-img-wrap{
	top: 104px;
    position: relative;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project{
  		font-size: 13px;
  		font-family:pretendard;
  		position: relative;
  		text-align: left;
  		width: 200px;
  		height: 98.5px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project .text-wrap{
    font-size: 16px;
	font-weight: 700;
	/* height: 100%; */
	overflow: auto;
    position: absolute;
    bottom: 0;
    max-height:90px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.right{
	text-align: right !important;
}

#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-top-img-wrap{
	position: absolute;
	bottom: 3px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-bottom-img-wrap{
	position: absolute;
	top: 3px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .year-wrap{
	font-size: 15px;
    font-weight: 700;
    color: #505050;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .year-wrap.top{
	position: absolute;
    bottom: -53px;
    left: 7px;
    z-index: 1;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .year-wrap.top.right{
	right: 7px !important;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .year-wrap.bottom{
	position: absolute;
    top: -50px;
    left: 7px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-top-img-wrap.right,
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-bottom-img-wrap.right,
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .year-wrap.top.right,
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .year-wrap.bottom.right{
	right: 0px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.top .text-wrap{
	position: absolute;
	bottom: 23px !important;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.bottom .text-wrap{
	position: absolute;
	top:23px !important;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.top.right .text-wrap, 
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.bottom.right .text-wrap{
	right: 0px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.year.top .text-wrap{
	position: absolute;
	bottom : 27px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.year.bottom .text-wrap{
	position: absolute;
	top : 23px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project-maintenance-btn {
    width: 200px;
    position: absolute;
    z-index: 3000;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.bottom .aads-project-maintenance-btn{
	top : 3px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.bottom.right .aads-project-maintenance-btn,
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.top.right .aads-project-maintenance-btn{
	right : 0px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.top .aads-project-maintenance-btn{
	bottom : 3px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.year.bottom .aads-project-maintenance-btn{
 	left: 56px;
    top: 7px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.year.bottom.right .year-wrap{
	position: absolute;
    top: -50px;
    right: 8px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.year.bottom.right .aads-project-maintenance-btn{
 	left: -47px;
    top: 3px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.year.top .aads-project-maintenance-btn{
 	left: 57px;
    bottom: 10px;
}
#aads-projectVisual .aads-project-visual-wrap .aads-project-visual-con .aads-project.year.top.right .aads-project-maintenance-btn{
 	left: -52px;
    bottom: 10px;
}

/* ******************  atmsProject 비주얼 ********************** */
#atms-projectVisual {overflow:hidden; width:100%; height:1000px;  position:relative;}	/* 비주얼높이값 이미지에맞게 수정 */
#atms-projectVisual .area{max-width: 1440px;} 

#height60px {
	height: 60px;
}

.atms-project-visual-con .slick-track,
.atms-project-visual-con .slick-list {
	 -webkit-perspective: 2000;
	-webkit-backface-visibility: hidden;
}
.atms-project-visual-con .slick-list{
	padding-top:16px;
}
.atms-project-visual-wrap,
.atms-project-visual-con, 
.atms-project-visual-con .slick-list,  
.atms-project-visual-con .slick-track, 
.atms-project-visual-item{
	height:100%; 
}

.atms-project-visual-con{z-index:1;}
/* aadsProject 비주얼 :: 이미지 */
.atms-project-visual-item{position:relative;}

/* aadsProject 비주얼 :: 텍스트 */
.atms-project-visual-item .atms-project-visual-txt-con{
	position:absolute; 
	top:50%; left:0px; top:0.79vw;
	width:100%; 
	z-index:1;
}
.atms-project-visual-item .atms-project-big-txt{position:absolute; bottom:0; left: 50%;transform: translate(-50%,0); background:url("/resources/image/common/text/atms-project_EDIT.svg"); fill:E6E6E6; width: 97vh;height:16vh;background-size: cover;}

.atms-project-visual-item .atms-project-visual-txt-con .atms-project-visual-txt-inner {width: 100%;}
.atms-project-visual-item .atms-project-visual-txt-con .atms-project-visual-txt1{display:block; font-size:48px; font-weight:400; letter-spacing:-1px; color:#333333; margin-bottom:1.25vw; line-height:1.25; text-align:center; }
.atms-project-visual-item .atms-project-visual-txt-con .atms-project-visual-txt1 em{font-weight:700;}
.atms-project-visual-item .atms-project-visual-txt-con .atms-project-visual-txt2{font-size:24px; color:#000000;margin-bottom: 15px;}
.atms-project-visual-item .atms-project-visual-txt-con .atms-project-visual-txt2 em{font-weight:600; padding-right: 10px;}
.atms-project-visual-item .atms-project-visual-txt-con .atms-project-visual-txt3{font-size:18px; color:#000000;margin-bottom: 20px;}

.atms-project-visual-item .atms-project-visual-txt-con .txt-wrap {display:block; overflow:hidden; }
.atms-project-visual-item .txt-wrap em {display:inline-block; }
.atms-project-visual-txt3 .preTxt {font-family : Pretendard Variable Subset; font-size: 18px; color : #000000; margin-bottom: 29px; }

/* .atms-project-visual-item-wrap{width:1440px; height:508px;} */
.atms-project-visual-item-wrap{width:100%; height:508px;}
.atms-project-visual-item-wrap .atms-project-post-wrap{padding-right:20px; padding-left:20px;}
.atms-project-visual-item-wrap .atms-project-post{width:330px;}
.atms-project-visual-item-wrap .atms-project-post .atms-project-post-image{width:100%; height:58px;}
.atms-project-maintenance-btn .small {font-size: 14px;}
.basic-btn:hover{ color:#00BF8F; }
.basic-btn.red:hover{ color: red; }


/* slick-slide */
.atms-project-post-txt-wrap{
	display: block; height: 578px; overflow-y: auto;
}

.atms-project-post-txt-wrap::-webkit-scrollbar {  width: 10px;  /* 스크롤바의 너비 */}
.atms-project-post-txt-wrap::-webkit-scrollbar-thumb {  height: 30%; /* 스크롤바의 길이 */  background: #999999; /* 스크롤바의 색상 */  border-radius: 10px;} 
.atms-project-post-txt-wrap::-webkit-scrollbar-track {  background: #F2F2F2;  /*스크롤바 뒷 배경 색상*/}

.aads-project-visual-pre-wrap{
	white-space:pre-wrap; font-family : Pretendard Variable Subset; font-size: 18px; color : #000000;
}

.atms-project-visual-pre-wrap{
	white-space:pre-wrap; font-family : Pretendard Variable Subset; font-size: 18px; color : #000000;
}

#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-visual-line-wrap{
	height: 208px;
    display: flex;
    align-items: center;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-visual-line-wrap.right{
	flex-direction : row-reverse;
	width:1400px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-line-img-wrap{
	position: relative;
	transform: scale(1.1);
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-right-curve-img-wrap{
    top: 104px;
    position: relative;
    left: 6px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-left-curve-img-wrap{
	top: 104px;
    position: relative;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project{
  		font-size: 13px;
  		font-family:pretendard;
  		position: relative;
  		text-align: left;
  		width: 200px;
  		height: 98.5px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project .text-wrap{
       font-size: 16px;
	font-weight: 700;
	/* height: 100%; */
	overflow: auto;
    position: absolute;
    bottom: 0;
    max-height:90px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.right{
	text-align: right !important;
}

#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-top-img-wrap{
	position: absolute;
	bottom: 3px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-bottom-img-wrap{
	position: absolute;
	top: 3px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .year-wrap{
	font-size: 15px;
	font-weight: 700;
	color: #505050;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .year-wrap.top{
	position: absolute;
    bottom: -52px;
    z-index: 1;
    left: 8px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .year-wrap.top.right{
	position: absolute;
    bottom: -52px;
    z-index: 1;
    right: 7px !important;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .year-wrap.bottom.right{
	position: absolute;
    top: -51px;
    right: 7px !important;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .year-wrap.bottom{
	position: absolute;
    top: -51px;
    left: 7px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-top-img-wrap.right,
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-bottom-img-wrap.right,
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .year-wrap.top.right,
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .year-wrap.bottom.right{
	right: 0px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.top .text-wrap{
	position: absolute;
	bottom: 23px !important;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.bottom .text-wrap{
	position: absolute;
	top:23px !important;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.top.right .text-wrap, 
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.bottom.right .text-wrap{
	right: 0px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.year.top .text-wrap{
	position: absolute;
	bottom : 27px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.year.bottom .text-wrap{
	position: absolute;
	top : 23px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project-maintenance-btn {
    width: 200px;
    position: absolute;
    z-index: 3000;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.bottom .atms-project-maintenance-btn{
	top : 3px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.bottom.right .atms-project-maintenance-btn,
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.top.right .atms-project-maintenance-btn{
	right : 0px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.top .atms-project-maintenance-btn{
	bottom : 3px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.year.bottom .atms-project-maintenance-btn{
 	left: 56px;
    top: 7px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.year.bottom.right .atms-project-maintenance-btn{
 	left: -47px;
    top: 3px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.year.top .atms-project-maintenance-btn{
 	left: 57px;
    bottom: 10px;
}
#atms-projectVisual .atms-project-visual-wrap .atms-project-visual-con .atms-project.year.top.right .atms-project-maintenance-btn{
 	left: -52px;
    bottom: 10px;
}
/* 
@media all and (max-width: 1380px) {
	.merit-visual-item .merit-visual-txt-con
	, .composition-visual-con
	, .process-visual-con
	, .field-visual-con
	, .function-visual-con{
		display: flex;
	  	justify-content: center;
	  	align-items: center;
	}
	
	.merit-visual-item .merit-visual-txt-con #merit-visual-item-list
	, #composition-visual-item-list
	, .field-visual-item-wrap{
		scale: 80%;
	}
}

@media all and (max-width: 1280px){
	.function-visual-item-wrap{scale: 80%;}
}

@media all and (max-width: 1060px) {
	#composition-visual-item-list{scale: 60%;}
	.process-visual-item-wrap img{scale: 80%;}
	.field-visual-item-wrap{scale : 70%;}
}

@media all and (max-width: 1000px) {
	.product-visual-item .product-visual-txt-con .product-visual-txt4{font-size: 13px;}
	.product-visual-item .product-visual-txt-con .product-visual-txt3{font-size: 15px;}
	.product-visual-item .product-visual-txt-con .product-visual-txt2{font-size: 40px;}
	.function-visual-item-wrap{scale: 60%;}
	
	.atms-project-visual-item .atms-project-visual-txt-con .atms-project-visual-txt1{
		font-size: 26px !important;
	}
	
	.atms-project-visual-item .atms-project-visual-txt-con .atms-project-visual-txt2{
		font-size: 20px !important;
	}
	
	.atms-project-visual-pre-wrap{
		font-size: 14px;
	}
	
	.atms-project-visual-item .atms-project-big-txt{
		left:0 !important;
		right:0 !important;
		transform:none !important;
		width:auto !important;
		height: 7vh !important;
	}
	
	.atms-project-visual-item-wrap .atms-project-post{
		width:inherit !important;
	}
	
	.aads-project-visual-item .aads-project-visual-txt-con .aads-project-visual-txt1{
		font-size: 26px !important;
	}
	
	.aads-project-visual-item .aads-project-visual-txt-con .aads-project-visual-txt2{
		font-size: 20px !important;
	}
	
	.aads-project-visual-pre-wrap{
		font-size: 14px;
	}
	
	.aads-project-visual-item .aads-project-big-txt{
		left:0 !important;
		right:0 !important;
		transform:none !important;
		width:auto !important;
		height: 7vh !important;
	}
	
	.aads-project-visual-item-wrap .aads-project-post{
		width:inherit !important;
	}
}

@media all and (max-width: 970px) {
	.merit-visual-item .merit-visual-txt-con #merit-visual-item-list{scale: 60%;}
}

@media all and (max-width: 900px) {
	.field-visual-item-wrap{scale : 60%;}
}

@media all and (max-width: 820px) {
	.process-visual-item-wrap img{scale: 70%;}
}

@media all and (max-width: 800px) {
	#composition-visual-item-list{scale: 40%;}
}

@media all and (max-width: 755px) {
	.field-visual-item-wrap{scale : 50%;}
	.function-visual-item-wrap{scale: 50%;}
}

@media all and (max-width: 720px) {
	.product-visual-item .product-visual-txt-con .product-visual-txt4{font-size: 11px;}
	.product-visual-item .product-visual-txt-con .product-visual-txt3{font-size: 13px;}
	.product-visual-item .product-visual-txt-con .product-visual-txt2{font-size: 30px;}
	.merit-visual-item .merit-visual-txt-con #merit-visual-item-list{scale: 45%;}
	.process-visual-item-wrap img{scale: 60%;}
}

@media all and (max-width: 640px) {
	.function-visual-item-wrap{scale: 40%;}
}

@media all and (max-width: 600px) {
	.process-visual-item-wrap img{scale: 50%;}
	.field-visual-item-wrap{scale : 40%;}
}

@media all and (max-width: 550px) {
	.merit-visual-item .merit-visual-txt-con #merit-visual-item-list{scale: 40%;}
}


 */