@charset "utf-8";
.pcbr{display:block;}
.ptbr{display:block;}
.tbbr{display:none;}
.mbbr{display:none;}
.dn{display:none;}

#container{overflow: hidden;}

#contents{padding-bottom: 130px;}

.innerwrap{
	width: 92%;
	max-width: 1740px;
	margin: 0 auto;
}


#custom_cursor{width: 120px;height: 120px;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{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: rgba(0,0,0,0.8);transition:transform 0.3s; display: flex;flex-direction: column;align-items: center;justify-content: center;}


.sec_tit{
	position: relative;
	z-index: 1;
}
.sec_tit .tit .tit_en{
	font-family: "Wix Madefor Display";
	font-size: 20px;
	font-weight: 700;
	color: #fff;
}
.sec_tit .tit .tit_kr{
	margin-top: 30px;
	font-size: 50px;
	font-weight: 700;
	line-height: 1.4em;
	color: #fff;
}
.sec_tit .link{
	margin-top: 40px;
	display: flex;
	align-items: center;
}
.sec_tit .link span{
	font-size: 17px;
	color: #fff;
	margin-right: 15px;
}
.sec_tit .link a{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 58px;
	height: 58px;
	border: 1px solid rgba(255,255,255,0.4);
	border-radius: 50%;
	box-sizing: border-box;
}
.sec_tit .link a:after{
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	transform: scale(0);
	transform-origin: center;
	width: 100%;
	height: 100%;
	background: #fff;
	border-radius: 50%;
	transition: all 0.3s;
}
.sec_tit .link a:hover:after{
	transform: scale(1);
}
.sec_tit .link a i{
	position: relative;
	z-index: 1;
	display: block;
	width: 15px;
	height: 14px;
	background: url(/images/main/link_arr.png) no-repeat center / cover;
	transition: all 0.3s;
}
.sec_tit .link a:hover i{
	background: url(/images/main/link_arr_bl.png) no-repeat center / cover;
}

.sec_tit.bl .tit .tit_en{color: #000;}
.sec_tit.bl .tit .tit_kr{color: #000;}
.sec_tit.bl .link span{color: #000;}
.sec_tit.bl .link a{border: 1px solid #000;}
.sec_tit.bl .link a:after{background: #000;}
.sec_tit.bl .link a i{background: url(/images/main/link_arr_bl.png) no-repeat center / cover;}
.sec_tit.bl .link a:hover i{background: url(/images/main/link_arr.png) no-repeat center / cover;}


/* visual */
.visual{
	overflow:hidden;
	position:relative;
	width:100%; height: 100vh;
}
.visual .swiper-wrapper{width:100%;height:100%;}
.visual .swiper-slide{
	position:relative;
	width:100%;height:100%;
}
.visual .swiper-slide .bg{
	position:absolute;left:0%;top:0%;z-index:-1;
	width:100%;height:100%;	
	transform:scale(1.1);
	transition:all 4s;
}
.visual .swiper-slide-active .bg{transform:scale(1);}
.visual .swiper-slide.v1 .bg{background:url(/images/main/main_visual1.jpg) no-repeat center;background-size:cover;}
.visual .swiper-slide.v2 .bg{background:url(/images/main/main_visual1.jpg) no-repeat center;background-size:cover;}
.visual .swiper-slide.v3 .bg{background:url(/images/main/main_visual1.jpg) no-repeat center;background-size:cover;}


.visual .txtwrap{
	position:absolute;left:4%;top:50%;z-index:10;
	transform:translateY(-50%);
	width:92%;
}
.visual .txtwrap .tit h2, .visual .txtwrap .tit h3{
	overflow: hidden;
}
.visual .txtwrap .tit h2 span{
	display: inline-block;
	font-size: 72px;
	font-weight: 700;
	color: #fff;
}
.visual .txtwrap .tit h3 span{
	display: inline-block;
	font-size: 28px;
	color: #fff;
	margin-top: 30px;
}

.visual .vpaging {
	position: absolute;
	width: 92%;
	left: 4%;
	bottom: 70px;
	z-index: 100;
	margin: 0 auto;
	display: flex;
	align-items: center;
}
.visual .vpaging span{
	opacity:1;
	display: inline-block;
	position:relative;
	width:50px;height:1px;
	margin-right: 10px;
	border-radius: 0;
	background:#839ba5;
}
.visual .vpaging span.swiper-pagination-bullet-active{
	height: 3px;
}

.visual .scrollWrap{
	position: absolute;
	right: 4%;
	bottom: 0;
	z-index: 1;
}
.visual .scrollWrap .scroll{
	display: inline-block;
	position: relative;
	width: 1px;
	height: 180px;
	background: rgba(255, 255, 255, 0.3);
}
.visual .scrollWrap .scroll:after{
	display: block;
	content: "";
	width: 2px;
	height: 60px;
	background: #fff;
	position: absolute;
	left: 0;
	top: 0;
	animation: scroll 1.4s infinite ease;
}
@keyframes scroll{
	0%{transform:translateY(0);}
	100%{transform:translateY(120px);}
}


.sec2{
	position: relative;
	height: 100vh;
	display: flex;
	align-items: center;
}
.sec2 .innerwrap > .tit{
	font-family: "Wix Madefor Display";
	font-size: 20px;
	font-weight: 700;
}
.sec2 .slg{
	margin: 30px 0;
}
.sec2 .slg > .txt{
	display: inline-block;
	overflow: hidden;
	font-size: 94px;
	font-weight: 700;
	line-height: 1.2em;
}
@media (max-width: 1699px){
	.sec2 .slg > .txt{font-size: 80px;}
}
.sec2 .slg .sec3Wrap{
	position: absolute;
	left: 50%;
	top: 50%;
	opacity: 0;
	transform: translate(-50%, -50%);
	width: 350px;
	height: 126px;
	border-radius: 30px;
	z-index: 10;
	overflow: hidden;
}
.sec2 .innerwrap > p{
	font-size: 24px;
	line-height: 1.8em;
}

.sec3{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
}
.sec3.mobile{display: none !important;}
.sec3 .bg{
	position: absolute;
	left: 0;
	top: 0;
	width :100%;
	height: 100%;
	background: url(/images/main/sec3_bg.jpg) no-repeat center / cover;
}
.sec3 .innerwrap{
	position: relative;
	display: flex;
	align-items: center;
	height: 100%;
}
.sec3 .txtwrap{
	width: 50%;
	display: none;
	opacity: 0;
}
.sec3 .txtwrap .info{
	position: relative;
	z-index: 1;
	margin-top: 90px;
}
.sec3 .txtwrap .info h3{
	margin: 10px 0 50px;
	font-size: 36px;
	font-weight: 700;
	color: #fff;
}
.sec3 .txtwrap .info h4{
	margin-bottom: 20px;
	font-size: 24px;
	font-weight: 700;
	color: #fff;
}
.sec3 .txtwrap .info p{
	font-size: 18px;
	line-height: 1.8em;
	color: rgba(255,255,255,0.6);
}
.sec3 .imgwrap{
	width: 50%;
	height: auto;
}
.sec3 .imgwrap .img{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	/* right: 0;
	top: 50px; */
}
.sec3 .imgwrap .img img{
	/* min-width: 305px; */
}

.sec4{padding: 260px 0 0;}
.sec4 .conwrap{
	position: relative;
	width: 100%;
	padding: 90px;
	border-radius: 30px;
	background: #2534cb;
	overflow: hidden;
	display: flex;
	align-items: center;
}
.sec4 .conwrap .bg{
	position: absolute;
	left: 0;
	bottom: 90px;
}
.sec4 .conwrap .titwrap{
	width: 50%;
}
.sec4 .conwrap .info{
	width: 50%;
	height: 720px;
	padding: 90px 80px;
	border-radius: 20px;
	background: rgba(255,255,255,0.1);
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}
.sec4 .conwrap .info h3{
	margin: 10px 0 40px;
	font-size: 36px;
	font-weight: 700;
	color: #fff;
}
.sec4 .conwrap .info h4{
	margin-bottom: 20px;
	font-size: 24px;
	font-weight: 700;
	color: #fff;
}
.sec4 .conwrap .info p{
	font-size: 18px;
	line-height: 1.8em;
	color: #fff;
}

.sec5{
	margin-top: -180px;
	padding: 430px 0 260px;
	background: url(/images/main/sec5_bg.png) no-repeat center bottom 40% / contain #e6e7ea;
}
.sec5 .boxwrap{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}
.sec5 .boxwrap .box{
	position: relative;
	width: calc((100% - 40px) / 3);
	z-index: 2;
}
.sec5 .boxwrap .box.txt{
	z-index: 1;
}
.sec5 .boxwrap .box:after{
	content: "";
	display: block;
	padding-bottom: 100%;
}
.sec5 .boxwrap .box .inner{
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 30px;
	overflow: hidden;
}
.sec5 .boxwrap .box:nth-child(1) .inner{border-radius: 0;}
.sec5 .boxwrap .box:nth-child(6),
.sec5 .boxwrap .box:nth-child(7){
	opacity: 0;
}
.sec5 .boxwrap .box:nth-child(2) .inner{background: url(/images/main/sec5_box2_img.jpg) no-repeat center / cover;}
.sec5 .boxwrap .box:nth-child(4) .inner{background: url(/images/main/sec5_box4_img.jpg) no-repeat center / cover;}
.sec5 .boxwrap .box:nth-child(8) .inner{background: url(/images/main/sec5_box8_img.jpg) no-repeat center / cover;}
.sec5 .boxwrap .box.txt .inner{
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 70px 50px;
	box-sizing: border-box;
	background: #fff;
}
.sec5 .boxwrap .box.txt .inner b{
	display: block;
	margin: 25px 0;
	font-size: 35px;
	font-weight: 700;
}
.sec5 .boxwrap .box.txt .inner p{
	font-size: 19px;
	line-height: 1.6em;
}


.sec6{width: 100%; height: 100vh; padding: 140px 0; box-sizing: unset;}
.sec6 .innerwrap{
	position: relative;
	height: calc(100% - 110px);
	margin-top: 110px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.sec6 .circlewrap{
	position: relative;
	width: 788px;
	height: 788px;
}
.sec6 .circlewrap .slg{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
}
.sec6 .circlewrap .slg .tit{
	font-family: "Wix Madefor Display";
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 30px;
}
.sec6 .circlewrap .slg h2{
	font-size: 50px;
	font-weight: 700;
	white-space: nowrap;
}
.sec6 .circlewrap .slg h2 div{
	overflow: hidden;
}
.sec6 .circlewrap .slg h2 div span{
	display: inline-block;
	transform: translateY(100%);
}
.sec6 .circlewrap .slg h2 div:nth-child(1) span{transition: all 0.1s;}
.sec6 .circlewrap .slg h2 div:nth-child(2) span{transition: all 0.3s;}
.sec6 .circlewrap .slg h2 div:nth-child(3) span{transition: all 0.5s;}
.sec6 .circlewrap li{
	position: absolute;
	font-size: 34px;
	font-weight: 700;
	text-align: center;
	white-space: nowrap;
}
.sec6 .circlewrap li:nth-child(1){
	left: 50%;
	top: -15%;
	transform: translateX(-50%);
}
.sec6 .circlewrap li:nth-child(2){
	left: -39%;
	top: 75%;
}
.sec6 .circlewrap li:nth-child(3){
	right: -39%;
	top: 75%;
}
.sec6 .circlewrap .circle{
	position: absolute;
	width: 100%;
	height: 100%;
	background: url(/images/main/sec6_circle_line.png) no-repeat center / contain;
}
.sec6 .circlewrap .circle .dot{
	position: absolute;
	width: 11px;
	height: 11px;
	z-index: 2;
}
.sec6 .circlewrap .circle .dot:nth-child(1){
	left: 50%;
	top: -0.5%;
	transform: translateX(-50%);
}
.sec6 .circlewrap .circle .dot:nth-child(2){
	left: 6%;
	top: 74%;
}
.sec6 .circlewrap .circle .dot:nth-child(3){
	right: 6%;
	top: 74%;
}
.sec6 .circlewrap .circle .dot .pinkcc{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 50px;
	height: 50px;
	opacity: 0;
}
.sec6 .circlewrap .circle .dot .pinkcc .cc{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: #f9d9d4;
}

.sec6 .circlewrap .circle .dot .pinkcc .cc1{animation: wave 2s ease-in infinite 0s;}
.sec6 .circlewrap .circle .dot .pinkcc .cc2{animation: wave 2s ease-in infinite 0.5s;}
.sec6 .circlewrap .circle .dot .pinkcc .cc3{animation: wave 2s ease-in infinite 1s;}
@keyframes wave{
0%{opacity:1; transform: translate(-50%, -50%) scale(0);}
100%{opacity:0.5;transform: translate(-50%, -50%) scale(1);}
}
.sec6 .circlewrap .circle .dot .redcc{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 11px;
	height: 11px;
	border-radius: 50%;
	background: #e3432a;
	z-index: 1;
}


.sec7{padding-bottom: 230px;}
.sec7 .sec_tit{
	display: flex;
	justify-content: space-between;
}
.sec7 .press{
	margin-top: 60px;
	padding-bottom: 70px;
}
.sec7 .press .swiper-slide{
	width: 408px;
}
.sec7 .press .swiper-slide a{
	display: block;
}
.sec7 .press .swiper-slide a .thumb{
	width: 100%;
	border-radius: 30px;
	overflow: hidden;
}
.sec7 .press .swiper-slide a .thumb img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.7s;
}
.sec7 .press .swiper-slide a:hover .thumb img{
	transform: scale(1.1);
}
.sec7 .press .swiper-slide a .txtwrap{
	margin-top: 30px;
}
.sec7 .press .swiper-slide a .txtwrap .tit{
	font-size: 24px;
	font-weight: 700;
	color: #222;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}
.sec7 .press .swiper-slide a .txtwrap .con{
	font-size: 20px;
	color: #222;
	line-height: 1.5em;
	height: 3em;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	margin: 10px 0 15px;
}
.sec7 .press .swiper-slide a .txtwrap .date{
	font-size: 18px;
	color: #777;
}
.sec7 .press .swiper-scrollbar{
	display:block !important;
	width:100%;height:1px;
	left:0;
	background:#c4c4c4;
}
.sec7 .press .swiper-scrollbar .swiper-scrollbar-drag{
	height:2px;
	background:#000;
}



.sec8{}
.sec8 .conwrap{
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	height: 600px;
	border-radius: 30px;
	overflow: hidden;
}
.sec8 .conwrap .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(/images/main/sec8_bg.jpg) no-repeat center / cover;
}
.sec8 .conwrap .sec_tit{
	width: 100%;
	padding: 0 80px;
	box-sizing: border-box;
}

/*신규*/
.sec4 .listarea{margin-bottom: 200px;}
.sec4 .listarea .sec_tit{margin-bottom: 95px;}
.sec4 .listarea .sec_tit .tit .tit_kr{color:#111;font-size:50px;}
.sec4 .listarea .sec_tit p{
margin-top: 40px;color:#555;font-size:24px;font-weight: 400;
}
.sec4 .listarea .list{display: flex;flex-wrap:wrap;gap:7vw;}
.sec4 .listarea .list>li{}
.sec4 .listarea .list>li .bold{
font-size:94px;color:#222222;font-weight: bold;font-family: "Wix Madefor Display", "Noto Sans KR";
letter-spacing:-0.025em;
}
.sec4 .listarea .list>li .bold small{font:inherit;font-size:38px;}
.sec4 .listarea .list>li .bold img{padding-bottom: 18px;}
.sec4 .listarea .list>li .txt{
font-size:20px;color:#555555;font-weight: 350;font-family: "Noto Sans KR";margin-top: 8px;
}
/* 모션 */
@-webkit-keyframes showImg{
0%{ clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);}
100%{clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%); }
animation-delay: 1s;
}
@-webkit-keyframes showImg2{
0% {clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);}
100% {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
animation-delay: 1s;
}
@-webkit-keyframes opacityAni{
0%{opacity:0;}
100%{opacity:1;}
}
@-webkit-keyframes scaleAni{
0%{opacity:0;transform:scale(1.3);}
100%{opacity:1;transform:scale(1);}
}
@-webkit-keyframes scaleAni2{
0%{opacity:0.5;transform:scale(1.3);}
100%{opacity:1;transform:scale(1);}
}
@-webkit-keyframes fadeUpAni{
0%{opacity:0; transform:translateY(50px);}
100%{opacity:1;transform:translateY(0);}
}
@-webkit-keyframes fadeUpAni2{
0%{opacity:0; transform:translateY(30px);}
100%{opacity:1;transform:translateY(0);}
}
@-webkit-keyframes fadeLeftAni{
0%{opacity:0; transform:translateX(-50px);}
100%{opacity:1;transform:translateX(0);}
}
@-webkit-keyframes fadeRightAni{
0%{opacity:0; transform:translateX(50px);}
100%{opacity:1;transform:translateX(0);}
}

.fadeUp{opacity: 0;}
.fadeUp2{opacity: 0;}
.fadeLeft{opacity: 0;}
.fadeRight{opacity: 0;}
.showImg{opacity: 0;}
.showImg2{opacity: 0;}
.showImg_2{opacity: 0;}

.showImg.in-view{animation-name: showImg;animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 1.4s; opacity: 1;}
.showImg2.in-view{animation-name: showImg2;animation-timing-function: cubic-bezier(0.14, 0, 0.42, 1.01); animation-duration: 1.4s; opacity: 1;}



.showImg_2.in-view {animation-name: showImg2;animation-timing-function: cubic-bezier(.37,.38,.61,.61);animation-duration: 1.4s;opacity: 1 !important;}
.opacity.in-view{animation-name: opacityAni;animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 1.4s;}
.fadeUp.in-view{animation-name: fadeUpAni; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01);animation-duration: 1.4s; opacity: 1;}
.fadeUp2.in-view{animation-name: fadeUpAni2; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01);animation-duration: 1.4s; opacity: 1;}
.fadeLeft.in-view{animation-name: fadeLeftAni; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01);animation-duration: 1.4s; opacity: 1;}
.fadeRight.in-view{animation-name: fadeRightAni; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01);animation-duration: 1.4s; opacity: 1;}
.scaleAni.in-view{animation-name: scaleAni; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 1.4s; }
.scaleAni2.in-view{animation-name: scaleAni2; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 1.5s; }



.visual .txtwrap .tit h2 span{opacity: 0; transform: translateY(100%);}
.visual .txtwrap .tit h3 span{opacity: 0; transform: translateY(100%);}
.visual.in-view .txtwrap .tit h2 span{opacity: 1; transform: translateY(0); transition: all 1.2s 0.2s;}
.visual.in-view .txtwrap .tit h3 span{opacity: 1; transform: translateY(0); transition: all 1.2s 0.6s;}



.sec4 .conwrap .bg img{transform: translateX(-100%);}
.sec4 .conwrap.in-view .bg img{transform: translateX(0); transition: 1.2s 0.2s ease;}


.sec5 .boxwrap .box.txt{transform: translateX(calc(-100% - 20px));}
.sec5 .boxwrap .box.txt.in-view{transform: translateX(0); transition: all 1.5s 0.2s;}


.sec7 .sec_tit{opacity: 0; transform: translateY(40px);}
.sec7 .sec_tit.in-view{opacity: 1; transform: translateY(0); transition: all 1.4s 0.3s;}
.sec7 .press{opacity: 0; transform: translateY(40px);}
.sec7 .press.in-view{opacity: 1; transform: translateY(0); transition: all 1.4s 0.3s;}


.sec8 .conwrap .bg{transform: scale(1.2);}
.sec8 .conwrap.in-view .bg{transform: scale(1); transition: all 2.5s 0.2s;}
.sec8 .conwrap .sec_tit .tit .tit_en{opacity: 0; transform: translateY(40px);}
.sec8 .conwrap.in-view .sec_tit .tit .tit_en{opacity: 1; transform: translateY(0); transition: all 1.4s 0.2s;}
.sec8 .conwrap .sec_tit .tit .tit_kr{opacity: 0; transform: translateY(40px);}
.sec8 .conwrap.in-view .sec_tit .tit .tit_kr{opacity: 1; transform: translateY(0); transition: all 1.4s 0.2s;}
.sec8 .conwrap .sec_tit .link{opacity: 0; transform: translateY(40px);}
.sec8 .conwrap.in-view .sec_tit .link{opacity: 1; transform: translateY(0); transition: all 1.4s 0.2s;}




