@charset "utf-8";

.main_swiper_01 .swiper-slide p.t1 span{
	-webkit-transition: all 1s 0.2s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-moz-transition: all 1s 0.2s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-o-transition: all 1s 0.2s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-ms-transition: all 1s 0.2s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	transition: all 1s 0.2s cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
.main_swiper_01 .swiper-slide p.t2 span{
	-webkit-transition: all 1s 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-moz-transition: all 1s 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-o-transition: all 1s 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-ms-transition: all 1s 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	transition: all 1s 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
.main_swiper_01 .swiper-slide p.t3 span{
	-webkit-transition: all 1s 0.6s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-moz-transition: all 1s 0.6s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-o-transition: all 1s 0.6s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-ms-transition: all 1s 0.6s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	transition: all 1s 0.6s cubic-bezier(0.215, 0.610, 0.355, 1.000);
}

.main_bannery ul li div a:after, .main_bannery ul li div a:before, .main_bannery ul li p{
	-webkit-transition: all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-moz-transition: all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-o-transition: all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-ms-transition: all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	transition: all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000);
}

.main_bannery ul li div a img{
	-webkit-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-moz-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-o-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-ms-transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	transition: all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000);
}

.main_inner{max-width: 1300px; margin: 0 auto;}

/* 메인 */
.main_wrap{width: 100%; padding-top: 80px;}

/* 메인 공통 */
.section{}
.main_inner{width: 100%; max-width: 1300px; margin: 0 auto;}

.main_title{text-align: center; margin-bottom: 70px;}
.main_title h3{font-size: 50px; font-weight: 800; line-height: 1.2;}
.main_title p{font-size: 17px; line-height: 1.4; margin-top: 10px;}


/* 메인 sec1 */
.section.sec1{position: relative; display: flex; justify-content: center; align-items: center; width: 100%; height: calc(100vh - 80px); background: url("../imgs/main/visual_bg.jpg") no-repeat center; background-size: cover; overflow: hidden;}
.section.sec1 .sec1_wrap{position: relative; width: 90%; max-width: 1920px; margin: 0 auto; border-radius: 50px; overflow: hidden; box-shadow: 0 15px 15px rgba(0, 0, 0, 0.3); z-index: 5;}

.main_swiper_01 .text_area{position: absolute; width: 100%; left: 50%; top: 50%; transform: translate(-50%, calc(-50% - 30px)); z-index: 1;}
.main_swiper_01 .text_area p{color: #fff; overflow: hidden; text-align: center;}
.main_swiper_01 .text_area p span{display: block; transform: translateY(100%);}
.main_swiper_01 .text_area .t0{font-size: 57px; font-weight: 800; line-height: 1.3;}
.main_swiper_01 .text_area .t3{font-size: 19px; font-weight: 400; margin-top: 20px; line-height: 1.5;}
.main_swiper_01 img{width: 100%; height: 100%; object-fit: cover;}
/* 메인 sec1 swiper pagination */
.main_swiper_01 .swiper-slide.swiper-slide-active p span{transform: translateY(0);}
.main_swiper_01 .swiper-pagination{position: absolute; bottom: 40px; display: flex; width: auto; height: 12px; left: 50%; transform: translateX(-50%); z-index: 2;}
.main_swiper_01 .swiper-pagination span:nth-child(1){margin-left: 0;}
.main_swiper_01 .swiper-pagination .swiper-pagination-bullet{display: block; width: 12px; height: 12px; background-color: transparent; border: 1px solid #fff; opacity: 1; margin: 0 5px;}
.main_swiper_01 .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color: #fff;}
/* 메인 sec1 swiper play & stop */
.main_swiper_01 .btn_pause{position: absolute; bottom: 40px; display: inline-block; width: 12px; height: 12px; left: 50%; transform: translateX(calc(-50% + 40px)); background: url("../imgs/icon/icon_stop.svg") no-repeat center; background-size: cover; z-index: 2;}
.main_swiper_01 .btn_pause.on{background-image: url("../imgs/icon/icon_play.svg");}
/* 메인 sec1 swiper button */
.main_swiper_01 .swiper-button-next, .main_swiper_01 .swiper-button-prev{width: 14px; height: 26px; background-repeat: no-repeat; background-position: center; background-size: cover;}
.main_swiper_01 .swiper-button-next:after, .main_swiper_01 .swiper-button-prev:after{content: ''; display: none;}
.main_swiper_01 .swiper-button-prev{background-image: url("../imgs/icon/arrow_prev.svg"); left: 3%;}
.main_swiper_01 .swiper-button-next{background-image: url("../imgs/icon/arrow_next.svg"); right: 3%;}
.main_swiper_01 .autoplay-progress {position: absolute; right: 3%; bottom: 22px; z-index: 2; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; font-weight: 300; color: #fff;}
.main_swiper_01 .autoplay-progress svg {--progress: 0; position: absolute; left: 0; top: 0px; z-index: 2; width: 100%; height: 100%; stroke-width: 2px; stroke: #fff; fill: none; stroke-dashoffset: calc(125.6px * (1 - var(--progress))); stroke-dasharray: 125.6; transform: rotate(-90deg);}

.main_deco{position: absolute; bottom: 0; z-index: 1;}
.main_deco img{width: 100%;}
.deco_fish_up{left: 100px; width: 96px; bottom: 220px;  z-index: 3; animation: move1 1.8s infinite alternate;}
.deco_weed_left{left: 20px; width: 138px;  z-index: 2;}
.deco_fish_down{left: 120px; width: 114px; bottom: 50px;  z-index: 1; animation: move2 1.5s infinite alternate;}
.deco_weed_right{right: 10px; width: 320px;}

@keyframes move1{0% {transform:translate(0, -10px);} 100% {transform:translate(0,10px);}}
@keyframes move2{0% {transform:translate(0, -10px);} 100% {transform:translate(0,10px);}}



/* 메인 sec2 */
.section.sec2{}

.roller_wrap{position: relative; width: 100%; padding-top: 30px;}
.ezkorry-roller{overflow: hidden; white-space: nowrap;}
.ezkorry-roller span{position:relative; color: rgba(80, 184, 198, 0.3); line-height: 1.4; font-size: 85px; font-weight: 800;}


/* 메인 sec5 */
.section.sec5{width: 100%; padding: 200px 0;}

/* 메인 sec5 swiper button */
.main_swiper_02 .swiper-button-next, .main_swiper_02 .swiper-button-prev{width: 24px; height: 46px; background-repeat: no-repeat; background-position: center; background-size: cover; margin-top: 0; transform: translateY(calc(-50% - 25px));}
.main_swiper_02 .swiper-button-next:after, .main_swiper_02 .swiper-button-prev:after{content: ''; display: none;}
.main_swiper_02 .swiper-button-prev{background-image: url("../imgs/icon/arrow_black_prev.svg"); left: 3%;}
.main_swiper_02 .swiper-button-next{background-image: url("../imgs/icon/arrow_black_next.svg"); right: 3%;}
.main_swiper_02 a{display: block;}
.main_swiper_02 img{width: 100%;}
.main_swiper_02 b{display: block; text-align: center; font-size: 23px; line-height: 1.4;}
.main_swiper_02 .swiper-slide{padding-bottom: 25px;}
.main_swiper_02 .swiper-slide.swiper-slide-active b{transform: translateY(25px);}
.main_swiper_02 .swiper-slide{position: relative;}
.main_swiper_02 .swiper-slide img{opacity: 0.3; border-radius: 30px; transform: scale(0.85);}
.main_swiper_02 .swiper-slide.swiper-slide-active img{opacity: 1; transform: scale(1); border-radius: 0;}
.main_swiper_02 .swiper-slide span{display: block;}

.main_swiper_02 .swiper-slide img, .main_swiper_02 b, .staff_bg ul li a img{
	-webkit-transition: all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-moz-transition: all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-o-transition: all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	-ms-transition: all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
	transition: all 0.4s cubic-bezier(0.215, 0.610, 0.355, 1.000);
}


/* 메인 sec6 */
.section.sec6{display: flex;justify-content: center; align-items: center; width: 100%; height: 100vh; background: url("../imgs/main/bannery_bg.jpg") no-repeat center; background-size: cover;}
.main_bannery{width: 100%; max-width: 1824px; color: #fff; text-align: center;}
.main_bannery > p{font-size: 21px; font-weight: 400;}
.main_bannery > h3{font-size: 50px; font-weight: 800; margin-top: 10px; line-height: 1.2;}
.main_bannery ul{display: flex; justify-content: center; margin-top: 80px;}
.main_bannery ul li{width: 134px; margin-left: 80px;}
.main_bannery ul li:first-child{margin-left: 0;}
.main_bannery ul li a{position: relative; display: block;}
.main_bannery ul li div a{border-radius: 30px; box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.16); overflow: hidden;}
.main_bannery ul li div a img{width: 100%; transform: scale(1.01);}
.main_bannery ul li div a:hover img{transform: scale(1.2);}
.main_bannery ul li p{font-size: 19px; margin-top: 20px;}
.main_bannery ul li:hover p{text-shadow: 5px 5px 15px rgba(0, 0, 0, 0.16);}

.main_bannery ul li div a:after{content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0, 27, 88, 0.7); z-index: 1; opacity: 0;}
.main_bannery ul li div a:before{content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-position: center; background-repeat: no-repeat; background-size: 70px; z-index: 2; opacity: 0;}
.main_bannery ul li:nth-child(1) div a:before{background-image: url("../imgs/icon/bannery_01.svg");}
.main_bannery ul li:nth-child(2) div a:before{background-image: url("../imgs/icon/bannery_02.svg");}
.main_bannery ul li:nth-child(3) div a:before{background-image: url("../imgs/icon/bannery_03.svg");}
.main_bannery ul li:nth-child(4) div a:before{background-image: url("../imgs/icon/bannery_04.svg");}
.main_bannery ul li:nth-child(5) div a:before{background-image: url("../imgs/icon/bannery_05.svg");}
.main_bannery ul li:hover div a:after{content: ''; opacity: 1;}
.main_bannery ul li:hover div a:before{content: ''; opacity: 1;}



/* 메인 sec7 */
.section.sec7{}

.main_map_wrap > ul{display: flex; align-items: center;}
.main_map_wrap > ul > li{width: 50%;}
.main_map_wrap > ul > li:nth-child(2){margin-left: 60px;}
.main_map_box{width: 100% !important;}
.main_map_box .wrap_map{min-height: 800px;}
.main_map_box .wrap_controllers{display: none;}
.main_map_wrap > ul li li{margin-top: 50px;}
.main_map_wrap > ul li li:first-child{margin-top: 0;}
.main_map_wrap .p1{font-size: 25px; font-weight: 800; line-height: 1.3;}
.main_map_wrap .p2{font-size: 15px; line-height: 1.6;}
.main_map_wrap .p3{font-size: 21px; font-weight: 700; line-height: 1.4; margin-bottom: 5px;}
.main_map_wrap .p4{font-size: 23px; font-weight: 800; line-height: 1.4;}
.main_map_wrap .p5{font-size: 19px; line-height: 1.4;}
.main_map_wrap img{width: 100%; max-width: 540px;}


.main_pc_only_img{display: inline-block !important;}
.main_mobile_only_img{display: none !important;}


@media (max-width:2000px){	
	/* 메인 sec1 */
	.section.sec1 .sec1_wrap{max-width: 1420px;}
}

@media (max-width:1420px){	
	/* 메인 공통 */
	.main_inner{padding: 0 3%;}
	.section.sec_inner{padding-left: 3%; padding-right: 3%;}
	
	/* 메인 sec1 */
	.main_swiper_01 .text_area .t0{font-size: 47px;}
	.main_swiper_01 .text_area .t3{font-size: 17px; margin-top: 20px;}
	
	
	/* 메인 sec2 */
	.roller_wrap{padding-top: 30px;}
	.ezkorry-roller span{font-size: 39px;}
}

@media (max-width:1023px){	
	/* 메인 */
    .main_wrap{width: 100%; padding-top: 50px;}
	
	
	/* 메인 sec1 */
	.section.sec1{height: 70vh;}
	.main_swiper_01 .text_area .t0{font-size: 40px;}
	.main_swiper_01 .text_area .t3{font-size: 16px;}
	
	
	/* 메인 sec6 */
	.section.sec6{height: auto; padding: 100px 0;}
	.main_bannery{width: 80%; margin: 0 auto;}
	.main_bannery > p{font-size: 17px;}
	.main_bannery > h3{font-size: 30px; margin-top: 10px; line-height: 1.3;}
	.main_bannery ul{flex-wrap: wrap; margin-top: 50px;}
	.main_bannery ul li{width: 24%; margin-left: 14%;}
	.main_bannery ul li:nth-child(3n+1){margin-left: 0;}
	.main_bannery ul li:nth-child(n+4){margin-top: 50px;}
	.main_bannery ul li div a{border-radius: 20px;}
	.main_bannery ul li p{font-size: 17px; margin-top: 10px;}
	.main_bannery ul li div a:before{content: ''; background-size: 50px;}
	
}

@media (max-width:767px){
	.main_pc_only_img{display: none !important;}
	.main_mobile_only_img{display: inline-block !important;}
	
	
	/* 메인 공통 */
	.main_title{margin-bottom: 30px;}
	.main_title h3{font-size: 35px;}
	.main_title p{font-size: 16px; margin-top: 5px;}
	
	/* 메인 sec2 */
	.ezkorry-roller span{font-size: 31px;}
	
	/* 메인 sec1 */
	.section.sec1{height: 70vh;}
	.section.sec1 .sec1_wrap{width: 70%; border-radius: 30px;}
	.main_swiper_01 .text_area .t0{font-size: 30px;}
	.main_swiper_01 .text_area .t3{font-size: 15px;}
	
	.deco_fish_up{left: 5px; width: 58px; bottom: 120px; }
	.deco_weed_left{left: -20px; width: 83px;  z-index: 2;}
	.deco_fish_down{left: 40px; width: 68px; bottom: 30px;}
	.deco_weed_right{right: -30px; width: 180px;}

	
	/* 메인 sec5 */
	.section.sec5{padding: 50px 0 70px;}
	
	/* 메인 sec5 swiper button */
	.main_swiper_02 .swiper-button-next, .main_swiper_02 .swiper-button-prev{display: none;}
	
	.main_swiper_02 b{font-size: 17px;}
	.main_swiper_02 .swiper-slide{padding-bottom: 15px;}
	.main_swiper_02 .swiper-slide.swiper-slide-active b{transform: translateY(15px);}
	.main_swiper_02 .swiper-slide img{border-radius: 20px;}

	
	/* 메인 sec7 */
	.section.sec7{padding-top: 60px; padding-bottom: 100px;}
	.main_map_wrap > ul{flex-wrap: wrap;}
	.main_map_wrap > ul > li{width: 100%;}
	.main_map_wrap > ul > li:nth-child(2){margin-left: 0; margin-top: 40px;}
	.main_map_box {height: 300px !important;}
	.main_map_box .wrap_map{min-height: 300px;}
	.main_map_wrap > ul li li{margin-top: 30px;}
	.main_map_wrap > ul li li:first-child{margin-top: 0;}
	.main_map_wrap .p1{font-size: 21px;}
	.main_map_wrap .p2{font-size: 14px;}
	.main_map_wrap .p3{font-size: 19px;}
	.main_map_wrap .p4{font-size: 20px;}
	.main_map_wrap .p5{font-size: 17px;}
	.main_map_wrap img{width: 100%; max-width: 540px;}
}


@media (max-width:480px){
	/* 메인 공통 */
	.main_title h3{font-size: 29px;}
	.main_title p{font-size: 15px;}
	
	/* 메인 sec1 */
	.section.sec1{height: 70vh;}
	.section.sec1 .sec1_wrap{border-radius: 20px;}
	.main_swiper_01 .text_area .t0{font-size: 25px;}
	.main_swiper_01 .text_area .t3{font-size: 15px; margin-top: 10px;}	
	
	.section.sec1 .sec1_wrap{width: 85%;}
	
	.deco_fish_up{left: -5px; bottom: 30px; }
	.deco_fish_down{left: 60px; bottom: 15px;}
	
	
	/* 메인 sec6 */
	.section.sec6{padding: 80px 0;}
	.main_bannery > p{font-size: 15px;}
	.main_bannery > h3{font-size: 25px;}
	.main_bannery ul{margin-top: 50px;}
	.main_bannery ul li:nth-child(5){display: none;}
	.main_bannery ul li{width: 46%; margin-left: 8%;}
	.main_bannery ul li:nth-child(3n+1){margin-left: 8%;}
	.main_bannery ul li:nth-child(2n+1){margin-left: 0;}
	.main_bannery ul li:nth-child(n+3){margin-top: 40px;}
	.main_bannery ul li div a{border-radius: 10px;}
	.main_bannery ul li p{font-size: 15px;}
	
	
	/* 메인 sec7 */
	.main_map_box {height: 250px !important;}
	.main_map_box .wrap_map{min-height: 250px;}

}



@media (max-width:400px){

	/* 메인 sec1 */
	.section.sec1{height: 70vh;}

}