@import "https://fonts.googleapis.com/css?family=Raleway";
#banner { background:#fff;}
#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;}
#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;display: none;}
#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:60%;text-align:left;margin-left:20px;width:28px}
#banner .slick-dots li button:before,#banner .slick-dots li.slick-active button:before{    color: #3755e6;}
#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}
#views:after{
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 100px 0 0 100vw;
    border-color: transparent transparent transparent #fff;
    position: absolute;
    bottom: 0;
    right: 0;
}
#views:before{
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 100vh 350px 0 0;
    border-color: #fff transparent transparent transparent;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
    display: none;
}
}
@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%}
#banner video,#banner iframe{
}
#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 video,#banner iframe{display:none}
#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;}

}