/*메인 visual*/
#main_visual {
	position:relative;
}
#main_visual .mySwiper {
	overflow: hidden;
}

#main_visual .swiper-slide{  height:100vh; max-height:97rem; min-height:50rem; overflow:hidden; }
#main_visual .swiper-slide:after,
#main_visual .swiper-slide:before{ content:""; z-index:11; position:absolute; bottom:0; left:0; height:3px; }
#main_visual .swiper-slide:before{ width:100%;  background:rgba(0,0,0,.05); }
#main_visual .swiper-slide:after{ width:0%; background:#1e39b4;  }
#main_visual .swiper-slide .img_area{ position:absolute; top:50%; left:50%; width:100%; height:100%; background-position:center; background-size:cover;
	-webkit-transform:translate(-50%,-50%) scale(1.2);  -moz-transform:translate(-50%,-50%) scale(1.2); transform:translate(-50%,-50%) scale(1.2); 
	-webkit-transition:all 6s; -moz-transition:all 6s; transition:all 6s;
}
#main_visual .swiper-slide .img_area01{ background-image:url('../_img/main/main_visual01.jpg');}
#main_visual .swiper-slide .img_area02{ background-image:url('../_img/main/main_visual02.jpg');}
#main_visual .swiper-slide .img_area03{ background-image:url('../_img/main/main_visual03.jpg');}
#main_visual .swiper-slide .tit_area{ position:absolute; top:45%; left:50%; width:100%; max-width: 1500px; padding: 0 2rem;
	-webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); transform:translate(-50%,-50%);
}
#main_visual .swiper-slide .tit_area small{ opacity:0; display:block; margin-bottom:2rem; font-size:1.6rem; font-weight:500;
	-webkit-transform:translateX(-15rem); -moz-transform:translateX(-15rem); transform:translateX(-15rem);
}
#main_visual .swiper-slide .tit_area small span:after{ content:""; display:inline-block; vertical-align:middle; width:12rem; height:1px; margin:0 2.5rem; background:#000;}
#main_visual .swiper-slide .tit_area h2{ opacity:0; font-size:5.8rem; font-weight:700; line-height:1.2;  
	-webkit-transform:translateX(-15rem); -moz-transform:translateX(-15rem); transform:translateX(-15rem);
}
#main_visual .swiper-slide .tit_area h2 b{ font-weight:700;}
#main_visual .swiper-slide .tit_area p{ opacity:0; margin-top:3rem;  font-size:2rem; font-weight:300; 
	-webkit-transform:translateX(-15rem); -moz-transform:translateX(-15rem); transform:translateX(-15rem);
}
#main_visual .swiper-slide .tit_area p b{ font-weight:700;}

#main_visual .swiper-slide-active:after{ animation:visualBar 5s linear forwards;}
#main_visual .swiper-slide-active .img_area{ -webkit-transform:translate(-50%,-50%) scale(1);  -moz-transform:translate(-50%,-50%) scale(1);   transform:translate(-50%,-50%) scale(1);  }
#main_visual .swiper-slide-active .tit_area small,
#main_visual .swiper-slide-active .tit_area h2,
#main_visual .swiper-slide-active .tit_area p{ opacity:1; -webkit-transform:translateX(0rem); -moz-transform:translateX(0rem); transform:translateX(0rem);
	-webkit-transition:all 2s; -moz-transition:all 2s; transition:all 2s;
}
#main_visual .swiper-slide-active .tit_area h2{ -webkit-transition-delay:.2s; -moz-transition-delay:.2s; transition-delay:.2s; }
#main_visual .swiper-slide-active .tit_area p{ -webkit-transition-delay:.4s; -moz-transition-delay:.4s; transition-delay:.4s; }


@media all and (max-width:1750px) {
	.main_visual_type3 .controller{padding:0 15px;}
}
@media all and (max-width:1199.98px) {
	#main_visual .swiper-slide{ max-height:87rem; }
	#main_visual .swiper-slide .tit_area{ text-align:center; }
	#main_visual .swiper-slide .tit_area small span:after{ width:8rem;}
	#main_visual .swiper-slide .tit_area h2{ font-size:6rem; }
	#main_visual .swiper-slide .tit_area p{ font-size:2rem;}
}

@media all and (max-width:991.98px) {
	#main_visual .swiper-slide{ max-height:77rem; }
	#main_visual .swiper-slide .tit_area small span:after{ width:5rem;}
	#main_visual .swiper-slide .tit_area h2{ font-size:5rem; }
	#main_visual .swiper-slide .tit_area p{ font-size:1.8rem;}
}

@media all and (max-width:575.98px) {
	#main_visual .swiper-slide{ max-height:67rem; }
	#main_visual .swiper-slide .tit_area small span:after{ margin:0 1.5rem;}
	#main_visual .swiper-slide .tit_area h2{ font-size:4rem; }
}


.main_visual#main_visual_mo{
	display:none;
}
.main_visual .swiper-slide{
	height:970px;
	position:relative;
}


.main_visual .swiper-slide .tit_area h3{
	font-family: 'Play';
	font-size:7rem;
	font-weight:bold;
}
.main_visual .swiper-slide  .tit_area h2 strong:nth-of-type(1){
	color: #fff;
}
.main_visual .swiper-slide  .tit_area h2 strong:nth-of-type(2),
.main_visual .swiper-slide .tit_area h2 strong:nth-of-type(3){
	color: rgba(0, 0, 0, 0) !important;
	-webkit-text-stroke:.5px #fff;
}
@media(max-width:991.98px){
	.main_visual{
	 height:auto;
 }
 .main_visual#main_visual_pc{
	 display:none;
 }

 .main_visual#main_visual_mo{
	 display:block;
	 padding-top: 67px;
 }

 .main_visual .swiper-slide {
	 
	 max-height:280px;
		 position: relative;
 }
}

/* 메인 visual button */
.main_visual_type3 .controller{
	position:absolute;
	width: 100%;
	left:0;
	bottom:4rem;
	z-index:10;
	color:#fff;
}
.main_visual_type3 .controller .inner{
	margin: 0 auto;
	width: 100%;
	max-width: 1600px;
	display:flex;
	align-items: center;
}
.main_visual_type3 .controller .mv_prev,
.main_visual_type3 .controller .mv_next{
	font-size:2.6rem;
}
.main_visual_type3 .controller .mv_status{
	font-size:2rem;
	margin-left:1rem;
}
.main_visual_type3 .controller .mv_status button{
	outline: none;
	background: none;
	border: none;
  color:#fff;
}
.main_visual_type3 .controller .mv_pagination{
	display:flex;
	align-items: center;
}

/* button style */
.main_visual_type3 .swiper-pagination-bullet {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: auto;
	height: auto;
	margin: 0 10px;
	background-color: transparent;
	border-radius: 50%;
	cursor: pointer;
	transition: 0.3s;
	outline: none;
	opacity:1;
}
.main_visual_type3 .swiper-pagination-bullet-active::before{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	border:3px solid rgba(255,255,255,.3);
	border-radius:100%;
}
.main_visual_type3 .swiper-pagination-bullet span{
	position:absolute;
	border-radius:100%;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    font-family: "Pretendard";
    color:#fff;
    opacity:.3;
    font-size:12px;
    margin-top:1px;
}
.main_visual_type3 .swiper-pagination-bullet span::before{
    content:"0";
}
.main_visual_type3 .swiper-pagination-bullet-active span{
    opacity:1;
}

/* button circle */
.main_visual_type3 .progress_circle {
	transform: rotate(-90deg);
	opacity:1;
}
.main_visual_type3 .circle-origin {
	fill: transparent;
	stroke: rgb(255, 255, 255);
	stroke-width: 2;
	stroke-linecap: round;
	stroke-dasharray: 150px;
	stroke-dashoffset: 150px;
}

@media(max-width:991.98px){
    .main_visual_type3 .controller{
        padding-left:0;
        transform:scale(.8);
    }
    .main_visual_type3 .swiper-pagination-bullet span{
        font-size:14px;
    }
    .main_visual_type3 .controller .mv_status{
        font-size:3rem;
        margin-left:2rem;
        margin-top:4px;
    }
}






/* sec 공통 */
#main_container > section{
	padding:10rem 0;
}
#main_container > section .container{
	max-width: 1400px;
	margin: 0 auto;
	text-align: center;
}
#main_container > section .container h4{
	margin-bottom: 2rem;
	font-family: 'Play';
	font-size: 5.8rem;
	font-weight: bold;
}
#main_container > section .container > p{
	font-family: 'Poppins';
	font-size: 2rem;
}
#main_container > section .container ul{
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	padding: 0;
}
#main_container > section .container li::marker{
	content: "";
	display: none !important;
}
@media (max-width:991.98px) {
	#main_container > section .container h4{
		font-size: 4.5rem;
	}
}

/*sec01*/
#main_container > .sec01 .container > p{
	margin-bottom: 10rem;
}
#main_container > .sec01 .container li{
	width: 25%;
	padding: 0 2rem;
}
#main_container > .sec01 .container li img{
	margin-bottom: 3rem;
}
#main_container > .sec01 .container li p{
	font-family: 'Play';
	font-weight: bold;
}
#main_container > .sec01 .container li span{
	font-size: 2.4rem;
}
#main_container > .sec01 .container li strong{
	margin-left: .5rem;
	font-size: 5rem;
}
#main_container > .sec01 .container li small{
	font-family: 'Poppins';
	font-size: 1.6rem;
}
@media (max-width:991.98px) {
	#main_container > .sec01 .container ul{
		flex-wrap: wrap;
		justify-content: center;
	}
	#main_container > .sec01 .container li{
		margin: 0 3rem;
		width: 35%;
	}
	#main_container > .sec01 .container li img{
		margin-bottom: 1rem;
	}
}
@media (max-width:575.98px) {
	#main_container > .sec01 .container li{
		width: 100%;
	}
	#main_container > .sec01 .container li img{
		margin-bottom: 0rem;
	}
}



/*sec02*/
#main_container > .sec02{
	z-index:1; 
	position:relative; 
}
#main_container > .sec02::before,
#main_container > .sec02::after{
	content:"";
	position:absolute;
	left:50%; right:50%;
	margin-left:-50vw; margin-right:-50vw;
	height:100%; 
}
#main_container > .sec02::before{
	z-index:-1;
	bottom: 0;
	background: url(../_img/main/content_bg.png) no-repeat center bottom / 100% auto;
}
#main_container > .sec02::after{
	z-index:-2;
	top:0;
	background:#f1f5f7;
}
#main_container > .sec02 .container > p{
	margin-bottom: 8rem;
}
#main_container > .sec02 .container li{
	position: relative;
	width: 31%;
	text-align: left;
	overflow: hidden;
}
#main_container > .sec02 .container li img{
	width: 100%;
}
#main_container > .sec02 .container li .text_box{
	position: absolute;
	bottom: 0;
	display: flex;
	justify-content: space-between;
	max-width: 75%;
	width: 33rem;
	padding: 3rem;
	background: #fff;
	transition: all 0.2s;
}
#main_container > .sec02 .container li .text_box button{
	width: 3rem;
	height: 3rem;
	outline: none;
	font-size: 1.5rem;
	color: #aaaaaa;
	background: #eeeeee;
	border: 1px solid #eeeeee;
	border-radius: 50%;
	transition: all 0.4s;
}
#main_container > .sec02 .container li .text_box .text{
	
}
#main_container > .sec02 .container li .text_box .text strong{
	font-family: 'Play';
	font-size: 2.2rem;
	font-weight: bold;
	color: #000;
}
#main_container > .sec02 .container li .text_box .text .active_text{
	overflow: hidden;
	height: 0;
	margin-top: 0;
	font-family: 'Poppins';
	font-size: 1.4rem;
	color: #fff;
	transition: all 0.4s;
}
@media (max-width:991.98px) {
	#main_container > .sec02::before{
		display: none;
	}
	#main_container > .sec02 .container ul{
		flex-wrap: wrap;
		justify-content: center;
	}
	#main_container > .sec02 .container li{
		width: 80%;
	}
	#main_container > .sec02 .container li .text_box{
		width: 40rem;
	}
}
@media (max-width:767.98px){
	#main_container > .sec02 .container li{
		width: 100%;
	}
	#main_container > .sec02 .container li .text_box .text strong{
		font-size: 2.5rem;
	}
}
/*sec02 hover*/
#main_container > .sec02 .container li:hover .text_box{
	color: #fff;
	background: #0066a1;
}
#main_container > .sec02 .container li:hover .text_box .text strong{
	color: #fff;
}
#main_container > .sec02 .container li:hover .text_box .text .active_text{
	overflow: auto;
	height: auto;
	margin-top: 2rem;
}
#main_container > .sec02 .container li:hover .text_box button{
	color: #fff;
	background: none;
	border: 1px solid #fff;
}




/*sec03*/
#main_container > .sec03 .container{
	max-width: 1600px;
}
#main_container > .sec03 .container .inner{
	max-width: 1400px;
	margin: 0 auto;
	margin-bottom: 6rem;
}
#main_container > section .container .inner > p{
	font-family: 'Poppins';
	font-size: 2rem;
	margin-bottom: 5rem;
}
#main_container > .sec03 .container .inner img{
	width: 100%;
}
#main_container > .sec03 .container .img_box{
	display: flex;
}
#main_container > .sec03 .container .img_box li{
	position: relative;
	width: 50%;
}
#main_container > .sec03 .container .img_box li img{
	width: 100%;
}
#main_container > .sec03 .container .img_box li div{
	position: absolute;
	top: 50%; left: 5rem;
	transform: translateY(-50%);
	color: #fff;
	text-align: left;
}
#main_container > .sec03 .container .img_box li div p:first-child strong{
	font-family: 'Play';
	font-size: 4rem;
	font-weight: bold;
}
#main_container > .sec03 .container .img_box li div p:last-child{
	margin-top: 1rem;
	font-family: 'Poppins';
	font-size: 1.8rem;
	font-weight: 200;
}
@media (min-width:992px) {
	#main_container > .sec03 .container .img_box li{
		max-height: 200px;
	}
}
@media (max-width:991.98px) {
	#main_container > .sec03 .container .img_box{
		flex-wrap: wrap;
	}
	#main_container > .sec03 .container .img_box li{
		width: 100%;
	}
}

/*sec04*/
.sec04{position:relative; z-index:1; margin-top: 3rem; padding-bottom: 14rem !important;}
.sec04::after{
	content:"";
	z-index:-1;
	position:absolute;
	top:0; left:50%; right:50%;
	margin-left:-50vw; margin-right:-50vw;
	height:100%;
	background:#f5f5f5;
}
.sec04 .container .img_box{
	display: flex;
	flex-wrap: wrap;
}
.sec04 .container .img_box li{
	width: 25%;
	padding: 2rem;
}
.sec04 .container .img_box li img{
	width: 100%;
}
@media (max-width:991.98px) {
	.sec04 .container .img_box li{
		width: 50%;
	}
}
@media (max-width:767.98px) {
	.sec04 .container .img_box li{
		width: 100%;
	}
}





