/* 메인 상단 비주얼 */

/* 메인 상단 비주얼 버튼*/

.pager_wrap2 {

  position: absolute;

  z-index: 9999999999999999999999999999999999999999999;

  width: 100%;

  bottom: 190px;



}



.pager_wrap2 .container {

  display: flex;

}



.pager_wrap2 .arr {

  width: 76px;

  height: 76px;

  border: 1px solid rgba(255, 255, 255, .3);

  border-radius: 50%;

  display: flex;

  justify-content: center;

  align-items: center;

  cursor: pointer;

  transition: .3s;



}



.pager_wrap2 .prev2 {

  margin-right: 6px;

}



.pager_wrap2 .next2 {

  margin-left: 6px;

}



.pager_wrap2 .arr:hover {

  background: rgba(255, 255, 255, .2);

  border: 1px solid rgba(255, 255, 255, 0);

}

.pager_wrap2 i {

  font-size: 36px;



  color: #fff;

  transition: .3s;



}

/* 버튼 마감 */

.caption,

.main-slider .slick-slide::before,

.main-slider .slick-slide {

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

}



.main-slider .slick-slide::before {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100vh;

}







.main-slider {

  position: relative;

  width: 100%;

  height: 100vh;

  visibility: hidden;

  clear: both;

  opacity: 0;

  transition: opacity 1s ease;

  -webkit-transition: opacity 1s ease;

}



.main-slider.slick-initialized {

  opacity: 1;

  visibility: visible;

}



.main-slider .slick-slide {

  position: relative;

  height: 100%;

  overflow: hidden;

  max-height: 100%;

  height: 100vh;

  position: relative;



}



.main-slider .slick-slide::before {

  background: rgba(0, 0, 0, 0.45);

  opacity: 1;

  z-index: 1;

  pointer-events: none;

}



.slide-video {}



.main-slider .slick-slide video {}



.main-slider .slick-slide iframe {

  position: relative;

  pointer-events: none;



}



.main-slider .slick-slide figure {

  position: relative;

  height: 100%;

}



.main-slider .slick-slide .slide-image {

  opacity: 1;

  height: 100vh;

  width: 100%;

  background-size: cover;

  background-position: center;

  transition: all 0.8s ease;

}



.main-slider .slick-slide .slide-image.show {

  opacity: 1;

}



.main-slider .slick-slide .image-entity {

  width: 100%;

  height: 100vh;

  opacity: 0;

  visibility: hidden;

}



.main-slider .slick-slide .loading {

  position: absolute;

  top: 44%;

  left: 0;

  width: 100%;

}



.main-slider .slick-slide .slide-media {

  -webkit-animation: slideOut 0.4s cubic-bezier(0.4, 0.29, 0.01, 1);

  animation: slideOut 0.4s cubic-bezier(0.4, 0.29, 0.01, 1);

}



.main-slider .slick-slide.slick-active {

  z-index: 1;

}



.main-slider .slick-slide.slick-active .slide-media {

  -webkit-animation: slideIn 2.4s cubic-bezier(0.4, 0.29, 0.01, 1);

  animation: slideIn 2.4s cubic-bezier(0.4, 0.29, 0.01, 1);

}



.main-slider .slick-slide.slick-active .caption {

  opacity: 1;

  transform: translateY(0);

  transition: all 0.7s cubic-bezier(0.32, 0.34, 0, 1.62) 0.6s;

}





.main-slider .caption {

  position: absolute;

  top: 40%;

  left: 0%;

  width: 100%;

  padding: 20px;

  border: 3px solid;

  color: #fff;

  margin: 0;

  font-size: 40px;

  font-weight: bold;

  letter-spacing: 0.02em;

  opacity: 0;

  z-index: 2;

  border: 0;



}



.main-slider .caption h1 {

  color: #fff;

  font-size: 54px;

  line-height: 66px;

  font-weight: 900;

  font-family: 'Poppins', 'NotoSans', sans-serif;

  transition-delay: .6s;

  transition-duration: 1.2s;

  transform: translateX(-5%);

}



.main-slider .caption p {

  color: #fff;

  font-size: 24px;

  line-height: 29px;

  font-weight: 400;

  margin-top: 24px;

  color: rgba(255, 255, 255, 1);

  margin-bottom: 0;

  font-family: 'Poppins', 'NotoSans', sans-serif;

  transition-delay: .6s;

  transition-duration: 1.2s;

  transform: translateX(-5%);

}





.main-slider .slick-dots {

  text-align: center;

  padding-top: 15px;

}



.main-slider .slick-dots li {

  display: inline-block;

  vertical-align: top;

  margin: 0 8px;

}



.main-slider .slick-dots li button {

  width: 16px;

  height: 16px;

  border: none;

  cursor: pointer;

  border-radius: 50%;

  border: 2px solid #fff;

  box-shadow: 0 0 0 0 transparent;

  vertical-align: middle;

  color: #fff;

  background-color: #fff;

  transition: all 0.3s ease;

  opacity: 0.4;

}



.main-slider .slick-dots li button:focus {

  outline: none;

}



.main-slider .slick-dots li button:hover {

  opacity: 1;

}



.main-slider .slick-dots li.slick-active button {

  border-color: #2d3042;

  box-shadow: 0 0 0 2px #fff;

  opacity: 1;

}



/*  슬라이드 흐림효과 .. 안이뻐서 안써요 

  @-webkit-keyframes slideIn {

    from {

      filter: blur(15px);

    }

    to {

      filter: blur(0);

    }

  }

  

  @keyframes slideIn {

    from {

      filter: blur(15px);

    }

    to {

      filter: blur(0);

    }

  }

  @-webkit-keyframes slideOut {

    from {

      filter: blur(0);

    }

    to {

      filter: blur(15px);

    }

  }

  @keyframes slideOut {

    from {

      filter: blur(0);

    }

    to {

      filter: blur(15px);

    }

  }  */

  @media(max-width:991px){ 

    .pager_wrap2 {

      width: 100%;

      bottom: 30px;

    }

    .pager_wrap2 .container {

      display: flex;

      margin-left: 20px;

    }

    

    .pager_wrap2 .arr {

      width: 56px;

      height: 56px;

      border: 1px solid rgba(255, 255, 255, .3);

      border-radius: 50%;

      display: flex;

      justify-content: center;

      align-items: center;

      cursor: pointer;

      transition: .3s;

    

    }  

    

    .pager_wrap2 .prev2 {

      margin-right: 4px;

    } 

    

    .pager_wrap2 .next2 {

      margin-left: 4px;

    }

    

    .pager_wrap2 .arr:hover {

      background: rgba(255, 255, 255, .2);

      border: 1px solid rgba(255, 255, 255, 0);

    }

    .pager_wrap2 i {

      font-size: 24px;

    

      color: #fff;

      transition: .3s;

    

    }



    .main-slider .caption {

      position: absolute;

      top: 30%;

      left: 0%;

      width: 100%;

      padding: 20px;

      border: 3px solid;

      color: #fff;

      margin: 0;

      font-size: 40px;

      font-weight: bold;

      letter-spacing: 0;

      opacity: 0;

      z-index: 1;

      border: 0;

    

    } 

    

    .main-slider .caption h1 {

      color: #fff;

      font-size: 25px;

      line-height: 32px;

      font-weight: 600;

      font-family: 'Poppins', 'NotoSans', sans-serif;

      transition-delay: .6s;

      transition-duration: 1.2s;

      transform: translateX(-5%);

    }

    

    .main-slider .caption p {

      color: #fff;

      font-size: 14px;

      line-height: 20px;

      font-weight: 400;

      margin-top: 20px;

      color: rgba(255, 255, 255, .5);

      margin-bottom: 0;

      font-family: 'Poppins', 'NotoSans', sans-serif;

      transition-delay: .6s;

      transition-duration: 1.2s;

      transform: translateX(-5%);

    }

    

   }