﻿.banner{position:relative;}
.banner-title {
    position: absolute;
    left: 50%;
    top: 50%;
    text-align: center;
    transform: translate(-50%,-50%);
    color: #fff;
}
.engTitle {
    font-size: 1.25rem;
    text-transform: uppercase;
    line-height: 1.2;
    position: relative;
    z-index: 1;
}
.chTitle {
    font-weight: bold;
    font-size: 2.75rem;
}
.introduct {
    font-size: 6rem;
    font-weight: bold
}
.desc {
    font-size: 1rem;
    margin-top: 2rem;
}
.mySwiper2 {
    width: 66.66%;
    margin-top: 5rem;
}
.mySwiper{margin-bottom:8rem;padding-left:16.666%}
.mySwiper .swiper-slide{cursor:pointer;}
.video-title {
    font-weight: bold;
    font-size: 1.75rem;
    margin: 2rem 0;
}
.navigation {
    display: flex;
    justify-content: space-between;
    margin: 3rem 0 2rem;
}
.more__link-swiper {
    border: 1px solid #000;
    display: inline-block;
    padding: 0 0.5rem 0 0.75rem;
    color: #000;
    padding: 15px 10px;
}
.more__link-prev {
    transform: rotate(180deg);
    margin-right: 1rem;
}
.more__link-swiper .buttonIn {
    width: 30px;
}
.sub-title{font-weight:bold;margin-top:.5rem}
.thumbs{position:relative;line-height:0}
.thumbs-mask{position:absolute;width:100%;height:100%;top:0;left:0;background:#000;opacity:0}
.mySwiper .swiper-slide:hover .thumbs-mask,.mySwiper .swiper-slide-thumb-active .thumbs-mask{opacity:.5}