@charset "utf-8";
.pcbr{display:none;}
.tbbr{display:none;}
.mbbr{display:block;}
.dn{display:none;}





/* visual */
#visual{overflow:hidden;width:100vw;height:100vh;}
.visual{overflow:hidden;position:relative;width:100%;height:100%;}
.visual .swiper-slide{overflow:hidden;position:relative;width:100%;height:100%;}
.visual .swiper-slide .slide-inner{
	overflow:hidden;
	width:100%;height:100%;
    position: absolute;left:0;top:0;z-index:100;
    background-size: cover;
    background-position: center;
    display:flex;justify-content:center;align-items:center;
    text-align: left;
}
.visual .swiper-slide .bg{
	position:absolute;left:0;top:0;
	width:100%;height:100%;
	transition:all 1.2s;
}
.visual .swiper-slide .bg>div{width:100%;height:100%;}
.visual .swiper-slide .bg>div::after{
content:'';
background-color: #000;
position: absolute;
top:0;
left: 0;
right: 0;
bottom: 0;
opacity: 0.1;
}
.visual .swiper-slide .bg>div video{width:100%;height:100%;object-fit:cover;}
.visual .swiper-slide.v1 .bg>div{background:url(/images/main/visual1.jpg) no-repeat center;background-size:cover}
.visual .swiper-slide.v2 .bg>div{background:url(/images/main/visual2.jpg) no-repeat center;background-size:cover}
.visual .swiper-slide.v3 .bg>div{background:#000 url(/images/main/visual3.png) no-repeat center;background-size:cover}
.visual .swiper-slide.v4 .bg>div{background:url(/images/main/visual4.jpg) no-repeat center;background-size:cover}
.visual .swiper-slide.v5 .bg>div{background:url(/images/main/visual5.jpg) no-repeat center;background-size:cover}
.visual .swiper-slide.v6 .bg>div{background:url(/images/main/visual6.jpg) no-repeat center;background-size:cover}
.visual .swiper-slide.v7 .bg>div{background:#000 url(/images/main/visual7.png) no-repeat center;background-size:cover}
.visual .txtWrap{
	position:absolute;left:0;top:50%;z-index:100;
	width:100%;
	box-sizing:border-box;
	padding:0 3%;
	opacity:0;transform:translate(40px, -50%);
	font-size:8vw;color:#fff;font-weight:600;line-height:1.1em;
	transition:all 1s;
}
.visual .txtWrap span{display:block;font-size:4.8vw;}
.visual.in-view .txtWrap{opacity:1;transform:translateX(0px)translateY(calc(-50% ));}
.visual .ctr{
	display:none;
	position:absolute;right:10%;bottom:15%;z-index:100;
	width:70px;height:70px;
	/*transform:translate(-50%,-50%);*/
	cursor:pointer;
}
.visual .ctr .bg{
	position:absolute;left:50%;top:50%;
	width:100%;height:100%;
	transform:translate(-50%,-50%) rotate(45deg);
	background:#000;
}
.visual .ctr .pageNum{
	display:flex;align-items:center;justify-content:center;
	position:relative;z-index:10;
	width:100%;height:100%;
}
.visual .ctr .pageNum .thisNum{font-size:14px;color:#fff;}
.visual .ctr .pageNum .bar{
	display:block;
	width:1px;height:10px;
	margin:0 10px;
	background:#808080;
}
.visual .ctr .pageNum .totalNum{font-size:14px;color:rgba(255,255,255,0.4);}
.visual .vpaging{bottom:100px;}
.visual .vpaging span{
	width:10px;height:10px;
	margin:0 10px;
	border:1px solid #fff;background:0;
	opacity:1;
}
.visual .vpaging span.swiper-pagination-bullet-active{background:#fff;}




/**/
.mainTitle1{font-size:16px;color:#000;font-weight:600;}
.mainTitle2{font-size:28px;color:#000;font-weight:700;line-height:1.3em;}
.btnMore{font-size:12px;color:#666;font-weight:500;}




/* sec1 */
.sec1{
	padding:100px 3% 100px;
	border-bottom:1px solid #7f7f7f;
}
.sec1 .tit{}
.sec1 .tit>div{font-size:12vw;font-weight:600;color:#000;line-height:1.1em;}
.sec1 .txt{
	margin:100px 0 0;
	text-align:right;
}
.sec1 .txt p{font-size:14px;color:#666;line-height:1.5em;}
.sec1 .txt a{display:block;margin-top:20px;font-size:13px;color:#000;font-weight:500;}





/* sec2 */
.sec2{padding:0 3%;}
.sec2>div{padding:35px 0 100px;border-bottom:1px solid #7f7f7f;}
.sec2>div .conwrap{margin:65px 0 0;}
.sec2>div .conwrap ul{display:none;}
.sec2>div .conwrap .mobileService{padding-bottom:50px;}
.sec2>div .conwrap .mobileService .swiper-slide{width:100%;}
.sec2>div .conwrap .mobileService .swiper-slide .card{
	position:relative;
	width:100%;
	aspect-ratio:408/644;
}
.sec2>div .conwrap .mobileService .swiper-slide.item1 .card{
	background:url(/images/main/sec2_img1.jpg) no-repeat center;
	background-size:cover;
}
.sec2>div .conwrap .mobileService .swiper-slide.item2 .card{
	background:url(/images/main/sec2_img2.jpg) no-repeat center;
	background-size:cover;
}
.sec2>div .conwrap .mobileService .swiper-slide.item3 .card{
	background:url(/images/main/sec2_img3.jpg) no-repeat center;
	background-size:cover;
}
.sec2>div .conwrap .mobileService .swiper-slide.item4 .card{
	background:url(/images/main/sec2_img4.jpg) no-repeat center;
	background-size:cover;
}
.sec2>div .conwrap .mobileService .swiper-slide .card:after{
	display:block;content:"";
	width:100%;height:100%;
	background:rgba(0,0,0,0.4);
	position:absolute;left:0;top:0;
	transform-origin:bottom;
	transform:scaleY(1);
	transition:all 0.6s;
}
.sec2>div .conwrap .mobileService .swiper-slide .card .stit{
	position:absolute;left:20px;top:0;z-index:10;
	width:calc(100% - 40px);
	border-bottom:1px solid #d6d6d6;
}
.sec2>div .conwrap .mobileService .swiper-slide .card .stit>div{
	display:flex;align-items:center;
	width:50%;height:88px;
	border-right:1px solid #d6d6d6;
}
.sec2>div .conwrap .mobileService .swiper-slide .card .stit>div .num{
	flex-shrink: 0;
	font-size:min(6vw, 32px);color:#fff;font-weight:500;text-align:center;
}
.sec2>div .conwrap .mobileService .swiper-slide .card .stit>div .kwangjang{
	flex-shrink: 0; margin-left: 10px;
	font-size:14px;color:#fff;font-weight:500;
}
.sec2>div .conwrap .mobileService .swiper-slide .card .hiddenTxt{
	position:absolute;left:0;bottom:0;z-index:10;
	box-sizing:border-box;
	padding:25px 20px;
	font-size:16px;color:#fff;line-height:1.7em;
	transform:translateY(0px);opacity:1;
	transition:all 0.6s;
}
.sec2>div .conwrap .mobileService .swiper-slide .card .hiddenTxt .htit{display:block;margin-bottom:20px;font-size:24px;}
.sec2>div .conwrap .mobileService .swiper-slide .tit{
	display:none;
	margin-top:25px;font-size:18px;color:#000;font-weight:600;text-align:center;
}

.sec2>div .conwrap .mobileService .swiper-slide:hover .card:after{transform:scaleY(1);}
.sec2>div .conwrap .mobileService .swiper-slide:hover .card .hiddenTxt{
	transform:translateY(0);opacity:1;
	transition:all 0.6s;
}
.sec2>div .conwrap .mobileService .sec2Paging{bottom:0;}
.sec2>div .conwrap .mobileService .sec2Paging span{
	width:10px;height:10px;
	margin:0 10px;
	border:1px solid #000;background:0;
	opacity:1;
}
.sec2>div .conwrap .mobileService .sec2Paging span.swiper-pagination-bullet-active{background:#000;}






/* sec3 */
.sec3{padding:35px 3%;}
.sec3 .titlearea{display:flex;align-items:center;justify-content:space-between;}
.sec3 .conwrap{
	overflow:hidden;
	position:relative;
	padding:45px 0;
}
.sec3 .conwrap .custom-cursor{
	overflow:hidden;
	position: absolute;z-index:200;
	width:54px;height:54px;
	background:#000;
	opacity:0;
	pointer-events: none;
	transform-origin:left;
	display: none !important;
}
.sec3 .conwrap .custom-cursor .icon{
	display:flex;align-items:center;justify-content:center;
	width:54px;height:54px;
	font-size:20px;color:#fff;
}
.sec3 .conwrap .custom-cursor .icon .txt{
	display:flex;align-items:center;
	position:absolute;left:54px;top:0;z-index:10000;
	width:100px;height:100%;
	font-size:14px;color:#fff;
}


.sec3 .conwrap ul{
	display:flex;flex-wrap:wrap;gap:40px;row-gap:60px;
	margin-top:80px;
}
.sec3 .conwrap ul li{width:100%;}
.sec3 .conwrap ul li a{display:inline-block;}
.sec3 .conwrap ul li .thumb{
	position:relative;
	width: 100%;
	aspect-ratio: 345 / 222;
	background:#000;
}
.sec3 .conwrap ul li .thumb img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.sec3 .conwrap ul li .thumb .vod{
	position:absolute;left:0;top:0;z-index:10;
	width:100%;height:100%;
	opacity:0;
	transition:all 0.4s;
}
.sec3 .conwrap ul li:hover .thumb .vod{opacity:1;}
.sec3 .conwrap ul li .thumb .vod video{width:100%;height:100%;object-fit:cover;}
.sec3 .conwrap ul li .tit{margin-top:25px;font-size:16px;color:#000;font-weight:500;}




/* sec4 */
.sec4{padding:0 0 0px;}
.sec4 .textBg{position:relative;margin:50px 0;padding:5vh 0 5vw 0;}
.sec4 .textBg .txt{
	position:absolute;left:0%;top:0;display:flex;white-space:nowrap;
	font-size:15vw;font-weight:700;line-height:1em;
	font-family:"pretendard";color:transparent;
	-webkit-text-stroke: 1px #000;
}
.sec4 .textBg .txt>div{margin-right:40px;}
.sec4 .textBg .fillCanvas{
    position:absolute;
    left:0;top:0;
    z-index:2;
    pointer-events:none;
    display:none;
}
@keyframes textScroll {
	0%{
		transform: translate(0, 0);
	}
	100%{
		transform: translate(-50%, 0);
	}
}




/* sec5 */
.sec5{
	overflow:hidden;
	position:relative;
	width:100%;height:100vh;
}
.sec5 .projectList{
	overflow:hidden;
	position:relative;
	width:100%;height:100vh;
}
.sec5 .projectList ul{}
.sec5 .projectList ul li{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    clip-path: inset(0 0 0 0);
    z-index: 1;
}
.sec5 .projectList ul li:nth-child(1){z-index:30;}
.sec5 .projectList ul li:nth-child(2){z-index:20;}
.sec5 .projectList ul li:nth-child(3){z-index:10;}
.sec5 .projectList>ul>li .bg{
	position: absolute;
	left:0;
	top:0;
	width:100%;height:100vh;
}
.sec5 .projectList>ul>li .info{
	position:absolute;left:3%;bottom:105px;
	box-sizing:border-box;
	width:94%;	
}
.sec5 .projectList>ul>li .info .tit1{font-size:16px;color:#fff;}
.sec5 .projectList>ul>li .info .tit2{margin:30px 0 0;font-size:10vw;color:#fff;font-weight:500;}
.sec5 .projectList>ul>li .info .tit3{font-size:18px;color:#fff;font-weight:500;}
.sec5 .projectList>ul>li .info .line{width:100%;height:1px;margin:40px 0 50px;background:rgba(255,255,255,0.5);}
.sec5 .scrollDown{
	position:absolute;left:50%;top:40%;z-index:100;
	transform:translate(-50%,-50%);
	width:110px;height:110px;
	display: none !important;
}
.sec5 .scrollDown .bg{
	position:absolute;left:50%;top:50%;
	width:100%;height:100%;
	transform:translate(-50%,-50%) rotate(45deg);
	background:#000;
}
.sec5 .scrollDown .con{
	display:flex;align-items:center;justify-content:center;
	position:relative;z-index:10;
	width:100%;height:100%;
}
.sec5 .scrollDown .con .num{
	display:flex;align-items:center;justify-content:center;
}
.sec5 .scrollDown .con .num .sec5ThisNum{font-size:14px;color:#fff;}
.sec5 .scrollDown .con .num .bar{width:15px;height:1px;margin:0 10px;background:rgba(255,255,255,0.4);}
.sec5 .scrollDown .con .num .sec5TotalNum{font-size:14px;color:rgba(255,255,255,0.4);}
.sec5 .scrollDown .con .txt{margin-top:7px;font-size:12px;color:#fff;text-align:center;}





/* sec6 */
.sec6{padding:100px 3% 100px;}
.sec6 .inner{
	padding:35px 0 0;
	border-top:1px solid #7f7f7f;
}
.sec6 .titlearea{display:flex;align-items:center;justify-content:space-between;}
.sec6 h4{padding:45px 0 90px;}
.sec6 .conwrap{display:none;}
.sec6 .mobileESG{}
.sec6 .mobileESG .swiper-slide{
	box-sizing:border-box;
	display:flex;align-items:center;justify-content:center;
	width:100%;padding:20vh 5%;
	border-bottom:1px solid #fff;
	text-align:center;
}
.sec6 .mobileESG .swiper-slide.item1{
	background:url(/images/main/sec6_bg1.jpg) no-repeat center;
	background-size:cover;
}
.sec6 .mobileESG .swiper-slide.item2{
	background:url(/images/main/sec6_bg2.jpg) no-repeat center;
	background-size:cover;
}
.sec6 .mobileESG .swiper-slide.item3{
	background:url(/images/main/sec6_bg3.jpg) no-repeat center;
	background-size:cover;
}
.sec6 .mobileESG .swiper-slide.item4{
	background:url(/images/main/sec6_bg4.jpg) no-repeat center;
	background-size:cover;
}

.sec6 .mobileESG .swiper-slide .icon{height:60px;}
.sec6 .mobileESG .swiper-slide .tit{margin:40px 0 20px;font-size:24px;color:#fff;font-weight:500;}
.sec6 .mobileESG .swiper-slide .kr{font-size:17px;color:#fff;font-weight:500;}
.sec6 .mobileESG .swiper-slide .txt{margin-top:10px;font-size:14px;color:#fff;line-height:1.7em;}
.sec6 .mobileESG .sec6Paging{bottom:40px;}
.sec6 .mobileESG .sec6Paging span{
	width:10px;height:10px;
	margin:0 10px;
	border:1px solid #fff;background:0;
	opacity:1;
}
.sec6 .mobileESG .sec6Paging span.swiper-pagination-bullet-active{background:#fff;}





/* sec7 */
.sec7{padding:0 3%;}
.sec7 .inner{
	padding:35px 0 100px;
	border-top:1px solid #7f7f7f;
}
.sec7 .titlearea{display:flex;align-items:center;justify-content:space-between;}
.sec7 h4{padding:45px 0 90px;}
.sec7 .conwrap{
	overflow:hidden;
	position:relative;
}
.sec7 .conwrap ul{display:flex;flex-wrap:wrap;}
.sec7 .conwrap ul li{
	box-sizing:border-box;
	width:50%;
	padding:40px 5% 20px;
	text-align:center;
}
.sec7 .conwrap ul li .icon{}
.sec7 .conwrap ul li .icon svg{width:50%;margin:0 auto;}
.sec7 .conwrap ul li .icon>div{
	display:flex;align-items:center;justify-content:center;
	width:84px;height:84px;
	margin:0 auto;
	background:#000;
	border-radius:50%;
}
.sec7 .conwrap ul li .icon circle,
.sec7 .conwrap ul li .icon polyline,
.sec7 .conwrap ul li .icon line,
.sec7 .conwrap ul li .icon path{}
.sec7 .conwrap ul li.in-view:nth-child(1) .icon circle{
	stroke-dasharray:200px;stroke-dashoffset:200px;
	animation:svgImg1 2s;animation-fill-mode:forwards;
}
.sec7 .conwrap ul li.in-view:nth-child(1) .icon polyline{
	stroke-dasharray:50px;stroke-dashoffset:50px;
	animation:svgImg2 2s;animation-fill-mode:forwards;
}
.sec7 .conwrap ul li.in-view:nth-child(1) .icon line{
	stroke-dasharray:20px;stroke-dashoffset:20px;
	animation:svgImg3 2s;animation-fill-mode:forwards;
}
.sec7 .conwrap ul li.in-view:nth-child(2) .icon line{
	stroke-dasharray:50px;stroke-dashoffset:50px;
	animation:svgImg2 2s;animation-fill-mode:forwards;
}
.sec7 .conwrap ul li.in-view:nth-child(2) .icon path{
	stroke-dasharray:180px;stroke-dashoffset:180px;
	animation:svgImg4 2s;animation-fill-mode:forwards;
}
.sec7 .conwrap ul li.in-view:nth-child(3) .icon line{
	stroke-dasharray:20px;stroke-dashoffset:20px;
	animation:svgImg3 2s;animation-fill-mode:forwards;
}
.sec7 .conwrap ul li.in-view:nth-child(3) .icon path{
	stroke-dasharray:100px;stroke-dashoffset:100px;
	animation:svgImg5 2s;animation-fill-mode:forwards;
}
.sec7 .conwrap ul li.in-view:nth-child(4) .icon line{
	stroke-dasharray:20px;stroke-dashoffset:20px;
	animation:svgImg3 2s;animation-fill-mode:forwards;
}
.sec7 .conwrap ul li.in-view:nth-child(4) .icon polyline{
	stroke-dasharray:180px;stroke-dashoffset:180px;
	animation:svgImg4 2s;animation-fill-mode:forwards;
}
.sec7 .conwrap ul li.in-view:nth-child(4) .icon path{
	stroke-dasharray:100px;stroke-dashoffset:100px;
	animation:svgImg5 2s;animation-fill-mode:forwards;
}
.sec7 .conwrap ul li .tit{
	margin:40px 0 20px;
	font-size:18px;color:#000;font-weight:700;line-height:1.2em;
}
.sec7 .conwrap ul li .txt{font-size:12px;color:#555;line-height:1.7em;}

@keyframes svgImg1{
	0%{stroke-dashoffset: 200px;}
	100%{stroke-dashoffset: 0;}
}
@keyframes svgImg2{
	0%{stroke-dashoffset: 50px;}
	100%{stroke-dashoffset: 0;}
}
@keyframes svgImg3{
	0%{stroke-dashoffset: 20px;}
	100%{stroke-dashoffset: 0;}
}
@keyframes svgImg4{
	0%{stroke-dashoffset: 180px;}
	100%{stroke-dashoffset: 0;}
}
@keyframes svgImg5{
	0%{stroke-dashoffset: 100px;}
	100%{stroke-dashoffset: 0;}
}






/* sec8 */
.sec8{padding:0 3%;}
.sec8 .inner{padding:0 0 100px;}
.sec8 .titlearea{display:flex;align-items:center;justify-content:space-between;}
.sec8 h4{padding:45px 0 90px;}
.sec8 .conwrap{position:relative;}
.sec8 .conwrap:before{
	display:block;content:"";
	position:absolute;left:-50%;top:0;
	width:200%;height:1px;
	background:#ccc;
}
.sec8 .conwrap:after{
	display:block;content:"";
	position:absolute;left:-50%;bottom:0;
	width:200%;height:1px;
	background:#ccc;
}
.sec8 .conwrap .news{}
.sec8 .conwrap .news .swiper-slide{	
	box-sizing:border-box;
	max-width:448px;
	margin-right:-1px;
	box-shadow:1px 1px 0 #ccc inset, -1px -1px 0 #ccc inset;
}
.sec8 .conwrap .news .swiper-slide a{
	display:block;
	padding:35px 15px;
}
.sec8 .conwrap .news .swiper-slide a .date{font-size:14px;color:#000;font-weight:500;}
.sec8 .conwrap .news .swiper-slide a .thumb{
	margin:30px 0;
	width: 100%;
	aspect-ratio: 380 / 226;
}
.sec8 .conwrap .news .swiper-slide a .thumb img{
	width:100%;
	height:100%;
	object-fit:cover;
}
.sec8 .conwrap .news .swiper-slide a .tit{
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
	font-size:18px;color:#000;font-weight:600;
}
.sec8 .conwrap .news .swiper-slide a .txt{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	height: 3.4em;
	margin:15px 0 25px;
	font-size:14px;color:#555;line-height:1.7em;word-break:break-word;
}
.sec8 .conwrap .news .swiper-slide a .more{font-size:12px;color:#555;}





/* sec9 */
.sec9{}
.sec9 .inner{display:flex;flex-wrap:wrap;justify-content:space-between;padding:0 0 0;}
.sec9 .inner .txtarea{
	box-sizing:border-box;
	width:47%;
	padding:35px 3% 75px;
	border-top:1px solid #7f7f7f;border-bottom:1px solid #7f7f7f;
}
.sec9 .inner .txtarea h4{margin:70px 0 0;}
.sec9 .inner .txtarea .line{
	width:1px;height:50px;
	background:#ccc;
	margin:35px 0;
}
.sec9 .inner .txtarea p{font-size:14px;color:#666;line-height:1.7em;}
.sec9 .inner .banner{
	display:flex;align-items:center;justify-content:center;
	position:relative;
	width:47%;
}
.sec9 .inner .banner .bg{
	position:absolute;left:0;top:0;
	width:100%;height:100%;
	background:url(/images/main/sec9_bg.jpg) no-repeat;
	background-size:cover;
}
.sec9 .inner .banner .btn{
	display:flex;align-items:center;justify-content:center;
	position:absolute;left:50%;top:50%;z-index:100;
	width:100px;height:100px;
	transform:translate(-50%,-50%);
	background:0;border:1px solid #fff;
	text-align:center;
}
.sec9 .inner .banner .btn a{display:block;}
.sec9 .inner .banner .btn .tit{font-size:14px;color:#fff;font-weight:500;}
.sec9 .inner .banner .btn .arr{margin-top:5px;font-size:17px;color:#fff;}
.sec9 .inner .banner .deco{
	overflow:hidden;
	position:absolute;left:0;top:0;
	width:100%;height:100%;
}
.sec9 .inner .banner .deco svg{width:100%;height:100%;object-fit:cover;}
.sec9 .inner .banner .deco>div{}
.sec9 .inner .banner .deco>div.d1{position:absolute;left:-10vw;bottom:-5px;width:100%;height:90%;}
.sec9 .inner .banner .deco>div.d1 .g2{opacity:0;}
.sec9 .inner .banner .deco>div.d2{position:absolute;right:0px;top:0px;}
.sec9 .inner .banner .deco>div.d2 .g2{opacity:0;}



@media(max-width:1060px){

	.sec9 .inner{display:block;}
	.sec9 .inner .txtarea{width:100%;}
	.sec9 .inner .banner{width:100%;height:50vh;}

}





/* animation */
.sec1 .txt p{opacity:0;transform:translateX(-60px);transition:all 1.4s;}
.sec1 .txt a{opacity:0;transform:translateX(-60px);transition:all 1.4s;}

.sec1 .txt.in-view p{opacity:1;transform:translateX(0);transition:all 1.4s;}
.sec1 .txt.in-view a{opacity:1;transform:translateX(0);transition:all 1.4s 0.2s;}

.sec2>div .conwrap ul li{opacity:0;transform:translateY(60px);}

.sec2>div .conwrap ul li.in-view{opacity:1;transform:translateY(0);}
.sec2>div .conwrap ul li.in-view:nth-child(1){transition:all 1.4s;}
.sec2>div .conwrap ul li.in-view:nth-child(2){transition:all 1.4s 0.2s;}
.sec2>div .conwrap ul li.in-view:nth-child(3){transition:all 1.4s 0.4s;}
.sec2>div .conwrap ul li.in-view:nth-child(4){transition:all 1.4s 0.6s;}

.sec2>div .conwrap .mobileService{opacity:0;transform:translateY(60px);}
.sec2>div .conwrap .mobileService.in-view{opacity:1;transform:translateY(0); transition: all 1.4s;}

.sec3 h4{opacity:0;transform:translateX(60px);transition:all 1.4s;}
.sec3 h4.in-view{opacity:1;transform:translateX(0);transition:all 1.4s;}
.sec3 ul li{opacity:0;transform:scale(0.8) translateY(60px);}
.sec3 ul li.in-view{opacity:1;transform:scale(1) translateY(0);transition:all 1.4s;}
.sec3 ul li.in-view .thumb:after{
	transition:all 1.4s;
	transform:translateX(-50%) scaleY(0);
}

.sec6 .titlearea h3{opacity:0;transform:translateX(60px);transition:all 1.4s;}
.sec6 .titlearea.in-view h3{opacity:1;transform:translateX(0);transition:all 1.4s;}
.sec6 h4{opacity:0;transform:translateX(60px);transition:all 1.4s;}
.sec6 h4.in-view{opacity:1;transform:translateX(0);transition:all 1.4s 0.1s;}

.sec6 .mobileESG{opacity:0;transform:translateY(60px);}
.sec6 .mobileESG.in-view{opacity:1;transform:translateY(0); transition: all 1.4s;}

.sec7 .titlearea h3{opacity:0;transform:translateX(60px);transition:all 1.4s;}
.sec7 .titlearea.in-view h3{opacity:1;transform:translateX(0);transition:all 1.4s;}
.sec7 h4{opacity:0;transform:translateX(60px);transition:all 1.4s;}
.sec7 h4.in-view{opacity:1;transform:translateX(0);transition:all 1.4s 0.1s;}

.sec8 .titlearea h3{opacity:0;transform:translateX(60px);transition:all 1.4s;}
.sec8 .titlearea.in-view h3{opacity:1;transform:translateX(0);transition:all 1.4s;}
.sec8 h4{opacity:0;transform:translateX(60px);transition:all 1.4s;}
.sec8 h4.in-view{opacity:1;transform:translateX(0);transition:all 1.4s 0.1s;}

.sec9 .inner .txtarea h3{opacity:0;transform:translateX(60px);transition:all 1.4s;}
.sec9 .inner .txtarea.in-view h3{opacity:1;transform:translateX(0);transition:all 1.4s;}
.sec9 .inner .txtarea h4{opacity:0;transform:translateX(60px);transition:all 1.4s;}
.sec9 .inner .txtarea.in-view h4{opacity:1;transform:translateX(0);transition:all 1.4s 0.1s;}
.sec9 .inner .txtarea .line{transform:scaleY(0);transform-origin:top;transition:all 1.4s;}
.sec9 .inner .txtarea.in-view .line{transform:scaleY(1);transition:all 1.4s 0.1s;}
.sec9 .inner .txtarea p{opacity:0;transform:translateX(60px);transition:all 1.4s;}
.sec9 .inner .txtarea.in-view p{opacity:1;transform:translateX(0);transition:all 1.4s 0.6s;}