@charset "utf-8";

/*main banner*/
.main-bn-swip .s1{background-image:url(../img/sub3/7/image1.jpg);}
.main-bn-swip .s2{background-image:url(../img/sub3/7/image2.jpg);}
.main-bn-swip .s3{background-image:url(../img/sub3/7/image3.jpg);}
.main-bn-swip .s4{background-image:url(../img/sub3/7/image4.jpg);}

/*fac-con*/
.fac-top-img{width:100%;height:500px;background-image:url(../img/sub3/7/image4.jpg);background-size:cover;background-position:center center;background-repeat:no-repeat;}
.fac-con-img .bg{width:100%;height:100%;background-size:cover;background-position:center center;background-repeat:no-repeat;}
.fac-con-top-l .fac-con-img .bg{background-image:url(../img/sub3/7/image1.jpg);}
.fac-con-top-r .fac-con-img .bg{background-image:url(../img/sub3/7/image2.jpg);}
.fac-con-bt .fac-con-img .bg{background-image:url(../img/sub3/7/image3.jpg);}


/************************반응형****************************/
@media screen and (min-width:1px) and (max-width:1700px){
  .ct-bn{padding:50px 20px;}
  .ct-bn>.ct-bn-img{width:30%;}
  .ct-bn-con{width:70%;}
  .ct-bn-con .ct-bn-img{width:45%;}
  .ct-bn-txt{width:55%;}
}

@media screen and (min-width:1px) and (max-width:1200px){

  .fac-con{width:100%;padding:0 20px;}
  .fac-con-img{height:70vh;}

  .ct-bn{height:642px;}/*height:70vh*/

  .others{width:100%;margin:150px 0 200px;padding:0;}
  .others-con-control{top:-40px;left:auto;right:0;transform:translateX(0);}
  .others-con-img{width:60%;height:420px;}
  .others-con-txt{width:51%;}
  .others-con-txt-in{height:400px;padding:0 20px;}
}


@media screen and (min-width:1px) and (max-width:1024px){

  .fac-top{margin-bottom:50px;}
  .fac-top-img{height:350px;}
  .fac-con-top{flex-direction:column;}
  .fac-con-top-l{width:100%;}
  .fac-con-top-r{display:flex;width:100%;flex-direction: column-reverse;}
  .fac-con-img{height:350px;}
  .fac-con-top-r .fac-con-txt{text-align:right;}
  .fac-con-bt{height:350px;margin-top:50px;}


   /*ct-bn*/
   .ct-bn{height:735px;padding:50px 0 0;flex-direction:column;justify-content:space-between;}/*height:80vh*/
   .ct-bn>.ct-bn-img{display:none;}
   .ct-bn-con{width:100%;flex-direction:column;}
   .ct-bn-con .ct-bn-img{width:100%;height:45%;}
   .ct-bn-txt{width:100%;height:50%;}
   .ct-bn-txt-in h3{margin-bottom:20px;font-size:40px;}
   .ct-bn-txt-in>p{margin-bottom:30px;font-size:14px;line-height:22px;}
   .ct-bn-txt-in>p>span:nth-child(2){margin-bottom:0px;}

    .others{margin:150px 0 0px;}
    .others-con-img{width:100%;height:350px;}
    .others-con-txt{display:flex;position:static;top:auto;right:auto;z-index:9;width:100%;flex-direction:column-reverse;height:400px;}
    .others-con-control{display:flex;position:static;top:auto;left:auto;right:auto;transform:translateX(0%);z-index:1;width:130px;height:20px;margin:30px auto;}
    .others-con-control .others-swip-page.swiper-pagination-fraction{padding:5px 10px 0 10px;font-size:12px;}
    .others-con-txt-in{width:100%;height:428px;}
    .others-txt-in h4{font-size:25px;}
    .others-txt-in h4::before{content:url(../img/deco3-m.png);display:block;}
    .others-txt-in p{margin-bottom:60px;font-size:13px;font-weight:400;line-height:24px;}
    .others-txt-in p span{display:block;}
}

@media screen and (min-width:1px) and (max-width:780px){

  .fac{margin:80px 0 0;}
  .fac-top{margin-bottom:0px;}
  .fac-top-img{height:270px;}
  .fac-con-txt{padding:50px 0px;font-size:12px;line-height:24px;}
  .fac-con-img{height:300px;}
  .fac-con-bt{height:300px;}
  .fac-con-txt{text-align:center !important;}
  .fac-con-txt>p>span{display:inline;}

  .deco{margin:80px 0;padding:0 20px;font-size:12px;line-height:22px;}
  .deco>p>span{display:inline;}
  .deco>img{width:100px;}

  /*ct-bn*/
  .ct-bn{height:80vh;}/*height:80vh*/
  .ct-bn-con .ct-bn-img{height:55%;}
  .ct-bn-txt{height:40%;}
  .ct-bn-txt-in h3{font-size:30px;}
  .ct-bn-txt-in>p{font-size:12px;line-height:22px;}

   /*others*/
   .others{margin:100px 0 0;}
   .others-con-img{width:100%;height:350px;}
   .others-con-txt{display:flex;position:static;top:auto;right:auto;z-index:9;width:100%;flex-direction:column-reverse;height:400px;}
   .others-con-control{display:flex;position:static;top:auto;left:auto;right:auto;transform:translateX(0%);z-index:1;width:130px;height:20px;margin:30px auto;}
   .others-con-control .others-swip-page.swiper-pagination-fraction{padding:5px 10px 0 10px;font-size:12px;}
   .others-con-txt-in{width:100%;height:428px;}
   .others-txt-in h4{font-size:20px;}
   .others-txt-in h4::before{content:url(../img/deco3-m.png);display:block;}
   .others-txt-in p{font-size:12px;line-height:23px;}
   .others-txt-in p span{display:inline;}
}