#hero:before{content: "";display: block; width: 100%;height: 100%;background-color: rgba(0,0,0,.1);position: absolute;left: 0px;top: 0px;z-index:2}
#hero {width: 90%;height: calc(100vh - 170px);background-color: rgba(22, 30, 56, 0.8);overflow: hidden;position: relative;margin-left: 5%;margin-top: 170px;border-radius:46px 0 0 0}
#hero .carousel, #hero .carousel-inner, #hero .carousel-item, #hero .carousel-item::before {position: absolute;top: 0;right: 0;left: 0;bottom: 0;}
#hero .carousel-inner .carousel-item {transition-property: opacity;background-position: center top;}

#hero .carousel-inner > div:nth-child(1){background-image: url('/images/bg_main05.jpg');animation: bgShow1 2s forwards; animation-timing-function: ease-out;}
#hero .carousel-inner > div:nth-child(1){background-position:0% 0% !important}
#hero .carousel-inner > div:nth-child(2){background-image: url('/images/bg_main07.jpg');animation: bgShow2 2s forwards; animation-timing-function: ease-out;}
#hero .carousel-inner > div:nth-child(2){background-position:50% 50% !important}

.mySwiper4{width: 100%;height: 150px;background-color: #eee;}
	.mySwiper4 img{width: 100%;height: 150px;}
	#m_res_button{width: 100%;height: 50px;display: flex;}
	#m_res_button > a{display: inline-block;width: 50%;height: 50px;text-align: center;color: #fff;font-size: 17px;line-height: 50px;font-weight: bold;}
	#m_res_button > a:first-child{background-color: #254667;}
	#m_res_button > a:last-child{background-color: #F19914;}

.main_txt{position: absolute;left: 50%;transform:translateX(-50%);bottom: 150px;text-align: center;z-index:5;color: #fff;text-shadow:2px 2px 1px rgba(0,0,0,.5);font-size: 30px;}
.main_txt > div:nth-child(1){animation-name: fadeUpAni1; animation-duration: 5s; animation-fill-mode: forwards;animation-iteration-count: infinite;}
.main_txt > div:nth-child(2){animation-name: fadeUpAni2; animation-duration: 5s; animation-fill-mode: forwards;opacity: 0;animation-iteration-count: infinite;}

.main_title{text-align: center;margin-bottom: 50px;}
.main_title > strong{display: block;font-size: 58px;font-family: 'Cardo';line-height: 58px;}
.main_title > span{display: block;font-size: 18px;}

#event_area{margin-top: 150px;margin-bottom: 150px;}
#event_area .container{max-width: 1450px;}
/*
#event_area .swiper-slide > a{text-align: center;font-size: 22px;position: relative;display: block;height: 332px;background:#fff url('') center center no-repeat;border-bottom: 1px solid #ddd;}
#event_area .swiper-slide:nth-child(1) > a{background-image: url('/images/banner_01.jpg');}
#event_area .swiper-slide:nth-child(2) > a{background-image: url('/images/banner_02.jpg');}
#event_area .swiper-slide:nth-child(3) > a{background-image: url('/images/banner_03.jpg');}
#event_area .swiper-slide:nth-child(4) > a{background-image: url('/images/banner_04.jpg');}
#event_area .swiper-slide:nth-child(5) > a{background-image: url('/images/banner_05.jpg');}
#event_area .swiper-slide:nth-child(6) > a{background-image: url('/images/banner_01.jpg');}
#event_area .swiper-slide:nth-child(7) > a{background-image: url('/images/banner_02.jpg');}
#event_area .swiper-slide:nth-child(8) > a{background-image: url('/images/banner_03.jpg');}
#event_area .swiper-slide:nth-child(9) > a{background-image: url('/images/banner_04.jpg');}
#event_area .swiper-slide:nth-child(10) > a{background-image: url('/images/banner_05.jpg');}

#event_area .swiper-slide > a:hover{color: #0D88FF;text-decoration: underline;}
#event_area .swiper-slide > a > span{position: absolute;top: 50%;transform: translateY(-50%);left: 15%;width: 70%;text-align: center;}
*/
.mySwiper1{padding-bottom: 40px;}
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{margin-bottom: -10px;}
.mySwiper1 .swiper-pagination-bullet {width: 20px;height: 20px;text-align: center;line-height: 20px;font-size: 12px;color: #000;opacity: 1;background: rgba(0, 0, 0, 0.2); }
.mySwiper1 .swiper-pagination-bullet-active {color: #fff; background: #007aff;}

/* 240430 add */
#event_area .swiper-slide > a{width: 332px;height: 332px;display: block;background-color: #eee;border: 1px solid #ddd;}
#event_area .swiper-slide > a > img{width: 100%;height: 100%;}


#course_area{width: 100%;height: 1080px;background: #E5F7F8 url('/images/bg_ci.svg') right bottom no-repeat;}
#course_area .container{max-width: 1700px;padding-top: 100px;}
#course_area .row{margin: 0;}
#course_area .row > div{margin: 0;padding: 0;}	
	


.main_icon_menu{width: 100%;height: auto;background-color: #254667;border-radius:0 0 0 50px;padding: 60px 80px 0;}
.main_icon_menu > ul{display:flex;flex-wrap:wrap;}
.main_icon_menu > ul > li{width: 25%;text-align: center;margin-bottom: 60px;}	
.main_icon_menu > ul > li > a{display: block;height: 93px;color: #fff;}	
.main_icon_menu > ul > li > a > span{display: block;padding-top: 10px;}	

#course_area .mySwiper3{padding-top: 300px;padding-left: 100px;}
#course_area .course_info{background-color: #E5F7F8;}	
#course_area .course_info > strong{font-size: 50px;font-family: 'Cardo';color: #254667;display: block;margin-bottom: 50px;}	
#course_area .course_info > button{background-color: #254667;color: #fff;padding: 10px 30px;border-radius:7px 0;}



#main_map{position: relative;}
#main_map .mapinfo{position: absolute;left: 150px;top: 50px;width:520px ;height: 240px;background-color: #fff;z-index:3;box-shadow:0 8px 11px 0 rgba(0, 0, 0, 0.16);padding:40px 50px;color: #666;}
#main_map .mapinfo > div:nth-child(1){font-size: 24px;color: #000;margin-bottom: 10px;}
#main_map .mapinfo > div:nth-child(2){margin-bottom: 10px;}
#main_map .mapinfo > div:nth-child(3) > strong{color: #0082ff;display: inline-block;padding-right: 10px;}
#main_map .mapinfo > div:nth-child(3) > span{display: inline-block;padding-right: 20px;}
#main_map .mapinfo > div:nth-child(5){text-align: right;margin-top: 20px;}





@media(max-width:768px){
	#hero{width: 100%;height: 410px;margin-left: 0;border-radius:0;margin-top: 0;}
	.main_txt{display: none;}
	.main_title{padding: 0 6px;margin-bottom: 20px;}
	.main_title > strong{font-size: 2rem;line-height: 2rem;}
	.main_title > span{font-size: 1rem;}

	#event_area{margin-top: 50px;margin-bottom: 50px;}
	#event_area .swiper-slide{display: flex;justify-content:center;   }
	
	.mySwiper2 img{width: 100%;}
	.main_icon_menu{display: none;}
	#course_area{height: 650px !important;}
	#course_area .mySwiper3{padding-top: 20px;padding-left: 0px;}
	#course_area .course_info > strong{font-size: 2rem;margin-bottom: 10px;}
	#course_area .course_info > button{font-size: 0.8rem;padding: 6px 10px;}
	#course_area .course_info{text-align: right;padding-right: 14px;}

	.kakaomap{height: 350px;}
	#main_map .mapinfo{left: 10px;top: 10px;width: 300px;height: 170px;padding: 10px;font-size: .8rem;}
	#hero .carousel-inner > div:nth-child(1){background-position:50% 0% !important}
	#section02 h3{padding-top: 30px;}
	
	#main_map .mapinfo > div:nth-child(1){font-size: 1.2rem;}
	
	
	
}

@keyframes bgShow1 {
		from{
			background-size: 100% 100%; 
		}
		to{
			background-size: 104% 104%;
		}
	}
	@keyframes bgShow2 {
		from{
			background-size: 104% 104%; 
		}
		to{
			background-size: 100% 100%;
		}
	}
	@keyframes bgShow3 {
		from{
			background-size: 100% 100%; 
		}
		to{
			background-size: 107% 107%;
		}
	}



	@keyframes fadeUpAni1{
		0% {
		opacity: 0;
		transform:translate3d(0,10px,0);
		}
		15% {
		opacity:1;
		transform:translate3d(0,0px,0);
		}
		100% {
		opacity:1;
		transform:translate3d(0,0px,0);
		}
	}	
	@keyframes fadeUpAni2{
		0% {
		opacity: 0;
		transform:translate3d(0,10px,0);
		}
		15% {
		opacity: 0;
		transform:translate3d(0,10px,0);
		}
		30% {
		opacity:1;
		transform:translate3d(0,0px,0);
		}
		100% {
		opacity:1;
		transform:translate3d(0,0px,0);
		}
	}	

	@keyframes fadeUpAni3{
		0% {
		opacity: 1;
		transform:translate3d(0,0px,0);
		}
		100% {
		opacity:1;
		transform:translate3d(0,-10px,0);
		}
	}


	@media (max-width:768px){
		
		
		

		@keyframes bgShow1 {
			from{
				background-size: auto 100%; 
			}
			to{
				background-size: auto 104%;
			}
		}
		@keyframes bgShow2 {
			from{
				background-size: auto 108%; 
			}
			to{
				background-size: auto 100%;
			}
		}
		@keyframes bgShow3 {
			from{
				background-size: auto 100%; 
			}
			to{
				background-size: auto 107%;
			}
		}
	}