@charset "utf-8";


/* 레이아웃 */
#gaonwrap { min-width:1600px; width:100%; }

#top { position:absolute; left:0; top:0; min-width:1600px; width:100%; border-bottom:1px solid rgba(255,255,255,0.05); background:none; z-index:2; transition:0.3s; }
	#toparea { position:relative; width:100%; height:111px; margin:0 auto; overflow:visible; } 

.scTop	{ background:#fff !important; border-bottom:1px solid #ddd !important; transition:0.3s; }
#top.scTop2 { position:fixed; background:rgba(255,255,255,0.9); border-bottom:1px solid #ddd; }
	#top.scTop2 #toparea{ height:71px; }


#container { position:relative; min-width:100%; width:100%; height:auto; z-index:1; }	
	#cont1 { position:relative; width:100%; height:100vh; background:#0b1442; overflow:hidden; }	
	#cont2 { position:relative; width:100%; padding:100px 0 150px 0; background:#0b1442; overflow:hidden; }	
	#cont3 { position:relative; width:100%; padding:0 0 100px 0; background:linear-gradient(180deg, #0b1442, #060d2f); }
		.containerarea { position:relative; width:1600px; margin:0 auto; }
	

#bottom { position:relative; width:100%; padding:0 50px 50px 50px; background:#fff; color:#ccc; z-index:3; }
	#bottomarea { position:relative; width:100%; padding:10px 50px; border-radius:30px; background:#1d2443; margin:0 auto; }

#bottom.mBottom { background:#060d2f; }
	#bottom.mBottom #bottomarea { background:#203180; }


@media (min-width:1401px) and (max-width:1600px){
	#gaonwrap { min-width:100%; width:100%; }

	#top { position:absolute; left:0; top:0; min-width:100%; width:100%; border-bottom:1px solid rgba(255,255,255,0.05); background:none; z-index:2; transition:0.3s; }
		#toparea { position:relative; width:100%; height:111px; margin:0 auto; overflow:visible; } 
	
	.scTop	{ background:#fff !important; border-bottom:1px solid #ddd !important; transition:0.3s; }
	#top.scTop2 { position:fixed; background:rgba(255,255,255,0.8); border-bottom:1px solid #ddd;  }
		#top.scTop2 #toparea{ height:71px; }
	
		
	#container { position:relative; min-width:100%; width:100%; height:auto; z-index:1; }		
		#cont1 { position:relative; width:100%; height:100vh; overflow:hidden; }	
		#cont2 { position:relative; width:100%; padding:100px 0 150px 0; background:#0b1442; overflow:hidden; }	
		#cont3 { position:relative; width:100%; padding:0 0 100px 0; background:linear-gradient(180deg, #0b1442, #060d2f); }
			.containerarea { position:relative; width:100%; margin:0 auto; }
		
			
	#bottom { position:relative; width:100%; padding:0 30px 30px 30px; background:#fff; color:#ccc; z-index:3; }
		#bottomarea { position:relative; width:100%; padding:10px 50px; border-radius:30px; background:#1d2443; margin:0 auto; }

	#bottom.mBottom { background:#060d2f; }
		#bottom.mBottom #bottomarea { background:#203180; }
}


@media (min-width:1281px) and (max-width:1400px){
	#gaonwrap { min-width:100%; width:100%; }

	#top { position:absolute; left:0; top:0; min-width:100%; width:100%; border-bottom:1px solid rgba(255,255,255,0.05); background:none; z-index:2; transition:0.3s; }
		#toparea { position:relative; width:100%; height:111px; margin:0 auto; overflow:visible; } 
	
	.scTop	{ background:#fff !important; border-bottom:1px solid #ddd !important; transition:0.3s; }
	#top.scTop2 { position:fixed; background:rgba(255,255,255,0.8); border-bottom:1px solid #ddd; }
		#top.scTop2 #toparea{ height:71px; }
	
		
	#container { position:relative; min-width:100%; width:100%; height:auto; z-index:1; }		
		#cont1 { position:relative; width:100%; height:100vh; overflow:hidden; }	
		#cont2 { position:relative; width:100%; padding:100px 0 150px 0; background:#0b1442; overflow:hidden; }	
		#cont3 { position:relative; width:100%; padding:0 0 100px 0; background:linear-gradient(180deg, #0b1442, #060d2f); }
			.containerarea { position:relative; width:100%; margin:0 auto; }
		
			
	#bottom { position:relative; width:100%; padding:0 30px 30px 30px; background:#fff; color:#ccc; z-index:3; }
		#bottomarea { position:relative; width:100%; padding:10px 50px; border-radius:30px; background:#1d2443; margin:0 auto; }

	#bottom.mBottom { background:#060d2f; }
		#bottom.mBottom #bottomarea { background:#203180; }
}


@media (min-width:1025px) and (max-width:1280px){
	html, body, #gaonwrap { min-width:100%; width:100%; }		
	
	#gaonwrap { min-width:100%; width:100%; }

	#top { position:absolute; left:0; top:0; min-width:100%; width:100%; border-bottom:1px solid rgba(255,255,255,0.05); background:none; z-index:2; transition:0.3s; }
		#toparea { position:relative; width:100%; height:111px; margin:0 auto; overflow:visible; } 
	.scTop	{ background:#fff !important; border-bottom:1px solid #ddd !important; transition:0.3s; }
	#top.scTop2 { position:fixed; background:rgba(255,255,255,0.8); border-bottom:1px solid #ddd; }
		#top.scTop2 #toparea{ height:71px; }
	
	
		
	#container { position:relative; min-width:100%; width:100%; height:auto; z-index:1; }		
		#cont1 { position:relative; width:100%; height:100vh; overflow:hidden; }	
		#cont2 { position:relative; width:100%; padding:100px 0 150px 0; background:#0b1442; overflow:hidden; }	
		#cont3 { position:relative; width:100%; padding:0 0 100px 0; background:linear-gradient(180deg, #0b1442, #060d2f); }
			.containerarea { position:relative; width:100%; margin:0 auto; }
		
			
	#bottom { position:relative; width:100%; padding:0 30px 30px 30px; background:#fff; color:#ccc; z-index:3; }
		#bottomarea { position:relative; width:100%; padding:10px 50px; border-radius:30px; background:#1d2443; margin:0 auto; }

	#bottom.mBottom { background:#060d2f; }
		#bottom.mBottom #bottomarea { background:#203180; }
}


@media (min-width:769px) and (max-width:1024px){
	html, body, #gaonwrap { min-width:100%; width:100%; }
		
	#top { position:relative; min-width:100%; width:100%; border-bottom:1px solid #ddd; z-index:2; transition:none;}
		#toparea { position:relative; width:100%; height:90px; margin:0 auto; overflow:visible; } 
	.scTop	{ background:#fff !important; border-bottom:1px solid #ddd !important; transition:none; }
	#top.scTop2 { position:fixed; background:#fff; border-bottom:1px solid #ddd; }
		#top.scTop2 #toparea { height:90px; }
		
	
	#container { position:relative; min-width:100%; width:100%; height:auto; z-index:1; }		
		#cont1 { position:relative; width:100%; height:600px; overflow:hidden; }	
		#cont2 { position:relative; width:100%; padding:100px 0 150px 0; background:#0b1442; overflow:hidden; }	
		#cont3 { position:relative; width:100%; padding:0 0 100px 0; background:linear-gradient(180deg, #0b1442, #060d2f); }
			.containerarea { position:relative; width:100%; margin:0 auto; }
		
			
	#bottom { position:relative; width:100%; padding:0 30px 30px 30px; background:#fff; color:#ccc; z-index:3; }
		#bottomarea { position:relative; width:100%; padding:10px 50px; border-radius:30px; background:#1d2443; margin:0 auto; }

	#bottom.mBottom { background:#060d2f; }
		#bottom.mBottom #bottomarea { background:#203180; }
}


@media (max-width:768px){
	html, body, #gaonwrap { min-width:100%; width:100%; }
		
	#top { position:relative; min-width:100%; width:100%; border-bottom:1px solid #ddd; z-index:2; transition:none; }
		#toparea { position:relative; width:100%; height:70px; margin:0 auto; overflow:visible; }
	.scTop	{ background:#fff !important; border-bottom:1px solid #ddd !important; transition:none; }
	#top.scTop2 { position:fixed; background:#fff; border-bottom:1px solid #ddd; }
		#top.scTop2 #toparea { height:70px; }
		
	#container { position:relative; min-width:100%; width:100%; height:auto; z-index:1; }		
		#cont1 { position:relative; width:100%; height:400px; overflow:hidden; }	
		#cont2 { position:relative; width:100%; padding:100px 0 150px 0; background:#0b1442; overflow:hidden; }	
		#cont3 { position:relative; width:100%; padding:0 0 100px 0; background:linear-gradient(180deg, #0b1442, #060d2f); }
			.containerarea { position:relative; width:100%; margin:0 auto; }
		
			
	#bottom { position:relative; width:100%; padding:0 15px 15px 15px; background:#fff; color:#ccc; font-size:90%; z-index:3; }
		#bottomarea { position:relative; width:100%; padding:10px 15px; border-radius:30px; background:#1d2443; margin:0 auto; }

	#bottom.mBottom { background:#060d2f; }
		#bottom.mBottom #bottomarea { background:#203180; }
}



/* 고객지원*/
.quictkMenu { position:fixed; right:0; bottom:100px; z-index:100; }
.quictkMenu a:link,
.quictkMenu a:visited { width:100px; height:100px; padding-top:15px; border-radius:10px 0 0 10px; background:#5a78de; color:#fff; font:90% SCDream6; text-align:center; transition:0.3s; box-shadow:0 5px 8px rgba(0,0,0,0.3); display:block; }
.quictkMenu a:active, 
.quictkMenu a:focus,
.quictkMenu a:hover {  background:#f15a28;  }

.quictkMenu a svg { font-size:250%; display:block; margin:5px auto 0; }


@media (max-width:500px){
	.quictkMenu { bottom:90px; }
}

/* 타이틀 */
#top h1.title { position:absolute; left:50px; top:25px; }
#top h1.title a { width:225px; height:60px; background:url(/images/inc/titleW.png) no-repeat; transition:0.2s; display:block; }
#top h1.title a img { width:100%; height:100%; }


.scTop h1.title a { background:url(/images/inc/titleB.png) no-repeat !important; }



#top.scTop2 h1.title { top:15px; }
#top.scTop2 h1.title a { width:150px; height:40px; background:url(/images/inc/titleB.png) no-repeat !important;  background-size:150px 40px !important;  }


@media (min-width:1401px) and (max-width:1600px){
	#top h1.title { left:30px; }
}

@media (min-width:1281px) and (max-width:1400px){
	#top h1.title { left:30px; }
}


@media (min-width:1025px) and (max-width:1280px){
	#top h1.title { left:30px; }
}


@media (min-width:769px) and (max-width:1024px){
	#top h1.title { left:calc(50% - 112px); top:15px; text-align:center; margin:0; }
	#top h1.title a { background:url(/images/inc/titleB.png) no-repeat; }
	
	.sidenav h1 img { height:40px; } 

	#top.scTop2 h1.title a { width:225px; height:60px; background:url(/images/inc/titleB.png) no-repeat !important;  background-size:225px 60px !important;  }
}

@media (max-width:768px){
	#top h1.title { left:calc(50% - 75px); top:15px; text-align:center; margin:0; }
	#top h1.title a { width:150px; height:40px; background:url(/images/inc/titleB.png) no-repeat; background-size:150px 40px; }
	#top h1.title img {  height:40px; }

	.scTop h1.title a { background-size:150px 40px !important;  }
	
	.sidenav h1 img { height:40px; } 

}



/* 메인 메뉴 */
#menu { position:absolute; right:50px; top:45px; }
#topMenu { position:relative; overflow:visible !important; }

#topMenu > li { position:relative; float:left; text-align:center; display:inline-block; }

#topMenu > li > a:link,
#topMenu > li > a:visited { height:70px; vertical-align:top; padding:0 110px; color:#fff; font-size:140%; font-family:SCDream8; letter-spacing:-1px; display:block; }
#topMenu > li > a:active,
#topMenu > li > a:focus,
#topMenu > li > a:hover,
#topMenu > li > a.select { color:#ff5244;  }

#top.scTop2 #menu { top:20px; }
#top.scTop2 #topMenu > li > a:link,
#top.scTop2 #topMenu > li > a:visited { color:#333; }


@media (min-width:1281px) and (max-width:1600px){
	#menu { right:0px; }
	#topMenu > li > a:link,
	#topMenu > li > a:visited { padding:0 90px; font-size:130%; }
}

@media (min-width:1025px) and (max-width:1280px){
	#menu { right:0px; }
	#topMenu > li > a:link,
	#topMenu > li > a:visited { padding:0 60px; font-size:130%; }
}


@media (max-width:1024px){
	#menu { display:none; }
}
	

.scTop #topMenu > li > a:link,
.scTop #topMenu > li > a:visited { color:#333; }
.scTop #topMenu > li > a:active,
.scTop #topMenu > li > a:focus,
.scTop #topMenu > li > a:hover,
.scTop #topMenu > li > a.select { color:#ff5244;  }





/* 서브메뉴 표시 */
#topMenu > li:hover > ul { background:#fafafa; }
#topMenu > li > ul { position:absolute; left:0; top:66px; width:100%; height:225px; padding:10px 0 0 0px; border-top:1px solid #ddd;  border-left:1px solid #ddd; background:#fff; display:none; clear:both; z-index:1003; transition:0.3s;   }
#topMenu > li > ul > li { position:relative; width:100%; padding:3px 10px 4px 10px;  text-align:left; display:block; }
#topMenu > li > ul.end { border-right: 1px solid #eee;}

#topMenu > li > ul > li > a:link,
#topMenu > li > ul > li > a:visited { width:100%; height:auto; padding:0; background:none; color:#333; border:0; line-height:1.3; text-decoration:none; font-family:SCDream4; font-size:85%; margin:0; letter-spacing:-1px;  }
#topMenu > li > ul > li > a:active,
#topMenu > li > ul > li > a:hover,
#topMenu > li > ul > li > a:focus,
#topMenu > li > ul > li > a.select { clear:both; color:#2a8e9d; font-weight:bold; }

#topMenu > li > ul > li > a.st { letter-spacing:-2px; }

#topMenu > li > ul > li > a span { font-size:80%; }

.submenu { display:none; overflow:hidden; }

.menubox { position:absolute; left:0; top:111px; width:100%; height:228px; border-top:1px solid #ddd; border-bottom:3px solid #ff5244; background:#fff; display:none; transition:0.3s; z-index:10; }




#top.scTop2 #topMenu > li > ul { top:51px; }
#top.scTop2 .menubox { top:71px; } 


@media (min-width:1025px) and (max-width:1280px){
	#topMenu > li > ul > li > a span { display:none; }
}



@media (max-width:1024px){
	.topMenu,
	.menubox { display:none; } 	
	.menubox { width:0; height:0; border:0; line-height:0; }
}	
	





/* 메인비주얼 */
.mVisible { position:relative; float:left; width:100%; height:100vh; z-index:2; }

.mVisible .visibleList { position:relative; width:100%; height:100%; margin:0 auto; }

.mVisible .visibleList .slick-list { overflow:hidden; }

.mVisible .visibleList .list { position:relative; float:left; width:100%; height:100%; overflow:hidden; }
.mVisible .visibleList .list a { width:100%; cursor:default; display:block; }



.mVisible .visibleList .list .pic { position:relative; } 
.mVisible .visibleList .list .pic img { width:100%; height:100%; object-fit:cover; transform:scale(1.3);}
.mVisible .visibleList .list.slick-active img { transform:scale(1.0);  }
.mVisible .visibleList .list.slick-current img { transform:scale(1.0);}

.mVisible .visibleList .list.slick-current img { animation-name:vimg1; animation-duration:8s; }
	@keyframes vimg1 {
		from { transform:scale(1.3); }
		to { transform:scale(1.0);  }	
	}

.mVisible .visibleList .list.slick-active img { animation-name:vimg2; animation-duration:8s; }
	@keyframes vimg2 {
		from { transform:scale(1.3); }
		to { transform:scale(1.0);  }	
	}


.mVisible .slick-prev,
.mVisible .slick-next { position:absolute; top:calc(50% - 40px); width:40px; height:80px; line-height:80px; border:none; font-size:0; cursor:pointer; opacity:0.5; transition:0.3s; display:block; z-index:1003; }

.mVisible .slick-prev { left:100px; background:url(/images/main/slick_btn_prev.gif) no-repeat; }
.mVisible .slick-next { right:100px; background:url(/images/main/slick_btn_next.gif) no-repeat; }

.mVisible .slick-prev:hover,
.mVisible .slick-next:hover { opacity:1; }


.mVisible .slick-dots { position:absolute; left:0; right:0;  bottom:50px; display:flex !important; justify-content:center; gap:10px; }
.mVisible .slick-dots .fill { display:block; width:0%; height:100%; background:#007bff; border-radius:5px; transition:width 0.1s linear; }


.mVisible .slick-dots { display:flex !important; justify-content:center; gap:10px; }
.mVisible .slick-dots .fill { display:block; width:0%; height:100%; background:#007bff; border-radius:4px; transition:width 0.1s linear; }
.mVisible .slick-dots li { position:relative; display:inline-block; vertical-align:middle; width:10px; height:10px; border-radius:50%; background:#ccc; overflow:hidden; position:relative; transition:width 0.3s ease, border-radius 0.3s ease, background 0.3s ease; }
.mVisible .slick-dots li button { all:unset; display:block; width:100%; height:100%; cursor:pointer; position:relative; }
.mVisible .slick-dots li.active { width:60px; border-radius:5px; background:#202b69; }
.mVisible .slick-dots li .fill { position:absolute; top:0; left:0; height:100%; width:0%; background:#f15a28; transition:width 0.1s linear;	border-radius:5px; }



@media (min-width:1025px) and (max-width:1600px){
	.mVisible .slick-prev { left:30px; }
	.mVisible .slick-next { right:30px; }	
}

@media (min-width:769px) and (max-width:1024px){
	.mVisible { height:100%; }
	.mVisible .visibleList .list .pic img { width:auto; height:800px; }

	.mVisible .slick-prev { left:30px; }
	.mVisible .slick-next { right:30px; }
}

@media (max-width:768px){
	.mVisible { height:100%; }
	.mVisible .visibleList .list .pic img { width:auto; height:600px; }

	.mVisible .slick-prev,
	.mVisible .slick-next {  top:calc(50% - 20px); width:20px; height:40px; line-height:40px; }

	.mVisible .slick-prev { left:15px; background-size:20px 40px; }
	.mVisible .slick-next { right:15px;background-size:20px 40px;  }

	.mVisible .slick-dots { bottom:20px; }

}



/* 메인비주얼 TXT 애니메이션 */
.mVisible .visibleList .list .txt11 { opacity:0; }
.mVisible .visibleList .list.slick-active .txt11 { position:absolute; left:300px; color:#fff; font-family:SCDream8; font-size:310%; letter-spacing:-1px; opacity:0;
	animation-name:txtMove11;
	animation-duration:2s; /* 걸리는 시간 */
	animation-fill-mode:forwards;
	animation-delay:0.5s;
	animation-timing-function:ease;
	animation-iteration-count:1; /* 반복횟수 */
	animation-direction:normal; 
}
	
@keyframes txtMove11 {
	from { top:calc(50vh - 125px); opacity:0; text-shadow:none; }
	to { top:calc(50vh - 75px); opacity:1; text-shadow:5px 5px 10px rgba(0,0,0,0.8);}	
}

.mVisible .visibleList .list .txt12 { opacity:0; }
.mVisible .visibleList .list.slick-active .txt12 { position:absolute; left:300px; color:#fff; font-family:SCDream8; font-size:310%; letter-spacing:-1px; opacity:0;
	animation-name:txtMove12;
	animation-duration:2s; /* 걸리는 시간 */
	animation-fill-mode:forwards;
	animation-delay:1.0s;
	animation-timing-function:ease;
	animation-iteration-count:1; /* 반복횟수 */
	animation-direction:normal; 
}

@keyframes txtMove12 {
	from { top:calc(50vh - 55px); opacity:0; text-shadow:none;  }
	to { top:calc(50vh - 5px); opacity:1; text-shadow:5px 5px 10px rgba(0,0,0,0.8); }	
}


@media (min-width:1281px) and (max-width:1600px){
	.mVisible .visibleList .list.slick-active .txt11 { left:150px; font-size:280%; }
	.mVisible .visibleList .list.slick-active .txt12 { left:150px; font-size:280%; }
}

@media (min-width:1025px) and (max-width:1280px){
	.mVisible .visibleList .list.slick-active .txt11 { left:150px; font-size:250%; }
	.mVisible .visibleList .list.slick-active .txt12 { left:150px; font-size:250%; }
}

@media (min-width:769px) and (max-width:1024px){
	.mVisible .visibleList .list.slick-active .txt11 { left:100px; font-size:180%; }
	.mVisible .visibleList .list.slick-active .txt12 { left:100px; font-size:180%; }

	@keyframes txtMove11 {
		from { top:205px; opacity:0; text-shadow:none; }
		to { top:255px; opacity:1; text-shadow:5px 5px 10px rgba(0,0,0,0.8); }
	}

	@keyframes txtMove12 {
		from { top:250px; opacity:0; text-shadow:none; }
		to { top:300px; opacity:1; text-shadow:5px 5px 10px rgba(0,0,0,0.8); }
	}
}

@media (max-width:768px){
	.mVisible .visibleList .list.slick-active .txt11 { left:45px; font-size:105%; }
	.mVisible .visibleList .list.slick-active .txt12 { left:45px; font-size:105%; }

	@keyframes txtMove11 {
		from { top:125px; opacity:0; text-shadow:none; }
		to { top:175px; opacity:1; text-shadow:5px 5px 10px rgba(0,0,0,0.8); }
	}

	@keyframes txtMove12 {
		from { top:150px; opacity:0; text-shadow:none; }
		to { top:200px; opacity:1; text-shadow:5px 5px 10px rgba(0,0,0,0.8); }
	}
}



.mVisible .visibleList .list .txt21 { opacity:0; }
.mVisible .visibleList .list.slick-active .txt21 { position:absolute; left:300px; color:#fff; font-family:SCDream8; font-size:310%; letter-spacing:-1px; opacity:0;
	animation-name:txtMove21;
	animation-duration:2s; /* 걸리는 시간 */
	animation-fill-mode:forwards;
	animation-delay:0.5s;
	animation-timing-function:ease;
	animation-iteration-count:1; /* 반복횟수 */
	animation-direction:normal; 
}
	
@keyframes txtMove21 {
	from { top:calc(50vh - 125px); opacity:0; text-shadow:none;  }
	to { top:calc(50vh - 75px); opacity:1; text-shadow:5px 5px 10px rgba(0,0,0,0.8); }	
}

.mVisible .visibleList .list .txt22 { opacity:0; }
.mVisible .visibleList .list.slick-active .txt22 { position:absolute; left:300px; color:#fff; font-family:SCDream8; font-size:310%; letter-spacing:-1px; opacity:0;
	animation-name:txtMove22;
	animation-duration:2s; /* 걸리는 시간 */
	animation-fill-mode:forwards;
	animation-delay:1.0s;
	animation-timing-function:ease;
	animation-iteration-count:1; /* 반복횟수 */
	animation-direction:normal; 
}

@keyframes txtMove22 {
	from { top:calc(50vh - 55px); opacity:0; text-shadow:none;  }
	to { top:calc(50vh - 5px); opacity:1; text-shadow:5px 5px 10px rgba(0,0,0,0.8); }	
}



@media (min-width:1281px) and (max-width:1600px){
	.mVisible .visibleList .list.slick-active .txt21 { left:150px; font-size:280%; }
	.mVisible .visibleList .list.slick-active .txt22 { left:150px; font-size:280%; }
}

@media (min-width:1025px) and (max-width:1280px){
	.mVisible .visibleList .list.slick-active .txt21 { left:150px; font-size:250%; }
	.mVisible .visibleList .list.slick-active .txt22 { left:150px; font-size:250%; }
}

@media (min-width:769px) and (max-width:1024px){
	.mVisible .visibleList .list.slick-active .txt21 { left:100px; font-size:180%; }
	.mVisible .visibleList .list.slick-active .txt22 { left:100px; font-size:180%; }

	@keyframes txtMove21 {
		from { top:205px; opacity:0; text-shadow:none; }
		to { top:255px; opacity:1; text-shadow:5px 5px 10px rgba(0,0,0,0.8); }
	}

	@keyframes txtMove22 {
		from { top:250px; opacity:0; text-shadow:none; }
		to { top:300px; opacity:1; text-shadow:5px 5px 10px rgba(0,0,0,0.8); }
	}
}

@media (max-width:768px){
	.mVisible .visibleList .list.slick-active .txt21 { left:45px; font-size:105%; }
	.mVisible .visibleList .list.slick-active .txt22 { left:45px; font-size:105%; }

	@keyframes txtMove21 {
		from { top:125px; opacity:0; text-shadow:none; }
		to { top:175px; opacity:1; text-shadow:5px 5px 10px rgba(0,0,0,0.8); }
	}

	@keyframes txtMove22 {
		from { top:150px; opacity:0; text-shadow:none; }
		to { top:200px; opacity:1; text-shadow:5px 5px 10px rgba(0,0,0,0.8); }
	}
}



/* cont2 */
/* cont2 */
/* cont2 */

/* 배경색 원효과 */
.cursor-circle { position:absolute; width:800px; height:800px; background:radial-gradient(#152056 0%, #0c1542 70%); border-radius:50%; pointer-events:none; transform:translate(-50%, -50%); transition:background 0.2s ease; mix-blend-mode:lighten; }


#cont2 .txt21 { position:relative; color:#fff; font-family:SCDream8; font-size:300%; opacity:0; transition:0.4s; margin-bottom:60px; }
#cont2 .txt21 .txtB1 { position:relative; left:100px; opacity:0; transition:0.5s;}
#cont2 .txt21 .txtB2 { position:relative; left:100px; opacity:0; transition:0.5s;}

#cont2.active .txt21 { opacity:1; }
#cont2.active .txt21 .txtB1 { left:0px; opacity:1; transition-delay:0.1s; }
#cont2.active .txt21 .txtB2 { left:0px; opacity:1; transition-delay:0.3s; }

@media (min-width:1025px) and (max-width:1600px){
	#cont2 .txt21 { font-size:280%; }
	#cont2 .txt21 .txtB1 { left:130px; }
	#cont2 .txt21 .txtB2 { left:130px; }

	#cont2.active .txt21 .txtB1 { left:30px; }
	#cont2.active .txt21 .txtB2 { left:30px; }
}

@media (min-width:769px) and (max-width:1024px){
	#cont2 .txt21 { font-size:200%; }
	#cont2 .txt21 .txtB1 { left:130px; }
	#cont2 .txt21 .txtB2 { left:130px; }

	#cont2.active .txt21 .txtB1 { left:30px; }
	#cont2.active .txt21 .txtB2 { left:30px; }
}

@media (max-width:768px){
	#cont2 .txt21 { font-size:150%; }
	#cont2 .txt21 .txtB1 { left:130px; }
	#cont2 .txt21 .txtB2 { left:130px; }

	#cont2.active .txt21 .txtB1 { left:30px; }
	#cont2.active .txt21 .txtB2 { left:30px; }
}

@media (max-width:500px){
	#cont2 .txt21 { font-size:110%; }
	#cont2 .txt21 .txtB1 { left:115px; }
	#cont2 .txt21 .txtB2 { left:115px; }

	#cont2.active .txt21 .txtB1 { left:15px; }
	#cont2.active .txt21 .txtB2 { left:15px; }
}




/* 솔루션 */
.mSolution { position:relative; top:100px; width:100%;  opacity:0; transition:0.7s; transition-delay:0.3s; z-index:100; }
.mSolution .list { float:left; width:/*360px*/calc(25% - 40px); height:500px; overflow:hidden; margin:0 20px; }

.mSolution .list a:link,
.mSolution .list a:visited { position:relative; width:100%; height:100%; padding:40px 30px 0 30px; border:1px solid rgba(255,255,255,0.3); border-radius:30px; transition:0.3s; overflow:hidden; display:block; }
.mSolution .list a:active,
.mSolution .list a:focus,
.mSolution .list a:hover { border:none; }

.mSolution .list a h1 { /*height:100px;*/ color:#fff; font-family:SCDream8; font-size:200%; word-break:keep-all; margin-bottom:30px; }
.mSolution .list a h1 span { font-family:SCDream6; font-size:50%; display:block; }

.mSolution .list a .txt { color:#ccc; font-size:90%; line-height:1.5; word-break:keep-all; margin-bottom:30px; }
.mSolution .list a:link .pic, 
.mSolution .list a:visited .pic{ position:absolute; left:0; right:0; bottom:70px; width:100%; text-align:center; transition:0.3s;  }
.mSolution .list a:active .pic,
.mSolution .list a:focus .pic,
.mSolution .list a:hover .pic { bottom:110px; }
.mSolution .list a .pic img { width:auto; margin:0 auto; }



.mSolution .list a:link::after,
.mSolution .list a:visited::after { content:''; position:absolute; left:-150px; bottom:-150px; width:510px; height:650px; background:url(/images/main/cont2_contentbox.png) no-repeat right top; opacity:0; transition:0.5s; display:block; z-index:-1; }
.mSolution .list a:active::after,
.mSolution .list a:focus::after,
.mSolution .list a:hover::after { left:0; bottom:0; opacity:1; }



.mSolution .slick-dots { position:absolute; left:0; right:0;  bottom:-50px; display:flex !important; justify-content:center; gap:10px; }
.mSolution .slick-dots .fill { display:block; width:0%; height:100%; background:#007bff; border-radius:5px; transition:width 0.1s linear; }


.mSolution .slick-dots { display:flex !important; justify-content:center; gap:10px; }
.mSolution .slick-dots .fill { display:block; width:0%; height:100%; background:#007bff; border-radius:4px; transition:width 0.1s linear; }
.mSolution .slick-dots li { position:relative; display:inline-block; vertical-align:middle; width:10px; height:10px; border-radius:50%; background:#ccc; overflow:hidden; position:relative; transition:width 0.3s ease, border-radius 0.3s ease, background 0.3s ease; }
.mSolution .slick-dots li button { all:unset; display:block; width:100%; height:100%; cursor:pointer; position:relative; }
.mSolution .slick-dots li.active { width:60px; border-radius:5px; background:#202b69; }
.mSolution .slick-dots li .fill { position:absolute; top:0; left:0; height:100%; width:0%; background:#f15a28; transition:width 0.1s linear;	border-radius:5px; }


.mSolution.active { top:0; opacity:1; }


@media (min-width:1025px) and (max-width:1600px){
	.mSolution .list { width:calc(25% - 30px); margin:0 15px; }

	.mSolution .list a:link,
	.mSolution .list a:visited { padding:40px 20px 0 20px; }

	.mSolution .list a h1 { font-size:180%; }
	.mSolution .list a .pic img { height:120px; }
}

@media (min-width:769px) and (max-width:1024px){
	.mSolution .list { width:calc(25% - 20px); margin:0 10px; }

	.mSolution .list a:link,
	.mSolution .list a:visited { padding:40px 20px 0 20px; }

	.mSolution .list a h1 { font-size:180%; }

	.mSolution .list a:link .pic, 
	.mSolution .list a:visited .pic{ bottom:100px;  }
	.mSolution .list a:active .pic,
	.mSolution .list a:focus .pic,
	.mSolution .list a:hover .pic { bottom:140px; }

	.mSolution .list a .pic img { height:120px; }
}

@media (max-width:768px){
	.mSolution .list { width:calc(33.333% - 10px); margin:0 5px; }

	.mSolution .list a:link,
	.mSolution .list a:visited { padding:40px 15px 0 15px; }

	.mSolution .list a h1 { font-size:180%; }

	.mSolution .list a:link .pic, 
	.mSolution .list a:visited .pic{ bottom:100px;  }
	.mSolution .list a:active .pic,
	.mSolution .list a:focus .pic,
	.mSolution .list a:hover .pic { bottom:140px; }

	.mSolution .list a .pic img { height:120px; }
}







/* cont3 */
/* cont3 */
/* cont3 */

#cont3 .txt31 { position:relative; color:#fff; font-family:SCDream8; font-size:300%; opacity:0; transition:0.4s; margin-bottom:60px; }
#cont3 .txt31 .txtC1 { position:relative; left:100px; opacity:0; transition:0.5s;}
#cont3 .txt31 .txtC2 { position:relative; left:100px; opacity:0; transition:0.5s;}

#cont3.active .txt31 { opacity:1; }
#cont3.active .txt31 .txtC1 { left:0px; opacity:1; transition-delay:0.1s; }
#cont3.active .txt31 .txtC2 { left:0px; opacity:1; transition-delay:0.3s; }


@media (min-width:1281px) and (max-width:1600px){
	#cont3 .txt31 { font-size:280%; }
	#cont3 .txt31 .txtC1 { left:130px; }
	#cont3 .txt31 .txtC2 { left:130px; }

	#cont3.active .txt31 .txtC1 { left:30px; }
	#cont3.active .txt31 .txtC2 { left:30px; }
}


@media (min-width:1025px) and (max-width:1280px){
	#cont3 .txt31 { font-size:260%; }
	#cont3 .txt31 .txtC1 { left:130px; }
	#cont3 .txt31 .txtC2 { left:130px; }

	#cont3.active .txt31 .txtC1 { left:30px; }
	#cont3.active .txt31 .txtC2 { left:30px; }
}


@media (min-width:769px) and (max-width:1024px){
	#cont3 .txt31 { font-size:200%; }
	#cont3 .txt31 .txtC1 { left:130px; }
	#cont3 .txt31 .txtC2 { left:130px; }

	#cont3.active .txt31 .txtC1 { left:30px; }
	#cont3.active .txt31 .txtC2 { left:30px; }
}

@media (max-width:768px){
	#cont3 .txt31 { font-size:150%; }

	#cont3 .txt31 .txtC1 { left:130px; }
	#cont3 .txt31 .txtC1 span { display:block; }
	#cont3 .txt31 .txtC2 { left:130px; }

	#cont3.active .txt31 .txtC1 { left:30px; }
	#cont3.active .txt31 .txtC2 { left:30px; }
}

@media (max-width:500px){
	#cont3 .txt31 { font-size:110%; }
	#cont3 .txt31 .txtC1 { left:115px; }
	#cont3 .txt31 .txtC1 span { display:block; }
	#cont3 .txt31 .txtC2 { left:115px; }

	#cont3.active .txt31 .txtC1 { left:15px; }
	#cont3.active .txt31 .txtC2 { left:15px; }
}



/* mService */
#cont3 { max-height:none; }
#cont3 .mService { position:relative;width:100%; padding:0 0 300px; transition:0.5s; }
#cont3 .mService .serviceList { position:relative; top:100px; overflow:visible; opacity:0; transition:0.3s;  }
#cont3 .mService .serviceList.active { top:0; overflow:visible; opacity:1;  }


#cont3 .mService .serviceList li { position:sticky; top:120px; height:300px; border-radius:30px; overflow:hidden; transition:all .3s ease-in-out; }
#cont3 .mService .serviceList li:before { content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:linear-gradient(to right, rgba(0,0,0,0.8) 50%, rgba(0,0,0,0.5) 75%, rgba(0,0,0,0) 90%); z-index:0; display:block; }

#cont3 .mService .serviceList li a { position:relative; width:100%; height:auto; display:block; padding:20px 40px; }

#cont3 .mService .serviceList li a:link h1, 
#cont3 .mService .serviceList li a:visited h1 { color:#ddd; font-family:SCDream8; /*font-size:97.25%;*/ font-size:130%; opacity:0.8; transition:0.3s; margin-bottom:30px; }
#cont3 .mService .serviceList li a:active h1, 
#cont3 .mService .serviceList li a:focus h1,
#cont3 .mService .serviceList li a:hover h1 { color:#fff !important; font-size:140%; }

#cont3 .mService .serviceList li a:link p, 
#cont3 .mService .serviceList li a:visited p { padding-right:900px; color:#666; font:130% SCDream4; word-break:keep-all; transition:0.4s; margin-bottom:40px; }
#cont3 .mService .serviceList li a:active p, 
#cont3 .mService .serviceList li a:focus p,
#cont3 .mService .serviceList li a:hover p { color:#ccc; }


#cont3 .mService .serviceList li a:link span,
#cont3 .mService .serviceList li a:visited span { position:relative; width:70px; height:70px; line-height:65px !important; border-radius:50%; background:#06c; color:#fff; font:120% SCDream6; text-align:center; transition:0.3s; opacity:0; display:block; }
#cont3 .mService .serviceList li a:active span, 
#cont3 .mService .serviceList li a:focus span,
#cont3 .mService .serviceList li a:hover span { background:#ff5244; opacity:1; transform:translate(0,-20px); }


#cont3 .mService .serviceList li:nth-child(1) { background:url(/images/main/service_img1.jpg) no-repeat 85% 50%; transform: translateY(0px); }                             
#cont3 .mService .serviceList li:nth-child(2) { background:url(/images/main/service_img2.jpg) no-repeat 85% 50%; transform:translateY(60px); }  
#cont3 .mService .serviceList li:nth-child(3) { background:url(/images/main/service_img3.jpg) no-repeat 85% 50%; transform:translateY(120px); } 
#cont3 .mService .serviceList li:nth-child(4) { background:url(/images/main/service_img4.jpg) no-repeat 85% 50%; transform:translateY(180px); }  
#cont3 .mService .serviceList li:nth-child(5) { background:url(/images/main/service_img5.jpg) no-repeat 85% 50%; transform:translateY(240px); }  
#cont3 .mService .serviceList li:nth-child(6) { background:url(/images/main/service_img6.jpg) no-repeat 85% 50%; transform:translateY(300px); }



@media (min-width:1441px) and (max-width:1600px){
	#cont3 .mService .serviceList li a p { padding-right:750px; }
}

@media (min-width:1281px) and (max-width:1440px){
	#cont3 .mService .serviceList li a:link p, 
	#cont3 .mService .serviceList li a:visited p { padding-right:650px; font:140% SCDream4; }

	
}

@media (min-width:1025px) and (max-width:1280px){	
	#cont3 .mService .serviceList li a:link p, 
	#cont3 .mService .serviceList li a:visited p { padding-right:500px; font:130% SCDream4; }

	#cont3 .mService .serviceList li:nth-child(1) { background:url(/images/main/service_img1.jpg) no-repeat 50% 50%; }   
	#cont3 .mService .serviceList li:nth-child(2) { background:url(/images/main/service_img2.jpg) no-repeat 0% 50%; } 
}



@media (min-width:1025px) and (max-width:1600px){
	#cont3 .mService { padding:0 30px 300px; }
}



@media (min-width:769px) and (max-width:1024px){
	#cont3 .mService { padding:0 30px 300px; }

	#cont3 .mService .serviceList li a:link p, 
	#cont3 .mService .serviceList li a:visited p { padding-right:100px; font:130% SCDream4; }
}

@media (max-width:768px){
	#cont3 .mService { padding:0 15px 300px; }


	#cont3 .mService .serviceList li a { padding:20px 15px; }
	#cont3 .mService .serviceList li a:link p, 
	#cont3 .mService .serviceList li a:visited p { padding-right:50px; font:115% SCDream4; }
}





/* 하단 */
#bottom #bottomarea .area { padding:30px 10px; border-bottom:1px solid rgba(255,255,255,0.1); }
#bottom #bottomarea .area.end { border-bottom:none; }
#bottom #bottomarea .area span { line-height:1.5; display:block; margin:5px 0px; }
#bottom #bottomarea .area span b { width:60px; color:#7f8ed0; font-weight:normal; display:inline-block; }

#bottom #bottomarea .area address { margin-bottom:20px; }

#bottom #bottomarea a.privacy:link,
#bottom #bottomarea a.privacy:visited { color:#f15a28; }
#bottom #bottomarea a.privacy:active,
#bottom #bottomarea a.privacy:focus,
#bottom #bottomarea a.privacy:hover { color:#fff; }

#bottom #bottomarea .copyright { line-height:1.5; font-size:90%; font-family:Arial, Helvetica, sans-serif; } 

#bottom .topbtn { position:absolute; right:15px; bottom:15px; width:55px; height:55px; border-radius:50%; overflow:hidden; z-index:100001; }


@media (max-width:768px){
	.mbottom:before { background:#e9e9e9 url(/images/common/bottom_bg.png) no-repeat 50% top !important; }
	
	#bottom #bottomarea .bottomMenu ul li { margin-right:10px; }
	#bottom #bottomarea .bottomMenu ul li:nth-child(3) { margin-right:0; }
	#bottom #bottomarea .bottomMenu ul li a:link,
	#bottom #bottomarea .bottomMenu ul li a:visited { line-height:26px; }
	

}



@media (max-width:425px){
	
}