/**/
.blindbox1{
		position:fixed; left:0; top:0;
		width:100%; height:100%;
		z-index:200;		
	}

	body.off #header{
		opacity:0;
	}
	body.off #footer{
		display:none;
	}
	body.off #wrap{
		opacity:0;
		max-height:0; overflow:hidden;
	}
	body.mainon #header:not(.fixed):not(.nav-down):not(.nav-up){
		opacity:1;
		transition:opacity ease .6s 1.2s;
	}
	
	

/*main*/
	#navigation{
		position:fixed; left:50px; top: 50%;
		transform:translateY(-50%);
		opacity: 1; 
		z-index:6;
		display:none;
	}
	
	.tbtn1{
		right:40px; bottom:50px;
	}
	#visualArea .step{
		position:absolute; left:0; top:0;
		width:100%; height:100%;
	}
	#visualArea .step.t1{
		z-index:1;
	}
	#visualArea .step.t2{
		background:rgba(0,0,0,.6); backdrop-filter: blur(5px);
		opacity:0;
		z-index:4;
		transition:opacity ease .5s;
		pointer-events:none;
	}
	.mainvisual{
		position:relative; 
		width:100%; height:100vh; 
		overflow:hidden;
		z-index:10; box-sizing:border-box;		
	}	
	
	.mainvisual .visualbox{
		position:relative; overflow:hidden; 
		height:100%; 
		z-index:3
	}
	
	.mainvisual .visualbox .swiper-slide{
		width:100%; height:100%;
	}	
	.mainvisual .visualbox .mainimg1,
	.mainvisual .visualbox .swiper-slide .mainimg1 > div{
		position:relative;
		width:100%; height:100%;
	}
	.mainvisual .visualbox .swiper-slide .mainimg1 > div{
		background-size:cover !important;
		transform:scale(1.12);
		transition:transform ease .3s .8s;
	}
	
	.mainvisual .visualbox .visualtxt1{
		position:absolute; left:min(max(1vw, 8vw),150px); top:26%;
		text-align:left;
	}
	.mainvisual .visualbox .swiper-slide .visualtxt1 .txt1{
		font-weight:500; color:var(--main-color1); font-size:25px; line-height:25px;
		opacity:0;
		filter:blur(10px);
		transform:translateX(-10px);
		transition:opacity ease .2s .6s, transform ease .2s .6s;
	}
	.mainvisual .visualbox .swiper-slide .visualtxt1 .txt1 > em{
		display:inline-flex; align-items:center; gap:10px;
	}
	.mainvisual .visualbox .swiper-slide .visualtxt1 .txt1 > em::after{
		width:100px; height:1px;
		background:var(--main-color1);
		content:"";
	}
	.mainvisual .visualbox .swiper-slide .visualtxt1 .txt2{
		margin-top:30px;
		font-family:var(--font-family2);
		color:var(--main-color1); font-size:50px; line-height:68px; letter-spacing:-1px;
		opacity:0;
		filter:blur(10px);
		transform:translateX(-20px);
		transition:opacity ease .2s .6s, transform ease .2s .6s;
	}
	.mainvisual .visualbox .swiper-slide .visualtxt1 .txt2 > em{
		font-weight:700; 
	}
	.mainvisual .visualbox .swiper-slide .visualtxt1 .txt3{
		margin-top:60px;
		opacity:0;
		filter:blur(10px);
		transform:translateX(-30px);
		transition:opacity ease .2s .6s, transform ease .2s .6s;
	}
	body.mainon .mainvisual .visualbox .swiper-slide.swiper-slide-active .mainimg1 > div{
		transform:scale(1);
		transition:transform ease 6s .2s;
	}
	body.mainon .mainvisual .visualbox .swiper-slide.swiper-slide-active .visualtxt1 .txt1{
		filter:blur(0px);
		opacity:1;
		transform:translateX(0px);
		transition:opacity ease 1.1s .1s, transform ease 1.1s .1s, filter ease 1.1s .1s;
	}
	body.mainon .mainvisual .visualbox .swiper-slide.swiper-slide-active .visualtxt1 .txt2{
		filter:blur(0px);
		opacity:1;
		transform:translateX(0px);
		transition:opacity ease 1.1s .3s, transform ease 1.1s .3s, filter ease 1.1s .3s;
	}
	body.mainon .mainvisual .visualbox .swiper-slide.swiper-slide-active .visualtxt1 .txt3{
		filter:blur(0px);
		opacity:1;
		transform:translateX(0px);
		transition:opacity ease 1.1s .6s, transform ease 1.1s .6s, filter ease 1.1s .6s;
	}	
	
	.mainvisual > .scroll1{
		position:absolute; left:min(max(40px, 5vw),100px); bottom:min(max(40px, 5vw),100px);
		display:flex; gap:10px; align-items:center;		
		z-index:5;	
		
		filter:blur(10px);
		opacity:0;
		transform:translateX(-20px)	
	}
	.mainvisual > .scroll1 > span{
		position:relative;
		width:20px; height:40px; 
		border:1px solid rgba(255,255,255,1);	
		border-radius:50px;
	}
	.mainvisual > .scroll1 > span::before{
		position:absolute; left:calc(50% - 2px); top:8px;
		width:4px; height:4px;
		border-radius:50%;
		background:#fff;
		animation: play-down2 900ms linear infinite ; animation-timing-function:ease-in-out;
		content:"";
	}
	.mainvisual > .scroll1 > em{
		text-align:left;
		font-weight:600; font-family:var(--font-family3); color:#fff; font-size:16px; line-height:20px;
	}
	body.mainon .mainvisual > .scroll1{
		filter:blur(0px);
		opacity:1;
		transform:translateX(0px);
		transition:opacity ease 1.1s .6s, transform ease 1.1s .6s, filter ease 1.1s .6s;
	}
	
	.mainvisual > .mbnn1{
		position:absolute; right:min(max(40px, 5vw),100px); bottom:min(max(40px, 5vw),100px);
		width:158px; height:158px;
		display:inline-flex; align-items:center; justify-content:center;
		z-index:5;
		filter:blur(10px);
		opacity:0;
		transform:translateX(20px)
	}
	.mainvisual > .mbnn1::before{
		position:absolute; left:0%; top:0%;
		width:100%; height:100%;
		background:url(../../images/main/txt_cir1.png) no-repeat center center; background-size:cover;
		opacity:.8;
		animation:ratateLoop infinite 20s linear;
		content:"";
	}
	.mainvisual > .mbnn1 > em{
		font-weight:500; color:#fff; font-size:22px; line-height:28px;				
	}
	
	body.mainon .mainvisual > .mbnn1{
		filter:blur(0px);
		opacity:1;
		transform:translateX(0px);
		transition:opacity ease 1.1s .6s, transform ease 1.1s .6s, filter ease 1.1s .6s;
	}
	
	#visualArea .step.t2 > .tit1{
		position:absolute; left:min(max(1vw, 8vw),150px); top:10%;
		color:#fff;
		text-align:left;
		opacity:0;
		transform:translateX(-20%);
		transition:transform ease .4s, opacity ease .4s;
	}
	#visualArea .step.t2 > .tit1 > h2{
		font-weight:400; color:#fff; font-family:var(--font-family3); font-size:100px;
	}
	#visualArea .step.t2 > .tit1 > p{
		font-size:26px; margin-top:10px;
	}
	
	#visualArea .step.t2 > .detail1 {
		position:absolute; right:min(max(1vw, 8vw),150px); bottom:10%; 
		width:720px; 
		display:grid; grid-template-columns: repeat(3, 1fr); gap:100px 110px;
		color:#fff;
		
		opacity:0;
		transform:translateX(20%);
		transition:transform ease .4s, opacity ease .4s;
	}
	#visualArea .step.t2 > .detail1 > .item {
		text-align:left;
	}
	#visualArea .step.t2 > .detail1 > .item > .tit1 {
		font-weight: 500; font-size:22px; line-height:22px;
	}
	#visualArea .step.t2 > .detail1 .txt1 {
		margin-top:15px; 
		display:flex; align-items: center; gap:3px;
		white-space:nowrap;
	}
	#visualArea .step.t2 > .detail1 .txt1 > em.num {
		font-weight:500; font-family:var(--font-family2); font-size:60px; line-height:60px;
	}
	#visualArea .step.t2 > .detail1 .txt1 > span {
		position:relative; top:10px;
		font-size:31px;		 
	}
	#visualArea .step.t2 > .detail1 .txt1 > em.num ~ em.num {
		margin-left:9px;
	}
	
	
	.mainvisual .vctrbox1{
		position:absolute; left:150px; bottom:60px;
		width:83%;
		display:flex; gap:10px; align-items:center;
		z-index:10;
		display:none;
	}
	.mainvisual .vctrbox1 .vslidernum1,
	.mainvisual .vctrbox1 .totalcnt{
		color:#fff; font-size:18px;
		font-variant-numeric:tabular-nums;
	}
	.mainvisual .vctrbox1 .vslidernum1{
		font-weight:600; font-size:26px;
	}
	.mainvisual .vctrbox1 .vline1{
		position:relative;
		margin:0 10px;
		flex:1; height:2px;
		background:rgba(255,255,255,.2);
	}
	.mainvisual .vctrbox1 .vline1 > span{
		position:absolute; left:0; top:0;
		width:100%; height:100%;
		background:#fff;
		transform-origin:left;
		transform: scaleX(0);
		transition:transform ease 1.4s .0s;
	}
	.mainvisual .vctrbox1 .vline1 > span::before{
		position:absolute; left:0; top:0;
		width:0%; height:100%;
		
		content:"";
		transition:width ease 0s .0s;
	}
	.mainvisual .vctrbox1 .vline1.active > span::before{
		width:100%; 
		transition:width ease 5s;
	}	
	.mainvisual .vctrbox1 .dots1{
		display:none;
	}
	.mainvisual .vctrbox1 .ctr1{
		width:270px;
		display:flex; gap:8px; align-items:center;
		color:#fff;
	}
	.mainvisual .vctrbox1	.sprev1,
	.mainvisual .vctrbox1	.snext1{
		font-size:0; line-height:0;
		width:60px; height:60px;
		cursor:pointer;
		z-index:10;	
	}
	.mainvisual .vctrbox1	.sprev1::before,
	.mainvisual .vctrbox1	.snext1::before{
		display:block;
		width:100%; height:100%;
		background:url(../../images/main/btn_arr1.png) no-repeat left center; background-size:200% 100%;
		content:"";
	}
	.mainvisual .vctrbox1	.snext1::before{background-position:right center;}
	.mainvisual	.sprev1{
		margin-right:14px;
	}
	.mainvisual	.snext1{
		margin-left:14px;
	}
	.mainvisual .vctrbox1	.sprev1:hover::before{ animation: play-left 400ms linear infinite alternate; animation-timing-function:ease-in-out;}
	.mainvisual .vctrbox1	.snext1:hover::before{ animation: play-right 400ms linear infinite alternate; animation-timing-function:ease-in-out;}
	
	
	#visualArea.step2{		
	}
	#visualArea.step2 .mainvisual .visualbox .swiper-slide.swiper-slide-active .visualtxt1 .txt1,
	#visualArea.step2 .mainvisual .visualbox .swiper-slide.swiper-slide-active .visualtxt1 .txt2,
	#visualArea.step2 .mainvisual .visualbox .swiper-slide.swiper-slide-active .visualtxt1 .txt3,
	#visualArea.step2 .mainvisual > .scroll1{
		opacity:0;
		transform:translateX(-20%);
		transition:opacity ease 1.1s, transform ease 1.1s ;
	}
	
	#visualArea.step2 .mainvisual > .mbnn1{
		opacity:0;
		transform:translateX(40%);
		transition:opacity ease 1.1s, transform ease 1.1s, filter ease 1.1s;
	}
	
	#visualArea.step2 .step.t2{
		pointer-events:auto;
		opacity:1;			
		transition:opacity ease 1.1s .2s;
	}
	
	#visualArea.step2 .step.t2.active > .tit1{
		opacity:1;
		transform:translateX(0);
		transition:transform ease .9s .4s, opacity ease .9s .4s;
	}
	
	#visualArea.step2 .step.t2.active > .detail1 {
		opacity:1;
		transform:translateX(0);
		transition:transform ease .9s .4s, opacity ease .9s .4s;
	}
	
	
	.mncont1{
		position:relative;
		width:100%; height:100vh;
		overflow:hidden;
	}
	.mncont1 > .tit1{
		position:absolute; right:min(max(1vw, 15vw),280px); top:min(max(1vw, 6vw),130px);
		text-align:left;
		font-family:var(--font-family3); color:var(--main-color1); font-size:100px; line-height:110px;
		pointer-evnets:none;
		opacity:0;
		transform:translateX(20px);
		transition:transform ease .7s, opacity ease .7s;
		z-index:1;		
	}
	.mncont1 > .tit1 > span{
		display:inline-block;
	}
	.mncont1 > .tit1 > span:last-child{
		margin-left:120px;
	}
	.mncont1::before{
		position:absolute; right:0; top:0;
		width:min(max(1vw, 20vw),236px); height:100%;
		background:url(../../images/main/bg_pattern1.png) repeat-y right top;
		transform:translateX(100%);
		z-index:-1;
		content:"";
		opacity:0;
		transition:transform ease .8s .2s, opacity ease .5s .2s;
	}
	.mncont1 .step{
		position:absolute; left:0; top:0;
		width:100%; height:100%;
		display:flex; align-items:center; justify-content:center;
	}
	.mncont1 .step.t1{
		opacity:1;
	}
	
	.mncont1 .step .cont1{
		position:absolute; left:0; top:0;
		width:100%; height:100%;
		overflow:hidden;
		z-index:6;
	}
	.mncont1 .step .cont1 > .bg1{
		position:absolute; left:0; top:0;
		width:100%; height:100%;
		background:url(../../images/main/bg_location1.jpg) no-repeat center top; background-size:cover;
		transform:scale(1.12);
		z-index:1;
		transition:transform ease .5s, background ease .5s;
	}
	.mncont1 .step .cont1 > .detail1{
		position:absolute; left:50%; top:20%; width:1400px;
		transform:translateX(-50%);
		color:var(--main-color3);
		z-index:2;
		clip-path:inset(0% 0% 0% 0%);
		transition:opacity ease .6s .2s, transform ease .6s .2s;
	}
	.mncont1 .step .cont1 > .detail1 > .tit1{
		text-transform:uppercase;
		letter-spacing:5px;
		font-weight:600; font-family:var(--font-family3); font-size:22px; line-height:22px;
		opacity:0;
		transition:opacity ease .5s;
	}
	.mncont1 .step .cont1 > .detail1 > .tit1::after{
		display:block;
		margin:20px auto;
		width:1px; height:0;
		background:var(--main-color3);
		transition:height ease .5s;
		content:"";
	}
	.mncont1 .step .cont1 > .detail1 > .txt1{
		opacity:0;
		transition:opacity ease .5s;		 
	}
	.mncont1 .step .cont1 > .detail1 > .txt1 > em{
		font-weight:500; font-family:var(--font-family2); font-size:55px; line-height:55px; letter-spacing:-2px;
	}
	.mncont1 .step .cont1 > .detail1 > .txt1 > p{
		margin-top:20px;
		font-size:32px; line-height:32px; letter-spacing:-1px;
	}
	
	#locationArea.active.step1 .mncont1 .step .cont1 > .detail1 > .tit1,
	#locationArea.active.step1 .mncont1 .step .cont1 > .detail1 > .txt1{
		opacity:1;
		transition:opacity ease .6s .3s, transform ease .4s;
	}
	#locationArea.active.step1 .mncont1 .step .cont1 > .detail1 > .tit1::after{
		height:130px;
		transition:height ease .6s .3s;
	}
	#locationArea.active .mncont1 .step .cont1 > .bg1{
		transform:scale(1);
		transition:transform ease 1.8s .3s, background ease 1.4s;
	}	
	#locationArea.step2 .mncont1 .step .cont1 > .detail1{
		opacity:0;
		transform:translateY(-120px) translateX(-50%);
		transition:opacity ease .6s .0s, transform ease .6s;
	}
	#locationArea.step2 .mncont1 .step .cont1 > .bg1{		
		background-position:center bottom;
		transition:background ease 1.4s;
	}	
	#locationArea.step3 .mncont1 .step .cont1 > .bg1{
		background-position:center bottom;
		clip-path:inset(0% 0% 0% 0%);
		transition:background ease 1.4s;
	}
	#locationArea.step4 .mncont1 .step .cont1 > .bg1{
		background-position:center bottom;
	}
	#locationArea.step3 .mncont1::before,
	#locationArea.step4 .mncont1::before,
	#locationArea.step5 .mncont1::before,
	#locationArea.step6 .mncont1::before{
		transform:translateX(0%);
		opacity:1;
		transition:transform ease .5s, opacity ease .5s
	}
	
	.mncont1 .step .cont2{
		position:absolute; left:0; bottom:0;
		display:flex; align-items:flex-end; gap:min(max(1vw, 9vw),130px);
		width:100%; height:100%;
		pointer-events:none;		
		z-index:5;
	}
	.mncont1 .step.t3 .cont2{
		z-index:4
	}
	.mncont1 .step.t4 .cont2{
		z-index:3
	}
	.mncont1 .step.t5 .cont2{
		z-index:2
	}
	.mncont1 .step.t6 .cont2{
		z-index:1
	}
	.mncont1 .step .cont2 .imgbox1{
		position:relative;
		width:30%; height:100%;
		overflow:hidden;
		clip-path: inset(0% 0% 0% 0%);
	}
	.mncont1 .step .cont2 .imgbox1 > img{
		width:100%; height:100%;
		object-fit:cover;
	}
	.mncont1 .step .cont2 .imgbox1 > img{
		opacity:0;
	}
	.mncont1 .step .cont2 .detail1{
		display:flex; align-items:flex-end; gap:min(max(1vw, 7vw),100px);
		flex:1;
		text-align:left;
		margin-bottom:min(max(1vw, 10vw),140px);
		
		opacity:0;
		transform:translateX(40%);
		transition:opacity ease .7s, transform ease .7s;
	}
	.mncont1 .step .cont2 .detail1 .fst1{
	}
	.mncont1 .step .cont2 .detail1 .fst1 .tt1{
		margin-bottom:16px;
	}
	.mncont1 .step .cont2 .detail1 .fst1 .tt1 > em{
		display:flex; align-items:center; gap:6px;
		text-transform:uppercase;
		color:var(--main-color4); font-weight:600; font-family:var(--font-family3); font-size:26px; line-height:26px;
		opacity:0;
		transition:opacity ease .6s;
	}
	.mncont1 .step .cont2 .detail1 .fst1 .tt1 > em::before{
		width:15px; height:31px;
		background:url(../../images/main/ico_tit1.png) no-repeat center center; background-size:cover;
		content:"";
	}
	.mncont1 .step .cont2 .detail1 .fst1 .imgbox2{
		position:relative;
		overflow:hidden;
		clip-path:inset(0 50% 0 50%);
		transition:clip-path ease .5s;
	}
	.mncont1 .step .cont2 .detail1 .fst1 .imgbox2 > img{
		width:100%; height:100%;
		object-fit:cover;
	}
	.mncont1 .step .cont2 .detail1 .txt1{
		position:relative;
	}
	.mncont1 .step .cont2 .detail1 .txt1 > em{
		position:relative;
		display:inline-block;
		color:var(--main-color4); font-family:var(--font-family2); font-size:35px; line-height:35px; font-weight:600; letter-spacing:-2px;
		filter:blur(5px);
		opacity:0;
		transition:opacity ease .6s, filter ease .6s;
	}
	.mncont1 .step .cont2 .detail1 .txt1 > em > span{
		position:absolute; left:77%; bottom:11px;
		color:var(--main-color5); font-size:100px; line-height:100px;
		opacity:.5;
		z-index:-1;
	}
	.mncont1 .step .cont2 .detail1 .txt1 > div{
		position:relative;
		padding:70px 0 0 70px;
	}
	.mncont1 .step .cont2 .detail1 .txt1 > div::before{
		position:absolute; left:25px; top:25px;
		display:block;
		width:40px; height:1px;
		background:var(--main-color3);
		transform-origin:left top;
		transform:rotate(0deg);
		transition:transform ease .6s;
		content:"";
	}
	.mncont1 .step .cont2 .detail1 .txt1 > div > em{
		display:inline-block;
		color:var(--main-color1); font-weight:500; font-size:24px;
		opacity:0;
		transform:translateX(40px);
		transition:opacity ease .6s, transform ease .6s;
	}
	.mncont1 .step .cont2 .detail1 .txt1 > div > p{
		margin-top:12px;
		color:var(--main-color6); font-size:18px; line-height:30px;
		opacity:0;
		transform:translateX(40px);
		transition:opacity ease .6s, transform ease .6s;
	}
	
	#locationArea.step3 .mncont1 > .tit1,
	#locationArea.step4 .mncont1 > .tit1,
	#locationArea.step5 .mncont1 > .tit1,
	#locationArea.step6 .mncont1 > .tit1{
		opacity:1;
		transform:translateX(0px);
		transition:transform ease .5s .3s, opacity ease .5s .3s;
	}
	
	#locationArea.step3 .mncont1 .step .cont2 .detail1,
	#locationArea.step4 .mncont1 .step .cont2 .detail1,
	#locationArea.step5 .mncont1 .step .cont2 .detail1,
	#locationArea.step6 .mncont1 .step .cont2 .detail1{
		opacity:1;
		transform:translateX(0);
		transition:opacity ease .7s .2s, transform ease .7s .2s;
	}
	#locationArea.step3 .mncont1 .step.t3 .cont2 .imgbox1 > img,
	#locationArea.step4 .mncont1 .step.active .cont2 .imgbox1 > img,
	#locationArea.step5 .mncont1 .step.t3 .cont2 .imgbox1 > img{
		opacity:1;
	}
	#locationArea.step4 .mncont1 .step.t4 .cont2 .imgbox1 > img,
	#locationArea.step5 .mncont1 .step.active .cont2 .imgbox1 > img,
	#locationArea.step6 .mncont1 .step.t4 .cont2 .imgbox1 > img{
		opacity:1;
	}
	#locationArea.step5 .mncont1 .step.t5 .cont2 .imgbox1 > img,
	#locationArea.step6 .mncont1 .step.active .cont2 .imgbox1 > img{
		opacity:1;
	}
	
	#locationArea.step3 .mncont1 .step .cont2 .detail1 .txt1 > div::before,
	#locationArea.step4 .mncont1 .step .cont2 .detail1 .txt1 > div::before,
	#locationArea.step5 .mncont1 .step .cont2 .detail1 .txt1 > div::before,
	#locationArea.step6 .mncont1 .step .cont2 .detail1 .txt1 > div::before{
		transform:rotate(45deg);
		transition:transform ease .6s .3s;
	}
	
	.mncont1 .step.active .cont2{
		pointer-events:auto;
	}
	.mncont1 .step.active .cont2 .detail1 .fst1 .tt1 > em{
		opacity:1;
		transition:opacity ease 1.2s;
	}	
	.mncont1 .step.active .cont2 .detail1 .fst1 .imgbox2{
		clip-path:inset(0% 0% 0% 0%);
		transition:clip-path ease .8s;
	}
	.mncont1 .step.active .cont2 .detail1 .txt1 > em{
		filter:blur(0px);
		opacity:1;
		transition:opacity ease 1.2s, filter ease .6s;
	}	
	.mncont1 .step.active .cont2 .detail1 .txt1 > div > em{
		opacity:1;
		transform:translateX(0px);
		transition:opacity ease 1.2s, transform ease 1.2s;
	}
	.mncont1 .step.active .cont2 .detail1 .txt1 > div > p{
		opacity:1;
		transform:translateX(0px);
		transition:opacity ease 1.2s .1s, transform ease 1.2s .1s;
	}
	
	
	
	.mncont2{
		position:relative;
		width:100%; height:100vh;
		overflow:hidden;
	}
	
	.mncont2 .horizontal-scroll{ 
		position:absolute; inset:0; 
		gap:140px;
	}
	.mncont2 .panel{
		display:flex; justify-content:center; align-items:center;
	}
	
	.mncont2 .panel .cont1{
		display:flex; flex-wrap:wrap; gap:25px 0;
	}
	.mncont2 .panel .cont1 > .imgbox1{
		width:fit-content;
	}
	.mncont2 .panel .cont1 > .imgbox1 > img{
	}
	.mncont2 .panel .cont1 > .detail{
		display:flex; gap:30px;
		text-align:left;
	}
	.mncont2 .panel .cont1 > .detail > .tit1{
	}
	.mncont2 .panel .cont1 > .detail > .tit1 > em{ 
		display:flex; align-items:center; gap:6px;
		color:var(--main-color4); font-weight:600; font-family:var(--font-family3); font-size:26px; line-height:26px;
	}
	.mncont2 .panel .cont1 > .detail > .tit1 > em::before{ 
		width:15px; height:31px;
		background:url(../../images/main/ico_tit1.png) no-repeat center center; background-size:cover;
		content:"";
	}
	.mncont2 .panel .cont1 > .detail > .txt1{
	}
	.mncont2 .panel .cont1 > .detail > .txt1 > em{
		color:var(--main-color4); font-weight:600; font-family:var(--font-family2); font-size:28px; line-height:28px; letter-spacing:-1px;
	}
	.mncont2 .panel .cont1 > .detail > .txt1 > p{ 
		margin-top:12px;
		color:var(--main-color6); font-size:18px; line-height:28px;
	}	
	
	:root { --img1-w: 820px; --img1-h: 530px; }

	.mncont2 .panel.t1 .cont1 {
		position:relative;
		display:grid;
		grid-template-columns:calc((100vw - var(--img1-w)) / 2) var(--img1-w);
		grid-template-areas:
		"title image"
		"title detail";
		align-content:center;
	}
	.mncont2 .panel.t1 > .cont1 > .tit1 {  
		position:absolute; right:min(max(1vw,72vw),950px);
		writing-mode:vertical-rl;
		text-align:right;
		font-family:var(--font-family3); color:var(--main-color1); font-size:100px; line-height:110px;
		
		transform:translateX(-40px) rotate(180deg);
		opacity:0;
		transition:opacity ease .5s, transform ease .5s;
		
	}
	.mncont2 .panel.t1 > .cont1 > .tit1 > span{
		display:inline-block;
	}
	.mncont2 .panel.t1 > .cont1 > .tit1 > span:first-child{
		margin-bottom:160px;
	}
	.mncont2 .panel.t1 .imgbox1 {
		grid-area:image; 
		width:var(--img1-w); height:var(--img1-h);
	}
	.mncont2 .panel.t1 .detail  { 
		grid-area:detail; 
	} 
	.mncont2 .panel.t1 .imgbox1 {
		transform-origin:center center;
		transition:transform .4s ease ;
	}
	.mncont2 .panel.t1 .imgbox1 {
		transform:translateX(calc(50vw - 50% - (100vw - var(--img1-w)) / 2)) scale(var(--fs));
	}
	.mncont2 .panel.t1 .imgbox1 img{
		width:100%; height:100%;
		object-fit:cover;
	}
		
	#premiumArea.shrink .mncont2 .panel.t1 .imgbox1 {
		transform: translateX(0) scale(1);
		transition:transform 1.2s ease ;
	}
	#premiumArea.shrink .mncont2 .panel.t1 > .cont1 > .tit1 {  
		transform:translateX(0px) rotate(180deg);
		opacity:1;
		transition:opacity ease 1.0s .2s, transform ease 1.0s .2s;
		
	}
	
	.mncont2 .panel:nth-of-type(2){
	}
	.mncont2 .panel:nth-of-type(2) .cont1{
		flex-direction:column-reverse;
	}
	.mncont2 .panel:nth-of-type(2) .cont1 .detail{
		flex-wrap:wrap;
	}
	.mncont2 .panel:nth-of-type(2) .cont1 .detail > .txt1{
		width:100%;
	}
	.mncont2 .panel:nth-of-type(3){
		transform:translateY(-70px);
	}
	.mncont2 .panel:nth-of-type(3) .cont1 .detail{
		flex-wrap:wrap;
	}
	.mncont2 .panel:nth-of-type(3) .cont1 .detail > .txt1{
		width:100%;
	}
	.mncont2 .panel:nth-of-type(4){
	}
	.mncont2 .panel:nth-of-type(5){
		transform:translateY(30px);
	}
	.mncont2 .panel:nth-of-type(5) .cont1{
		flex-direction:column-reverse;
	}
	.mncont2 .panel:nth-of-type(5) .cont1 .detail{
		flex-wrap:wrap;
	}
	.mncont2 .panel:last-of-type{
		padding-right:calc((70vw - var(--img1-w))) ;
	}
	.mncont2 .panel:last-of-type .cont1 .detail{
		flex-wrap:wrap;
	}
	
	
	.mncont3{
		position:relative;
		background:#e1ebf5;
		height:100vh;
		overflow:hidden;
	}
	.mncont3::before{
		position:absolute; left:0; top:0;
		width:min(max(1vw, 40vw),960px); height:155px;
		background:url(../../images/main/bg_pattern2.png) repeat-x right top;
		opacity:0;
		filter: brightness(150%);
		content:"";
		
		transform:translateY(-100%);		
		opacity:0;
		transition:opacity ease .6s, transform ease .6s;
	}
	.mncont3 .mncont1{
		display:flex; justify-content:space-between; align-items:center;
		width:100%; height:100vh;		
	}
	.mncont3 .mncont1 > *:first-child{
		width:510px;
		padding-left:150px;
		text-align:left;
	}
	.mncont3 .mncont1 > .imgbox1{
		flex:1;
		 -webkit-mask-image: linear-gradient(
			to right,
			transparent 0%,
			#000 30%,
			#000 100%
		);
	}
	.mncont3 .mncont1 > .imgbox1 > img{
		width:100%;
		object-fit:cover;
	}
	.mncont3 .mncont1 > *:first-child > .tit1{
		font-family:var(--font-family3); color:var(--main-color1); font-size:100px; line-height:110px;
		margin-bottom:100px;
		transform:translateX(-20px);
		opacity:0;
		transition:opacity ease .6s, transform ease .6s;
	}
	.mncont3 .mncont1 .cont1{
	}
	.mncont3 .mncont1 .cont1:last-of-type{
		margin-top:60px;
	}
	.mncont3 .mncont1 .cont1 .txt1{
		color:var(--main-color3);
		display:flex; align-items:flex-end;
		transform:translateX(-20px);		
		opacity:0;
		transition:opacity ease .6s, transform ease .6s;
	}
	.mncont3 .mncont1 .cont1 .txt1 > em{
		font-family:var(--font-family2); font-weight:600; font-size:30px; line-height:30px;
	}
	.mncont3 .mncont1 .cont1 .txt1 > span{
		display:flex;
		font-weight:500; font-size:22px; line-height:22px;
	}
	.mncont3 .mncont1 .cont1 .txt1 > span::before{
		width:1px; 
		margin:0 16px;
		background:var(--main-color3);
		opacity:.3;
		content:"";
	}
	.mncont3 .mncont1 .cont1 .lnk1{
		margin-top:30px;
		display:flex; gap:20px; justify-content:space-between;
	}
	.mncont3 .mncont1 .cont1 .lnk1 > a{
		color:var(--main-color3); font-size:16px; line-height:34px;
		text-align:left;
		flex:1;
		border-bottom:1px solid;
		opacity:0;
		transform:translateY(10px);
		transition:opacity ease .6s, transform ease .6s;
	}
	.mncont3 .mncont1 .cont1 .lnk1 > a > span{
		display:flex; align-items:center; gap:7px;
		font-weight:600; 		
	}
	.mncont3 .mncont1 .cont1 .lnk1 > a > span::before{
		width:18px; height:17px;
		background:url(../../images/main/ico_naver1.png) no-repeat center center; background-size:cover;
		content:"";
	}
	.mncont3 .mncont1 .cont1 .lnk1 > a:nth-of-type(2) > span::before{
		width:16px; height:23px;
		background:url(../../images/main/ico_kakao1.png) no-repeat center center; background-size:cover;
		content:"";
	}
	.mncont3 .mncont1 .cont1 .lnk1 > a:nth-of-type(3) > span::before{
		width:20px; height:20px;
		background:url(../../images/main/ico_tmap1.png) no-repeat center center; background-size:cover;
		content:"";
	}
	.mncont3 .mncont1 .cont1 .lnk1 > a > span::after{
		margin-left:auto;
		content:"→";
	}
	.mncont3 .mncont1 > *:first-child > .tit1,
	.mncont3 .mncont1 .cont1 .txt1,
	.mncont3 .mncont1 .cont1 .lnk1 > a{
		will-change:opacity, transform;
	}
	
	#contactArea.on .mncont3::before{
		opacity: .2;
		transform:translateY(0);
		transition:opacity ease .6s .2s, transform ease .6s .2s;
	}
	#contactArea.on .mncont3 .mncont1 > *:first-child > .tit1{
		opacity:1;
		transform:translateX(0);
		transition:opacity ease .6s .3s, transform ease .6s .3s;
	}
	
	#contactArea.on .mncont3 .mncont1 .cont1 .txt1{
		opacity:1;
		transform:translateX(0);
		transition:opacity ease .6s .5s, transform ease .6s .5s;
	}
	
	#contactArea.on .mncont3 .mncont1 .cont1 .lnk1 > a{
		opacity:1;
		transform:translateY(0);
		transition:opacity ease .6s .5s, transform ease .6s .5s;
	}
	#contactArea.on .mncont3 .mncont1 .cont1 .lnk1 > a:nth-of-type(2){
		transition-delay:.6s
	}
	#contactArea.on .mncont3 .mncont1 .cont1 .lnk1 > a:nth-of-type(3){
		transition-delay:.7s
	}
	
	
	#brandArea{
		pointer-events:none;
	}
	.mncont4{
		position:relative;
		overflow:hidden;
		height:100vh;
	}
	.mncont4 > .step{
		position:absolute; top:0;
		height:100%;
		transition:transform ease 1.1s;
	}
	.mncont4 > .step.t1{
		width:100%;
	}
	.mncont4 > .step.t2{
		right:0;
		transform:translateX(100%);		
		width:calc(50% + 50px);
		display:flex; justify-content:center; align-items:center;
		background:url(../../images/main/bg_register1.jpg) no-repeat center center; background-size:cover;
	}
	
	.mncont4 > .step.t1 .vdbox1 {
		position:absolute; left:0; top:0;
		inset:0;
		z-index:-1;
		overflow:hidden;
		pointer-events:none;
  	}
	.mncont4 > .step.t1 .vdbox1 > .bgbox1{
		position:absolute; left:0; top:0%;
		width:100%; height:100%;
		background:url(../../images/main/door_logo.png) no-repeat center center; background-size:cover;
		z-index:2;
		opacity:1; 
		transform:scale(1); 
		transition:transform 0s .5s, opacity 0s .5s;
	}
	.mncont4 > .step.t1 .vdbox1 iframe {
		position:absolute; top:50%; left:50%;
		transform:translate(-50%, -50%);
		--cover-w: max(100vw, 177.78vh, 1300px);
		width: var(--cover-w);
		height: calc(var(--cover-w) * 9 / 16);
		border:0;
	}
			
	.mncont4 > .step.t1 .tit1{
		position:absolute; left:min(max(1vw, 10vw),150px); top:min(max(1vw, 10vw),150px);
		text-align:left;
		color:#fff;
	}
	.mncont4 > .step.t1 .tit1 > em{
		display:block;
		font-family:var(--font-family3); color:#fff; font-size:100px; line-height:110px;
		
		transform:translateX(-30px);
		opacity:0;
		transition:transform ease .1s .4s, opacity ease .1s .4s;
	}
	.mncont4 > .step.t1 .tit1 > .txt1{
		margin-top:30px;
	}
	.mncont4 > .step.t1 .tit1 > .txt1 > p{
		font-size:20px; line-height:28px;
		
		transform:translateX(-30px);
		opacity:0;
		transition:transform ease .1s .4s, opacity ease .1s .4s;
	}
	.mncont4 > .step.t1 .tit1 > .txt1 > p:last-of-type{
		margin-top:40px;
	}
	.mncont4 > .step.t1 .bl1{
		position:absolute; right:min(max(1vw, 10vw),150px); bottom:min(max(1vw, 10vw),150px);
		
		transform:translateX(30px);
		opacity:0;
		transition:transform ease .1s .4s, opacity ease .1s .4s;
	}
	
	.mncont4 > .step.t2{
	}
	.mncont4 > .step.t2 > .cont1 .tit1{
		font-family:var(--font-family3); color:#fff; font-size:100px; line-height:110px;
		
		transform:translateY(30px);
		opacity:0;
		transition:transform ease .1s .4s, opacity ease .1s .4s;
	}
	.mncont4 > .step.t2 > .cont1 p{
		margin-top:50px;
		color:#fff; font-size:20px; line-height:30px;
		
		transform:translateY(30px);
		opacity:0;
		transition:transform ease .1s .4s, opacity ease .1s .4s;
	}
		
	.mncont4 > .step.t2 a{
		position:relative;
		display:block;
		margin:50px auto 0;
		width:248px; height:250px;
		display:flex; justify-content:center; align-items:center;
		text-align:center;
		color:#fff;
		z-index:4;
		
		transform:translateY(30px);
		opacity:0;
		transition:transform ease .1s .4s, opacity ease .1s .4s;
	}
	
	.mncont4 > .step.t2 a::before{
		position:absolute; left:0; top:0;
		width:100%; height:100%;
		background:url(../../images/main/txt_cir2.png) no-repeat center center; background-size:cover;
		animation:ratateLoop infinite 15s linear; -ms-animation:ratateLoop infinite 15s linear;
		content:"";
	}
	.mncont4 > .step.t2 a > span::after{
		position:absolute; left:50%; top:50%;
		transform:translate(-50%,-50%) scale(.7);
		width:57px; height:57px;
		background:url(../../images/main/ico_arr1.png) no-repeat center center; background-size:cover;
		content:"";
		opacity:0;
		transition:transform ease .4s 0s, opacity ease .4s 0s;
	}	
	.mncont4 > .step.t2 a > span{
		display:block;
		font-weight:600; color:#fff; font-size:30px; line-height:34px;
	}
	.mncont4 > .step.t2 a > span > em{
		transition:transform ease .3s 0s, opacity ease .3s 0s;
	}
	.mncont4 > .step.t2 a:hover > span::after{
		transform:translate(-50%,-50%) scale(1);
		opacity:1;
	}
	.mncont4 > .step.t2 a:hover > span > em{
		transform:scale(0); opacity:0;
	}
	.mncont4 > .step.t1 .tit1 > em,
	.mncont4 > .step.t1 .tit1 > .txt1 > p,
	.mncont4 > .step.t1 .bl1{
		will-change:opacity, transform;
	}
	
	
	#brandArea.active{
		pointer-events:auto;
	}
	#brandArea.on .mncont4 > .step.t1 .vdbox1 > .bgbox1{
		will-change: transform, opacity;
		opacity:0; 
		transform:scale(10); 
		transition:transform 5s 2.4s, opacity 1.2s 3.4s;
	}
	
	#brandArea.on .mncont4 > .step.t1 .tit1 > em{
		transform:translateX(0px);
		opacity:1;
		transition:transform ease 1.1s .6s, opacity ease 1.1s .6s;
	}
	#brandArea.on .mncont4 > .step.t1 .tit1 > .txt1 > p{
		transform:translateX(0px);
		opacity:1;
		transition:transform ease .8s .7s, opacity ease .8s .7s;
	}
	#brandArea.on .mncont4 > .step.t1 .tit1 > .txt1 > p:nth-of-type(2){
		transition-delay:.8s;
	}
	#brandArea.on .mncont4 > .step.t1 .tit1 > .txt1 > p:nth-of-type(3){
		transition-delay:.9s;
	}
	
	#brandArea.on .mncont4 > .step.t1 .bl1{
		transform:translateX(0px);
		opacity:1;
		transition:transform ease .8s .6s, opacity ease .8s .6s;
	}
	
	#brandArea.step2 .mncont4 > .step{
		transform:translateX(calc((50% + 49px) * -1));
		transition:transform ease 1.1s;
	}
	#brandArea.step2 .mncont4 > .step.t2{
		transform:translateX(0);
		transition:transform ease 1.1s;
	}
	
	#brandArea.step2 .mncont4 > .step.t2 > .cont1 .tit1{
		transform:translateY(0px);
		opacity:1;
		transition:transform ease .8s .5s, opacity ease .8s .5s;
	}
	#brandArea.step2 .mncont4 > .step.t2 > .cont1 p{
		transform:translateY(0px);
		opacity:1;
		transition:transform ease .8s .6s, opacity ease .8s .6s;
	}
	#brandArea.step2 .mncont4 > .step.t2 a{
		transform:translateY(0px);
		opacity:1;
		transition:transform ease .8s .7s, opacity ease .8s .7s;
	}
	
/*main*/