@charset "utf-8";
/* CSS Document */

/* 메인섹션  */

#section1{position:relative; width:100%; height:980px; min-height:650px; overflow:hidden}
#section2{position:relative; width:100%; background:#fff; display:block; padding:150px 0 0 0}
#section3{position:relative; width:100%; display:block; padding:250px 0 150px 0; background:#0060bf}
#section4{position:relative; width:100%; background:#eff6f9; padding:150px 0 150px 0; }
#section5{position:relative; width:100%; height:100%; display:table; background:#fff; padding:150px 0 100px 0; }
.section_height{height:75px; position:absolute; z-index:1; bottom:0}

.sec_btn{position:absolute; top:100px; left:0; height:1px}

.main_inner{position:relative; width:1600px; margin:0 auto}
.main_inner h2{display:block; text-align:center; font-size:40px; font-weight:500;}

/*우측네비동그라미*/
.right_nav{position:fixed; top:40%; right:0; width:50px; height:80px; z-index:19}
.right_nav ul{position:absolute; height:30%; width:50px; right:0px; top:40%;}
.right_nav li{position:relative; display:block; cursor:pointer; width:7px; height:7px; border-radius:10px; background:#fff; margin:20px 0; transition:all .3s }
.right_nav li span{position:absolute; top:-13px; left:-13px; display:block; cursor:pointer; width:33px; height:33px;  border-radius:33px;  text-indent:-9999px; border:1px solid rgba(255, 255, 255, 0);}
.right_nav li:nth-child(1){background:#ff8200;}
.right_nav li:nth-child(1) span{border:1px solid rgba(204, 204, 204, 0.8)}


/* 메인동영상 */
.video{display:block; width:100%;overflow:hidden}
.video vidio{width:100%;}

/* 헤드카피 */
.copy_btn{position:absolute; top:300px; left:200px;}
.headcopy{color:#fff;}
.headcopy li{font-family:'GmarketSans'}
.headcopy li:nth-child(1){font-size:36px; font-weight:400;}
.headcopy li:nth-child(1) strong{font-weight:500;}
.headcopy li:nth-child(2){font-size:70px; font-weight:600; margin:20px 0 35px 0; letter-spacing:-1px}
.headcopy li:nth-child(3){font-size:130px; font-weight:500; letter-spacing:1px}

/* 다운로드 버튼 */
.download{display:flex; margin-top:50px}
.download li{width:300px; height:60px; border:2px solid #fff; background:rgba(0,0,0, 0.2)}
.download li a{width:100%; height:100%; display:block; color:#fff; font-size:20px; padding:0 50px 0 25px; line-height:58px; background:url("../img/common/icon_down.png") right 20px center  no-repeat; font-weight:400; box-sizing:bordder-box}
.download li:last-child{border-left:none}
.download li:hover{cursor:pointer;  background:rgba(255,255,255, 0.1)}



/* 스크롤 */
.icon_scroll{position:absolute; width:100%; height:52px;left:0; bottom:70px; background:url(../img/common/icon_scroll.png) center no-repeat; text-indent:-9999px; cursor:pointer}


/*사업분야*/

#section2 h2{color:#000}

.business{width:100%; display:flex; margin:100px auto}
.business ul{position:relative; display:block; align-content:center; text-align:center; width:33.3%; padding:0 20px; box-sizing:border-box}
.business ul:nth-child(2){border-left:1px solid #ddd; border-right:1px solid #ddd}

.business li{text-align:center; color:#666; font-family:'Noto Sans';}
.business li:nth-child(1){display:inline-block; width:80px; height:80px}
.business li:nth-child(2){color:#000; font-size:26px; font-weight:500; margin:20px auto 30px auto}
.business li:nth-child(3){font-weight:400px; line-height:26px; letter-space:-1px; margin-bottom:35px}
.business li:nth-child(4){background:url("../img/common/icon_go_01.png") right center no-repeat; padding:0 15px; display:inline-block}
.business li:nth-child(5){position:absolute; top:0; left:0; display:block; width:100%; height:100%}
.business li:nth-child(5) a{display:block; width:100%; height:100%; text-indent:-9999px}


/*고객문의 */
.customer{position:relative; width:100%; height:150px; margin:0 auto; z-index:9}
.customer ul{positon:absolute; top:0; left:0; width:100%; height:300px; text-align:center; border-radius:20px; background:url(../img/main/help_bg.png) center no-repeat; padding:30px; box-sizing:border-box}

.customer li{color:#fff}
.customer li:nth-child(1){font-size:36px; font-weight:500; padding:110px 0 40px 0}
.customer li:nth-child(2) a{background:url("../img/common/icon_go_02.png") 90% center no-repeat rgba(0, 0, 0, 0.2); padding:11px 70px 11px 20px; display:inline-block; border:1px solid rgba(255, 255, 255, 0.5); color:#fff; transition:all .3s}
.customer li:nth-child(2) a:hover{background:url("../img/common/icon_go_02.png") 95% center no-repeat rgba(0, 0, 0, 0.5); border:1px solid #fff; }


/* 사업실적 */

#section3 h2{color:#fff}

.showing{width:100%; display:flex; margin-top:90px }
.showing ul{width:20%; text-align:center; color:#fff; border-right:1px solid rgba(255,255,255,0.1)}
/*.showing ul:nth-child(5){flex-basis:25%; align-items:flex-end}*/

.showing li:nth-child(1){font-size:70px; font-family:'GmarketSans'; font-weight:500; padding:20px 0 20px 0}
.showing li:nth-child(1) span{font-size:36px; font-family:'GmarketSans';padding-left:5px; font-weight:400}
.showing li:nth-child(2){font-size:20px; font-weight:400}

.showing ul:last-child{border-right:none}
.showing ul:last-child li:nth-child(1){font-size:100px; padding:0  0 10px 0}


/* 아카넷소식 */
#section4 h2{color:#000}
.news{display: flex; flex-wrap: wrap; justify-content: center; margin-top:60px}
.news ul{position: relative; background: #fff; border-bottom: 1px solid #e0e7ea; padding-bottom: 15px; margin: 20px 2%; width:20%}
.news li:nth-child(1){display:block; width:100%; overflow:hidden;transition:all 0.3s }
.news li:nth-child(1) img{width:100%}
.news li:nth-child(2){font-size:18px; line-height:22px; color:#000; margin:35px 8% 20px 8%; font-weight:500}
.news li:nth-child(3){margin:20px 8%}
.news dl{position:relative; display:block; width:100%; font-size:14px; margin-bottom:5px; padding-left:70px }
.news dt{position:absolute; display:block; top:0; left:0; width:60px; height:22px; line-height:22px; background:#000; color:#fff;   text-align: center}
.news dd{line-height:22px}

.news ul:hover .news li:nth-child(1) img{width:120%}

/* 주요고객  */
#section5 h2{color:#000}
.banner{width: 100%; text-align:center; margin-top:60px}
.banner li{display:inline-block; width:15%; margin:15px 0.7% 15px 0.7%;  padding: 5px 0; background:#fff}
.banner li img{width:70%}    

 


@media (max-width:1640px) {
 .main_inner{width:90%;}  
}

/*길유빈 추가작업*/
@media (min-width:801px) and (max-width:1400px) {
 #section4{padding: 150px 0 100px 0;}
 .news {justify-content:flex-start;}
 .news ul{width: 30%; margin: 20px 1%;}
}

@media (max-width:1300px) {
#section1{height:100%} 
#section2{padding:70px 0 0 0} 
#section3{padding:250px 0 120px 0}
#section4{height:auto; padding:70px 0 10px 0}
#section5{height:auto; padding:70px 0 70px 0}    
    
.main_inner h2{font-size:32px} 
.copy_btn{top:250px; left:100px}
.right_nav{display:none}
  
.business li br{display:none}
.business li{word-break:keep-all}   
 

.banner li{width:18%} 
    
}

@media (max-width:1150px) {
.showing{margin-top:70px }
.showing li:nth-child(1){font-size:50px;}
.showing li:nth-child(1) span{font-size:25px}
.showing li:nth-child(2){font-size:16px; font-weight:400}
.showing ul:last-child{border-right:none}

.news ul{width:30%}

}
    

@media (max-width:1100px) {
#section1{min-height:600px}     
    
/* 메인이미지*/    
.video video{display:none}  
.video {background:url("../img/main/main_visual.png") no-repeat bottom right / cover; height:100vh}
    
/* 헤드카피 */
.copy_btn{top:200px; left:50px}
.headcopy li:nth-child(1){font-size:30px; line-height:40px}
.headcopy li:nth-child(2){font-size:50px; line-height:50px; margin:20px 0 25px 0; }
.headcopy li:nth-child(3){font-size:100px;} 
    
/*고객문의 */
.customer li:nth-child(1){font-size:32px; line-height:40px; padding:50px 0 40px 0; font-weight:400} 
.banner li{width:23%} 

}



@media (max-width:870px) {
.showing{width:100%; display:block; margin-top:90px }
.showing ul{display:inline-block; width:24%}
.showing ul:nth-child(4){border-right:none}
.showing ul:last-child{width:100%; margin-top:50px}
    
.news{margin-top:50px}
.news li:nth-child(2){font-size:16px; line-height:22px;margin:25px 0 25px 0; padding:0 15px}
    
}

@media (max-width:800px) {
	
.business{display:block; margin: 50px auto}
.business ul{display:block; align-content:center; text-align:left; width:100%; padding:0 0 30px 120px; box-sizing:border-box}
.business ul:nth-child(2){border-left:none; border-right:none; border-top:1px solid #ddd; border-bottom:1px solid #ddd}

.business li{text-align:left; color:#666; }
.business li:nth-child(1){position:absolute; top:10px; left:0}
.business li:nth-child(2){font-size:22px; margin:20px auto 10px auto}
.business li:nth-child(3){line-height:20px; margin-bottom:10px}
.business li:nth-child(4){padding:0 15px 0 0; display:inline-block}
.business li:nth-child(5){position:absolute; top:0; left:0; display:block; width:100%; height:100%}  
    
.banner li{width:31%} 
	
.news {display:block} 
.news ul{position:relative; width:100%; display:block; margin:0 auto 20px auto; padding:10px 10px 10px 200px}
.news li:nth-child(1){position:absolute; top:0; left:0; display:block; width:180px; height:100%; overflow:hidden; transition:all 0.3s }
.news li:nth-child(1) img{width:auto; height:100%; max-width:none}
.news li:nth-child(2){font-size:16px; margin:0; padding:0 0 5px 0; text-align:left; box-sizing:border-box}
.news li:nth-child(3){margin:0}
    
}

@media (max-height:700px) {
.icon_scroll{display:none}
}
    
@media (max-width:640px) {
#section3{padding:200px 0 80px 0}
    
.customer ul{height:auto; padding:60px 30px 40px 30px; background-size:cover}
.customer li:nth-child(1){font-size:32px; font-weight:400; padding:0 0 30px 0}   
    
.showing{position:relative; margin-top:60px; padding-right:calc(100% - 200px); box-sizing:border-box }   
.showing ul{position:relative; display:block; width:100%; text-align:right; border-right:none; border-bottom:1px solid rgba(255,255,255,0.1); /*padding-left:110px;*/ box-sizing:border-box; margin:20px 0} 
.showing li:nth-child(1){padding:20px 0}
.showing li:nth-child(2){position:absolute; top:20px; left:0}
 
.showing ul:nth-child(4){border-bottom:none}
.showing ul:last-child{position:absolute; top:0; right:0; border-bottom:none; padding:0; width:160px; line-height:30px}
.showing ul:last-child li:nth-child(2){position:static; text-align:center}
	
.copy_btn{top:100px; left:0; width:100%; padding:50px}	
	
.download{display:block}
.download li{border:1px solid #fff; margin-bottom:10px; background:rgba(0,0,0, 0.5)}
.download li:last-child{border-left:1px solid #fff}    
}

@media (max-width:560px) {
.banner li{width:45%; margin:7px 1.5% } 	
.icon_scroll{bottom:40px}
}


@media (max-width:450px) {
#section1{min-height:500px}   
    
.headcopy li:nth-child(1){font-size:25px; line-height:35px}
.headcopy li:nth-child(2){font-size:35px; line-height:45px; margin:10px 0 25px 0; }
.headcopy li:nth-child(3){font-size:95px;}  	

.download li{width:100%; height:45px; background:rgba(0,0,0, 0.6); margin-bottom:5px}
.download li a{font-size:16px; padding:0 50px 0 25px; line-height:44px}
.download li:hover{background:rgba(255,255,255, 0.1)}
    
.customer li:nth-child(1){font-size:25px; line-height:35px}    
    
.showing{padding-right:0;}   
.showing ul{width:280px; margin:20px auto} 
.showing li:nth-child(1){padding:20px 0}
.showing li:nth-child(2){position:absolute; top:20px; left:0}
 
.showing ul:nth-child(4){border-bottom:1px solid rgba(255,255,255,0.1)}
.showing ul:last-child{position:relative; display:block; width:300px; padding-left:110px; margin:20px auto; line-height:1.2; box-sizing:border-box}
.showing  ul:last-child li:nth-child(2){position:absolute; top:20px; left:0}
    
.news ul{padding:20px}
.news li:nth-child(1){display:none}   
.news li:nth-child(2){font-size:20px; padding:0 0 15px 0; color:#0060bf}
}

@media (max-width:380px) {
.showing ul:last-child{width:100%} 	
.headcopy li:nth-child(3){font-size:80px;}	
}