@charset "utf-8";

#main { background-color:#000; height:100vh }

#visual { position:relative; width:100%; height:100%; overflow:hidden; }
#visual .swiper-container { height:100vh; }
#visual .swiper-slide { overflow:hidden; }
#visual .swiper-slide .pc { display:block; position:absolute; z-index:1; }
#visual .swiper-slide .mobile { display:none; position:absolute; }
#visual .visual_box { position:absolute; width:100%; height:100%; left:0; top:0; background-size:cover; background-position:center; }
#visual .visual_box .video-box { width:100%; height:100%; }
#visual .visual_box video { position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; -o-object-fit:cover;  }

#visual .swiper-slide .mvisualImage { position:absolute; width:100%; height:100%; left:0; top:0; z-index:1; }
#visual .mvisualImage { overflow:hidden; background-position:center; background-size:cover; background-repeat:no-repeat; }
#visual .swiper-slide.swiper-slide-active .mvisualImage { animation:bgs1 8s; animation-fill-mode:both; }
#visual .visu02 .mvisualImage {  background-image:url(/img/main/bg_visual2.jpg); }
#visual .swiper-slide .visual_txt { position:absolute; top:50%; left:0; z-index:100; transform:translateY(-50%); width:100%; text-align:center; }
#visual .swiper-slide .visual_txt .vs_tit { font-family:var(--font-family); color:#fff; font-size:60px; font-weight:800; }
#visual .swiper-slide .visual_txt .vs_title1 span,
#visual .swiper-slide .visual_txt .vs_title3 span { font-family:var(--font-family); line-height:1.15; font-weight:800; /* text-shadow:#fff 2px 0 5px; */}
#visual .swiper-slide .visual_txt .vs_title2 { opacity:0; line-height:1.4; overflow:hidden; }
#visual .swiper-slide .visual_txt .vs_title2 span { font-family:var(--font-family); display:block; font-weight:800; }
#visual .swiper-slide .visual_txt .txt { opacity:0; color:rgba(255,255,255,1); font-size:22px; font-weight:400; margin-top:40px; }
#visual .swiper-slide.swiper-slide-active .visual_txt .vs_title1,
#visual .swiper-slide.swiper-slide-active .visual_txt .vs_title2,
#visual .swiper-slide.swiper-slide-active .visual_txt .vs_title3 { opacity:1; }
#visual .swiper-slide.swiper-slide-active .visual_txt .vs_title1 span > span { animation:blur_txt 1.0s 2s; animation-fill-mode:both; }
#visual .swiper-slide.swiper-slide-active .visual_txt .vs_title3 span > span { animation:blur_txt 1.0s 0.8s; animation-fill-mode:both; }
#visual .swiper-slide.swiper-slide-active .visual_txt .vs_title2 span { animation:ani_3 1.0s 0.8s; animation-fill-mode:both; }
#visual .swiper-slide.swiper-slide-active .visual_txt .txt { animation:ani_5 1.0s 1.3s; animation-fill-mode:both; }
#visual .visu01.swiper-slide.swiper-slide-active .visual_txt .txt { animation:ani_5 1.0s 4.5s; animation-fill-mode:both; }
#visual .visu02.swiper-slide.swiper-slide-active .visual_txt .txt { animation:ani_5 1.0s 3.5s; animation-fill-mode:both; }
#visual .visu03.swiper-slide.swiper-slide-active .visual_txt .txt { animation:ani_5 1.0s 3.5s; animation-fill-mode:both; }

#visual .visu01 .visual_txt .txt span { text-shadow:0 0 5px rgba(0,0,0,1); }

#visual .control_box { position:absolute; left:0; bottom:26%; width:100%; }
#visual .swiper-pagination { position:relative; display:flex; align-items:center; justify-content:center;  }
#visual .swiper-pagination .swiper-pagination-bullet { display:flex; align-items:center; justify-content:center; position:relative; opacity:1; background-color:transparent; margin:0 10px; width:auto; height:auto; border:none; outline:none }
#visual .swiper-pagination .swiper-pagination-bullet em { position:relative; font-family:var(--fontMon-family); font-size:14px; color:rgba(255,255,255,0.5); font-weight:400; transition:all 0.3s ease-in-out; }
#visual .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active em { color:#fff; font-weight:600 }
#visual .swiper-pagination .swiper-pagination-bullet span { display:inline-block; }
#visual .swiper-pagination .swiper-pagination-bullet .sline { position:relative; width:0; height:1px; background-color:rgba(255,255,255,0.2); margin-left:10px; transition:all 0.3s ease-in-out; text-align:left; }
#visual .swiper-pagination .swiper-pagination-bullet .sline .line { position:absolute; left:0; top:0; width:0; height:100%; background-color:#fff; }
#visual .swiper-pagination .swiper-pagination-bullet-active .sline { width:65px; }

.swiper-btn { width:45px; height:45px; z-index:2; position:absolute; top:50%; transform:translateY(-50%); display:flex; align-items:center; justify-content:center; margin:0; padding:0 }
.swiper-btn i { color:rgba(255,255,255,0.6); font-size:45px; }
.swiper-btn.swiper-button-prev { left:40px; }
.swiper-btn.swiper-button-next { right:40px; }
.swiper-button-next:after, 
.swiper-button-prev:after { display:none; }
@media screen and (max-width:1280px){
    #visual .swiper-slide .visual_txt .vs_tit { font-size:50px; }
    #visual .swiper-slide .visual_txt .txt { font-size:20px; margin-top:35px; }
}
@media screen and (max-width:1024px){
    #visual .swiper-slide .visual_txt .vs_tit { font-size:38px; }
    #visual .swiper-slide .visual_txt .txt { font-size:18px; margin-top:30px; }
    #visual .control_box { bottom:28%; }
    #visual .swiper-pagination .swiper-pagination-bullet em { font-size:13px; }
    #visual .swiper-pagination .swiper-pagination-bullet-active .sline { width:55px; }
    .swiper-btn { width:40px; height:40px; }
    .swiper-btn i { font-size:38px; }
    .swiper-btn.swiper-button-prev { left:20px; }
    .swiper-btn.swiper-button-next { right:20px; }
}
@media screen and (max-width:640px){
    #visual .swiper-slide .visual_txt .vs_tit { font-size:28px; padding:0 50px; }
    #visual .swiper-slide .visual_txt .txt { font-size:16px; margin-top:25px; }
    #visual .control_box { bottom:30%; }
    #visual .swiper-pagination .swiper-pagination-bullet em { font-size:12px; }
    #visual .swiper-pagination .swiper-pagination-bullet-active .sline { width:45px; }
    .swiper-btn { width:40px; height:40px; }
    .swiper-btn i { font-size:30px; }
    .swiper-btn.swiper-button-prev { left:0; }
    .swiper-btn.swiper-button-next { right:0; }
}