@charset "UTF-8";
.cd-vertical-nav a:before {background-color: #ff8a00;}
.cd-vertical-nav a.active:before{border:2px solid #ff8a00;}
.ctit {background:#fff}

#section1{position:relative;width:100%;margin:0 auto;text-align:center;overflow:hidden;height:auto;margin-top:80px}
#section1 .content-wrapper{position:relative;width:100%;margin:0 auto;text-align:center;height:100%;vertical-align:top;}

.video {
  display: block;
  overflow: hidden;
  position: relative;
  height: 100%;
  width: 100%;
  overflow-x: hidden;
}

.my-video {
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 0;
  will-change: transform
}

#section2{position:relative;width:100%;margin:-5px auto 0;text-align:center;overflow:hidden;background:#fff;height:auto}
#section2 .content-wrapper{position:relative;}
#section2 .content-wrapper ul{overflow:hidden;}
#section2 .content-wrapper li{position:relative;overflow:hidden;float:left;width:50%; box-sizing:border-box;text-align:center;}
#section2 .content-wrapper li strong{position:absolute;top:50%;left:50%;width:217px;z-index:9;margin-top:-50px;margin-left:-108px;font-size:48px;text-align:center;color:#fff;line-height:120%;}
#section2 .content-wrapper li p{position:absolute;bottom:37%;left:50%;width:320px;z-index:9;margin-left:-160px;font-size:15px;text-align:center;color:#fff;line-height:130%;font-weight:300; letter-spacing:0.5px}
#section2 .content-wrapper li:nth-child(2) p{width:280px;margin-left:-140px;}
#section2 .content-wrapper li span img{transition:transform 2.2s; width:100%;}
#section2 .content-wrapper li:hover span img{transform:scale(1.1,1.1);}

#section2 .content-wrapper .object-box{position:absolute;width:380px;height:50px;margin-left:-160px;text-align:center;bottom:20%;left:50%;z-index:9;border:1px solid #fff;box-sizing:border-box;line-height:48px;color:#fff;font-size:18px;font-weight:400}

#section3{position:relative;width:100%;margin:0 auto;background:#fff;height:auto}
#section3 .content-wrapper{position:relative;display:block;left:0;width:90%;margin:0 auto;vertical-align:top;}
#section3 .content-wrapper .free-wall{display:block;margin:0 auto;width:100%;overflow:hidden;box-sizing:border-box;border-left:1px solid #dbdbdb;}
#section3 .content-wrapper .free-wall li {border-right:1px solid #dbdbdb;border-bottom:1px solid #dbdbdb;box-sizing:border-box;float:left;width:16.6%;display:table-cell;}
#section3 .content-wrapper .free-wall li a {width:16.6%;height:224px;text-align:center;display:table-cell;vertical-align:middle;cursor:auto}
#section3 .content-wrapper .free-wall li a:hover {transform: translate(0, -5px);transition:transform 0.5s;}

#section4{position:relative;width:100%;margin:0 auto;text-align:center;height:auto}
#section4 .content-wrapper{position:relative;display:block;left:0;width:100%;margin:0 auto;text-align:center;vertical-align:top;}
#section4 .content-wrapper .conbox{position:absolute;left:5%;top:0;width:30%;height:730px;background:#2d3340;box-sizing:border-box;padding:4% 3%;text-align:left}
#section4 .content-wrapper .conbox .coninfo {position:absolute;left:10%;bottom:70px;}
#section4 .content-wrapper .conbox .coninfo span{font-size:11px;display:block;text-align:left;color:#fff;font-weight:400;margin-bottom:28px;}
#section4 .content-wrapper .conbox .coninfo strong{position:relative;display:block;text-align:left;color:#fff;font-size:14px;}
#section4 .content-wrapper .conbox .coninfo strong:before{position:absolute;content:"";display:block;top:-16px;left:0;width:27px;height:4px;background:#ff8a00;}

#section4 .content-wrapper .conbox .tit {margin-bottom:35px}
#section4 .content-wrapper .conbox .tabs{}
#section4 .content-wrapper .conbox .tabs li{color:#fff;display:inline-block;cursor: pointer;margin-bottom:25px;line-height:150%;}
#section4 .content-wrapper .conbox .tabs li strong{position:relative;width:217px;font-size:16px;font-weight:300;background:#575c66;padding:7px 20px 10px;display:block;margin-bottom:20px}
#section4 .content-wrapper .conbox .tabs li strong:after{position:absolute;content:"";display:block;top:12px;right:17px;width:10px;height:13px;background:url(../img/map.png) no-repeat 0 0;z-index:9}
#section4 .content-wrapper .conbox .tabs li p{font-size:14px;}
#section4 .content-wrapper .conbox .tabs li span{font-size:14px;margin-right:20px}
#section4 .content-wrapper .conbox .tabs li.current strong{background:#ff8a00;}

#section4 .content-wrapper .map{display:block;width:100%;border-top:1px solid #fff;overflow:hidden;padding:0;margin:0;background:#fff;display:none;} 
#section4 .content-wrapper .map.current{display:inherit;}



/* 반응형 */
@media screen and (max-width: 1600px) {
	#section3 .content-wrapper .free-wall li {width:25%;}
	#section3 .content-wrapper .free-wall li a {width:25%;height:224px;}
}

@media screen and (max-width: 1100px) {
	
	#section2 .content-wrapper li strong{position:absolute;top:40%;z-index:10;margin-top:-30px;font-size:48px;text-align:center;color:#fff;line-height:120%;}
	#section2 .content-wrapper li strong img{height:24px}
	
	#section2 .content-wrapper .object-box{font-size:15px;height:38px;line-height:33px;bottom:15%;width:340px;;margin-left:-170px;}

}

@media screen and (max-width: 1024px) {
	
	#section3 .content-wrapper .free-wall li {width:33.3%;}
	#section3 .content-wrapper .free-wall li a {width:33.3%;height:224px;}
	
	#section4 .content-wrapper .conbox{left:0;top:0;width:100%;height:auto;padding:30px 5%;text-align:center}
	#section4 .content-wrapper .conbox .coninfo {display:none;}
	
	#section4 .content-wrapper .conbox .tit {margin-bottom:35px}
	#section4 .content-wrapper .conbox .tabs{overflow:hidden}
	#section4 .content-wrapper .conbox .tabs li{float:left;width:49%;margin-left:2%;cursor: pointer;margin-bottom:0;}
	#section4 .content-wrapper .conbox .tabs li:first-child {margin-left:0;}
	#section4 .content-wrapper .conbox .tabs li strong{width:100%;}
	#section4 .content-wrapper .conbox .tabs li p{text-align:left}
	#section4 .content-wrapper .conbox .tabs li span{float:left;text-align:left}
		
}

@media screen and (max-width: 999px) {
	#section2 .content-wrapper li strong{top:32%;}
	#section3 .content-wrapper .free-wall li {width:50%;}
	#section3 .content-wrapper .free-wall li a {width:10%;height:180px;}
}


@media screen and (max-width: 640px) {
	#section1{display:none}
	#section2 {margin-top:80px}
	#section2 .content-wrapper li{width:100%;}
	#section2 .content-wrapper li strong{margin-top:-30px;font-size:48px;text-align:center;color:#fff;line-height:120%;font-weight:500}
	#section2 .content-wrapper li strong img{height:20px}
	#section2 .content-wrapper li p{font-size:14px;bottom:35%;}
	#section2 .content-wrapper li span img{transition:transform 2.2s; width:100%;}
	#section2 .content-wrapper li:hover span img{transform:scale(1.1,1.1);}


	#section2 .content-wrapper .object-box{width:160px;height:60px;margin-left:-80px;margin-bottom:-30px;bottom:50%;line-height:150%;padding-top:20px;letter-spacing:0.5px;}
	#section2 .content-wrapper .object-box span {display:block}
	
	#section4 .content-wrapper .conbox{padding:20px 5% 25px;}
	#section4 .content-wrapper .conbox .tit{margin-bottom:20px}
	#section4 .content-wrapper .conbox .tit img{width:130px;}
	#section4 .content-wrapper .conbox .tabs{overflow:hidden}
	#section4 .content-wrapper .conbox .tabs li{width:100%;margin-left:0%;margin-bottom:20px;letter-spacing:-0.5px;}
	#section4 .content-wrapper .conbox .tabs li:last-child {margin-bottom:0;}
	#section4 .content-wrapper .conbox .tabs li strong{padding:6px 20px 8px;margin-bottom:12px;font-weight:400;font-size:15px}
	#section4 .content-wrapper .conbox .tabs li strong:after{top:10px;}
	#section4 .content-wrapper .conbox .tabs li p{text-align:center;font-size:12px;line-height:120%;}
	#section4 .content-wrapper .conbox .tabs li span{float:none;text-align:center;margin-right:10px;font-size:12px;line-height:120%;}

}

@media screen and (max-width: 480px) {
	#section3 .content-wrapper .free-wall li a {height:110px;}
	#section3 .content-wrapper .free-wall li a img{max-width:115px;max-height:38px;}
	/*
	#section3 .content-wrapper .free-wall li {width:100%;}
	#section3 .content-wrapper .free-wall li a {height:100px;}
	#section3 .content-wrapper .free-wall li a img{max-width:160px;max-height:40px;}*/
	
}