@charset "utf-8";
/* banner__09.css */

.banner__09 .winload{ position:absolute; width:100%; height:100%; top:0; left:0; background:#fff; z-index:2; transition:opacity 1s;}
.banner__09 .winload.loaded{ opacity: 0;}


.banner__09{ position:relative; height:100vh !important; max-height:1000px; min-height:620px; margin:0 auto;}
.banner__09.tbsec.section{height:100vh !important;}
.banner__09 .swiper-container{ height:100%; overflow: hidden; }
.banner__09 .swiper-wrapper{ height:100%; }
.banner__09 .swiper-slide{ position:relative; height:100%; overflow: hidden; }
@media (max-width: 768px){
  .banner__09{ height:620px;}
}
/* bnnBgImg.scale -- 슬라이드 배경이미지 컸다가 작아지는  */
.banner__09 .bnnBgImg{ position:absolute; top:50%; left:50%; height:100%; width:100%; background-size: cover; background-repeat: no-repeat;background-position:center center;  transition:transform 3s ease-out; -webkit-transition:transform 3s ease-out; transform:translate(-50%, -50%);}
.banner__09 .bnnBgImg.scale {transform:translate(-50%, -50%) scale(1.2);}
.banner__09 .swiper-slide.swiper-slide-active .bnnBgImg.scale{ transform:translate(-50%, -50%) scale(1); }

.banner__09 .coverDim{ z-index:1; background:rgba(0,0,0,.5); } /* 나머지 사항은 newbiibasic.css에 */

.banner__09 #bnnvdo{ position:absolute; height:100%; width:100%; object-fit: cover;}


/* 슬라이드되고 배너 글씨들 애니메이션 */ 
.banner__09 .sliderCont .line1{transition-delay:.7s;}
.banner__09 .sliderCont .line2{transition-delay:1.1s;}
.banner__09 .sliderCont .line3{transition-delay:1.5s;}

.banner__09 .down-up{  opacity:0; transform:translateY(40px); transition-property: opacity, transform; transition-duration: .9s, .7s; transition-timing-function:linear;  will-change: transform; will-change: opacity;}
.banner__09 .swiper-slide.swiper-slide-active .down-up{opacity:1; transform:translateY(0);}

/* 배너 폰트 기본 */
.banner__09 .sliderCont{font-family: "Nanum Myeongjo",'Noto Sans KR', serif;  width:100%; position:absolute; top:50%; transform:translateY(-50%); left:0; color:#fff;}
/*.banner__09 .slide1 .sliderCont{opacity:0; transform:translateY(40px); transition:1s;}
.banner__09 .slide1 .sliderCont.loaded{opacity:1; transform:translateY(0);}*/


/* swiper-controler01 */
.swiper-controler01{ z-index:1; color:#fff; position:absolute; width:100%; bottom:10%; left:50%; transform:translateX(-50%); text-align:left;}

.swiper-controler01 .custom-paginate{ display:inline-block; margin-right:25px; }
.swiper-controler01 .custom-paginate span{ display:inline-block; vertical-align: middle; line-height:2.6rem;}
/*.swiper-controler01 .custom-paginate .number{ text-align:center; width:15px; font-size: 1.6rem; font-weight:500; }*/
.swiper-controler01 .custom-paginate .line-standard{ position:relative; width:300px; height:3px; background-color: rgba(255,255,255,.3); margin:0 10px;}
.swiper-controler01 .custom-paginate .full-line{ position:absolute; top:0; left:0; width:0; height:100%; background-color:#fff; opacity:0;}



.swiper-controler01 .swiper-button-next,
.swiper-controler01 .swiper-button-prev{ font-weight:600; margin-right:20px; position:relative; color:#fff; font-size:2.2rem; left:auto; right:auto; top:auto; bottom:auto; opacity:1; display:inline-block;  vertical-align: middle; line-height:2.6rem; top:1px;}

@media (max-width: 768px){
  .swiper-controler01{ bottom:40px; }
  .swiper-controler01 .custom-paginate{margin-right:18px;}
  .swiper-controler01 .custom-paginate .line-standard{width:70px; margin:0 6px;}
  .swiper-controler01 .swiper-button-next,
  .swiper-controler01 .swiper-button-prev{ margin-right:18px; }
  .banner__09 .sliderCont{  transform: translateY(-70%);}
}

.banner__09 .swiper-controler01{ transition:opacity 1s 1.3s; opacity: 0;}
.banner__09 .swiper-controler01.loaded{opacity: 1; }