@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Nanum+Myeongjo&family=Noto+Serif+KR:wght@200..900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Teko:wght@300..700&family=Tektur:wght@400..900&display=swap');
#special3 .swiper-slide {
  overflow: hidden;
/*  backface-visibility: hidden;*/
/*  -webkit-backface-visibility: hidden;*/
}

*, *:before, *:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

#special3 .swiper {
    position:relative;
    width: 100%;
    height: 100vh;
    float:left;
    transition:opacity .6s ease, transform .3s ease;
}

#special3 .swiper .swiper-button-prev,
#special3 .swiper .swiper-button-next { top: 60%; }
#special3 .swiper:hover .swiper-button-prev,
#special3 .swiper:hover .swiper-button-next {
    opacity:1;
    visibility:visible;
}
#special3 .swiper:hover .swiper-button-prev { transform:translateX(100px);}
#special3 .swiper:hover .swiper-button-next { transform:translateX(-200px);}


#special3 .swiper.loading { opacity:0; visibility:hidden; }

#special3 .swiper-slide .slide-bgimg {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100vh;
    background-position:center;
    background-size:cover;
    /*filter: brightness(0.4);*/
}
#special3 .swiper-slide .entity-img { display:none; }

#special3 .swiper-slide .content .cont-left {
    border-top-right-radius:44px; border-bottom-left-radius:44px; overflow:hidden; box-shadow:5px 5px 10px rgba(0,0,0,0.5);
    width: 600px;

}

#special3 .swiper-slide .content .cont-right { width: 500px; margin-left: 50px; overflow: hidden; }
#special3 .swiper-slide .content {
    position:absolute;
    display: flex; width: 1100px; justify-content: center; align-items: center;
    top:58%;
    left:50%;
    transform: translate(-50%, -50%);
    color:#fff;
}
#special3  .content > div { font-size: 1.1rem; text-align: left }
#special3 .swiper-slide .content .title-eng {
    text-transform:uppercase; letter-spacing:-2px; font-family:"Nanum Myeongjo", serif;
    font-size:2.4rem;
    font-weight:400;
    opacity: 0;
    transition: all 0.7s ease;
    letter-spacing: 0.6rem;
    text-align: left;
    white-space: nowrap;
}
#special3 .swiper-slide .content .title-eng span { color:#a3e6d8; font-weight: 600; }

#special3 .swiper-slide .content .bar {
    position: relative; display: inline-block; width: 1px; height: 20px; margin: 10px auto;
    background-color: #fff; border-radius: 3px;
    transform:translateY(-10px); opacity: 0; transition: all 0.7s ease .2s;
}
#special3 .swiper-slide .content .txt {
      display:block;
      font-size:1.1rem;
      letter-spacing: -.5px;
      line-height:1.4;
      transform:translateX(100px);
      opacity:0;
}
#special3 .swiper-slide .content .p1 { transition:all 1s cubic-bezier(.19,.48,.22,1.27) 0.5s; } 
#special3 .swiper-slide .content .p2 { transition:all 1s cubic-bezier(.19,.48,.22,1.27) 0.7s; } 
#special3 .swiper-slide .content .p3 { transition:all 1s cubic-bezier(.19,.48,.22,1.27) 0.9s; }
#special3 .swiper-slide .content .p4 { transition:all 1s cubic-bezier(.19,.48,.22,1.27) 1.1s; }

/*#special3 .swiper-slide .content.show .cont-left img {  transform: translateX(0); opacity: 1; }*/
#special3 .swiper-slide .content.show .title-eng { transform: translateX(0); opacity: 1; letter-spacing: -0.5px ; }
#special3 .swiper-slide .content.show .p1 { transform: translateX(0); opacity: 1; }
#special3 .swiper-slide .content.show .p2 { transform: translateX(0); opacity: 1; }
#special3 .swiper-slide .content.show .p3 { transform: translateX(0); opacity: 1; }
#special3 .swiper-slide .content.show .p4 { transform: translateX(0); opacity: 1; }
#special3 .swiper-slide .content.show .bar { transform: translateY(0); opacity: 1; }

[class^="swiper-button-"]
{
  width:44px;
  opacity:0;
  visibility:hidden;
  transition: all 0.5s ease;
}

#special3 .swiper-button-prev { transform:translateX(270px); }
#special3 .swiper-button-next { transform:translateX(-370px); }


/* 페이지네이션 변경하기 */
#special3 .swiper-pagination-bullet {
    width: 7px; height: 7px; border-radius: 7px; margin-right: 10px;
    transition: all .3s ease;  z-index: 10; background: #fff;
}
#special3 .swiper-pagination-bullet-active { width:70px; background-color:#fff }
#special3 .swiper-pagination {
    --swiper-pagination-bottom:0px;/*하단 위치 높이 변경*/
    --swiper-pagination-bullet-horizontal-gap: 5px;/*불렛간 간격 조정 - 가로*/
    bottom: 50px;
    color: #fff !important;
    /*margin-left: 100px;*/
}


#special3 small { font-size:0.875rem }


/*********/

#special3 .title {
    position: absolute; width: 100%; height: auto; top: 38%; left: 50%; letter-spacing: -2px;
     z-index: 99; transition:all 0.3s ease 0.1s; color:#E8DCC4; transform: translate(-50%, -50%);
}
#special3 .title .tt1 { font-size:1.7rem; font-weight: 400; text-align:center; }
#special3 .title .tt2 { font-size:2.8rem; font-weight: 700; margin-bottom:50px; color:#fff; letter-spacing: -0.5px; opacity: 0.8; text-align: center;}
#special3.active .title { top: 32%; opacity: 1; }



#special3 .swiper-slide .slide-bgimg { z-index: 1 }
#special3 .swiper-slide .content { z-index: 3 }


/* 처음 가림막 */
.special3_bg {
    position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index:2 ;
    background-color: rgba(0,0,0,0.6); animation: special3_bg 0.7s 0.3s both; display: block;
    border-radius: 0;
}
@keyframes special3_bg { from { left: 100%; transform: skew(-90deg);} to {  } }


@media (max-height: 800px ) {
    #special3 .swiper-slide .content .cont-left img { width:90% }
    #special3 .title .tt1 { font-size:2.5rem } 
    #special3 .title .tt2 {  }  
}

@media (max-height: 700px ) {
}
