@media screen and (max-width:768px){
  .titleArea,
  .titleArea h2.left,
  .titleArea p.left{text-align:center;}
}

/* 배너 */
.tbbanner{ position:relative; }
.tbbanner::after{display:block;visibility:hidden;clear:both;content:""}
.tbbanner .bnn-wrap{ position:relative; width:100%; height:100vh; max-height:900px; min-height:500px; margin:0 auto; }
.tbbanner .swiper-container{ width:100%; height:100%; }
.tbbanner .swiper-wrapper{ width:100%; height:100%; top:0;left:0; overflow: hidden;}
.tbbanner .swiper-slide{ position:relative; width:100%; height:100%; overflow: hidden; }
.tbbanner .swiper-slide .wideImg{ position:absolute; top:50%; left:50%; width:100%; transform:translate(-50%, -50%); height:100%;background-size: cover; background-repeat: no-repeat;background-position:center center;  transition:all 1.5s ease-out; -webkit-transition:all 1.5s ease-out;}

/*텍스트*/
.tbbanner .tbinner{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; height:100%; margin:0 auto; z-index:2; }
.tbbanner .slider-txt-wrap{height:100%; position:relative;}
  .tbbanner .slider-txt{ position:absolute; width:100%; top:60%; left:0; transform: translateY(0%); text-align:left; color:#fff; }
  .tbbanner .slider-txt.left{ text-align: left; }
  .tbbanner .slider-txt.center{ text-align: center; }
  .tbbanner .slider-txt.right{ text-align: right; }
  .tbbanner .slider-txt .bnn-title{ font-size: 8.5rem; line-height:1.2em; letter-spacing: -10px; color:#fff; font-weight: 300; margin-bottom:20px;  transition: all .4s .7s; }
  .tbbanner .slider-txt .bnn-text{ font-size:8.5rem; line-height:1.2em; letter-spacing: -10px;  color:#fff; font-weight: 300; transition: all .4s 1.1s; }
  .tbbanner .slider-txt .tbbtn{ -webkit-transition: opacity .4s 1.5s, bottom .4s 1.5s, border-radius .3s, background .3s,border-color .3s; -moz-transition: opacity .4s 1.5s, bottom .4s 1.5s, border-radius .3s, background .3s,border-color .3s; -ms-transition: opacity .4s 1.5s, bottom .4s 1.5s, border-radius .3s, background .3s,border-color .3s; -o-transition: opacity .4s 1.5s, bottom .4s 1.5s, border-radius .3s, background .3s,border-color .3s;  transition: opacity .4s 1.5s, bottom .4s 1.5s, border-radius .3s, background .3s,border-color .3s; }
  .tbbanner .slider-txt .bnn-title, .tbbanner .slider-txt .bnn-text, .tbbanner .slider-txt .tbbtn{position:relative; opacity:0; bottom:-20px;}
  .tbbanner .slider-txt .bnn-title.sldrun, .tbbanner .slider-txt .bnn-text.sldrun, .tbbanner .slider-txt .tbbtn.sldrun{opacity:1; bottom:0;}


@media (max-width: 1640px){
  .tbbanner .swiper-slide .tbinner{ max-width:100%; padding:0 80px;}
}
@media (max-width: 1024px){
  .tbbanner .bnn-wrap{ max-height:700px; }
  .tbbanner .swiper-slide .tbinner{padding: 0 50px;}
  /* .tbbanner .slider-txt {transform:translateY(-38%);} */
  .tbbanner .slider-txt .bnn-title,
  .tbbanner .slider-txt .bnn-text{ font-size:7rem;}
}
@media (max-width: 768px){
  .tbbanner .bnn-wrap{ max-height:600px;}
  .tbbanner .swiper-slide .tbinner{padding: 0 30px;}
  .tbbanner .slider-txt .bnn-title,
  .tbbanner .slider-txt .bnn-text{ font-size:5.2rem; letter-spacing: -5px;}
  
} 
@media (max-width: 560px){
  .tbbanner .bnn-wrap { max-height:550px; min-height:auto;}
  .tbbanner .swiper-slide .tbinner{padding: 0 30px;}
  .tbbanner .slider-txt .bnn-title,
  .tbbanner .slider-txt .bnn-text{ font-size:4rem; }
  
}
@media (max-width: 420px){
  .tbbanner .slider-txt .bnn-title,
  .tbbanner .slider-txt .bnn-text{ font-size:3.8rem; }
}

/*video*/
.tbbanner .swiper-slide .dim {position:absolute; top:0; left:50%; transform:translateX(-50%); width:100%; height:100%; background-color:rgba(0,0,0,.6); z-index: 1;}

.tbbanner{ position:relative; }
.tbbanner::after{display:block;visibility:hidden;clear:both;content:""}
.tbbanner .bnn-wrap{ position:relative; width:100%; height:100vh; max-height:1000px; min-height:500px; margin:0 auto; }
.tbbanner .swiper-container{ width:100%; height:100%; }
.tbbanner .swiper-wrapper{ width:100%; height:100%; top:0; left:0; overflow: hidden;}
.tbbanner .swiper-slide{ position:relative; width:100%; height:100%; overflow: hidden; }
.tbbanner .swiper-slide .bnnVideo{position: absolute; top: 50%; left: 50%;  width: 100%; height: 100%; object-fit: cover; transform: translate(-50%,-50%); }

/** 플레이 & mute 버튼 */
  .videoBtn { display:flex; position:absolute; bottom:50px; right:50px; z-index:10;  }
  .videoBtn a { display:flex; width:35px; height:35px; border-radius:35px; background-color:#fff; margin:0 auto; margin-left:8px; padding:10px; }
  .videoBtn .controlBtn.hidden{ display:none; }
  
  @media (max-width: 768px){
    .videoBtn {bottom:30px; right:30px;}
  } 
  @media (max-width: 560px){
    .videoBtn {bottom:20px; right:20px;}
  }