#banner{
    margin-top: 120px;
}
#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:50% 50%;background-size:cover;width:100%;height:100%;overflow:hidden}
#banner .slick-slide a img{opacity:.5;width:100%;}
.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: 0px;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: #eee;}

@media (max-width: 1440px) {
	#banner .slick-slide a h2{font-size: 40px;}
	#banner {margin-top: 123px;}
	#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: 1366px) {
#content {
    margin-top: 87vh;
}
}
@media (max-width: 1366px) {
#content {
    margin-top: 82vh;}
#banner .slick-slide a img {
    opacity: .5;
    width: 100%;
    height: 71vh;
}
}
@media (max-width: 1024px) {
	#banner .slick-slide a img{height: 56vh;}
	#content{    margin-top: 70vh;}
	#banner .slick-slide a .art{    width: 80%;
    left: 10%;}
#banner .slick-slide a {
    background-position: 48% 50%;
}
#content {
    position: relative;
    margin-top: 70vh;
    background: #eee;
}
}

@media (max-width: 960px) {
#banner .slick-slide a img {
    height: 55vh;
}
#content {
    position: relative;
    margin-top: 69vh;
    background: #eee;
}
}

@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: 280px;}
	#content{margin-top: 370px;}
	#content:after{    border-width: 0 0 70px 100vw;
    top: -70px;}
	#banner .slick-slide a h2{ font-size:32px;}
	#banner .slick-dots{bottom: 10%;}
#banner .slick-slide a img {
    height: 250px;
}
}

@media (max-width: 380px){
#banner .slick-slide a img {
    height: 220px;
}
	#content {
    margin-top: 339px;
}
}