/*  header start */
@media(max-width:1740px) {}

@media(max-width:1600px) {
  header .nav h1 {
    width: 15%;
  }

  header .nav .gnb {
    width: 70%;
  }

  header .nav .side {
    width: 15%;


  }

  header .nav .depth01>li>a {
    padding: 0 40px;
    color: #fff;
    opacity: 1;
    height: 100%;
    display: flex;
    align-items: center;
    transition: .4s;
    font-family: 'Poppins', 'NotoSans', sans-serif;
    font-size: 16px;
  }
}

@media (min-width: 1200px) and (max-width: 1500px) {
  header .nav h1 {
    width: 20%;
  }

  header .nav .gnb {
    width: 60%;
  }

  header .nav .side {
    width: 20%;
    /* background: #000 */
  }


}
@media(max-width:1200px){ 
  header .nav h1 {
    width: 20%;
  }

  header .nav .gnb {
    width: 80%;
  }

  header .nav .side {
    width: 20%;
    background: #000;
    display:none
  }

 }
@media(max-width:1300px) {

  header .nav {
    padding-left: 15px;
    padding-right: 15px;
  }
  #index-wrap section.sec01 { 
    height: auto;
    padding-bottom: 60px;
  }
  /* #index-wrap section.sec01 .business_slick {
    flex-wrap: wrap;
  }
  #index-wrap section.sec01 .business_slick .box {
    width: 50%;
    padding-bottom: 50px;
  } */
  /* .business_slick {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .business_slick .box {
    padding-bottom: 30px !important;
  } */
  .business_slick .box .wrap:hover {
    transition: none;
  }
  
  .business_slick .box .wrap:hover:before {
    transition: none;
  }
  .business_slick .box .wrap:hover h2 {
    transform: translate3d(0, 60px, 0);
    -webkit-transform: translate3d(0, 60px, 0);
    -moz-transform: translate3d(0, 60px, 0);
    -ms-transform: translate3d(0, 60px, 0);
    -o-transform: translate3d(0, 60px, 0);
  }
  
  .business_slick .box .wrap:hover p {
    opacity: 0;
    transform: none;
  }


  .s_visual_wrap {
    margin-top: 0px;
  }

  .s_visual_wrap .slide .content {
    top: 48%;

  }


}








  @media(max-width:991px) {
    body {
        overflow-x: hidden;
        overflow-y: auto;
      }
    .animate {
      opacity: 1;
    }


    .header.sticky {
      display: none;
    }

    .header .nav .gnb {
      display: none;
    }

    header .nav h1 {
      /* width: 100%;
      padding-left: 0;
      position: relative;
      z-index: 1; */
      width: 80%;
      padding-left: 0;
      position: relative;
      z-index: 999999999999999999999999;
    }

    header .nav .side {
      display: none;
    }

    header .nav {
      height: 60px;
    }

    header .nav h1 a {
      background: url('../../img/common/logo.png') 0 0% no-repeat;
      background-size: cover;
      overflow: hidden;
      display: block;
      height: 38px;
      width: 100px;
      text-indent: -9999px;
    }

    .js-offcanvas-btn {
      display: block;
    }

    .sidebar-offcanvas {
      display: block !important;
    }

    #header .top_wrap .logo {
      width: 50%;
    }







    /* 인덱스 */
    .hidden-text {
      position: absolute;
      z-index: 200;
    }

    #index-wrap {}

    /* sec01 */
    #index-wrap section.sec01 {
      padding-top: 50px;
      padding-bottom: 20px;
      background: url('../../img/main/sec01_bg.jpg');
      background-repeat: no-repeat;
      background-size: cover;
      height: auto;
    
    
    }
    
    #index-wrap section.sec01 .title {
      text-align: center;
      padding-bottom: 30px;
      font-weight:600;
      font-family: 'Poppins', 'NotoSans', sans-serif;
      font-size:15px;
      color: #353535;
    
    }
    #index-wrap section.sec01 .title h1 {
      font-family: 'Poppins', 'NotoSans', sans-serif !important ;
      text-transform:uppercase;
      font-size: 26px;
    }
    /* #index-wrap section.sec01 .business_slick {
      padding-left: 15px !important;
      padding-right: 15px !important;
      width: 100%;
       position: relative;
       display:block;
       overflow: auto;
       white-space: nowrap;
      
       
    }
    #index-wrap section.sec01 .business_slick .box {
      width: 330px;
      padding-bottom: 10px !important;
      display: inline-block;
    } */
   
  
    .business_slick .box .wrap {
      margin-left: 6px;
      margin-right: 6px;
      height: 245px;
      background: #eee;
      position: relative;
      overflow: hidden;
      background-repeat: no-repeat;
      background-size: cover;
      text-align: center;
      box-shadow: none;
    }
    .business_slick .box .wrap h2 {
      top: 56%;
      transform: translate3d(0, 60px, 0);
      font-family: 'Titillium Web', sans-serif;
      font-size: 16px;
      font-weight: 600;
      letter-spacing: 1px;
      -webkit-transform: translate3d(0, 60px, 0);
      -moz-transform: translate3d(0, 60px, 0);
      -ms-transform: translate3d(0, 60px, 0);
      -o-transform: translate3d(0, 60px, 0);
    }
    
    .business_slick .box .wrap p {
      opacity: 0;
      bottom: 0;
      transform: translate3d(0, -10px, 0);
      font-size: 16px;
      color: rgba(255, 255, 255, .9);
    }
    
    /* sec01 end */

    #index-wrap section.sec02 {
      background: url("../../img/main/section03_bg.jpg");
      /* min-height: 1100px; */
      background-repeat: no-repeat;
      background-size: cover;
      padding-top: 50px;
      padding-bottom: 40px;
      /* background: #1d1d1d; */
    }

    #index-wrap section.sec02 .title {
      text-align: center;
      color: #757575;
      font-size: 15px;
    }

    #index-wrap section.sec02 .title h1 {
      color: #fff;
      font-family: "Poppins", "NotoSans", sans-serif !important;
      font-weight: 700;
      font-size: 26px;
    }

    #index-wrap section.sec02 .slider-wrap {
      margin-top: 40px;
    }

    #index-wrap section.sec02 .slider-wrap .slider-index-portfolio .box img {
      width: 100%;
      box-shadow: 0 23px 25px rgba(0, 0, 0, .6);

    }

    #index-wrap section.sec02 .slider-wrap .slider-index-portfolio .box {
      position: relative;

    }

    #index-wrap section.sec02 .slider-wrap .slider-index-portfolio .box:nth-child(even) {
      margin-top: 0px;
    }

    #index-wrap section.sec02 .slider-wrap .slider-index-portfolio .box .overlay {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      /* right: 0; */
      height: 100%;
      width: 100%;
      opacity: 1;
      transition: .5s ease;
      background-color: rgba(0, 0, 0, 0);
      cursor: pointer;
    }

    #index-wrap section.sec02 .slider-wrap .slider-index-portfolio .box:hover .overlay {
      opacity: 0;
    }

    #index-wrap section.sec02 .slider-wrap .slider-index-portfolio .slick-list {
      margin: 0 ;
    }

    #index-wrap section.sec02 .slider-wrap .slider-index-portfolio .slick-slide {
      margin: 0 10px;
    }

    #index-wrap section.sec02 .slider-wrap .btn-wrap {
      margin-top: 30px;
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    #index-wrap section.sec02 .slider-wrap .btn-wrap a.btn {
      background: #0A0A0A;
      color: #7dbb21;
      font-size: 15px;
      font-weight: 500;
      width: 160px;
      height: 52px;
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: .4em;
      -webkit-border-radius: .4em;
      -moz-border-radius: .4em;
      -ms-border-radius: .4em;
      -o-border-radius: .4em;
      font-family: 'Poppins', 'NotoSans', sans-serif;
      border: 1px #588318 solid;
    }

    #index-wrap section.sec02 .slider-wrap .btn-wrap a.btn span {
      margin-left: 20px;
      color: #a0dd36;
    }

    #index-wrap section.sec03 {
      background-image: none;
      background-repeat: no-repeat;
      background-position: 95% 100%;
      background-color: #fff;
      padding-top: 60px;
      padding-bottom: 60px;
    }

    #index-wrap section.sec03 h1 {
      font-size: 26px;
      font-family: 'Poppins', 'NotoSans', sans-serif !important;
      color: #1d1d1d;
      text-transform: uppercase;
      text-align: center;
    }

    #index-wrap section.sec03 .content_flex {
      display: flex;
      flex-direction: column;
      padding-top: 12px;
      
    }

    #index-wrap section.sec03 .content_flex .left {
      width: 100%;
    }

    #index-wrap section.sec03 .content_flex .right {
      width: 100%;
    }

    #index-wrap section.sec03 .content_flex .left .box.flex {
      display: flex;
      justify-content: center;
    }

    #index-wrap section.sec03 .content_flex .left .box.flex h2 {
      color: #000;
      font-family: "Poppins", "NotoSans", sans-serif !important;
      font-weight: 600;
      font-size: 20px;
      padding-right: 70px;
    }

    #index-wrap section.sec03 .content_flex .left .box.flex p {
      color: #000;
      font-family: 'Poppins', 'NotoSans', sans-serif;
      font-size: 15px;
      text-align: center;
    }

    #index-wrap section.sec03 .content_flex .left .box.flex p span {
      font-family: 'Poppins', 'NotoSans', sans-serif;
      font-weight: 600;
    }

    #index-wrap section.sec03 .content_flex .left .btn-wrap {
      margin-top: 30px;
      text-align: center;
      display:none;
    }

    #index-wrap section.sec03 .content_flex .left .btn-wrap a.btn {
      color: #fff;
      font-family: 'Poppins', 'NotoSans', sans-serif;
      font-size: 14px;
      text-transform: uppercase;
      display: block;
      width: 200px;
      height: 50px;
      letter-spacing: 1px;
      font-weight: 400;
      display: inline-flex;
      justify-content: center;
      align-items: center;
      background: #7ec10b;
      box-shadow: 0 3px 5px rgba(0, 0, 0, .2);

    }

    #index-wrap section.sec03 .content_flex .left .btn-wrap a.btn i {
      margin-left: 30px;
      color: #fff;
      font-size: 14px;
    }


    /* form */
    #index-wrap section.sec03 .message {
      padding-right: 0px;
      margin-top: 40px;
    }

    #index-wrap section.sec03 .message .form_write .flex input {
      width: 100%;
      height: 46px;
      border: 0;
      border-radius: 0em;
      padding-left: 18px;
      padding-right: 18px;
      font-size: 13px;
      margin-left: 3px;
      margin-right: 3px;
      margin-bottom: 6px;
      /* background: #08090a; */
      background: #f0f0f0;
      border-radius: 0.4em;
      /* border-bottom: 1px #5c6075 solid; */
      font-family: "Poppins", "NotoSans", sans-serif;
    }

    #index-wrap section.sec03 .message .form_write .flex .wiz-nice-select {
      /* background: rgba(8, 9, 10, 0.8);
    border: 0;
    color: #85899b; */
      width: 100%;
      height: 46px;
      border: 0;
      border-radius: 0em;
      padding-left: 18px;
      padding-right: 18px;
      font-size: 13px;
      margin-left: 3px;
      margin-right: 3px;
      margin-bottom: 6px;
      /* background: #08090a; */
      background: #f0f0f0;
      border-radius: 0.4em;
      /* border-bottom: 1px #5c6075 solid; */
      color: #070707;
      font-family: "Poppins", "NotoSans", sans-serif;
      line-height: 45px;
    }
    #index-wrap section.sec03 .message .form_write .flex .wiz-nice-select .option {
        font-size:13px;
        line-height: 30px;
        list-style: none;
        min-height: 30px;
        color: #5c5c5c;
    }
    #index-wrap section.sec03 .message .form_write textarea {
      width: 100%;
      border: 0;
      border-radius: 0;
      padding: 20px 12px;
      font-size: 13px;
      background: #f0f0f0;
      border-radius: 0.4em;
      font-family: "Poppins", "NotoSans", sans-serif;
    }

    #index-wrap section.sec03 .message .form_write .btn_wrap label {
      color: #85899b;
      font-size: 12px;
      line-height: 0;
    }
 

   

    #index-wrap section.sec03 .message .form_write .btn_wrap .send input {
      background: #7ec10b;
  color: #fff;
      border-radius: 0.3em;
      width: 200px;
      height: 50px;
      font-size: 13px;
      font-weight: 700;

    }

    /* 인덱스 마감 */



    /* 서브 슬라이더 */
    .s_visual_wrap {
      position: relative;
      /*            min-width: 1100px;*/
      /* overflow: hidden; */
      /* z-index: 2; */
      height: 320px;
    }

    .s_visual_wrap .slide {
      height: 320px;

    }


    .s_visual_wrap .slide li {
      height: 320px;

    }

    .s_visual_wrap .slide .content {
      top: 40%;
      text-align: center;

    }

    .s_visual_wrap .slide {
      padding-left: 15px;
      padding-right: 15px;
    }

    .s_visual_wrap .slide .content h1 {
      font-size: 20px;
      font-weight: 800;
      color: #fff;
      font-family: 'NanumSquare', 'ë§‘ì€ ê³ ë”•', 'Nanum Gothic', 'Malgun Gothic', 'Ubuntu', 'ë‹ì›€', dotum, sans-serif;
      padding: 0;
      padding: 0;
      line-height: 32px;
      letter-spacing: 0;
    }

    .s_visual_wrap .slide .content p {
      font-size: 13px;
      font-weight: 400;
      color: #fff;
      margin-top: 6px;
    }
    .s_visual_wrap .slide .content ul.map {
      display: flex;
      align-items: center;
      justify-content: center;
      margin-top: 12px;
    }
    
    .s_visual_wrap .slide .content ul.map li {
      color: rgba(255, 255, 255, .6);
      font-size: 12px;
      margin-left: 4px;
      margin-right: 4px;
    }
    
    .s_visual_wrap .slide .content ul.map li:first-child {
      font-size: 12px;
    }
    
    /* 서브 슬라이더 마감 */


    /*  서브 레이아웃 */
    #sub_content {
      margin-top: 0;
      padding-top: 60px;
    }

    #sub_content .page-header {
      margin-bottom: 16px;
      padding-bottom: 0;
      padding-left: 15px;
      padding-right: 15px;
    }

    #sub_content .container .page-header {
      padding-left: 0;
    }


    #sub_content .page-header h1 {
      font-size: 22px;
      font-weight: 900;
      color: #000;
      font-family: 'NanumSquare';


    }

    #sub_content .page-header h1::before {
      position: absolute;
      width: 80%;
      height: 2px;
      background: #a0dd36;
      content: "";
      margin-top: 42px;
    }

    #sub_content .page-header p {
      color: #909090;
      animation: slide-up2 1s ease-out;
      font-size: 13px;
      margin-top: 28px;
      -webkit-animation: slide-up2 1s ease-out;
    }

    /*  서브 레이아웃 마감 */

    /* footer */

    footer {
      /*    margin-top: 30px;*/
      background-color: #050606;
      padding: 0;
      padding-bottom: 40px;
      padding-top: 40px;
      clear: both;
      width: 100%;
    }

    footer.sub {
      padding-top: 40px;
    }

    footer .flex {
      display: flex;
      flex-direction: column;
      justify-content: center;
      text-align: center;
    }

    footer .flex h1 {
      display: none;
    }

    footer .flex address {
      width: 100%;
      /* color: rgba(255, 255, 255, .2); */
      color: #adadad;
      font-size: 13px;
      line-height: 18px;
    }

    footer .flex address p {
      font-size: 13px;
      line-height: 18px;
      /* color: rgba(255, 255, 255, .2) !important; */
      color: #adadad

    }


    footer .footer-menu h1 {
      padding: 0;
      padding-bottom: 30px;
    }



    footer .btn-default {
      background-color: #fff;
      background-image: none;
      text-shadow: none;
      box-shadow: none;
      border: 1px #dddddd solid;
      padding: 4px 11px;
      border-radius: 0;
    }

    footer .footer-menu {
      padding-top: 40px;
      padding-bottom: 20px;
      background-color: #1c1c1c;
      border-bottom: 1px #1c1c1c solid;
    }

    footer .footer-menu ul {
      padding-top: 8px;
      padding-bottom: 12px;
      padding-left: 0;
      margin-left: 0;
    }

    footer .footer-menu ul li:before {
      color: #464646;
      content: "|";
      font-size: 12px;
    }

    footer .footer-menu ul li:first-child,
    footer .footer-menu ul li:first-child a {
      padding-left: 0;
      margin-left: 0;
    }

    footer .footer-menu ul li:first-child::before {
      content: "";
      padding-left: 0;
      margin-left: 0;
    }

    footer .footer-menu ul li a {
      font-size: 16px;
      color: #fff;
      font-weight: 900;
      padding-left: 16px;
      padding-right: 16px;
    }

    footer .footer-menu ul li a.blue {
      color: #fff;
    }

    footer .breadcrumb {
      margin-bottom: 4px;
      background-color: transparent;
    }

    footer p.logo {
      float: right;
      margin-top: 23px;
      display: none;
    }

    footer p.logo img {
      width: 80%;
    }

    footer address {
      font-size: 16px;
      line-height: 23px;
      font-weight: 500;
      color: #909090;
      font-style: normal;
      font-family: "Poppins", "NotoSans", sans-serif;
    }

    footer p {
      margin-top: 0;
      font-family: "Poppins", "NotoSans", sans-serif;
      padding-top: 6px;
      color: #757575 !important;
      font-size: 16px;
      font-weight: 600;
    }

    footer address a span {
      color: #979ba3;
      margin-left: 6px;
    }

    footer address a {
      color: #979ba3;
      font-size: 14px;
    }






  }
  @media(max-width:599px){
    #index-wrap section.sec01 { 
      padding-top: 100px;
      padding-bottom: 50px;
    }
    }