@charset "utf-8";

#content{position:relative; width:100%; border:0px solid red; margin-top:125px;}

.maincon{width:100%; height:490px; border:0px solid red; position: relative;}

/* 메인이미지 */
#visual { width:100%; overflow:hidden; position:relative;   height:490px; background:#fff ; }
.visual_wrap { position:relative; width:100%; height:100%; margin:0 auto;  overflow:hidden;   float:right;  }

.visual_box { position:absolute; width:100%; margin:0 auto;  border-radius:0px;}
.visual_box div {position:absolute; top:0;  left:0; border:0px solid red; height:490px; width:100%;    border:0px solid red; }
.visual_box div  img{width:100%;}
.v_ul { position:absolute;  bottom:300px; right:50%; margin-right:-74px;    z-index:9; }
.v_ul li { float:left;  z-index:1;  cursor:pointer; margin-right:6px; }
.v_btn01 {  position:absolute;  border-radius:50px; top:250px;  left:20px; background:rgba(250,250,250,0.2); width:65px; height:65px; 
  cursor:pointer; color:#fff ! important; font-weight:600;  font-size:14px;line-height:40px; opacity:0.9; text-transform:uppercase;z-index:2; }
.v_btn02 {  position:absolute;  border-radius:50px;  top:250px; z-index:1;  background:rgba(250,250,250,0.2);  right:20px; width:65px;
 height:65px; cursor:pointer; color:#fff ! important; font-weight:600;  font-size:14px;line-height:40px; opacity:0.9;
  text-transform:uppercase;z-index:2;  }


/* 메인 슬라이드 버튼*/
.btnArrowBox { position:absolute; z-index:999; left:50px; }

.visual_p { /*position:absolute;*/  left:0;}

#visual .visual_p { /*position:absolute;*/  left:0;}
#visual .visual_p img{width:100%;}
#visual .vs_txt {position:absolute;  border:0px solid red; width:60%; text-align:left;
left:20%; top:30%;  z-index:2; background:url(../images/main/bg_vtxt.png) no-repeat center top;}
#visual .vs_txt div{float:right; width:40%;}
#visual .vs_txt .m-txt {font-size:67px; font-weight:700; color:#fff;}
#visual .vs_txt .m-txt span{font-weight:100;}
#visual .vs_txt .m-txt1 {font-size:62px; font-weight:700; color:#fff; line-height:80px;}
#visual .vs_txt .m-txt2 {font-size:30px; font-weight:700; color:#fff; line-height:80px;}
#visual .vs_txt .m-txt2 span{float:right; font-size:17px; display:inline-block; color:#fff; border-radius:25px; border:1px solid #fff; padding :10px; }
#visual .vs_txt .m-txt3 {margin-top:5%;font-size:20px; font-weight:700; color:#fff; line-height:35px;}

.mainbg01{background:url('../images/main_01.jpg')top; background-size:cover;}
.mainbg02{background:url('../images/main_02.jpg'); background-size:cover;}




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

#content{position:relative; width:100%; border:0px solid red; margin-top:80px;}
#visual .vs_txt{width:100%; left:0%;}
#visual .vs_txt div{margin:0 auto; width:100%; text-align:center !important; padding:0 20%; border:0px solid red;}
.v_btn01 {  z-index:3; } 
.v_btn02 {  z-index:3; }
}

@media all and (max-width:976px){
  #content{position:relative; width:100%; border:0px solid red; margin-top:70px;}
#visual .vs_txt div img{width:100%;}
}

@media all and (max-width:480px){
  #content{position:relative; width:100%; border:0px solid red; margin-top:60px;}


.mainbg01{background:url('../images/main_01_m.jpg') center top; background-size:cover;}
.mainbg02{background:url('../images/main_02_m.jpg')center; background-size:cover;}

}




.mainbanner{width:1200px; margin:0 auto;  padding:80px 0px; overflow:hidden;}
.mainbanner ul {width:100%; position: relative;}
.mainbanner ul  li{display: inline-block; width:20%; float:left; text-align:center; padding:0px 35px;}
.mainbanner ul  li a{display: block; font-size:22px; font-weight:600; color:#333333; }
.mainbanner ul  li span{font-siZE:16px; color:#666666 !important; }
.mainbanner ul  li a:hover{color:#fbae09;}


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

.mainbanner{width:100%; padding:60px 0px;}
.mainbanner ul  li img{width:80%;}
}


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

.mainbanner ul  li{display: inline-block; width:50%; float:left; text-align:center; padding:20px 25px;}

}

.noticearea{width:1200px; margin:0 auto; padding-bottom:60px; overflow:hidden;}
.noticeleft{width:60%; float:left; background:#fcfaf2; padding:35px 45px; box-sizing: border-box;}
.noticeright{width:40%; float:left; background:#3c3c3c; padding:35px; box-sizing: border-box;}

.noticett{margin-bottom:35px;background:url('../images/noticebg.png')bottom; line-height:70px; font-sizE:26px; color:#333333; font-weight:600;}
.noticett span{display:inline-block; float:right;  font-size:18px;}

.noticelist{width:100%; line-height:40px; background:url('../images/dot_01.png')no-repeat left; padding-left:20px;}
.noticelist a{font-size:18px; color:#333;}
.noticelist span{display:inline-block; float:right; font-size:17px; font-style: italic;}


.noticett1{margin-bottom:0px;background:url('../images/noticebg1.png')bottom; line-height:70px; 
 font-sizE:26px; color:#fff; font-weight:600;}
.noticeright ul {width:100%; border:0px solid red; overflow:hidden;}
.noticeright ul li{display: inline-block; float:left; width:50%; }
.noticeright ul li:first-child{padding-right:35px;}
.noticeright ul li:last-child p{font-size:21px; color:#fff; line-height:28px; font-weight:600;}

.noticeright ul li:last-child span{font-size:17px; color:#ffcc33; font-weight:600;}


@media all and (max-width:1199px){
.noticearea{width:100%;}
.noticeleft{width:100%;}
.noticeright{width:100%;}
}

@media all and (max-width:589px){
.noticeleft{padding:25px;}
.noticelist a{font-size:17px; color:#333;}
.noticelist span{display:none;}


.noticeright{padding:25px;}
.noticeright ul li:first-child img{width:100%; padding-right:20px;}
 
}


.main_btn1 {
    bordeR:1px solid #fff;
    border-radius:10px;
    display:inline-block;
    cursor:pointer;
    color:#fff;
    font-weight:600;
   width:48% ;
   text-align:center;
   padding:10px 0px;
    font-size:18px;
    
    text-decoration:none;
    margin-top:15px;
    font-weight:600;
    margin:3.1% 1%;

    
    
    
}
.main_btn1:hover {
    color:#fff; 
    background:#fbae09;bordeR:1px solid #fbae09;

}



.bottombanner{width:1200px; margin:0 auto; padding-bottom:0px; overflow:hidden;  padding:10px; background:#f5f5f5; bordeR:0px  solid red;}
.bannerarea{width:100%; float:left;  padding:0px; background:#f5f5f5;}


.flow_banner {overflow: hidden; display: flex;background:#f5f5f5; padding:0px 30px; }
.flow_banner .list {display: flex;}
.flow_banner .list > li {width:200px !important;background:#fff;  border:1px solid #ccc; margin:5px; white-space: nowrap; font-size: 18px;color: #fff; padding:10px;}
@keyframes flowRolling {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}

/* 반응형 스타일 */
@media (max-width: 1280px) {
    .flow_banner .list > li {font-size: 16px;padding: 10px;}
}

@media (max-width: 1024px) {
.flow_banner {overflow: hidden; display: flex; margin: 10px auto;background:#f5f5f5;}
    .flow_banner .list > li {width:130px !important;font-size: 14px;padding: 5px;}

  .flow_banner .list > li > img{width:90% !important;}

}