@charset "utf-8";

/**************************************************
	Layout CSS Document
	IEETU Web Standardization Team
	2023-06-30
**************************************************/

/**************************************************
	Common
**************************************************/
.cont_main{word-break:keep-all; word-wrap:break-word;}

/**************************************************
	Header
**************************************************/
/* 헤더 Logo */
.main_wrap #header .area_logo .logo a{background:url(../images/common/logo_header_wh.png) no-repeat 0 0/cover; color:transparent;}
.main_wrap #header.open .area_logo .logo a{background:url(../images/common/logo_header.png) no-repeat 0 0/cover;}

/* 헤더 GNB */
.fixed .main_wrap #header{position:absolute;}
.main_wrap #header{border-bottom:none;}
.main_wrap #header.open{border-bottom:1px solid #e4e4e4;}
.main_wrap #header #gnb > li > a{color:#fff;}
.main_wrap #header.open #gnb > li > a{color:#222;}

/* Util */
.main_wrap #header .util_r li{background-image:url(../images/common/ico_util_sp_wh.png);}
.main_wrap #header.open .util_r li{background-image:url(../images/common/ico_util_sp.png);}

/**************************************************
	Main
**************************************************/
.cont_main{height:100vh;}
.cont_main .main_slider{height:100vh; overflow:hidden;}
.cont_main .main_slider .swiper-slide{overflow:hidden;}
.cont_main .main_slider .main02{background:url(../images/main/main_visual02.jpg) 50% 50%; background-size:cover;}
.cont_main .main_slider .main03{background:url(../images/main/main_visual03.jpg) 50% 50%; background-size:cover;}
.cont_main .main_slider .main04{background:url(../images/main/main_visual04.jpg) 50% 50%; background-size:cover;}
.cont_main .main_slider .inr{display:flex; flex-direction:column; justify-content:center; position:relative; z-index:50; height:100vh;}
.cont_main .main_slider .inr:before{content:""; display:block; position:absolute; top:50%; width:100%; height:1px; z-index:30; background:rgba(255,255,255,0.14);}
.cont_main .main_slider .main01 .inr:after{content:""; position:absolute; display:block; top:0; left:0; width:100%; height:100vh; background:rgba(0,0,0,0.4);}
.cont_main .mainbg-video {position:absolute; top:0%; left:50%; z-index:10; min-width:100vw; min-height:100vh; width:auto; height:auto; opacity:1; transform:translateX(-50%) translateY(0%); background-size:cover;}
.cont_main .main_slider .ms_top,
.cont_main .main_slider .ms_btm{position:absolute; top:50%; z-index:50; margin-left:5%;}
.cont_main .main_slider .ms_top{transform:translateY(-100%); padding-bottom:30px;}
.cont_main .main_slider .ms_btm{padding-top:40px;}
.cont_main .main_slider .main03 .ms_top,
.cont_main .main_slider .main03 .ms_btm{left:40%;}
.cont_main .main_slider .tit{font-family:'montserrat'; font-weight:800; font-size:65px; letter-spacing:-2px; color:#fff; line-height:1.2;}
.cont_main .main_slider .tit span{font-weight:400; font-size:60px; transition: ease-in-out 1s;}
.cont_main .main_slider .txt{font-size:20px; color:#fff; font-weight:300; line-height:1.7;}
.cont_main .main_slider .main02 .txt,
.cont_main .main_slider .main03 .txt,
.cont_main .main_slider .main04 .txt{padding-top:35px;}
.cont_main .main_slider .btn_view{position:relative; display:block; color:#fff; font-size:16px; font-weight:300; padding:0 50px 0 25px;}
.cont_main .main_slider .btn_view:before,
.cont_main .main_slider .btn_view:after{content:""; display:block; position:absolute;}
.cont_main .main_slider .btn_view:before{width:50px; height:50px; border-radius:50%; background:#246ac6; top:50%; left:0; transform:translateY(-50%);}
.cont_main .main_slider .btn_view:after{width:39px; height:9px; right:0; top:50%; transform:translateY(-50%); background:url(../images/main/ico_arrow.png); transition: 0.3s ease-in-out;}
.cont_main .main_slider .btn_view > span{position:relative; z-index:50;}
.cont_main .main_slider .btn_view > span > span{font-family: 맑은 고딕;}
.cont_main .main_slider .swiper_paging{position:absolute; right:5%; bottom:70px; z-index:50; display:flex; transition: 0.3s ease-out;}
.cont_main .main_slider .swiper_paging .swiper-pagination{position:initial;}
.cont_main .main_slider .swiper_paging .swiper-pagination-bullet{width:7px; height:7px; background:transparent; border:1px solid #fff; border-radius:50%; opacity:1; margin:0 6px;}
.cont_main .main_slider .swiper_paging .swiper-pagination-bullet-active{background:#fff;}
.cont_main .main_slider .swiper_paging .swiper-play-stop{position:relative; width:24px; height:24px; border:1px solid #fff; border-radius:50%; margin-left:10px; cursor:pointer;}
.cont_main .main_slider .swiper_paging .swiper-play-stop:before,
.cont_main .main_slider .swiper_paging .swiper-play-stop:after{content:""; display:block; position:absolute; bottom:7px; right:7px; width:2px; height:8px; background:#fff;}
.cont_main .main_slider .swiper_paging .swiper-play-stop:before{right:12px;}
.cont_main .main_slider .swiper_paging .swiper-play-stop.play:before{display:none;}
.cont_main .main_slider .swiper_paging .swiper-play-stop.play:after{content:""; display:block; position:absolute; width:0; height:0; right:1px; top:6px; border-bottom:5px solid transparent; border-top:5px solid transparent; border-left:6px solid #fff; border-right:6px solid transparent; background:none;}
.cont_main .main_slider .swiper_btn{position:absolute; right:5%; top:50%; transform:rotate(90deg); margin-top:-11px; z-index:50; display:flex; transition: 0.3s ease-out;}
.cont_main .main_slider .swiper_btn .swiper-button-next,
.cont_main .main_slider .swiper_btn .swiper-button-prev{position:relative; width:20px; height:24px; background:none; margin:0; left:0; right:0; top:3px;}
.cont_main .main_slider .swiper_btn .swiper-button-next{margin-left:20px;}
.cont_main .main_slider .swiper_btn .swiper-button-next:before,
.cont_main .main_slider .swiper_btn .swiper-button-prev:before{position:absolute; top:0; content:''; width:13px; height:13px; border-top:4px solid #fff; border-right:4px solid #fff;}
.cont_main .main_slider .swiper_btn .swiper-button-next:before{right:0; transform:rotate(45deg);}
.cont_main .main_slider .swiper_btn .swiper-button-prev:before{left:0; transform:rotate(-135deg);}
.cont_main .main_slider .swiper_btn .swiper-button-next:after,
.cont_main .main_slider .swiper_btn .swiper-button-prev:after{position:absolute; content:""; display:block; top:6px; width:5px; height:5px; background:#fff; transform:rotate(45deg);}
.cont_main .main_slider .swiper_btn .swiper-button-next:after{left:4px;}
.cont_main .main_slider .swiper_btn .swiper-button-prev:after{right:4px;}

/* text animation */
.swiper-slide [data-an-order] { opacity: 0; transition: ease-in-out 1s; }
.swiper-slide [data-an-order="1"] { transition-delay: 0.4s; }
.swiper-slide [data-an-order="2"] { transition-delay: 0.6s; }
.swiper-slide [data-an-order="3"] { transition-delay: 0.8s; }
.swiper-slide [data-an-order="4"] { transition-delay: 1.0s; }
.swiper-slide [data-an-order="5"] { transition-delay: 1.2s; }
.swiper-slide [data-an-order="6"] { transition-delay: 1.4s; }
.swiper-slide [data-an-order="7"] { transition-delay: 1.6s; }
.swiper-slide [data-an-order="8"] { transition-delay: 1.8s; }
.swiper-slide [data-an="fade-up"] { transform: translate(0, 100px); -webkit-transform: translate(0, 100px); -moz-transform: translate(0, 100px); -ms-transform: translate(0, 100px); -o-transform: translate(0, 100px); }
.swiper-slide [data-an="fade-down"] { transform: translate(0, -100px); -webkit-transform: translate(0, -100px); -moz-transform: translate(0, -100px); -ms-transform: translate(0, -100px); -o-transform: translate(0, -100px); }
.swiper-slide [data-an="fade-right"] { transform: translate(-100px, 0); -webkit-transform: translate(-100px, 0); -moz-transform: translate(-100px, 0); -ms-transform: translate(-100px, 0); -o-transform: translate(-100px, 0); }
.swiper-slide [data-an="fade-left"] { transform: translate(100px, 0); -webkit-transform: translate(100px, 0); -moz-transform: translate(100px, 0); -ms-transform: translate(100px, 0); -o-transform: translate(100px, 0); }
.swiper-slide-active [data-an="fade-down"],
.swiper-slide-active [data-an="fade-up"],
.swiper-slide-active [data-an="fade-right"],
.swiper-slide-active [data-an="fade-left"] { opacity: 1; transform: translate(0, 0); -webkit-transform: translate(0,0); -moz-transform: translate(0,0); -ms-transform: translate(0,0); -o-transform: translate(0,0);}

/* footer */
.main_wrap #footer{position:absolute; width:100%; text-align:center; bottom:35px; left:0; z-index:50; margin:0; background:none; padding:0;}
.main_wrap #footer .mobile{display:none;}


/* ~ 1460px */
@media screen and (max-width:1460px){

	/**************************************************
		Main
	**************************************************/
	.cont_main .main_slider .tit{font-size:45px;}
	.cont_main .main_slider .tit span{font-size:40px;}
	.cont_main .main_slider .txt{font-size:18px;}
	.cont_main .main_slider .swiper_btn,
	.cont_main .main_slider .swiper_paging{right:20px;}

}

/* ~ 1023px */
@media screen and (max-width:1023px){

	/**************************************************
		Header
	**************************************************/
	.main_wrap #header .util_r li{background-image:url(../images/common/ico_util_sp_wh_x2.png); background-size:24px;}

	/* 모바일 전체메뉴 */
	.main_wrap .wholeview_wrap .btn_wv span{background:#fff;}

}

/* ~ 767px */
@media screen and (max-width:767px){
	
	/**************************************************
		Main
	**************************************************/
	.cont_main .main_slider .tit{font-size:36px; line-height:1.1;}
	.cont_main .main_slider .tit span{font-size:32px;  line-height:1.1;}
	.cont_main .main_slider .txt{font-size:16px; line-height:1.5;}
	.cont_main .main_slider .main02 .txt, 
	.cont_main .main_slider .main03 .txt, 
	.cont_main .main_slider .main04 .txt{padding-top:20px;}
	.cont_main .main_slider .ms_top{padding-bottom:20px;}
	.cont_main .main_slider .ms_btm{padding-top:30px;}
	.cont_main .main_slider .ms_top, 
	.cont_main .main_slider .ms_btm{margin:0 20px;}
	.cont_main .main_slider .swiper_btn{display:none;}
	.cont_main .main_slider .swiper_paging{bottom:100px;}
	.cont_main .main_slider .btn_view:before{width:40px; height:40px; margin-top:-2px;}
	.cont_main .main_slider .btn_view{padding-left:20px;}
	.cont_main .main_slider .main03 .ms_top,
	.cont_main .main_slider .main03 .ms_btm{left:0;}

	/* footer */
	.main_wrap #footer{padding:0 20px; bottom:20px;}
	.main_wrap #footer .mobile{display:block;}
}

/* ~ 639px */
@media screen and (max-width:639px){
	
}

/* ~ 537px */
@media screen and (max-width:537px){
	
}

/* ~ 537px */
@media screen and (max-width:350px){
	
	/* footer */
	.main_wrap #footer .f_txt{font-size:13px;}

}