@import url('https://fonts.googleapis.com/css?family=Raleway');

#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%; height: 100vh; }
#banner .slick-slide .art { z-index: 2; overflow: hidden; width: 500px; position: absolute; left: calc(40% - 250px); bottom: 35%; }
#banner .slick-slide h2 { font-size: 60px; line-height: 100%; color: #191919; }
#banner .slick-slide p { margin-top: 20px; font-size: 17px; }
#banner video, #banner iframe { width: 100%; transform: scale(1.5); transform-origin: center; position: absolute; top: 0; left: 0; z-index: 1; }
#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: #ff9785; }
#banner .slick-dots li button:before { text-shadow: 0 0 5px #fff, 0 0 5px #fff; }

#views { width: 100%; }

@media (max-width: 1024px) {
	#banner .slick-slide .art { bottom: 30%; }
	#banner .slick-slide h2 { font-size: 50px; }
	#banner .slick-slide a img { height: 700px; }
	#banner video, #banner iframe { transform: scale(2); }
}
@media (max-width: 768px) {
	#banner video, #banner iframe { width: auto; height: 100%; transform: inherit; }
	#banner .slick-slide h2 { font-size: 40px; }
	#banner .slick-slide .art { bottom: 20%; width: 80%; left: 10%; }
	#banner .slick-slide p { font-size: 16px; }
}
@media (max-width: 640px) {
	#banner .slick-slide a img { height: 550px; }
}
@media (max-width: 480px) {
	#banner .slick-slide h2 { font-size: 30px; }
	#banner .slick-slide .art { bottom: 15%; }
}