section {background-size: cover !important}

.fullpage{
	max-width:1920px;
}

.fullpage-bg{
	background-size:100%;
}

#fp-nav ul li a span, .fp-slidesNav ul li a span{
	color:#FFF;
	background:#FFF;
}

.main_2_content, .main_3_content, .main_4_content, .main_5_content{
	max-width:1620px;
	margin:0 auto;
}

.main_6_content{
	max-width:1620px;
	margin:0 auto;
}

.main_1_content{
	position:relative;
}

.main_1_controller{
	position:absolute;
	bottom:60px;
	left:100px;
}

.main_1_controller .lefttxt{font-size: 17px; color: #fff; margin-right: 15px; font-family: 'Play'; vertical-align: middle;}

.controller_img{
	cursor:pointer;

}

.main_1_title{
	color:white;
	text-align:center;
	font-size:28px;
	letter-spacing:10px;
}

.main_1_subtitle{
	color:white;
	text-align:left;
	font-size:55px;
	font-weight:800;
	line-height: 84px; 
}

.main_1_txt_wrap{
	width:100vw;
	height:100vh;
	position:relative;
}

.main_1_txt_wrap .video{
	position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    overflow: hidden;
    z-index: -1;
    width: 100%;
    padding-top: 58%;
    
}




.main_1_txt_wrap .video iframe{
	position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    border: 0 none;
}

.main_1_txt{
	position:absolute;
	top:50%;
	width:100%;
	transform:translateY(-50%);
	padding: 0 100px;
	opacity: 0;
	left: -100px;
}

.main_1_txt{animation-name: texleft; animation-duration: 1s;}

@keyframes texleft {
  from {
    left: -100px;
  }

  to {
    left: 0px;
  }
}

.main_1_content .slick-current .main_1_txt{opacity: 1; transition-duration: 1s; left: 0px;}

#main_1_slide_count{
	font-size:14px;
font-family: 'Play';
	color:white;
	letter-spacing:3px;
	display:inline-block;
	vertical-align:middle;
	margin: 0 15px;
}

#slide_pause{margin-left: 15px}

.main_2_title{
	font-size:35px;
	color:white;
	font-weight:800;
	text-align:center;
	line-height:1.5;
}

.main_2_subtitle{
	font-size:18px;
	color:white;
	text-align:center;
	margin-top:30px;
}

.main_2_item_total_wrap{
	margin:0 auto;
	max-width:1300px;
	margin-top:80px;
	padding: 0 15px;
}

.main_2_item_wrap{
	float:left;
	max-width:260px;
	width:20%;
	height:260px;
	border:1px solid rgba(255,255,255,0.25);
	position:relative;
	background:rgba(0,0,0,0.25);
	cursor:pointer;
}

.main_2_item_over{
	width:300px;
	height:300px;
	position:absolute;
	top:-20px;
	left:-20px;
	background:#0066b3;
	z-index:200;
	opacity:0;
	box-shadow:0px 25px 22px rgba(0,0,0,0.27);
	-webkit-transition:all 0.5s;
    transition:all 0.5s;
}



.main_2_item{
	z-index:1000;
	padding-top:50px;
	position:relative;
}

.main_2_item img{
	display:block;
	margin:0 auto;
}

.main_2_item_title{
	color:white;
	font-size:16px;
	text-align:center;
}

.main_3_title{
	font-size:45px;
	font-weight:800;
	color:white;
}

.main_3_title_dot{
	color:#7dccbf;
}

.main_3_subtitle{
	font-size:18px;
	color:white;
	margin-top:40px;
}

.main_3_latest{
	margin-top:60px;
}

.main_4_wrap{
	width:880px;
	padding:50px 60px;
	background:white;	
}

.main_4_title{
	font-size:45px;
	color:black;
	font-weight:800;
}

.main_4_title_dot{
	color:#fdb813;
}

.main_input{
	display:inline-block;
	border:1px solid #f7f7f7;
	border-bottom:1px solid #555555;
	height:50px;
	font-size:15px;
	text-indent:10px;
}

.main_input_readonly{
	display:inline-block;
	border:1px solid #f7f7f7;
	height:50px;
	font-size:15px;
	text-indent:10px;
	color:#777777;
}

.main_input_checkbox{
	text-align:right;
	color:#999999;
}

.main_input_submit{
	width:190px;
	height:50px;
	background:#444444;
	color:white;
	font-size:15px;
	border:none;
	outline:none;
}

.main_5_item_wrap{
	max-width:1200px;
	margin:0 auto;
	margin-top:-100px;
	z-index:1000;
}

.main_5_item{
	float:left;
	width:300px;
	height:190px;
	position:relative;
	padding:50px 30px;
	z-index:1000;
}

.main_5_item_title{

	font-size:18px;
	color:white;
	font-weight:600;
}

.main_5_item_subtitle{
	font-size:16px;
	color:white;
	margin-top: 15px;
    letter-spacing: -0.5px;
}

.main_5_item img{
	position:absolute;
	bottom:20px;
	right:30px;
}

.main_footer{
	width:100%;
	padding-top:30px;
	display: flex; 
	padding: 60px 100px
}

.main-footer-left{
	position: relative;
	width: 15%
}

.main-footer-right{
	position: relative;
	width: 85%
}

.main-footer-title{
	font-size:16px;
	color:#aaa;
	line-height: 28px;
}

.main-footer-title span{margin-left: 10px}

.main-footer-title-separator{
	color:#9ba2b0;
	font-size:12px;
	vertical-align:middle;
}

.main-footer-subtitle{
       
	font-size:13px;
	color:#aaa;
	position: absolute; right: 0px;
	bottom: 0px;
}





.scroll{    
	position: fixed;
    z-index: 1000;
    right: 50px;
    bottom: 80px;
    animation-name: slidein;
    animation-iteration-count: infinite; animation-duration: 1s;}
    
@keyframes slidein {
  from {
    bottom: 80px; opacity: 1
  }

  to {
    bottom: 50px; opacity: 0.5
  }
}
    
    
.root_daum_roughmap .wrap_map{height: 450px !important;}    
    
    
 .main_product .slick-dots  {display: none !important}
    
 .main_product .slick-list{padding: 0}  
 .product_slide{display: flex;}  
 .product_slide .product_bg{width: 50%; overflow: hidden; position: relative; height: 100vh; background: #000}
 .product_slide .product_bg img{position: absolute; left: 0; top: 0; transition-duration: 1s; width: 100%; height:100%;opacity: 1}
 .product_slide .product_bg img:hover{transform: scale(1.2); transition-duration: 1s; opacity: 0.8}  
   
 .product_slide .product_txt{background:#efefef; width: 50%; padding: 100px; position: relative}
 .product_slide .product_txt h3{font-family:'Play'; color: #222; font-size: 22px; font-weight: bold; line-height: 35px; margin-bottom: 20px;}
 .product_slide .product_txt h1{font-family:'Play'; color: #222; font-size: 60px; font-weight: bold; line-height: 70px; margin-bottom: 0px;}
 .product_slide .product_txt h2{color: #222; font-size: 40px; font-weight: bold; line-height: 60px; margin-bottom: 25px;}  
 .product_slide .product_txt p{color: #777; font-size: 18px; font-weight: bold; line-height: 31px; margin-bottom: 65px; font-weight: 400} 
  .product_slide .product_txt p b{font-weight: 500}  
 .product_slide .product_txt .moreview {font-family:'Play'; color: #777; font-weight: 400; padding: 5px 20px; border: 1px solid #777; display: inline-block; font-size: 14px; line-height: 20px; text-transform: uppercase}
   

   
 .product_slide .product_txt .product_item{position: absolute; bottom: 0; left: 58px}
 .product_slide .product_txt .product_number {font-size: 30px; line-height: 45px; color: #d5d5d5; font-family:'Play'; position: absolute; right: 50px; bottom: 65px}
 .product_slide .product_txt .product_number b{display: inline-block; font-size: 110px; line-height: 110px;}
 
 
 .poduct_video{text-align: center}
  .poduct_video h2{font-family:'Play'; font-size: 40px; line-height: 70px; margin-bottom: 50px}
 .poduct_video .video {
  width: 100%;
  max-width: 1230px;
  margin: 0px auto;
}
 
.poduct_video .video-container {
  position: relative;
  width: 100%;
  height: auto;
  padding-top: 50%;
}
 
.poduct_video iframe {
  z-index: 1;
  top: 0;
  left: 0;
  position: absolute;
  width: 100%;
  height: 100%;
}
 
 
.main_business{position: relative}
.main_business .main_business_bg{ height: 100vh; overflow: hidden; background: #000; position: absolute; left: 0; top: 0; z-index: -1;
    width: 100%;}
.main_business .main_business_bg img{position: absolute; left: 50%; top: 0;  opacity: 0.8; width: 100%; height:100%; transform: translateX(-50%);} 
 
.fp-completely .main_business_bg img{position: absolute;  width: 100%; height:100%; opacity: 1; } 
 
 
 
 
.fp-completely .main_business_bg img{animation-name: bubg; animation-duration: 3s;}

@keyframes bubg {
  from {
    width:120%;
    height:120%;
    opacity: 0.5; 
  }

  to {
  	width:150%;
  	height:150%;
    opacity: 1; 
  }
}

 
.main_business ul{display: flex; height: 100vh;align-items: flex-end;} 
.main_business ul li{width: 25%; border-left:1px solid rgba(255,255,255,0.2); padding: 50px 0; height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;} 
.main_business ul li:first-child{border-left: 0;  } 
 
 
 
.main_business ul li .main_business_title{position: absolute; left: -50%; top: 150px; } 

.fp-completely ul li .main_business_title{left: 100px; transition-duration: 1s}

.main_business ul li .main_business_title h3{font-family:'Play'; font-size: 22px; line-height: 35px; font-weight: bold; margin-bottom: 25px; color: #fff}
.main_business ul li .main_business_title h1{font-family:'Play'; color: #fff; font-size:60px; line-height: 70px; font-weight: bold; margin-bottom: 30px;}
.main_business ul li .main_business_title p{color: #fff; font-weight: 300; font-size: 18px; line-height: 31px;} 
 
.main_business ul li .iconbox{padding: 50px 25px; height: 41vh }
.main_business ul li .iconbox h2{font-family:'Play'; color: #fff; font-size:35px; line-height: 35px; font-weight: bold; margin-bottom: 15px; margin-top: 15px;}
.main_business ul li .iconbox h2 span{font-size: 41px; font-family:'Noto Sans KR'}
.main_business ul li .iconbox h3{color: #fff; font-size:22px; line-height: 30px; font-weight: bold; margin-bottom: 10px; font-weight: 500}
.main_business ul li .iconbox p{ color: #fff; font-size:16px; line-height: 22px; font-weight: 400; }




.main_last{width: 100%; padding: 0; display: flex; height: 100vh}
.main_last .last_left{width: 50%;}
.main_last .last_left .service{background-size: cover !important; background-position: right bottom !important; padding: 110px 100px 70px; height: 50vh}
.main_last .last_left .service h3{font-family:'Play'; color: #fff; font-size: 22px; line-height: 35px; margin-bottom: 15px;}
.main_last .last_left .service h1{color: #fff; font-size: 40px; line-height: 50px; font-weight: bold;  margin-bottom: 20px;}
.main_last .last_left .service p{color: #fff; font-size: 18px; line-height: 31px; font-weight: 300;  margin-bottom: 30px;}
.main_last .last_left .service .gogo{color: #fff; font-size: 16px; line-height: 22px; padding: 12px 30px; border: 1px solid #fff; display: inline-block}
.main_last .last_left .service .gogo span{margin-left: 13px;}
.main_last .last_left .service .gogo:hover{background: #227198; transition-duration: 0.5s}
.main_last .last_left .service .gogo:hover span{margin-left: 23px; transition-duration: 0.5s}

.main_last .last_left .twobox{display: flex; height: 50vh}
.main_last .last_left .twobox .leftbox{width: 50%; position: relative; background: #000; overflow: hidden}
.main_last .last_left .twobox .leftbox img{left: 50%; top: 0;  opacity: 1; width: 100%; height:100%; transform: translateX(-50%); position: absolute}
.main_last .last_left .twobox .rightbox{width: 50%; padding: 60px;display: flex;
    flex-direction: column;
    justify-content: center; } 



.fp-completely .leftbox img{animation-name: leftbox; animation-duration: 3s;}

@keyframes leftbox {
  from {
    width: 150%;
    height:150%;
    opacity: 0.5; 
  }

  to {
    width: 120%;
    height:120%;
    opacity: 1; 
  }
}



.main_last .last_left .twobox .rightbox a{padding: 13px 0; position: relative; font-size: 18px; color: #777;display: block ; width: 100%; border-bottom: 1px solid #d9d9d9}
.main_last .last_left .twobox .rightbox a span{position: absolute; right: 0; top: 12px}




.main_last .last_right{width: 50%; position: relative; background: #000; overflow: hidden}
.main_last .last_right img{left: 50%; top: 0;  opacity: 1;width: 100%; height:100%;transform: translateX(-50%); position: absolute; }
.fp-completely .last_right img{animation-name: rightbox; animation-duration: 3s;}

@keyframes rightbox {
  from {
    width: 150%;
    height:150%;
    opacity: 0.5; 
  }

  to {
    width: 120%;
    height:120%;
    opacity: 1; 
  }
}


    @media screen and (max-width: 1500px) { 
 	#header>ul{width: 70%; margin: 0}
 	.header-right{padding: 35px 0 0 0; width: 30%; }
 	.main_2_item_wrap{width: 20%}
 	.notice li{width: 33% !important;}
 	.main_3_content, .main_4_content, .main_5_content{padding: 0 8%}
 	.main_5_item{width: 25%}
 	
 	.main_6_content{padding: 0 3%;}
 	.moblock1{width: 10%}
 	.moblock2{width: 80%}
 	.root_daum_roughmap .wrap_map{height: 300px !important;} 
 	
 	#fp-nav ul li {
    margin-top: 20px;
    margin-bottom: 20px;}
 	 #header>ul>li{width: 180px}
 	 #header>ul>li>a{font-size: 18px;}
 	 
 	 .company .img{width: 50%}
 	 .footinner{padding: 0 15px}
 	}   
    
    
    .w360{width: 360px;}
    .w130{width: 130px;}
    .w214{width: 214px}
    .m30{margin-left: 30px}
    .main_1_txt_wrap{background-size: cover !important; display: block !important}
    
   @media only screen and (max-width: 1024px) {
	
	.header-right{width: 5%}
	
	}     
    
     @media screen and (max-width: 1300px) { 
     	#header>ul{display: flex}
     	}   
    
  @media screen and (max-width: 800px){
  	
  	.main_input_readonly{width: 100% !important}
  	
  	html,body{overflow-y: scroll !important;
    overflow-x: hidden !important;}
  	.fp-tableCell{display: block}
  	#fp-nav.fp-left{display: none}
  	.header-right{padding: 40px 30px 0 0; width: auto; }
  	.main_1_controller{display: none}
  	.main_2_item_total_wrap{width: 100%}
  	.main_4_wrap{width: 100%}
  	.scroll{display: none}

  	
  	#hd, #wrapper, #ft{min-width:100%}
  	
  	.main_1_txt_wrap{height: 40vh; }
  	.fp-tableCell, .fp-section.fp-table, .fp-slide.fp-table{height: auto !important}
  	
  	.main_1_title{font-size: 16px;}
  	.main_1_subtitle{font-size: 18px; line-height: 25px}
  	
  	.main_2_content, .main_3_content, .main_4_content, .main_5_content{padding: 100px 20px}
  	.main_1_txt_wrap{background-size: cover !important; display: block !important}
  	
  	.main_2_item_wrap{float: none; width: 100%; max-width: 100%}
  	.main_2_item_over{width: 100%; max-width: 100% ; top: 0px;
    left: 0px; height: 260px}
  	.section{background-size: cover !important}
  	
  	.main_2_title{font-size: 20px}
  	.notice li{width: 50% !important}
  	
  	.main_footer{position: relative; height: auto; padding:20px 15px}
  	.main-footer-left{float: none;}
  	.marginleft100{margin-left: 0; margin-top: 10px}
  	.main_5_item{float: none; width: 100%}
  	
  	.w360{width: 100%;}
    .w130{width: 100%;}
    .w214{width: 100%;}
    .m30{margin-left: 0px}
    .main_input{margin: 5px 0}
    
    .notice li p.dt{display: none !important}
    
        .notice li{width: 100% !important; height: auto !important}
   	.notice li p.tit{font-size: 20px !important;}
   	.notice li p.cont{margin-top: 20px !important;}

  }   
    
    
    
   @media screen and (max-width: 500px){
   	
   	.main_1_title{font-size: 16px; letter-spacing: 3px}
   	.main_1_subtitle{font-size: 20px;}
   	.fp-tableCell{display: table-cell;}
   	
   	.main_1_txt_wrap .video {
    position: absolute;
    top: 0%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, 0%);
    overflow: hidden;
    z-index: -1;
    width: 100%;
    padding-top: 56%;
    height: 60vh;
    }
    
    .main_1_txt_wrap{height: 60vh}
    

   	
   	.main_3_title{font-size: 30px;}
   	.main_3_subtitle{font-size: 16px; margin-top: 20px;}
   	
   	.main_4_title{font-size: 30px;}
   	
   	.main_4_wrap{padding: 50px 20px;}
   	.main-footer-title{font-size: 14px;}
   	.main-footer-subtitle{margin-top: 15px;}
   	
   	.main_1_txt{padding: 0 15px}
   }   
    
    
    
    
    
    
