@charset "utf-8";
.pcbr{display:block;}
.ptbr{display:block;}
.tbbr{display:none;}
.tmbr{display:none;}
.mbbr{display:none;}
.pc_view{display:block !important;}
.pt_view{display:block !important;}
.t_view{display:none !important;}
.tm_view{display:none !important;}
.m_view{display:none !important;}
.dn{display:none;}
#wrap{overflow-x:hidden;position: relative;background: #ff2a1c;}
* {font-family:"Wix Madefor Display", "Noto Sans KR","돋움",dotum,sans-serif;box-sizing:border-box;}


#custom_cursor{width: 150px;height: 150px;position: fixed;top: 0;left: 0;z-index: 15000;pointer-events: none;}
.custom_cursor_inner {display: block;width: 100%;height: 100%;position: relative;top: 50%;left: 50%;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
.custom_hover_circle{display: block;width: 0;height: 0;position: absolute;top: 50%;left: 50%;margin-top: -106px;margin-left: -106px;overflow: hidden;opacity: 0;border-radius: 50%;}
.custom_hover_circle {z-index: 1;background:#ff2a1c;
font-size:15px;color:#fff; font-weight: 400;transition:transform 0.4s; display: flex;align-items: center;justify-content: center;}
.custom_hover_circle span{display: inline-block; margin-right: 4px; white-space: nowrap;}



.sec1{position: relative;overflow:hidden;width:100%;max-width:100%;height:100vh;/* max-height:1080px; */background: #fff;}

.sec1 .visual{
position: relative;
width:100%;height: 100%;

}
.sec1 .visual .v-swiper{
	width:100%;height:100%;position: relative;
	/* display: flex;align-items:end;justify-content:center; */
}
.sec1 .visual .v-swiper .swiper-slide{
	width:100%;position: relative;display: flex;align-items:end;justify-content:center;
}

.sec1 .visual .videoarea{
	position: absolute;top:50%;left:50%;
	transform:translate(-50%, -50%);
	/* background: url(/images/main/visual_img.jpg)no-repeat center / cover; */
	width:100%;height:100%;
	z-index:1;overflow:hidden;
}
.sec1 .visual .videoarea .bg{
	width:100%;height:100%;
	background: url(/images/main/sec4_img1.png)no-repeat center / cover;
}
.sec1 .visual .videoarea video{width:100%;height: 100%;object-fit:cover;}
.sec1 .visual .titlearea{
	width:100%;text-align: center;
	position: relative;z-index:10;
	padding-bottom:20vh;
}
.sec1 .visual .titlearea h2{
color:#fff;font-size:164px; font-family: "Wix Madefor Display", serif;font-weight: 700;
font-size:clamp(120px,9vw, 164px);
}
.sec1 .visual .titlearea p{
font-size:28px;color:#fff;font-weight: 350;margin-top: 28px;
}
.sec1 .visual .scroll{
	position: absolute;bottom:-120px;
	left:50%;transform:translateX(-50%);
	width:210px;height:210px;border-radius:50%;
	border:1px solid rgba(255,255,255,0.3);
	display: flex;justify-content:center;
	z-index:100;
}
.sec1 .visual .scroll>div{
	box-sizing:border-box;padding-top: 45px;
}
.sec1 .visual .scroll span{font-size:12px;color:#fff;font-weight: 300;display: block;}
.sec1 .visual .scroll i{
	display: block;
	background: url(/images/main/visual_scroll_arr.png)no-repeat center;
	width:12px;height:7px;
	margin:8px auto 0;
}

.visual .ctr{
	/* display:flex;align-items:center;justify-content:center;
	position:absolute;left:0;bottom:50px;z-index:10;width:100%;text-align:center; */
}
.visual .ctr .vprev{
	/* width:10px;height:16px;
	background:url(/images/main/vprev.png) no-repeat;
	cursor:pointer; */
	     position: absolute;
        left: 30px;
        top: 50%;
        transform: translateY(-50%);
        width: 75px;
        height: 75px;
        border-radius: 50%;
		/* background: rgba(255, 255,  255, 0.2);
		/* background: rgba(255, 255, 255, 0.2); */
        cursor: pointer;
        z-index: 100;
}
.visual .ctr .vnext{
	/* width:10px;height:16px;
	background:url(/images/main/vnext.png) no-repeat;
	cursor:pointer; */
 position: absolute;
right: 30px;
top: 50%;
transform: translateY(-50%);
width: 75px;
height: 75px;
border-radius: 50%;
/*  background: rgba(255, 255, 255, 0.2); */
cursor: pointer;
z-index: 100;
margin-left: 5px;
}
.visual .ctr .vprev i{
	position: absolute;
        left: 50%;
        top: 50%;
       transform: translate(-50%, -50%) rotate(90deg);
        width: 28px;
        height: 18px;
        background: url(/images/main/vprev.png) no-repeat center / cover;
}
.visual .ctr .vnext i{
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%) rotate(270deg);
width: 28px;
        height: 18px;
        background: url(/images/main/vprev.png) no-repeat center / cover;
}
.visual .vpaging{position: absolute;bottom: 15%; left: 50%;z-index:10;transform:translateX(-50%);text-align: center;}
.visual .vpaging .swiper-pagination-bullet { width: 10px; height: 10px; background: transparent; border: 1px solid #fff; opacity: 1; margin:0 7px;}
.visual .vpaging .swiper-pagination-bullet-active{width: 22px; transition: width .9s; border-radius: 5px; background: #fff; border: 1px solid transparent; }




section .titlewrap{margin:0 auto;width:94%;max-width:1480px;display: flex;align-items:end;justify-content:space-between;}
section .titlewrap.type2{display: block;}
section .titlewrap.type2 .title{margin-bottom: 50px;}
section .titlewrap h3{color:#000000;font-size:clamp(100px,7vw,110px);font-weight: bold;margin-bottom: 10px;}
section .titlewrap p{font-size:20px;color:#444444;font-weight: 400;font-family: "Noto Sans KR";line-height:1.6em;}
section .view_more{
box-sizing:border-box;display: flex;align-items:center;justify-content:center;
width:180px;border-radius:29px;
height:58px;
border:1px solid rgba(34,34,34, 0.4);
position: relative;
overflow:hidden;
}
section .view_more>span{
position: relative;z-index:10; font-family: "Poppins", sans-serif;color:#222;font-weight: 400;font-size:14px;

}
section .view_more>i{
position: relative;z-index:10;display: block;
width:21px;height: 19px;
background: url(/images/main/view_more_arr.png)no-repeat center / cover;
margin-left: 40px;
}
section .view_more.wht{border:1px solid rgba(255,255,255,0.4);}
section .view_more.wht>span{color:#fff;}
section .view_more.wht>i{
background: url(/images/main/view_more_arr_wht.png)no-repeat center / cover;
}

/*sec3*/
.sec3{
width:100%;background: url(/images/main/sec3_bg.jpg)no-repeat left bottom / cover;
box-sizing:border-box;
padding:230px 0;
}
.sec3 .titlewrap{display: block;}

.sec3 .view_more{margin-top: 1.6vw;}
.sec3 .innerwrap{
width:94%;max-width:1480px;margin:0 auto;
}
.sec3 .box-list{display: flex;flex-wrap:wrap;gap:1.56vw;}
.sec3 .box-list>li{
width:calc((100% - 1.56vw * 2) / 3);
max-width:24.6vw;
overflow:hidden;border-radius:5.2vw;
max-width:473px;
height:23.3vw;
max-height:373px;
position: relative;
overflow:hidden;
}
.sec3 .box-list>li>a{
position: relative;display: block;width:100%;height:100%;
box-sizing:border-box;
padding:3.6vw 1.6vw;
padding-right: 2vw;
display: flex;
align-items:end;
}
.sec3 .box-list>li .bg{
position: absolute;
top:50%;left:50%;
transform:translate(-50%, -50%);
width:100%;height: 100%;
z-index:1;

}
.sec3 .box-list>li:nth-child(2) .bg{background: url(/images/main/sec3_img1.jpg)no-repeat center / cover;}
.sec3 .box-list>li:nth-child(3) .bg{background: url(/images/main/sec3_img2.jpg)no-repeat center / cover;}
.sec3 .box-list>li:nth-child(4) .bg{background: url(/images/main/sec3_img3.jpg)no-repeat center / cover;}
.sec3 .box-list>li:nth-child(5) .bg{background: url(/images/main/sec3_img4.jpg)no-repeat center / cover;}
.sec3 .box-list>li:nth-child(6) .bg{background: url(/images/main/sec3_img5.jpg)no-repeat center / cover;}
.sec3 .box-list>li .info{
position: relative;z-index:10;
}
.sec3 .box-list>li .info h5{
font-family: "Noto Sans KR";color:#fff;font-weight:600;font-size:clamp(32px, 4vw,40px);
}
.sec3 .box-list>li .info p{
font-family: "Noto Sans KR";color:rgba(255,255,255,0.6);font-weight: 400;font-size:17px;line-height: 1.65em;
margin-top: 20px;word-break:keep-all;word-wrap:normal;
display: none;
/* 호버스크립트로제어 */
}
.sec3 .box-list>li .bg{transition:all 0.4s ease-in-out;}
.sec3 .box-list>li:hover .bg{
	transform:scale(1.1) translate(-50%, -50%);
	transition:all 0.4s ease-in-out;
}


/*sec4*/
/* .sec4{position: relative;width:100%;height:100vh;max-height:980px;overflow:hidden;background: #fff;}
.sec4 .bgarea{}
.sec4 .bgarea img{
	position: absolute;bottom:0;left:50%;
	transform:translate(-50%, 0%);
	max-width:100%;
	min-height:853px;
	display: block;margin:0 auto;
}
.sec4 .title-motion{
position: absolute;z-index:100;
top:50%;left:80%;transform:translate(0%, -50%);

}
.sec4 .title-motion>strong{
display: block;color:#ff2a1c;font-size:164px;font-weight: 700;
white-space:nowrap;
} */
/*sec5*/
.sec5{position: relative;width:100%;overflow:hidden;box-sizing:border-box;padding-top: 130px;background: #fff;}
.sec5 .titlewrap{margin-bottom:80px;}
.sec5 .rnd{
width:100%;max-width:100%;height:calc(100vh - 100px);max-height:830px;
background: url(/images/main/sec5_rnd_bg.jpg)no-repeat center top / cover;
overflow:hidden;
position: relative;
}

.sec5 .rnd .door-inner{height:100%;}
.sec5 .rnd .door-inner.complete{
width:100%;border-radius:0;
height:100%;

}
.sec5 .rnd .door-inner .door{
position: absolute;
top: 0;
z-index: 3;
width: calc((100vw - 720px) / 2);
height: 100%;
background-color: #fff;
}
.sec5 .rnd .door-inner .door.is-left{left:0;/* transform:translate3d(-100%, 0, 0); */}
.sec5 .rnd .door-inner .door.is-right{right:0;/* transform:translate3d(100%, 0, 0); */}
.sec5 .rnd .door-inner .conarea{
width:100%;height:100%;
}
.sec5 .rnd .conarea>a{
display: block;width: 100%;height: 100%;
display: flex;align-items:center;justify-content:center;
}
.sec5 .rnd .door-inner .conarea .title{
text-align: center;
}

.sec5 .rnd .door-inner .conarea .title strong{
display: block;font-size:52px;color:#fff;
font-weight: 600;

}

/*sec6*/
.sec6{width:100%;overflow:hidden;background: #fff;
padding: 0 11.14vw;box-sizing:border-box;margin:0 auto;position: relative;padding-top: 240px;padding-bottom: 240px;}
.sec6 .conwrap{
display: flex;align-items:center;justify-content:space-between;
}
.sec6 .conwrap .leftarea{width:50%;}
.sec6 .titlewrap{width:auto;max-width:unset;}
.sec6 .conwrap .rightarea{width:50%;}
.sec6 .conwrap .leftarea #thumb-slider{margin-top: 120px;max-width:720px;width:100%;min-height:calc(156px * 3);}
.sec6 .conwrap .leftarea #thumb-slider .swiper-wrapper{display: block !important;}
.sec6 .conwrap .leftarea #thumb-slider .swiper-wrapper>div{width: 100% !important;cursor:pointer;height:110px;
padding-top:30px;padding-bottom: 30px;box-sizing:border-box;
display: flex;align-items:center;position: relative;z-index:10;transition:all 0.6s ease;
}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide:after{
	position: absolute;content:'';background: #c5c6c7;height:1px;width:100%;
	right:0;bottom:0px;z-index:50;transition:width 0.6s ease;
}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide.swiper-slide-thumb-active{transition:all 0.4s ease;}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide.swiper-slide-thumb-active:after{
	position: absolute;content:'';background: #000;height:2px;width:100%;transition:width 0.6s ease;
	right:0;bottom:0px;z-index:50;
}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide:last-child:after{display: none;}

.sec6 .conwrap .leftarea #thumb-slider .swiper-slide .icon{
position: absolute;width:50px;height:50px;background:#818182;border-radius:17px;margin-right: 20px;
top:50%;transform:translateY(-50%);
}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide .icon:before{
	position: absolute;content:'';
	width:35px;height:35px;
	top:50%;left:50%;transform:translate(-50%, -50%);
	background: url(/images/main/sec6_icon1.png)no-repeat center;
}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide:nth-child(2) .icon:before{background: url(/images/main/sec6_icon2.png)no-repeat center;transform:translate(-50%, -50%);}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide:nth-child(3) .icon:before{background: url(/images/main/sec6_icon3.png)no-repeat center;transform:translate(-50%, -50%);}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide .tit{width:calc(100% - 50px);padding-left: 70px;margin-right: 30px;}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide .tit strong{font-size:26px;color:#818182;font-weight: bold;}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide .tit p{display: none;font-size:16px;color:rgba(0,0,0,0.7);line-height:1.25em;
font-family: "Noto Sans KR", sans-serif;
margin-top:8px;/* padding-bottom: 8px; */}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide .sec6_btn{display: none;}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide.swiper-slide-thumb-active{align-items:center;
height:156px !important;padding-top:30px;padding-bottom: 30px;}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide.swiper-slide-thumb-active .icon{width:94px;height:94px;background:#ff2a1c;border-radius:22px;}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide.swiper-slide-thumb-active .icon:before{
background: url(/images/main/sec6_icon1_hover.png)no-repeat center;
width: 58px;height: 58px;transform:translate(-50%, -50%);}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide:nth-child(2).swiper-slide-thumb-active .icon:before{
background: url(/images/main/sec6_icon2_hover.png)no-repeat center;
}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide:nth-child(3).swiper-slide-thumb-active .icon:before{
background: url(/images/main/sec6_icon3_hover.png)no-repeat center;
}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide.swiper-slide-thumb-active .tit{padding-left: 123px;}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide.swiper-slide-thumb-active .tit strong{font-size:32px;color:#000;}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide.swiper-slide-thumb-active .tit p{display: block;}
.sec6 .conwrap .leftarea #thumb-slider .swiper-slide.swiper-slide-thumb-active .sec6_btn{
width:73px;
display: block;padding-bottom: 8px;font-family:"Acumin", sans-serif;
font-size:13px;color:rgba(0,0,0,0.8);white-space:nowrap;
text-decoration: underline;text-underline-offset:3px;text-decoration-color:#b1b2b3;
}
.sec6 .conwrap .rightarea{}
.sec6 .conwrap .rightarea .circle-area{
max-width: 1000px;
max-height: 1000px;
transform: translate(12%);
width:55vw;height:55vw;position: relative;
}
.sec6 .conwrap .rightarea .circle-area #main-slider{
	width:100%;height: 100%;
	/* padding:3vw; */position: absolute;inset:0%;
	padding:3.5vw;
	
}
.sec6 .conwrap .rightarea .circle-area #main-slider .swiper-wrapper{
	align-items: center;
    width: 100%;
    height: 100%;
    display: flex;
}
.sec6 .conwrap .rightarea .circle-area #main-slider .list{
	max-width:864px !important;
	max-height:864px !important;
	height:100%;
	width:50vw !important;height:50vw !important;
	
}
.sec6 .conwrap .rightarea .circle-area #main-slider .list>span{
	display: block;width: 100%;height: 100%;
	background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}
.sec6 .conwrap .rightarea .circle-area .circle-line-wrap{
	outline-color: #cccccc;
    outline-offset: -1px;
    border-radius: 100%;
    outline-width: 3px;
    outline-style: solid;
    position: absolute;
    inset: 0%;
    transform: rotate(0deg);
	transition:transform 0.5s ease;
	
	 /*  animation: circle-line-ani 20s steps(4) infinite; */
}
.sec6 .conwrap .rightarea .circle-area .circle-line-wrap>div{
background-color: #cccccc;
width: 16px;
height: 16px;
border-radius:50%;
position: absolute;
}
.sec6 .conwrap .rightarea .circle-area .circle-line-wrap>div.top{
    left: 50%;
    transform: translate(-50%, -50%);
}
.sec6 .conwrap .rightarea .circle-area .circle-line-wrap>div.left{
  top:50%;
    transform: translate(-50%, -50%);
}
.sec6 .conwrap .rightarea .circle-area .circle-line-wrap>div.bottom{
   top:100%;left:50%;
    transform: translate(-50%, -50%);
}
.sec6 .conwrap .rightarea .circle-area .circle-line-wrap>div.right{
	top:50%;
    left: 100%;
    transform: translate(-50%, -50%);
}

@keyframes circle-line-ani{
0%{transform: rotate(0deg);}
25%{transform: rotate(-90deg);}
50%{transform: rotate(-180deg);}
75%{transform: rotate(-270deg);}
100%{transform: rotate(-360deg);}
}


/*sec7*/
.sec7{width:100%;overflow:hidden;
background: url(/images/main/sec7_bg.jpg)no-repeat left bottom / cover;
box-sizing:border-box;
height:1130px;
}
.sec7 .innerwrap{
width:100%;display: flex;height:100%;
}
.sec7 .titlewrap{
max-width:none;
width:calc(100% - 61%);
margin:0;
box-sizing:border-box;
padding-left: 11.45vw;
padding-top: 220px;
}
.sec7 .titlewrap h3{color:#fff;margin-bottom: 5px;}
.sec7 .titlewrap p{color:#fff;}
.sec7 .merit{width:61%;height:100%;}
.sec7 .merit .list{
display: flex;flex-wrap:wrap;height:100%;width:100%;
position: relative;
}
.sec7 .merit .list:before{
position: absolute;content:'';
width:1px;height:100%;
background: rgba(255,255,255,0.4);
top:0;left:50%;
transform:translateX(-50%);
}
.sec7 .merit .list:after{
position: absolute;content:'';
width:1px;height:100%;
background: rgba(255,255,255,0.4);
top:0;left:0;

}
.sec7 .merit .list>li{
width:50%;
height:50%;

display: flex;flex-direction:column;
justify-content:center;
box-sizing:border-box;
padding-left: 3.125vw;
position: relative;
}
.sec7 .merit .list>li:before{
	position: absolute;content:'';
	width:100%;height:1px;
	background:rgba(255,255,255,0.4);
	bottom:0;left:0;
}
.sec7 .merit .list>li:nth-child(3):before,
.sec7 .merit .list>li:nth-child(4):before{
display: none;
}
.sec7 .merit .list>li .icon{}
.sec7 .merit .list>li .num{font-size:18px;font-weight: 400;color:#fff;margin-bottom: 22px;margin-top: 36px;}
.sec7 .merit .list>li p{
font-size:36px;color:#fff;
font-weight: 550;
}

.sec7 .merit .list>li:nth-child(1){border-left:0;transform:translateY(57px);}
.sec7 .merit .list>li:nth-child(3){border-left:0;transform:translateY(57px);padding-bottom:75px;}
.sec7 .merit .list>li:nth-child(2){transform:translateY(-20px);}
.sec7 .merit .list>li:nth-child(4){transform:translateY(-20px);}

/*sec8*/
.sec8{background: #fff;position: relative;max-width:100%;width:100%;overflow:hidden;padding-top:228px;box-sizing:border-box;padding-bottom: 210px;}
.sec8 .client-wrap .client-slide1{}
.sec8 .client-wrap .client-slide2{}
.sec8 .client-wrap {overflow: hidden;margin-top: 80px; height: 305px;}
.sec8 .client-wrap > div {display: flex;justify-content: flex-start;white-space: nowrap;}
.sec8 .client-wrap > div + div {margin-top:170px;}
.sec8 .client-wrap ul {display:flex; position: absolute;}
.sec8 .client-wrap ul li {width:337px;height:135px;background:#f7f7f7;
display: flex;align-items:center;justify-content:center;margin: 0 17px;}
.sec8 .client-wrap > div ul{animation:clientSlideAni 18s infinite linear;}
.sec8 .client-wrap > div ul + ul{animation:clientSlideAni2 18s infinite linear;}
.sec8 .client-wrap > div.client-slide2 ul{animation-direction: reverse;}
@keyframes clientSlideAni {
  from   { transform: translateX(0%); }
  to { transform: translateX(-100%); }
}
@keyframes clientSlideAni2 {
  from   { transform: translateX(100%); }
  to { transform: translateX(0%); }
}

/*sec9*/
.sec9{
background: #fff;
width:100%;max-width:100vw;height:100vh;
position: relative;
display: flex;justify-content:flex-end;

}
.sec9 .bgarea{
width:100%;display: flex;align-items:center;justify-content:center;
position: absolute;
width: 100%;
height: 100%;
z-index: -1;
}

.sec9 .bgarea img{
	position: absolute;bottom:0%;left:0%;
	transform:translate(0%, 0%);
	max-width:100%;
	/* width:100%; */
/* min-height:853px; */
	display: block;margin:0 auto;
}


.sec9 .textFill .text-line + .text-line{margin-top: -10px;}


.sec9 .textFill{
display: flex;align-items:center;
position: relative;z-index:30;
width:50%;
}
.sec9 .textFill .text-line{
	 width: 100%;
    position: relative;
    font-family: "Wix Madefor Display";
    font-size: 110px;
    color: #d2d2d2;
    font-weight: 700;
    line-height: 1.2em;
    letter-spacing: -0.025em;
	-webkit-text-stroke: 1px #fff;
	paint-order: stroke fill;
	}

.sec9 .textFill .text-line>span{	
width:100%;
-webkit-text-stroke: 1px transparent;
font:inherit;position: absolute;
display: block;
top:50%;left:50%;
	transform:translate(-50%, -50%);
	clip-path:polygon(0 0, 0 0, 0 100%, 0 100%);
	/* clip-path:polygon(0px 0px, 50% 0px, 0% 100%, 0px 50%); */
	/* 완성:clip-path:polygon(0px 0px, 100% 0px, 100% 100%, 0px 100%); */
	/* 배경 그라데이션 적용 */
    background:linear-gradient(90deg, #f15c2c 0%, #f5942d 50%, #ed232a 100%);
	background: linear-gradient(90deg, #f5942d 0%, #ef422b 80%, #ed232a 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
	paint-order:stroke fill;
}

@media screen and (max-width:1800px){
	.sec9 .bgarea img{left:-9%;}
}
@media screen and (max-width:1600px){
	.sec9 .bgarea img{left:-15%;}
	.sec9 .textFill .text-line{font-size:100px;}
}

/*INTRO*/
#intro{
	position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100000000;
    pointer-events: none; /* 클릭 방지 */
	/* background:#fff; */
} 
#intro:before{
position: absolute;content:'';
width:100%;height: 100%;
background: #fff;z-index:-1;
animation:opaZero 0.6s ease;animation-delay:1.2s;animation-fill-mode: forwards;
}
#intro .intro-rect{
width:100%;height:100%;position: absolute;top:0;left:0;
}

#intro .svg_g{display:flex;align-items:center;justify-content:center;flex-direction:column;transform:scale(1.65);position: relative;}
#intro .svg_g:before{
	position: absolute;content:'';
	width:38px;height:38px;
	top:50%;right:88px;
	background: #fff;
	border-radius:50%;
	transform:translateY(-50%);
}
#intro .svg_g:after{
	position: absolute;content:'';
	width:100%;height:4.5px;
	top:50%;left:50%;
	background: #fff;
	transform:translate(-50%, -50%);
}
#intro .svg_g>.g{
position: relative;
width:261.1px;height:72.8px;
}
#intro .svg_g>.g svg{
position: absolute;top:0;left:0;

}
#intro .svg_g svg{
	width:261.1px;height:72.8px;
}
#intro .g_top svg .cls-1 {
	fill: #ee2529;
	stroke-width: 0px;
  }
  #intro .g_bot svg   .cls-1 {
	fill: #f4932e;
	stroke-width: 0px;
  }
#intro .g_top{transform:translateY(6px) ;}
#intro .g_bot{transform:translateY(-6px) ;}
/*초기상태*/
#intro .g_top{transform:translateX(-124px) translateY(6px) ;}
#intro .g_bot{transform:translateX(124px) translateY(-6px) ;}

@keyframes introAniTop{
	0%{
		transform:translateX(-124px) translateY(6px);
	}
	100%{
		transform:translateX(0px) translateY(6px);
	}
}
@keyframes introAniBottom{
	0%{
		transform:translateX(124px) translateY(-6px);
	}
	100%{
		transform:translateX(0px) translateY(-6px);
	}
}
@keyframes opaZero{
0%{}
100%{opacity:0;}
}
@keyframes introScaleUp{
0%{}
30%{opacity:0;}
100%{transform:scale(100);opacity:0;}
}
@keyframes introScaleUp2{
0%{}
30%{opacity:0;}
100%{transform: scale(101.65);opacity:0;}
}

/*intro start*/
#intro.start .g_top{
animation:introAniTop 1.2s ease-in-out;animation-fill-mode: forwards; 
}
#intro.start .g_bot{
animation:introAniBottom 1.2s ease-in-out;animation-fill-mode: forwards; 
}
#intro.start .g_top .origin_ver,
#intro.start .g_bot .origin_ver{animation:opaZero 0.6s ease;animation-delay:1.2s;animation-fill-mode: forwards; }
#intro.start{
animation:introScaleUp 4.7s ease-in-out;animation-delay:1.8s;animation-fill-mode: forwards;
}


#intro.end{
opacity:0;transition:opacity 0.4s ease-in-out;visibility:hidden;display: none;
}








/*animation*/
.fadeLeft, .fadeRight, .fadeUp, .fadeIn, .fadeImgRight{opacity:0;}
.imgAni{clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);}
.imgAni.in-view{animation-name: imgAni; animation-duration:1.25s;animation-fill-mode:forwards;}
.fadeLeft.in-view{animation-name: fadeLeft;animation-duration: 0.9s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;}
.fadeRight.in-view{animation-name: fadeRight;animation-duration: 0.8s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;}
.fadeUp.in-view{animation-name: fadeUp;animation-duration: 0.9s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;}
.fadeIn.in-view{animation-name: fadeIn;animation-duration: 0.9s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;}
.fadeImgRight.in-view{animation-name: fadeImgRight;animation-duration: 1.2s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;}
.fadeImgLeft.in-view{animation-name: fadeImgLeft;animation-duration: 1.2s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;}
  @keyframes bgScale{
   0%{transform:scale(1.15);}
   100%{transform:scale(1);}
  }
@keyframes fadeLeft{
 0%{transform:translate3d(-100px, 0, 0);opacity:0;}
  100%{transform:translate3d(0px, 0, 0);opacity:1;}
}
@keyframes fadeRight{
 0%{transform:translate3d(100px, 0, 0);opacity:0;}
  100%{transform:translate3d(0, 0, 0);opacity:1;}
}
@keyframes fadeUp{
0%{transform:translate3d(0%, 60px, 0);opacity:0;}
  100%{transform:translate3d(0%, 0, 0);opacity:1;}
}
@keyframes fadeIn{
0%{opacity:0;}
  100%{opacity:1;}
}
@keyframes imgAni{
0%{clip-path:polygon(0 0, 0 0, 0 100%, 0% 100%);}
100%{clip-path:polygon(100% 0, 0 0, 0 100%, 100% 100%);}

}
@keyframes fadeImgRight{
0%{opacity:0;clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);}
100%{opacity:1;clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
}
@keyframes fadeImgLeft{
0%{opacity:0;clip-path:polygon(0 0, 0 0, 0 100%, 0% 100%);}
100%{opacity:1;clip-path:polygon(100% 0, 0 0, 0 100%, 100% 100%);}
}

/* .titleani.in-view .char{
   animation:titleAni 2.3s linear;animation-fill-mode:forwards;
    animation-delay: calc(0.08s * var(--char-index));
} */

@keyframes titleAni{
0%{transform:translate3d(10%, 60%, 0);opacity:0;}
  100%{transform:translate3d(0%, 0, 0);opacity:1;}
}
@keyframes textAni{
0%{transform:translate3d(0%, 35px, 0);opacity:0;}
  100%{transform:translate3d(0%, 0, 0);opacity:1;}
}
@keyframes textFadeIn{
0%{opacity:0;transform:translate3d(-30px, 0, 0);}
  100%{opacity:1;transform:translate3d(0%, 0, 0);}
}
@keyframes sec1Open{
0%{clip-path:circle(3% at 50%);}
  100%{clip-path:circle(100% at 50%);}
}
@keyframes headerAni{
0%{top:-100px;}
  100%{top:0;}
}


/**/
section .titlewrap .title h3,
section .titlewrap .title p,
section .titlewrap .view_more{opacity:0;}
section .titlewrap.in-view .title h3,
section .titlewrap.in-view .title p,
section .titlewrap .view_more{
	animation-name: fadeLeft;animation-duration: 0.9s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;
}
section .titlewrap.in-view .title p{animation-delay:0.1s;}
section .titlewrap.type2.in-view .view_more{
	animation-name: fadeUp;animation-duration: 0.9s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;
	animation-delay:0.2s;
}
section .titlewrap.in-view .view_more
/*intro header motion*/
#header{
top:-100px;
}
#header.in-view{animation:headerAni 1s ease;animation-fill-mode:forwards;animation-delay:0.9s;}

/* .sec1{clip-path:circle(3% at 50%);}
.sec1.in-view{
animation:sec1Open 2s ease;animation-fill-mode:forwards;
} */
.sec1 .visual .v-swiper .swiper-slide .titlearea h2 .char{
display: inline-block;opacity:0;
}
.sec1 .visual .v-swiper .swiper-slide.swiper-slide-active .titlearea h2 .char{
	animation:titleAni 1s ease;animation-fill-mode:forwards;
    animation-delay: calc(0.04s * var(--char-index));
}
.sec1 .visual .v-swiper .swiper-slide .titlearea p .char{opacity:0;display: inline-block;}
.sec1 .visual .v-swiper .swiper-slide.swiper-slide-active .titlearea p .char{
	animation:textFadeIn 1s ease;animation-fill-mode:forwards;
	animation-delay:0.8s;
    animation-delay: calc(0.04s * var(--char-index));
}
.sec1 .visual .scroll i{
	animation:scrollAni 1s linear infinite;
}
@keyframes scrollAni{
0%{transform:translate3d(0%, 10px, 0);}
  100%{transform:translate3d(0%, 0, 0);}
}

/*sec3motion*/
.sec3{}
.sec3 .box-list>li:nth-child(2){
transform:translateX(100%);opacity:0;
}
.sec3 .box-list>li.in-view:nth-child(2){
	transform:translateX(0%);opacity:1;transition:transform 0.9s ease-in-out, opacity 0.9s ease-in-out;
}
/* .sec3 .box-list>li:nth-child(3){
opacity:0;
} */
/* .sec3 .box-list>li.in-view:nth-child(3){
	opacity:1;transition:transform 0.9s ease-in-out, opacity 0.9s ease-in-out;
} */
.sec3 .box-list>li:nth-child(4){
transform:translateX(100%);opacity:0;
}
/* .sec3 .box-list>li:nth-child(5){
opacity:0;
} */

.sec3 .box-list>li:nth-child(6){
transform:translateX(-100%);opacity:0;
}
.sec3 .box-list>li.in-view:nth-child(4){
	transform:translateX(0%);opacity:1;transition:transform 0.9s ease-in-out, opacity 0.9s ease-in-out;
}
/* .sec3 .box-list>li.in-view:nth-child(5){
	opacity:1;transition:transform 0.9s ease-in-out, opacity 0.9s ease-in-out;
} */
.sec3 .box-list>li.in-view:nth-child(6){
	transform:translateX(0%);opacity:1;transition:transform 0.9s ease-in-out, opacity 0.9s ease-in-out;
	transition-delay:0.1s;
}
/**/
.sec6 .conwrap .leftarea #thumb-slider{opacity:0;}
.sec6 .conwrap .leftarea #thumb-slider.in-view{
	animation-name: fadeLeft;animation-duration: 0.9s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;
	animation-delay:0.4s;
}
.sec6 .conwrap .rightarea{
	opacity:0;
}
.sec6 .conwrap .rightarea.in-view{
	animation-name: fadeRight;animation-duration: 0.9s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;
	animation-delay:0.4s;
}
/**/
.sec8 .client-wrap{opacity:0;}
.sec8 .client-wrap.in-view{
	animation-name: fadeUp;animation-duration: 0.9s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;
	animation-delay:0.3s;
}

/*sec7*/

.sec7 .merit .list>li .icon,
.sec7 .merit .list>li .num,
.sec7 .merit .list>li p{
	opacity:0;
}
.sec7 .merit .list>li.in-view .icon,
.sec7 .merit .list>li.in-view .num,
.sec7 .merit .list>li.in-view p{
animation-name: fadeUp;animation-duration: 0.8s;animation-fill-mode:forwards;animation-timing-function: ease-in-out;
animation-delay:0.1s;
}
.sec7 .merit .list>li.in-view .num{animation-delay:0.16s;}
.sec7 .merit .list>li.in-view p{animation-delay:0.32s;}
.sec7 .merit .list>li:before{width:0;}
.sec7 .merit .list>li.in-view:before{
	width:100%;transition:width 1s ease;
	transition-delay:0.3s;
}
.sec7 .merit .list>li:nth-child(2).in-view:before{
transition-delay:0.45s;
}
.sec7 .merit .list:before{height:0;}
.sec7 .merit .list:after{height:0;}
.sec7 .merit .list.in-view:before{
height:100%;transition:height 1.6s ease;
transition-delay:0.5s;
}
.sec7 .merit .list.in-view:after{
height:100%;transition:height 1.6s ease;
transition-delay:0.4s;
}