#visul {position: relative;background: #fff;clear: both;z-index: 3;margin-top: 144px;}
.hero-slide .b-de { position: relative; color: #fff; background: no-repeat 50% / cover; }
.hero-slide .b-de a {display: block;}
.hero-slide .b-de img{
    height: calc(100vh - 210px);
}
.banner-txt { position: absolute; width: 100%; top: 15%; left: 0; z-index: 11; }
.banner-txt h2 { font-size: 70px; transform: translateY(-30px); opacity: 0; }
.banner-txt p { transform: translateY(30px); transition-delay: .5s; opacity: 0; }
.banner-txt p a { font-size: 18px; color: #fff; }
.slick-current.slick-active .banner-txt h2 ,
.slick-current.slick-active .banner-txt p { transform: translateY(0); opacity: 1; }

#banner .item { position: relative; overflow: hidden; text-align: right; }
#banner .item video , #banner .item iframe { position: absolute; width: 100%; height: 100%; left: 0; top: 0; }

#visul .slick-dots { bottom: 10px; }
#visul .slick-dots li button:before { color: #808080; opacity: 1; }
#visul .slick-dots li.slick-active button:before { color: #fff; }

#visul .slick-slider { margin-bottom: 0; }
@media screen and (min-width:641px) {
	.mb-banner{
		display:none;
	}
}

@media screen and (max-width:1440px){
	.hero-slide .b-de img{
	    height: calc(100vh - 204px);
	}
}
@media screen and (max-width:1360px){
	#visul{
	    margin-top: 128px;
	}
	.hero-slide .b-de img{
	    height: calc(100vh - 194px);
	}
	.hero-slide .b-de{
    background-position: 5% 50%;
}
}
@media screen and (max-width:1280px){
	.hero-slide .b-de{
	    background-position: 7% 50%;
	}
	.hero-slide .b-de img{
	    height: calc(100vh - 173px);
	}
	#visul{
    margin-top: 123px;
}
}
@media screen and (max-width:980px) {
	#banner .item video { width: auto; height:100%; }
	#banner .item iframe { height:100%; }
	.banner-txt h2 { font-size: 8vw; }
	.hero-slide .b-de{
	    background-position: 6% 50%;
	}
	.hero-slide .b-de img{
	    height: 640px;
	}
}
@media screen and (max-width:768px){
	#visul{
    margin-top: 91px;
}
}
@media screen and (max-width:640px) {
	.banner-txt { top: 25%; left: 10%; width: 80%; }
	.hero-slide .b-de >img { padding: 30px 0; }
	#visul .slick-slider{display:none;}
}
@media screen and (max-width:480px) {
	.banner-txt { top: 20%; }
	.banner-txt p a { font-size: 4vw; }
	.hero-slide .b-de{
	    background-position: 5% 50%;
	}
	.hero-slide .b-de img{
	    height: 380px;
	}
}