#banner .bannerTran{display:-ms-flexbox;display:-webkit-flex;display:-webkit-box;display:flex;margin:0 auto;position:relative;overflow:hidden;height:auto;min-height:200px;z-index:1;min-height:34.4271vw}
.swiper-wrapper .slick-slider,.swiper-wrapper .slick-slider .slick-list,.swiper-wrapper .slick-slider .slick-track,.swiper-wrapper .slick-slider li{width:100%;height:100%;display:block}
#banner .slick-slide{position:relative}
#banner .slick-slide a{display:block;position:relative;background-repeat:no-repeat;background-position: 21% 50%;background-size:cover;width:100%;height:100%;overflow:hidden;}
#banner .slick-slide a img{opacity:.5;width:100%;height:100vh;}
.video a,.youtube a{text-shadow:0 0 7px #fff}
#banner .slick-slide a .art{position:absolute;width:800px;height:145px;left:calc(50% - 400px);top:calc(50% - 72px);z-index:2;text-shadow:0 0 8px #484848;overflow:hidden}
#banner .slick-slide a h2{font-size:50px;line-height:100%;text-align:center;color:#fff;font-weight:400}
#banner .slick-slide a p{margin-top:30px;line-height:110%;font-size:30px;color:#fff;text-align:center}
#banner video,#banner iframe{position:absolute;width:100%;top:0;right:0;z-index:1}
#banner .slick-dots{bottom: 60%;text-align:left;margin-left: 20px;width: 28px;}
.slick-dots li button:before{text-shadow:0 0 5px #fff,0 0 5px #fff}
#views{position:fixed;top:0;left:0;bottom:0;width:100%;height:100vh}
#content{position:relative;margin-top:100vh;background:#fff}
#content:after{/* content:''; */width:0;height:0;border-style:solid;border-width:0 0 150px 100vw;border-color:transparent transparent #319ad4;position:absolute;top:-150px;}
.page #content:after{border-color:transparent transparent #f6f6f6}

@media (max-width: 1440px) {
	#banner .slick-slide a h2{font-size: 40px;}
	#banner .slick-slide a p{font-size: 22px;}
	#banner .slick-slide a .art{top: calc(50% - 27px);    height: auto;}
	#content:after{border-width: 0 0 100px 100vw;top: -100px;}
}
@media (max-width: 1024px) {
	#banner .slick-slide a img{    height: 700px;}
	#content{    margin-top: 700px;}
	#banner .slick-slide a .art{    width: 80%;
    left: 10%;}
}
@media (max-width: 768px) {
#banner video,#banner iframe{display:none}
.video a,.youtube a{text-shadow:0 0 3px #fff,0 0 3px #fff}
	#banner .slick-slide a .art{top: 40%;}
}
@media (max-width: 480px) {
	#banner .slick-slide a img{    height: 550px;}
	#content{    margin-top: 550px;}
	#content:after{    border-width: 0 0 70px 100vw;
    top: -70px;}
	#banner .slick-slide a h2{ font-size:32px;}
	#banner .slick-dots{    bottom: 10%;}
}