@charset "utf-8";

#footerGroup {margin-top:120px;}

.sub_visual {margin:0 2%; position:relative; transition: all 0.5s; padding:120px; height:300px; background:#000; border-radius:30px;  overflow:hidden; z-index:0; transition: all 0.5s;}
.sub_visual.on {height:100px; margin:0px; border-radius:0px;}
.sub_visual #video_wrap {position:absolute; left:0px; top:-200px;  z-index:0; width:100%;}
.sub_visual #video_wrap video {width:100%;  height: 100%; position:relative; z-index:0; ;}

.sub_visual #sub_visual_guide { position:absolute; left:100px; bottom:100px; z-index:2;}
.sub_visual #sub_visual_guide h2 {font-size:19px; color:#fff;  letter-spacing:-1px; color:rgba(255,255,255,0.8); }

.sub_visual #sub_visual_guide .guide_title {margin-top:30px;}
.sub_visual #sub_visual_guide .guide_title .t1{font-size:60px; color:#fff;  letter-spacing:-3px; font-weight:bold; line-height:60px;}
.sub_visual #sub_visual_guide .guide_title .t2{font-size:17px; color:rgba(255,255,255,0.6);  margin-top:25px; line-height:20px; letter-spacing:-1px;}


.sub_visual .bg { position:absolute; left:0px; top:0px; width:100%; height:100%; background:linear-gradient(90deg, rgba(0,0,0,1), rgba(0,0,0,0.0));  z-index:1;}






.default_layout {max-width:1480px; margin:0 auto; position:relative;}



#guideGroup { margin:120px 0px 100px;}
#guideGroup h3 {font-size:50px; letter-spacing:-2px; color:#000; font-weight:900;}
#guideGroup .guide {  position:absolute; right:0px; top:0px; z-index:1;   }
#guideGroup .guide li{display:inline-block; color:#999;  font-size:14px; padding:0 20px 0 30px;background:url(../images/guide_dot.png) left 7px no-repeat;  vertical-align:middle;}
#guideGroup .guide li.home {padding:0 20px 0 30px;background:none; }
#guideGroup .guide li .feather {width:20px; height:20px; vertical-align:middle;}
#guideGroup .guide li a {color:#999; line-height:30px;}
#guideGroup .guide li.this { color:#999; padding-right:0px;}







/*페이징*/
.common_pager {margin:80px 0px; text-align:center;}
.common_pager a ,
.common_pager span {display:inline-block; margin:0 7px; font-size:17px; color:#000; vertical-align:middle;}
.common_pager a.arrow {width:50px; height:50px; line-height:50px; border-radius:50px; background:#f8f8f8;margin:0 20px;  }
.common_pager a.arrow .feather {position:relative; top:5px; width:18px; }
.common_pager .on {font-weight:bold; color:#de4047;}



@media all and (max-width:1024px) {


.sub_visual {margin:0 15px !important; padding:30px !important; height:200px !important; ; border-radius:10px !important;  }

.sub_visual #video_wrap {position:absolute; left:0px; top:0px;  z-index:0; width:100%;}
.sub_visual #video_wrap video {width:150%;  height: auto; position:relative; z-index:0; ;}

.sub_visual #sub_visual_guide { position:absolute; left:30px; bottom:30px; z-index:2;}
.sub_visual #sub_visual_guide h2 {font-size:19px;  letter-spacing:-1px; }

.sub_visual #sub_visual_guide .guide_title {margin-top:20px; padding-right:30px;}
.sub_visual #sub_visual_guide .guide_title .t1{font-size:30px;   letter-spacing:-1px;   line-height:30px;}
.sub_visual #sub_visual_guide .guide_title .t2{font-size:16px;  margin-top:15px; line-height:20px; }





.default_layout {max-width:auto; margin:0 auto; position:relative;}



#guideGroup { margin:30px 15px 60px;}
#guideGroup h3 {font-size:30px; }



}


@media all and (min-width:1025px) and (max-width:1440px) {


.sub_visual {margin:0px !important;  padding:120px; height:80px !important; border-radius:10px !important; }

.sub_visual #sub_visual_guide {left:70px; bottom:70px; z-index:2;}


#guideGroup { margin:120px 0px 100px;}








}