@import "https://fonts.googleapis.com/css?family=Raleway";
#banner { background:#069;}
#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;overflow:hidden}
#banner .slick-slide >a{display:block;position:relative;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;overflow:hidden;}
#banner .slick-slide a img{width:100%}
#banner .slick-slide .art{overflow:hidden;width:600px;position:absolute;left: calc(50% - 400px);bottom: 150px;z-index: 5;padding:50px 100px;color: #fff;display: none;}
#banner .slick-slide .art a.link{
	content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
#banner .slick-slide h2{font-size: 60px;line-height:100%;text-align: center;}
#banner .slick-slide p{line-height: 130%;font-size: 20px;text-align: center;margin-top: 40px;}
#banner .slick-slide b{margin-top: 60px;display:block;text-align: center;}
#banner .slick-slide b a{font-size: 18px;color: #f2f2f2;font-family:'Raleway',sans-serif;transition:all linear .3s;}
#banner video,#banner iframe{position: absolute;top: 0;left: 0;z-index: 1;width: auto;height: 100%;transform: scale(1.2);transform-origin: left center 0;}
#banner .slick-dots{bottom: 3%;text-align:left;margin-left:20px;width:28px;}
#banner .slick-dots li button:before,#banner .slick-dots li.slick-active button:before{color: #000000;}
#banner .slick-dots li button:before{text-shadow:0 0 5px #fff,0 0 5px #fff}
#views{width:100%; position:relative;overflow: hidden;}

@media (min-width: 1025px) {
	#banner .slick-slide b a:hover{opacity:.7}
	}
@media (max-width: 1440px) {
	#banner .slick-slide .art{bottom: 50px;}
}
@media (max-width: 1280px) {
	#views:before{border-width: 100vh 280px 0 0;}
	#views:after{border-width: 50px 0 0 100vw;}
}
@media (max-width: 1024px) {
	#banner{margin-top:56px}
	#banner .slick-slide >a{width:100%}
	#views:before,
	#views:after{ display:none;}
	#banner .slick-slide .art{bottom: 0;}
	#banner .slick-slide h2{font-size: 50px;}
	#banner .slick-slide p{font-size: 18px;    margin-top: 20px;}
}
@media (max-width: 768px) {
	#banner .slick-slide a img{height: 450px;}
	#banner .slick-slide .art{left: 0;padding: 50px 70px;width: calc(100% - 140px);}
	#banner .slick-slide h2{font-size: 40px;}
	#banner .slick-slide b{margin-top: 30px;}
}
@media (max-width: 480px) {
	#banner .slick-slide h2{font-size: 32px;}
	#banner .slick-slide p{font-size: 16px;}
	#banner .slick-slide >a{
    background-position: 80% 50%;
}
#banner .slick-slide a img {
    height: 320px;
}
}