@charset "utf-8";
 
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Black+Han+Sans&display=swap');

.section{width:100%;height:100%;}
.section-wrap{width:100%; height:100%; max-width:1200px; margin:0 auto; position:relative;}

.right#fp-nav{right:3.75%; z-index:900;}
#fp-nav{margin-top:0 !important; transform:translate(0, -50%);}
#fp-nav ul li, .fp-slidesNav ul li{width:25px; height:25px; margin:17.5px 0 17.5px 17.5px;}
#fp-nav ul li a span, .fp-slidesNav ul li a span{width:5px; height:5px; background:rgba(255,255,255,0.8); left:50%; top:50%; transform:translate(-50%, -50%); margin:0;}
#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li:hover a.active span{width:5px; height:5px; margin:0; border-radius:50%; left:50%; top:50%; transform:translate(-50%, -50%); background:#fff;}
#fp-nav ul li a.active, .fp-slidesNav ul li a.active, #fp-nav ul li:hover a.active, .fp-slidesNav ul li:hover a.active{position:relative;}
#fp-nav ul li:hover a span, .fp-slidesNav ul li:hover a span{width:5px; height:5px; background:#fff; left:50%; top:50%; transform:translate(-50%, -50%); margin:0;}
#fp-nav ul li a:before, .fp-slidesNav ul li a:before,  #fp-nav ul li:hover a:before, .fp-slidesNav ul li:hover a:before{content:''; width:25px; height:25px; margin:0; border-radius:50%; border:1px solid rgba(255,255,255,0.6); position:absolute; left:-1px; top:-1px; opacity:0;}
#fp-nav ul li a.active:before, .fp-slidesNav ul li a.active:before,  #fp-nav ul li:hover a.active:before, .fp-slidesNav ul li:hover a.active:before{-webkit-animation: ball-scale-multiple 1s 0s linear infinite; animation: ball-scale-multiple 1s 0s linear infinite;}
/* #fp-nav ul li a.active:before, .fp-slidesNav ul li a.active:before,  #fp-nav ul li:hover a.active:before, .fp-slidesNav ul li:hover a.active:before{content:''; width:25px; height:25px; margin:0; border-radius:50%; border:1px solid rgba(255,255,255,0.6); position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); -webkit-animation: ball-scale-multiple 1s 0s linear infinite; animation: ball-scale-multiple 1s 0s linear infinite;} */
#fp-nav.right.right ul li:last-child, .fp-slidesNav ul li:last-child{display:none !important;}

/* circle 애니메이션 css */
.ball-scale-multiple {position: relative; opacity:0;filter:Alpha(opacity=0);
	-moz-transition:all 0.7s, opacity 1.0s;
	-ms-transition:all 0.7s, opacity 1.0s;
	-webkit-transition:all 0.7s, opacity 1.0s;
	-o-transition:all 0.7s, opacity 1.0s;
	transition:all 0.7s, opacity 1.0s;
}
.ball-scale-multiple > div:nth-child(2) {
    -webkit-animation-delay: -2s;
    animation-delay: -2s; 
}
.ball-scale-multiple > div {
    border-radius: 50%;
    position: absolute;
    top: -3px;
	left:-3px;
    opacity: 0;
    margin: 0;
    width: 74px;
    height: 74px;
	border:3px solid #1a978e;
	background-color: #1a978e;
    -webkit-animation: ball-scale-multiple 3s 0s linear infinite;
    animation: ball-scale-multiple 3s 0s linear infinite;
}

@keyframes ball-scale-multiple {
	0% {
		-webkit-transform: scale(0.33);
        transform: scale(0.33);
		opacity: 0.3; 
	}
	5% {
		opacity: 0.8; 
	}
	100% {
		-webkit-transform: scale(1);
        transform: scale(1);
		opacity: 0; 
	}  
}

@-webkit-keyframes ball-scale-multiple {
	0% {
		-webkit-transform: scale(0.33);
        transform: scale(0.33);
		opacity: 0.3; 
	}
	5% {
		opacity: 0.8; 
	}
	100% {
		-webkit-transform: scale(1);
        transform: scale(1);
		opacity: 0; 
	}  
}

/* #fp-nav ul li .fp-tooltip.right{right:40px;} */
#fp-nav ul li .fp-tooltip{top:50%; transform:translate(0, -50%); font-family:'Montserrat', 'Noto Sans KR', sans-serif; width:auto; opacity:0.6; padding-right:20px;}
#fp-nav ul li a.active + .fp-tooltip{opacity:1;font-weight:300;}

/* nav-black */
.fp-viewing-3 #fp-nav ul li .fp-tooltip{color:#333;}
.fp-viewing-3 #fp-nav ul li a span, .fp-slidesNav ul li a span{background:rgba(51,51,51,0.6);}
.fp-viewing-3 #fp-nav ul li a.active span, .fp-viewing-3 .fp-slidesNav ul li a.active span, .fp-viewing-3 #fp-nav ul li:hover a.active span, .fp-viewing-3 .fp-slidesNav ul li:hover a.active span{background:#333;}
.fp-viewing-3 #fp-nav ul li a::before, .fp-viewing-3 .fp-slidesNav ul li a::before, .fp-viewing-3 #fp-nav ul li:hover a::before, .fp-viewing-3 .fp-slidesNav ul li:hover a::before { border: 1px solid rgba(51,51,51, 0.6);}

/*====================
	section0 - ABOUT
======================*/
#section0{position:relative;}
.section-bg-wrap{width:100%;height:100vh;position:relative;transition:all 0.4s;overflow:hidden;}
.section-bg{background:url(../../images/thema/main/bg0.jpg)no-repeat;}
.main-bg{width:100%; height:100%; position:absolute; background-position:center; background-size:cover; -webkit-transform: translateZ(0) scale(1.4) rotate(0.1deg); transform: translateZ(0) scale(1.4) rotate(0.1deg); -webkit-transition:transform 10s; transition:transform 10s; -webkit-transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000); transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);}
.bg-loaded{-webkit-transform: translateZ(0) scale(1) rotate(0deg); transform: translateZ(0) scale(1) rotate(0deg);}


.about{position:absolute;left:0;top:50%;transform:translateY(-50%);width:100%;}
.about .conwrap{position:relative;width:100%;padding-left:13%;box-sizing:border-box;}
.about .conwrap:before{width:100%;content:'';position:absolute;height:1px;background:rgba(255,255,255,0.4);left:0;top:43%;}
.about .conwrap h2{font-size:80px;font-family:'Montserrat', sans-serif;font-weight:900;color:#fff;line-height:1.12;margin-bottom:20px;}
.about .conwrap h3{font-size:49px;color:#fff;font-family: 'Black Han Sans', sans-serif;line-height:1.2;margin-bottom:9px;letter-spacing:0.1em;font-weight:normal;}
.about .conwrap p{font-size:25px;color:#fff;font-weight:400;line-height:1.4;}

.fadeInLeft{animation-duration:1.3s;}
.fadeInRight{animation-delay:0.5s;}
.fadeInUp{animation-duration:1.3s;}
/*====================
	section1 - PRODUCT
======================*/
#section1{background:linear-gradient(to right, #13172d 0%,#254462 100%);}
.product{width:100%;height:100%;position:relative;}
.polywrap{position:absolute;left:0;top:28.7%;}
.polywrap2{position:absolute;bottom:22.5%;left:50%;transform:translateX(-50%);}
.product-img{width:60%;max-width:1043px;height:796px;background-size:contain !important;position:absolute;right:0;top:0;}
.product-img.pi{background:url(../../images/thema/main/filter1.png)no-repeat;}
.product-img.pi1{background:url(../../images/thema/main/filter1.png)no-repeat;opacity:0;}
.product-img.pi2{background:url(../../images/thema/main/filter2.png)no-repeat;opacity:0;}
.product-img.pi3{background:url(../../images/thema/main/filter3.png)no-repeat;opacity:0;}
.product-img.pi4{background:url(../../images/thema/main/filter4.png)no-repeat;opacity:0;}
.product-img.pi5{background:url(../../images/thema/main/filter5.png)no-repeat;opacity:0;}
.product-img.pi6{background:url(../../images/thema/main/filter6.png)no-repeat;opacity:0;}


.prowrap{width:100%;height:100vh;background:rgba(0,0,0,0.2);transition:all 0.4s;position:relative;border-left:1px solid rgba(255,255,255,0.1);box-sizing:border-box;}
.prowrap.pw1{border-left:0;}
.pro-txt{text-align:center;position:absolute;bottom:13%;left:50%;transform:translateX(-50%);width:100%;}
.pro-txt2{bottom:16%;}
.pro-txt img{margin-bottom:31px;line-height:0;opacity:0;-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;	transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0,25px,0);	transform: translate3d(0,25px,0);}
.pro-txt h2{font-size:46px;line-height:1.11;color:rgba(255,255,255,0.7);font-weight:600;font-family:'Montserrat', sans-serif;-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;	transition: opacity 0.35s, transform 0.35s;-webkit-transform: translate3d(0,35px,0);	transform: translate3d(0,35px,0);}
.pro-block{display:block;}
.btn-wrap{margin-top:23px;}
.more-btn{opacity:0.8;transition-duration:0.4s;cursor:pointer;font-size:14px;color:#555;line-height:50px;padding:0 61px;border:1px solid #555;display:inline-block;}
.btn-wrap2{margin-top:35px;}
.btn-wrap2 .more-btn{border:1px solid #fff;color:#fff;padding:0 82px;}
.more-btn:hover{border:1px solid #e7141a !important;color:#fff;background:#e7141a;opacity:1;}
.product .btn-wrap{margin-top:44.5px;opacity:0;-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;	transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0,45px,0);	transform: translate3d(0,45px,0);}
.product .more-btn{padding:0 60px !important;}
.prowrap:hover{background:rgba(0,0,0,0.5);}
.prowrap:hover img{opacity:1;-webkit-transform: translate3d(0,0,0);	transform: translate3d(0,0,0);}
.prowrap:hover h2{color:rgba(255,255,255,1);-webkit-transform: translate3d(0,0,0);	transform: translate3d(0,0,0);}
.prowrap:hover .btn-wrap{opacity:1;-webkit-transform: translate3d(0,0,0);	transform: translate3d(0,0,0);}

/*====================
	section2 - GLOBAL
======================*/
/* #section2{background:#f4f8f8 url(../../images/thema/main/global-bg.png)no-repeat center center;background-size:cover;} 
 .clover{width:100%;height:100%;background:url(../../images/thema/main/world_map.png)no-repeat center center;background-size:cover;position:relative;}  */
.map-video{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);min-width:100%;min-height:100%;width:auto;height:auto;z-index:-100;background-size:cover;background: url(../../images/thema/main/global_bg.png)no-repeat center center;}
.clover .conwrap{text-align:center;position:absolute;top:52.3%;left:45.8%;}
.clover .conwrap h3{font-family:'Montserrat', 'Noto Sans KR', sans-serif;font-size:26px;font-weight:600;font-size:26px;line-height:1.4;margin-bottom:2px;}
.clover .conwrap h2{font-family:'Montserrat', 'Noto Sans KR', sans-serif;font-size:33px;font-weight:700;line-height:1.3;position:relative;margin-bottom:16px;letter-spacing:0.08em;}
.clover .conwrap h2:before{position:absolute;content:'';width:100%;height:1px;background:#000;left:0;bottom:1px;}
.clover .conwrap p{font-size:18px;font-weight:400;}

/*****circle 애니메이션*****/
/*  .circle-box .circle {position:absolute; left:33%; top:45%; display:flex; justify-content: center; align-items: center; width:200px; height:200px;}
.circle-box .shape {border:1px solid #fff; background:#fff; border-radius:100px; display:inline-block; box-sizing:border-box;}
.circle-box .circle.n1 .shape { width:20px; height:20px;}
.circle-box .circle.n2 .shape { width:45px; height:45px; opacity: 0.4; filter: alpha(opacity=40); -ms-filter:alpha(opacity=40);}
.circle-box .circle.n3 .shape { width:60px; height:60px; opacity: 0.3; filter: alpha(opacity=30); -ms-filter:alpha(opacity=30);}
.circle-box .circle.n4 .shape { width:100px; height:100px; opacity: 0.3; filter: alpha(opacity=30); -ms-filter:alpha(opacity=30);}
.circle-box .circle.n5 .shape { width:170px; height:170px; opacity: 0.2; filter: alpha(opacity=20); -ms-filter:alpha(opacity=20);}

.circle-box .circle {animation: map_circle 2s linear infinite; -webkit-animation: map_circle 2s linear infinite; animation-fill-mode:forwards; -webkit-animation-fill-mode:forwards}
.circle-box .circle {transform:scale(0); -webkit-transform:scale(0);}
.circle-box .circle.n1 {}
.circle-box .circle.n2 {animation-delay:-0.3s; -webkit-animation-delay:-0.3s;}
.circle-box .circle.n3 {animation-delay:-0.5s; -webkit-animation-delay:-0.5s;}
.circle-box .circle.n4 {animation-delay:-0.8s; -webkit-animation-delay:-0.8s;}
.circle-box .circle.n5 {animation-delay:-1.0s; -webkit-animation-delay:-1.0s;}  */

@-webkit-keyframes map_circle {
    0% {transform:scale(0); -webkit-transform:scale(0);}
    50% {transform:scale(1); -webkit-transform:scale(1); opacity: 1; filter: alpha(opacity=100); -ms-filter:alpha(opacity=100);}
	100% {transform:scale(1.5); -webkit-transform:scale(1.5); opacity: 0; filter: alpha(opacity=0); -ms-filter:alpha(opacity=0);}
}
@keyframes map_circle {
    0% {transform:scale(0); -webkit-transform:scale(0);}
    50% {transform:scale(1); -webkit-transform:scale(1); opacity: 1; filter: alpha(opacity=100); -ms-filter:alpha(opacity=100);}
	100% {transform:scale(1.5); -webkit-transform:scale(1.5); opacity: 0; filter: alpha(opacity=0); -ms-filter:alpha(opacity=0);}
}
/*====================
	section3 - NOTICE
======================*/
#section3{position:relative;background:url(../../images/thema/main/notice_bg.jpg)no-repeat center center;background-size:cover;}
.notice .conwrap{text-align:center;width:100%;}
.m-title{margin-bottom:46px;}
.m-title h1{font-size:40px;line-height:1;color:#fff;font-weight:500;}

.notice-box{width:100%; margin:10px 0;}
.notice-box a{display:block; min-height:80px;width:100%; height:100%; position:relative;border:1px solid #fff; transition:all 0.4s; box-sizing:border-box;}
.notice-box ul{position:absolute; width:100%; top:50%; transform:translateY(-50%);}
.notice-box ul li{display:table-cell; vertical-align:middle; width:12.5%; }
.notice-box ul li:nth-child(2){width:75%;padding:0 20px 0 0; box-sizing:border-box;text-align:left;}
.notice-box ul li h4{font-size:18px; color:#fff; font-weight:300;transition-duration:0.4s;}
.notice-box a:hover h4{text-decoration:underline;}
.n-date{font-size:18px; color:#fff; font-weight:300; float:right; padding-right:50px;transition-duration:0.4s;}
.notice-box a:hover .n-date{text-decoration:underline;}
.r-box{transition-duration:0.4s;background:rgba(51,51,51,0.9);width:100px; height:40px; font-size:16px; color:#fff;font-weight:300; text-align:center; line-height:40px; border-radius:20px; display:block; margin:0 25px;}
.notice-box a:hover .r-box{background:#e7141a;}

/* 공지사항 없을 경우 */
.no-notice{border:1px solid #fff;}
.no-notice p{color:#fff;line-height:180px;}

@media all and (max-width:1450px){
	.clover .conwrap{left:44.5%;}
	
}
@media all and (max-width:1199px){
	.section-wrap{width:96%;}
	#fp-nav{display:none !important;}
	.about .conwrap{padding:0 3.75%;}
	.about .conwrap h2{font-size:65px;margin-bottom:12px;}
	.about .conwrap h3{font-size:40px;margin-bottom:0;}
	.about .conwrap p{font-size:23px;}
	
	.polywrap2{bottom:7.5%;left:auto;transform:none;right:5%;}
	.product-img{width:77%;}
	.prowrap{height:33.33vh;border-bottom:1px solid rgba(255, 255, 255, 0.1);}
	.prowrap.pw3, .prowrap.pw5{border-left:0;}
	.prowrap.pw5, .prowrap.pw6{border-bottom:0;}
	.pro-txt{bottom:13% !important;}
	.pro-txt img{margin-bottom:14px;}
	.pro-txt h2{font-size:40px;}
	.pro-block{display:inline-block;}
	.product .btn-wrap{margin-top:28px;}
	
	.clover .conwrap{left:42.5%;}

	.n-date{padding-right:25px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
	
}

@media all and (max-width:890px){
	.clover .conwrap{left:41.5%;}
	
}

@media all and (max-width:767px){
	
	
	.about .conwrap h2{font-size:50px;}
	.about .conwrap h3{font-size:32px;}
	.about .conwrap p{font-size:20px;line-height:1.2;}
	
	#section1{height:auto !important;}
	#section1 .fp-tableCell{height:auto !important;}
	.prowrap{height:25vh;}
	.prowrap{border-left:0 !important;}
	.prowrap.pw5{border-bottom:1px solid rgba(255,255,255,0.1);}
	.pro-txt{bottom:auto !important;top:48%;transform:translate(-50%, -50%);}
	.pro-txt img{display:none;}
	.pro-txt h2{font-size:30px;-webkit-transform: translate3d(0,5px,0);	transform: translate3d(0,5px,0);font-weight:500;}
	.product .btn-wrap{opacity:1;-webkit-transform: translate3d(0,5px,0);	transform: translate3d(0,5px,0);margin-top:20px;}
	
	#section2{background-size:126% !important;background:#f4f8f8 url(../../images/thema/main/global_bg.png)no-repeat center 15%;}
	.map-video{display:none;}
	.clover .conwrap{left:50%;transform:translateX(-50%);width:100%;top:auto;bottom:18%;}
	.clover .conwrap h2{display:table;margin:0 auto 16px;}
	.more-btn{line-height:45px !important;padding:0 60px !important;}
	
/* 	#section3{height:auto !important;padding:150px 0;}
	#section3 .fp-tableCell{height:auto !important;} */
	.m-title{margin-bottom:37px;}
	.m-title h1{font-size:32px;}
	.notice-box ul{padding:20px;box-sizing:border-box;}
	.notice-box ul li{display:block;width:100% !important;text-align:left;}
	.notice-box ul li:first-child{display:none;}
	.notice-box ul li:nth-child(2){padding:0;}
	.notice-box ul li h4{font-size:16px;margin-bottom:5px;}
	.n-date{font-size:16px;padding-right:0;float:none;}
	
	

	
	
}

@media all and (max-width:525px){
	
	.about .conwrap h2{font-size:40px;}
	.about .conwrap h3{font-size:24px;}
	.about .conwrap p{font-size:18px;line-height:1.2;}
	
	
	.product-img{width:83%;}
	.pro-txt h2{font-size:23px;}
	.product .btn-wrap{margin-top:14px;}
	
	.clover .conwrap h3{font-size:21px;margin-bottom:0;}
	.clover .conwrap h2{font-size:28px;margin-bottom:10px;}
	.clover .conwrap p{font-size:16px;}
	
	.m-title{margin-bottom:31px;}
	.m-title h1{font-size:28px;}
	.notice-box a{min-height:75px;}
	.btn-wrap2{margin-top:30px;}


}

@media all and (max-width:360px){
	
}