#visual {position:relative; width:100%; /*height:100%;overflow:hidden;*/ width:100%;   z-index:1; padding-top:100px;}
#visual .slick-slider {position: relative; display: block;}
#visual .slick-list {position: relative; display: block; overflow: hidden;}
#visual .slick-slide {display: none; float: left; height: 100%; min-height: 1px;}
#visual .slick-initialized .slick-slide{display: block;}
#visual .slick-vertical .slick-slide{display: block; height: auto; border: 1px solid transparent;}
#visual .slick-prev, #visual .slick-next{ font-size: 0; line-height: 0; position: absolute; top: 53%; display: block; cursor: pointer; color: transparent; border: none; outline: none; background: transparent;}

#visual .sub_imgbox {height:100%;}
#visual .section {position:relative; margin-bottom:2px;width:100%; height:100%; overflow:hidden;background-position:center;background-size:cover; border:0;}
#visual .sub_imgbox .slick-list, #visual .sub_imgbox .slick-track {height:100%;}

#visual  .slick-dots {position: absolute; text-align:center; bottom:97px; z-index:999; width:100%}
#visual  .slick-dots li {display: inline-block;  margin:0 2px; font-size: 0;}
#visual  .slick-dots li button {width:40px; height:4px; border:0; font-size:0; background:#fff; cursor:pointer}
#visual  .slick-dots li.slick-active button{background:#13b6c0;}

#visual .v_txt {position:absolute; top:50%; left:50%; transform:translate(-63%, -50%); text-align:left; z-index:1000;}

.v_txt .txt_area {position:relative; width:1170px; margin:0 auto;}

.v_txt .txt_area p {font-size:1.5rem; word-break: keep-all; line-height:140%; font-weight:400; color:#fff; letter-spacing:-0.5pt;text-shadow: 0px 0px 8px rgb(0 0 0 / 90%)}
/*.v_txt .txt_area p br {display:none;}*/
.v_txt .txt_area h3 {display:block; font-size:3rem; letter-spacing:0; margin:25px 0 50px 0; line-height:105%; color:#fff;text-shadow: 0px 0px 8px rgb(0 0 0 / 90%);}
.v_txt .txt_area h3 br {display:none;}
.v_txt .txt_area a.btns {display:inline-block; width:260px; padding:15px 20px; border-radius:100px; border:2px solid #fff; text-align:left; color:#fff; box-sizing:border-box; background:url('/images/main_btnArr.png') right 10% center no-repeat; font-size:0.9375rem; letter-spacing:-0.5pt; transition:all 0.3s ease-out;}
.v_txt .txt_area a.btns:hover {padding:15px 20px 15px 30px; color:#333; background:#fff url('/images/main_btnArr_b.png') right 13% center no-repeat; transition:all 0.3s ease-out;}

.visual_wrap {position:relative; overflow: hidden; height:80vh; width:100%; margin:0 auto;}
/*.visual_wrap .inner_video {position:absolute; top:0; left:0; bottom:0; right:0;}*/
.visual_wrap .inner_video .bg_video {position: absolute;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);}
video[poster]{ height:100%; width:100%;}
/*.visual_wrap:after {content:''; width:100%; height:100%; background:rgba(0,0,0,0.2); position: absolute;}*/

/*#visual .section.cover01 .inner_video { background-position:top center; background-repeat:no-repeat; background-size:cover;}
#visual .section.cover02 .inner_video {background-position:top center; background-repeat:no-repeat; background-size:cover;}
#visual .section.cover03 .inner_video { background-position:top center; background-repeat:no-repeat; background-size:cover;}*/

#visual .scroll_down { width:16px; height:20px; z-index:99999; }
#visual .scroll_down a img{text-align:center;}


.scroll_down .actions{
    position: absolute;
    bottom: 20px;
	left:50%;
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    animation: scroll_ani 1.5s ease-in-out infinite;
 }
@keyframes scroll_ani {          
       0% {bottom: 20px;} 
	   50% {bottom: 30px;}  
       100% {bottom: 20px;} 
}

#main_container {position:relative; width:100%;   overflow: hidden;}
#main_container h2 {font-size:60px; line-height:100%; }
#main_container h2.kor {font-size:60px; font-weight:700; letter-spacing:-1.5pt; font-family:"Noto Sans KR", sans-serif; transition:all 0.3s ease-out;}
#main_container a.more {display:inline-block; font-size:20px; font-weight:400; letter-spacing:-0.5pt; padding: 10px 20px; box-sizing:border-box; transition:all 0.3s ease-out;}

#business {position:relative; text-align:center; padding:60px 0 100px 0; overflow:hidden; background: #fff;}
#business h2 {background:url('/images/main_titBg.png') center top no-repeat; padding:30px 0 40px 0; color:#000; font-weight:700;}
#business h2 p.stit {font-size:20px; letter-spacing:-0.5pt; color:#777; line-height:100%; font-weight:400; margin-top:15px;}
#business ul {width:100%; max-width:1480px; margin:0 auto; overflow:hidden;}
#business ul li {float:left; width:20%; text-align:center;}
/*#business ul li {float:left; margin-right:20px; text-align:center;}*/
#business ul li a:link, #business ul li a:visited {display:block;}
#business ul li a dl {position:relative; width:98%; max-width:280px; margin:0 auto;}
#business ul li a dt {position:relative; margin-bottom:20px;}
#business ul li a dt img {width:100%;}
#business ul li a dd {display:block; text-align:center;}
#business ul li a dd span.icon {width:100%; height:60px; padding:70px 0 90px 0; display:none;}
#business ul li a dd h3 {font-size:1.25rem; letter-spacing:-0.5pt; font-weight:400; color:#333; text-align:center;}
#business ul li a dd h3 br {display:none;}
#business ul li a dd p {font-size:16px; color:rgba(255,255,255,0.4); letter-spacing:-0.5pt; line-height:140%; padding-bottom:20px; display:none;}
#business ul li a dd span.more {display:inline-block; padding-right:40px; background:url('/images/icon_arr_w.png') right center no-repeat; color:#fff; display:none;}

#business ul li a:hover {}
#business ul li a:hover dt {margin-bottom:0px; }
#business ul li a:hover dt img {background:url('/images/busi_hover.png') left top no-repeat;}
#business ul li a:hover dd {position:absolute; left:0; top:0; width:100%; height:100%; z-index:3; background:url('/images/busi_hover.png') left top no-repeat;}
#business ul li a:hover dd span.icon {display:block;} /* background-position:center 55%; background-repeat:no-repeat; */
#business ul li a:hover dd {display:block; text-align:center;}
#business ul li a:hover dd h3 {font-size:1.563rem; color:#fff; text-align:center; margin-bottom:10px;}
#business ul li a:hover dd h3 br {display:none;}
#business ul li a:hover dd p {font-size:1rem; color:rgba(255,255,255,0.4); letter-spacing:-0.5pt; line-height:140%; padding-bottom:20px; display:block;}
#business ul li a:hover dd span.more {display:inline-block; padding-right:40px; background:url('/images/icon_arr_w.png') right center no-repeat; color:#fff;}

#business .slick-slider {position: relative; display: block;}
#business .slick-list {position: relative; display: block; overflow: hidden;}
#business .slick-slide {display: none; float: left; height: 100%; min-height: 1px;}
#business .slick-initialized .slick-slide{display: block;}
#business .slick-vertical .slick-slide{display: block; height: auto; border: 1px solid transparent;}

#business .slick-dots {display:none;}


/*#business ul li:first-child a:hover dd span.icon {background-image:url('/images/busi_img1_up.png');}
#business ul li:nth-child(2) a:hover dd span.icon {background-image:url('/images/busi_img2_up.png');}
#business ul li:nth-child(3) a:hover dd span.icon {background-image:url('/images/busi_img3_up.png');}
#business ul li:nth-child(4) a:hover dd span.icon {background-image:url('/images/busi_img4_up.png');}
#business ul li:last-child a:hover dd span.icon {background-image:url('/images/busi_img5_up.png');}*/
#business span.icon_sw {display:none; text-align:center; min-height:60px; background:url('/images/ico.swipe.png') top center no-repeat; text-indent:-2222222222px; margin-top:20px;} /* min-height:30px; background-size:auto 30px;  */

#about {position:relative;}
#about .banner {background:url('/images/about_bg.jpg') top center no-repeat; padding:130px 0 210px 0; text-align:center;}
#about .banner h2 {background:url('/images/about_titBg.png') top center no-repeat; padding:30px 0; color:#fff; text-transform:uppercase;}
#about .banner p {font-size:20px; color:rgba(255,255,255,0.7); letter-spacing:-0.5pt; font-weight:400; margin-bottom:20px; line-height:140%;}
#about .banner a.more:link, #about a.more:visited {color:#fff; padding:20px 45px 20px 0; background:url('/images/icon_arr_w.png') right center no-repeat; border-bottom:1px solid #868d9b;}
#about .banner a.more:hover {background:url('/images/icon_arr_w.png') right 8% center no-repeat;}
#about .quick_bn {position:relative; width:100%; max-width:1480px; margin:-100px auto 0 auto; background:#fff; overflow:hidden;}
#about .quick_bn dl {width:100%; display:table;}
#about .quick_bn dd {display:table-cell; width:50%; box-sizing:border-box; padding:60px 0px 60px 70px; font-size:28px; letter-spacing:-0.5pt; color:#666; font-weight:400; line-height:140%; vertical-align:middle; box-sizing:border-box;}
#about .quick_bn dt {display:table-cell; width:50%; box-sizing:border-box; padding:60px 10px 60px 0px; text-align:right; vertical-align:middle; box-sizing:border-box;}
#about .quick_bn dt a:link, #about .quick_bn dt a:visited {display:inline-block; position:relative; padding:90px 60px 5px 60px; border-right:1px solid #ddd; color:#333; font-size:25px; letter-spacing:-0.5pt;  background-position:center top; background-repeat:no-repeat; transition:all 0.2s ease-out;}
#about .quick_bn dt a:hover {background-position:center 10px; transition:all 0.2s ease-out;}
#about .quick_bn dt a:first-child {background-image:url('/images/company_ico1.png');}
#about .quick_bn dt a:nth-child(2) {background-image:url('/images/company_ico2.png');}
#about .quick_bn dt a:last-child {border-right:none; background-image:url('/images/company_ico3.png');}

#notice {position:relative; /*width:100%;*/ padding:150px 0; background:#f9f9f9}
#notice .notice_con {position:relative; width:100%; max-width:1480px; margin:0 auto; overflow:hidden;}
#notice h2 {float:left; display:block; width:300px; background:url('/images/main_titBg.png') top left no-repeat; padding:30px 0 25px 0; color:#333; font-weight:700;}
#notice h2 p {margin-top:25px; font-size:20px; letter-spacing:-0.5pt; color:#777; line-height:150%; font-weight:400;}
#notice h2 a:link, #notice h2 a:visited {width:147px; color:#333; background:url('/images/icon_arr_b.png') right center no-repeat; border-bottom:1px solid #ddd;}
#notice a.more:hover {background:url('/images/icon_arr_b.png') right 12% center no-repeat;}
#notice .list {float:left; width:calc(100% - 300px);}
#notice .list ul {width:100%; overflow:hidden;}
#notice .list ul li {float:left; width:33.3%;}
#notice .list ul li dl {width:100%; max-width:380px; margin:0 auto;}
#notice .list ul li dt {margin-bottom:20px;}
#notice .list ul li dt img {background-size:cover; background-position:50% 50%; background-repeat:no-repeat; border:1px solid #ddd; box-sizing:border-box;}
#notice .list ul li dd p {font-size:20px; color:#333; letter-spacing:-0.5pt; font-weight:400; margin-bottom:10px;}
#notice .list ul li dd span {background:url('/images/thum_date.png') left center no-repeat; padding-left:25px; font-size:16px; color:#777; min-height:15px;}
#notice a.main_mobile:link, #notice a.main_mobile:visited {display:none;}

#recruit {background:url('/images/recruit_bg.jpg') top center no-repeat; padding:80px 0; text-align:center;}
#recruit h2 {background:url('/images/about_titBg.png') top center no-repeat; padding:30px 0; color:#fff;}
#recruit p {font-size:20px; color:rgba(255,255,255,0.7); letter-spacing:-0.5pt; font-weight:400; margin-bottom:12px; line-height:140%;}
#recruit a.more:link, #recruit a.more:visited {width:220px; color:#fff; padding:20px 50px 20px 0; background:url('/images/icon_arr_w.png') right center no-repeat; border-bottom:1px solid #78b4ca;}
#recruit a.more:hover {background:url('/images/icon_arr_w.png') right 8% center no-repeat;}


/*******************************************************************************
	@media 1241px~1480px
*******************************************************************************/
@media all and (max-width:1480px){


#business ul {width:98%; max-width:100%;}
#business ul li a:hover dt { height:100%;}
/*#business ul li a dd span.icon {padding:20% 0 10% 0;}
#business ul li a:hover dd span.icon {background-position:center 65%;  padding:20% 0 10% 0;}*/
#business span.icon_sw {display:block;} /* min-height:30px; background-size:auto 30px;  */

#about .banner h2 {padding:30px 0;}
#about .quick_bn {width:98%; max-width:100%; }
#about .quick_bn dd {padding:45px 0px 45px 50px; font-size:25px;}
#about .quick_bn dt {padding:45px 10px 45px 0px;}
#about .quick_bn dt a:link, #about .quick_bn dt a:visited {padding:90px 40px 5px 40px; font-size:22px;}

#notice .notice_con {width:98%; max-width:100%; }
#notice .list {float:left; width:calc(100% - 300px);}
#notice .list ul li dl {width:98%; max-width:100%;}

}


/*******************************************************************************
	@media 1024px~1240px
*******************************************************************************/
@media all and (max-width:1240px){

#business {padding:80px 0 100px 0;}
#business ul li a:hover dd span.icon {padding:20% 0 10% 0;}
#business ul li a:hover dd h3 {font-size:1.25rem; margin-bottom:8px;}
#business ul li a:hover dd p {font-size:0.9375rem; padding-bottom:15px;}

#about .banner {padding:110px 0 180px 0;}

#notice {padding:120px 0;}
#notice h2 {float:none; width:100%; background:url('/images/main_titBg.png') top center no-repeat; text-align:center; padding:30px 0 40px 0;}
#notice h2 p {text-align:center;}
#notice h2 p br {display:none;}
#notice h2 a:link, #notice h2 a:visited {display:none;}
#notice .list {float:none; width:100%;}
#notice .list ul li dd p {line-height:130%;}
#notice a.main_mobile:link, #notice a.main_mobile:visited {display:block; margin:20px auto 0 auto; width:147px; color:#333; background:url('/images/icon_arr_b.png') right center no-repeat; border-bottom:1px solid #ddd; transition:all 0.2s ease-out;}
#notice a.main_mobile:hover {background:url('/images/icon_arr_b.png') right 8% center no-repeat; transition:all 0.2s ease-out;}

#recruit {padding:70px 0;}

}

/*******************************************************************************
	@media 1024px~1240px
*******************************************************************************/
@media all and (max-width:1100px){

#visual .v_txt {width:100%; padding:0 2%;}
#visual	.v_txt .txt_area {width:100%;}

#about .quick_bn dd br {display:none;}
#about .quick_bn dt a:link, #about .quick_bn dt a:visited {padding:90px 30px 5px 30px; font-size:20px;}
}

/*******************************************************************************
	@media 769~980px
*******************************************************************************/
@media all and (max-width:980px){

	/*#visual {min-height:auto; height:500px;}*/
	#visual .section {min-height:auto;}
	#visual .v_txt {top: 57%; transform:translate(-46%, -50%); }

	#main_container h2 {font-size:55px;}
	#main_container h2.kor {font-size:45px; letter-spacing:-1pt;}
	#main_container a.more {font-size:18px; padding:18px 0;}

	#business {padding:30px 0 80px 0;}
	#business h2 p.stit {font-size:18px;}
	/*#business ul li {width:33.3%;}*/
	#business ul li a dl dt {margin-bottom:15px;}
	#business ul li a dl dt img {width:100%;}
	#business ul li a dd span.icon { padding:50px 0 20px 0; height: auto; display:none;}
	#business ul li a dd h3 {line-height:130%;}

	#about .banner h2 {padding:30px 0 25px 0;}
	#about .banner {padding:80px 0 150px 0;}
	#about .banner p {font-size:18px; margin-bottom:10px;}
	#about .banner a.more:link, #about a.more:visited {padding:18px 40px 18px 0;}

	#about .quick_bn dd {display:block; width:100%; padding:40px 0px 20px 0px; font-size:22px; text-align:center;}
	#about .quick_bn dd br {display:block;}
	#about .quick_bn dt {display:block; width:100%; padding:20px 0px 40px 0px; text-align:center;}
	#about .quick_bn dt a:link, #about .quick_bn dt a:visited {padding:85px 40px 5px 40px; font-size:18px;}

	#notice {padding:90px 0;}
	#notice h2 p {font-size:18px; margin-top:15px;}
	#notice .list ul li dd p {font-size:18px;}
	#notice .list ul li dd span {font-size:15px; padding-left:22px;}

	#notice a.main_mobile:link, #notice a.main_mobile:visited {margin:18px auto 0 auto; }

	#recruit {padding:60px 0;}
	#recruit h2 {padding:25px 0 20px 0;}
	#recruit p {font-size:18px;}
	#recruit a.more:link, #recruit a.more:visited {width:190px; padding:18px 50px 18px 0;}

}

@media (min-width: 431px) and (max-width: 991px) {
	#visual {height:500px; padding-top:0;}
	.visual_wrap{background-position:center center !important;}
}

/*******************************************************************************
	@media 430px
*******************************************************************************/
@media all and (max-width:430px){
	#visual {min-height:auto; height:300px;}
	.visual_wrap{background-position:center center !important;}
}

/*******************************************************************************
	@media 671~768px
*******************************************************************************/
@media all and (max-width:768px){


#main_container h2 {font-size:50px;}
#main_container h2.kor {font-size:40px;}
#main_container a.more {font-size:16px; padding:16px 0;}

#visual .slick-dots{bottom:20px}

#business {padding:30px 0 60px 0;}
#business h2 {padding:25px 0 35px 0;}

#about .banner {padding:50px 0 135px 0;}
#about .banner h2 {padding:25px 0 20px 0;}
#about .banner a.more:link, #about a.more:visited {padding:16px 40px 16px 0;}

#notice {padding:60px 0;}
#notice h2 {padding:25px 0 35px 0;}
#notice .list ul li {width:50%;}
#notice .list ul li:nth-child(3) {display:none;}
#notice .list ul li dt {margin-bottom:15px;}
#notice .list ul li dt img {width:100%;}
#notice a.main_mobile:link, #notice a.main_mobile:visited {margin:16px auto 0 auto; }

#recruit {padding:50px 0;}
#recruit a.more:link, #recruit a.more:visited {width:170px; padding:16px 50px 16px 0;}
.visual_wrap .inner_video .bg_video {position: absolute;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
width: -webkit-fill-available;
height: -webkit-fill-available;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);}
video[poster]{ height:100%; width:100%;}


}


/*******************************************************************************
	@media 481~680px
*******************************************************************************/
@media all and (max-width:680px){

	.visual_wrap .inner_video {background-size:cover;}

	.v_txt .txt_area p {font-size:1.1rem;letter-spacing:-0.8px;}
	.v_txt .txt_area p {line-height:140%;}
	.v_txt .txt_area p br {display:block;}
	.v_txt .txt_area h3 {font-size:2rem; margin:25px 3% 50px 0; word-break: keep-all;letter-spacing:-0.8px;}
	.v_txt .txt_area h3 br {display:block;}

	#main_container h2 {font-size:40px;}
	#main_container h2.kor {font-size:30px;}
	#main_container a.more {font-size:15px; padding:15px 0;}

	#business {padding:20px 0 50px 0;}
	#business h2 p.stit {font-size:16px;}
	#business span.icon_sw {min-height:40px; background-size:auto 40px;}

	#about .banner h2 {padding:25px 0 15px 0;}
	#about .banner {padding:60px 0 120px 0;}
	#about .banner a.more:link, #about a.more:visited {padding:15px 40px 15px 0;}
	#about .quick_bn {margin:-80px auto 0 auto;}

	#about .banner p {font-size:16px;}
	#about .quick_bn dd {padding:30px 0px 10px 0px; font-size:18px;}
	#about .quick_bn dt {padding:20px 0px 30px 0px;}
	#about .quick_bn dt a:link, #about .quick_bn dt a:visited {padding:80px 40px 5px 40px; font-size:16px;}

	#notice {padding:45px 0;}
	#notice h2 p {font-size:16px; margin-top:12px;}
	#notice .list ul li dd p {font-size:16px;}
	#notice .list ul li dd span {font-size:14px;}
	#notice a.main_mobile:link, #notice a.main_mobile:visited {margin:15px auto 0 auto; }

	#recruit {padding:50px 0;}
	#recruit h2 {padding:25px 0 20px 0;}
	#recruit p {font-size:16px;}
	#recruit a.more:link, #recruit a.more:visited {padding:15px 45px 15px 0;}

	.visual_wrap .inner_video .bg_video {position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: -webkit-fill-available;
	height: -webkit-fill-available;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);}
	video[poster]{ height:100%; width:100%;}

}

/*******************************************************************************
	@media ~480px
*******************************************************************************/
@media all and (max-width:480px){

	#main_container h2 {font-size:30px;}
	#main_container h2.kor {font-size:25px;}
	#main_container a.more {font-size:14px; padding:12px 0;}
	.v_txt .txt_area h3 {font-size:1.5rem; }
	.v_txt .txt_area a.btns{width:220px}


	.visual_wrap .inner_video .bg_video {position: absolute;
		top: 50%;
		left: 50%;
		min-width: 100%;
		min-height: 100%;
		width: -webkit-fill-available;
		height: -webkit-fill-available;
		-webkit-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);}
		video[poster]{ height:100%; width:100%;
	}
	#business {padding:50px 0 40px 0;}
	#business h2 p.stit {font-size:14px;}
	#business ul li a dd h3 br {display:block;}
	#business span.icon_sw {margin-top:10px; min-height:30px; background-size:auto 30px;}

	#about .banner {padding:40px 0 100px 0;}
	#about .banner p {font-size:14px; padding:0 5%; box-sizing:border-box;}
	#about .banner p br {display:none;}
	#about .banner a.more:link, #about a.more:visited {padding:12px 40px 12px 0;}
	#about .quick_bn {margin:-60px auto 0 auto;}
	#about .quick_bn dd {padding:25px 5% 10px 5%; font-size:16px; box-sizing:border-box;}
	#about .quick_bn dd br {display:none;}
	#about .quick_bn dt a:link, #about .quick_bn dt a:visited {padding:56px 6% 0px 6%; font-size:15px; background-size:45px;}

	#notice h2 {padding:20px 0 25px 0}
	#notice h2 p {font-size:14px;}
	#notice .list ul li dt {margin-bottom:10px;}
	#notice .list ul li dd p {font-size:14px; margin-bottom:6px;}

	#recruit p {font-size:14px; padding:0 2%; box-sizing:border-box;}
	#recruit p br {display:none;}
	#recruit a.more:link, #recruit a.more:visited {width:150px; padding:12px 40px 12px 0;}

}


/*******************************************************************************
	@media ~480px
*******************************************************************************/
@media all and (max-width:380px){




#about .quick_bn dd {font-size:15px;}

}

/**************************************************************

	Image Menu
	v 2.2

**************************************************************/


#imageMenu {
	position: relative;
	width: 100%;
	height: 200px;
	overflow: hidden;
}



#imageMenu ul {
	list-style: none;
	margin: 0px;
	display: block;
	height: 200px;
	width: 1000px;
	
	}

#imageMenu ul li {
	float: left;
}

#imageMenu ul li a {
	text-indent: -1000px;
	background:#FFFFFF none repeat scroll 0%;
	border-right: 2px solid #fff;
	cursor:pointer;
	display:block;
	overflow:hidden;
	width:298px;
	height: 200px;
}

#imageMenu ul li.landscapes a {
	background: url(http://www.htmldrive.net/edit_media/2010/201007/20100709/imagemenu/imagemenu/images/landscapes.jpg) repeat scroll 0%;
}

#imageMenu ul li.people a {
	background: url(http://www.htmldrive.net/edit_media/2010/201007/20100709/imagemenu/imagemenu/images/people.jpg) repeat scroll 0%;
}

#imageMenu ul li.nature a {
	background: url(http://www.htmldrive.net/edit_media/2010/201007/20100709/imagemenu/imagemenu/images/nature.jpg) repeat scroll 0%;
}

#imageMenu ul li.urban a {
	background: url(http://www.htmldrive.net/edit_media/2010/201007/20100709/imagemenu/imagemenu/images/urban.jpg) repeat scroll 0%;
}

#imageMenu ul li.abstract a {
	background: url(http://www.htmldrive.net/edit_media/2010/201007/20100709/imagemenu/imagemenu/images/abstract.jpg) repeat scroll 0%;
	
}

.clear {
	clear: both;
}

/*************************************************************/


/*************************************************************
	
	ÇÏ´ÜÄÁÅÙÃ÷

*************************************************************/
.contents_middle {background:none;}
.content_list .business_area {position:relative;width:100%;min-width:1280px;}
.content_list .business_area .txt_ti {padding:120px 0 39px 0;text-align:center;}
.content_list .business_area .list {margin:0 auto;display:flex;width:100%;max-width:1920px;height:680px;font-size:0;overflow:hidden;}
.content_list .business_area .list li {position:relative;display:inline-block;width:25%;height:100%;overflow:hidden;transition:width 1s;font-size:0;}
.content_list .business_area .list li.grid1 {background:url("/images/de_img01.jpg") top center no-repeat;}
.content_list .business_area .list li.grid2 {background:url("/images/de_img02.jpg") top center no-repeat;}
.content_list .business_area .list li.grid3 {background:url("/images/de_img03.jpg") top center no-repeat;}
.content_list .business_area .list li.grid4 {background:url("/images/de_img04.jpg") top center no-repeat;}
.content_list .business_area .list li.grid5 {background:url("/images/de_img05.jpg") top center no-repeat;}
.content_list .business_area.active .list li {width:10.6666%;}
.content_list .business_area.active .list li.active {width:68%;}
.content_list .business_area .list li .bg-black {position:absolute;left:0;top:0;width:100%;height:100%;z-index:4;opacity:0;background:rgba(0, 0, 0, 0.3);transition:opacity 500ms;}
.content_list .business_area.active .list li .bg-black {opacity:1;}
.content_list .business_area.active .list li.active .bg-black {opacity:0;}
.content_list .business_area .list li .bg-hover {position:absolute;left:0;right:0;top:0;width:100%;height:100%;text-align:right;z-index:5;opacity:0;transition:opacity .5s .4s;}
.content_list .business_area.active .list li.active .bg-hover {opacity:1;transition:none;}
.content_list .business_area .list li .bg-hover img {position:absolute;right:-540px;top:0;transition:all .9s}
.content_list .business_area .list li.active .bg-hover img {right:0;}
.content_list .business_area .list li.grid1 .bg-hover {background:url("/images/de_img01_over.png") center top no-repeat;}
.content_list .business_area .list li.grid2 .bg-hover {background:url("/images/de_img02_over.png") center top no-repeat;}
.content_list .business_area .list li.grid3 .bg-hover {background:url("/images/de_img03_over.png") center top no-repeat;}
.content_list .business_area .list li.grid4 .bg-hover {background:url("/images/de_img04_over.png") center top no-repeat;}
.content_list .business_area .list li.grid5 .bg-hover {background:url("/images/de_img05_over.png") center top no-repeat;}
.content_list .business_area .list li .txtbox .txt {position:absolute;left:50%;top:351px;transform:rotate(0.0001deg) translate(-50%, 0);z-index:6;opacity:1;transition:opacity 500ms .3s;}
.content_list .business_area.active .list li .txtbox .txt {opacity:0;transition:opacity 500ms;}
.content_list .business_area .list li .txtbox .txt-hover {position:absolute;left:50%;top:50%;transform:rotate(0.0001deg) translate(-50%, -50%);z-index:6;opacity:0;transition:opacity 500ms, transform 500ms;}
.content_list .business_area.active .list li .txtbox .txt-hover {transition:opacity 500ms 0.2s;opacity:1;}
.content_list .business_area.active .list li.active .txtbox .txt-hover {transition:opacity 500ms 0;opacity:0;}
.content_list .with_area {margin:0 auto;min-width:1280px;width:100%;max-width:1920px;}
.content_list .with_area .pc {position:relative;margin:0 auto;width:100%;height:784px;}
.content_list .with_area .pc .txt_ti {padding:120px 0 38px 0;text-align:center;}
.content_list .with_area .pc .box1 {position:absolute;left:0;bottom:0;width:23.34%;height:560px;background:url("/images/main/with_box01_bg.jpg") top right no-repeat;z-index:3; display:block;}
.content_list .with_area .pc .box1 p {padding:60px 0 30px 60px;}
.content_list .with_area .pc .box1 a {display:block; height:560px;}
.content_list .with_area .pc .box1 div {padding-left:50px;}
.content_list .with_area .pc .box2 {position:relative;margin:0 auto;width:1024px;height:560px;overflow:hidden;z-index:2;}
.content_list .with_area .pc .box2 .cover {position:absolute;left:0;top:0;z-index:3;cursor:pointer;}
.content_list .with_area .pc .box2 .btn_pause {display:none;position:absolute;left:50%;top:50%;margin:-40px 0 0 -40px;z-index:2;cursor:pointer;}
.content_list .with_area .pc .box2:hover .btn_pause {display:block;}
.content_list .with_area .pc .box2 video {position:relative;top:-2px;left:-2px;width:1028px;height:570px;}
.content_list .with_area .pc .box3 .btn_off {display:none;position:absolute;bottom:20px;left:-55px;z-index:2;cursor:pointer;}
.content_list .with_area .pc .box3 .btn_on {display:none;position:absolute;bottom:20px;left:-55px;z-index:2;cursor:pointer;}
.content_list .with_area.active .pc .box3 .btn_on {display:block;}
.content_list .with_area .pc .box3 {position:absolute;right:0;bottom:0;width:23.34%;height:560px;background:url("/images/main/with_right_bg.gif") top left repeat-x #f3f3f3;z-index:3;display:block;}
.content_list .with_area .pc .box3 {text-align:left;}
.content_list .with_area .pc .box3 p {padding:40px 0 30px 50px;}
.content_list .with_area .pc .box3 a {margin-left:50px;}
.content_list .with_area .pc .box3 .promote {height:50%;}
.content_list .with_area .pc .box3 .promote div {padding-left:50px;}
.content_list .with_area .pc .box3 .sns {height:50%;}
.content_list .with_area .pc .box3 .sns a img {width:43px;}
.content_list .with_area .pc .box3 .btn_i {margin-left:50px;}
.content_list .with_area .pc .box3 .btn_f {margin-left:6px;}
.content_list .with_area .pc .box3 .btn_b {margin-left:6px;}
.content_list .with_area .pc .box3 .btn_p {margin-left:6px;}
.content_list .with_area .pc .box3 .btn_y {margin-left:6px;}
@media all and (max-width:991px){
	.content_list {height:auto;}
	.content_list .business_area {min-width:100%;}
	.content_list .business_area .mobile_ver .txt_ti {padding:100px 0 60px 0;}
	.content_list .business_area .mobile_ver ul li {width:100%;/*padding-top:459px;height:730px;*/box-sizing:border-box;}
	/*.content_list .business_area .mobile_ver ul li:nth-child(1) {background:url("/images/de_img01.jpg") left top no-repeat; background-size: cover;}
	.content_list .business_area .mobile_ver ul li:nth-child(2) {background:url("/images/de_img02.jpg") left top no-repeat; background-size: cover;}
	.content_list .business_area .mobile_ver ul li:nth-child(3) {background:url("/images/de_img03.jpg") left top no-repeat; background-size: cover;}
	.content_list .business_area .mobile_ver ul li:nth-child(4) {background:url("/images/de_img04.jpg") left top no-repeat; background-size: cover;}
	.content_list .business_area .mobile_ver ul li:nth-child(5) {background:url("/images/de_img05.jpg") left top no-repeat; background-size: cover;}*/
	.content_list .business_area .mobile_ver ul li .txt {/*margin:0 0 0 40px;*/padding:0 0 30px 0;text-align:center;background:#fff;}
	.content_list .business_area .mobile_ver ul li .txt p {margin-top:20px; font-size: 18px; color:#333;}
}

/*********************2022-11-29*********************/
/*main_title*/
.main_title {font-size: 40px; color: #140a4a; font-weight: bold; padding-bottom: 10px;letter-spacing:-0.8px;}
.main_title span {color: #1fafdd;}

/*network*/
.main_net {margin-top:160px;}
.network {height:33.3333%;}
.network > .row{height:100%;}
/*.network .col-md-6:first-child {padding: 0 70px 0 0;}
.network .col-md-6:last-child {padding: 0;}*/
.network .con_text.padd1 {padding:65px 55px;}
.network .con_text.padd2 {padding: 70px 35px 30px 35px;}
.network .con_text .list_txt {}
.network .con_text .list_txt li {position: relative;line-height: 1.6;font-size: 18px;padding:5px 0 5px 17px;/* letter-spacing: -1px; */word-break: keep-all;color: #333;}
.network .con_text .list_txt li:before {position:absolute; top: 14px; left: 0; display:block; content:""; overflow:hidden; width: 7px; height: 7px; border-radius: 50%; background:#333;}
.network div.col{padding:0; height:100%;}
.network div.col img{margin:0;width:100%;}

@media all and (max-width:991px){
	.main_net {margin-top:85px;}
}

@media all and (max-width:500px){
	.main_net {margin-top:250px;}
}





/*section 3*/
	.collection_wrap {
		width:100%;
		background:#12203a;
		display:flex;
		justify-content:space-between;
		align-items:center;
		overflow:hidden;
		position:relative;
	}

	.collection_wrap > div.left_area{
		padding-top: 60px;
		padding-bottom: 60px;
		text-align: center;
	}

	.collection_wrap > div.left_area div div a img {
		width:90%;
		height:auto;
	}
	.collection_wrap > div.right_area {
		position:static;
		text-align:left;
		height:auto;
		padding:0 100px;
		box-sizing:border-box;
	}
	.collection_wrap > div.right_area div div.swiper-slide {
		opacity:0;
		visibility:hidden;
		display:flex;
		justify-content:flex-start;
		align-items:center;
	}
	.collection_wrap > div.right_area div div.swiper-slide-active {
		opacity:1;
		visibility:visible;
	}
	.collection_wrap > div.right_area div div div p {
		color:#ffd800;
		font-size:18px;
		font-weight:300;
		font-family:'Noto Sans KR',sans-serif;
		letter-spacing:2px;
	}
	.collection_wrap > div.right_area div div div span {
		color:#fff;
		font-size:18px;
		line-height:1.6;
		word-break: keep-all;
	}
	.collection_wrap > div.right_area div div div h3 {
		font-weight: bold;
		line-height: 60px;
		font-size:48px;
		padding: 15px 0;
		color:#2cb1d0;
	}
	.collection_wrap > div.right_area .right_title a {
		font-size:15px;
		color:#fff;
		border:solid 1px #fff;
		box-sizing:border-box;
		display:inline-block;
		margin-top:45px;
		padding:12px 30px;
	}
	.collection_wrap > div.right_area .right_title a:hover {
		color:#333;
		background:#fff;
	}
	.collection_wrap > div.right_area  .button_wrap {
		position:absolute;
		 left: 95px;bottom: 60px;
		width:100px;
		display:flex;
		justify-content:space-between;
		align-items:center;
		z-index:99;
		color:#fff;
	}
	.collection_wrap > div.right_area  .button_wrap .swiper-button-prev {
		position:static;
		width:53px;
		height:53px;
		background:url('/images/left_button.jpg') no-repeat;
		background-size:100%;
		margin:0;
	}
	.collection_wrap > div.right_area  .button_wrap .swiper-button-next {
		position:static;
		width:53px;
		height:53px;
		background:url('/images/right_button.jpg') no-repeat;
		background-size:100%;
		margin:0 0 0 -1px;
	}
	.collection_wrap > div.right_area .button_wrap >div:after {
		display:none;
	}
	.collection_wrap > div.right_area .button_wrap .swiper-pagination-fraction {
		bottom:-10px;
	}
	
	
/* Desktop */
@media (min-width: 992px) and (max-width: 1600px) {

	/* main_title */
	.main_title {font-size: 36px; color: #140a4a; font-weight: bold; padding-bottom: 10px;}

	/*network*/
	.network .con_text {padding: 80px 50px 30px 50px;}
	.network .con_text .list_txt li {font-size: 22px;margin-bottom: 10px;color: #333;line-height: 28px;}
	.network .con_text .list_txt li:before {top: 6px;}

	/*collection_wrap>div*/
	.collection_wrap>div.right_area {
		padding: 0 80px;
	}

}

@media (max-width: 1200px) {
	/*network*/
	.network .con_text.padd1 {padding: 30px 50px 30px 50px;}
	.network .con_text.padd2 {padding: 30px 35px 30px 35px;}

	/*collection_wrap*/

	.collection_wrap {
		display:block;
	}
	.collection_wrap>div.right_area {
		padding:0 50px;
	}
}

@media (max-width: 991px) {
	/*main_title*/
	.main_title {font-size: 22px;}

	/*network*/
	.network .con_text.padd1 {padding:30px 25px 10px 25px;}
	.network .con_text.padd2 {padding:30px 25px 10px 25px;}

	.network .con_text .list_txt li {font-size: 16px;}
	.network .con_text .list_txt li:before {top: 6px;}

	/*collection_wrap*/
	.collection_wrap>div.right_area {
		padding: 30px 30px 0px 30px !important;
	}
	.collection_wrap>div.right_area div div div p {
		font-size: 14px;
	}
	.collection_wrap>div.right_area div div div h3 {
		font-size:26px;
	}

	.collection_wrap>div.right_area div div div span {
		font-size: 14px;
	}

	.collection_wrap>div.right_area .right_title a {
		display: block;
		width: 50%;
		text-align: center;
	}
	.collection_wrap>div.right_area .button_wrap {
		bottom: -70px;
	}
}
