#banner {/* position: relative; */margin-bottom: 0;width: 100%;/* top: 0; *//* left: 0; */z-index: 990;margin-top: 80px;}
#banner .slick-slider { margin-bottom: 0; }
#banner .main-slider .item a.Bggg {position: relative;width: 100%;height: 630px;/* background: rgba(253, 253, 253, .15); */display: block;z-index: 2;}
#banner .main-slider .item .banner-txt {position: absolute;width: 100%;top: 14vh;left: 0;z-index: 6;}
#banner .main-slider .item:before{
    position: absolute;
    background: #000;
    opacity: .3;
    width: 100%;
    height: 630px;
    top: 0;
    left: 0;
    z-index: 2;
    content: "";
}
.banner-txt { position: absolute; width: 100%; top: 15%; left: 0; z-index: 11; }
.banner-txt h1{
    font-family: 'Poppins', sans-serif;
    color: white;
    text-align: center;
    font-size: 20px;
    position: relative;
    margin-bottom: 60px;
    padding-bottom: 15px;
    letter-spacing: 0.5px;
}
.banner-txt h1:before {
    position: absolute;
    content: '';
    display: block;
    width: 18px;
    height: 7px;
    background: #dcdddd;
    right: calc(50% - 18px);
    bottom: 0;
    transform: skew(-30deg);
}
.banner-txt h1:after {
    position: absolute;
    content: '';
    display: block;
    width: 18px;
    height: 7px;
    background: #409ad6;
    left: calc(50% - 18px);
    bottom: 0;
    transform: skew(-30deg);
}
.banner-txt h2 {font-size: 40px;transform: translateX(-30px);opacity: 0;/* font-family: 'Kaushan Script', cursive; */text-align: center;text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);color: white;line-height: 120%;}
.banner-txt p {font-size: 25px;transform: translateX(30px);transition-delay: .5s;opacity: 0;text-align: center;color: white;width: 50%;margin: 0 auto;text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);font-weight: normal;}
.banner-txt span{display: block;text-align: center;margin-top: 50px;}
.banner-txt span a{
    color: white;
    border: 1px solid #fff;
    padding: 14px 50px;
    font-size: 14px;
}
.banner-txt span a:hover{opacity:.5;}
.slick-current.slick-active .banner-txt h2 ,
.slick-current.slick-active .banner-txt p {transform: translateX(0);opacity: 1;}

#banner .scrollBox { position: absolute; width: 45px; left: calc((100% - 45px) / 2); bottom: 20px; }
#banner .scrollBox a { position: absolute; width: 100%; height: 100%; display: block; }
#banner .scrollBox p {margin-right: -1px;text-align: center;font-size: 10px;letter-spacing: .135em;color: white;}
#banner .scrollBox .line {margin: 20px auto 0;width: 13px;height: 1px;background: #fff;display: block;animation: scrollline 2.8s cubic-bezier(.86,0,.07,1) infinite;-webkit-animation: scrollline 2.8s cubic-bezier(.86,0,.07,1) infinite;}
#banner .scrollBox .arrow-line { position: relative; overflow: hidden; margin: auto; width: 1px; height: 40px; display: block; }
#banner .scrollBox .arrow-line:before {width: 1px;height: 40px;background: #fff;display: block;animation: scrollarrow1 2.8s cubic-bezier(.86,0,.07,1) infinite;-webkit-animation: scrollarrow1 2.8s cubic-bezier(.86,0,.07,1) infinite;content: "";}
#banner .scrollBox .arrow-top {margin: auto;display: block;width: 0;height: 0;border-style: solid;border-width: 5px 3px 0 3px;border-color: #fff transparent transparent transparent;animation: scrollarrow2 2.8s cubic-bezier(.86,0,.07,1) infinite;-webkit-animation: scrollarrow2 2.8s cubic-bezier(.86,0,.07,1) infinite;}

@keyframes scrollline{ 0%, 80%, to { transform:scale(0); } 50% { transform:scale(1); } }
@-webkit-keyframes scrollline{ 0%, 80%, to { -webkit-transform:scale(0); } 50% { -webkit-transform:scale(1); } }
@keyframes scrollarrow1 { 0% { transform: translateY(-100%); } 50% { transform: translateY(0%); } to { transform: translateY(100%); } }
@-webkit-keyframes scrollarrow1 { 0% { -webkit-transform: translateY(-100%); } 50% { -webkit-transform: translateY(0%); } to { -webkit-transform: translateY(100%); } }
@keyframes scrollarrow2 { 0%, 20% { transform: rotateY(-270deg); } 50% { transform: rotateY(0deg); } to{ transform: rotateY(270deg); } }
@-webkit-keyframes scrollarrow2 { 0%, 20% { -webkit-transform: rotateY(-270deg); } 50% { -webkit-transform: rotateY(0deg); } to{ -webkit-transform: rotateY(270deg); } }

/* bannerBox */
#bannerBox { width: 100%; height: 100vh; }

@media screen and (max-width:980px) {
	.banner-txt p {    width: 65%;}
	#banner{
    position: relative;
}
}
@media screen and (max-width:768px) {
	#banner{margin-top: 60px;}
}
@media screen and (max-width:640px) {
	.banner-txt p {    width: 100%;}
}
@media screen and (max-width:480px) {
	.banner-txt h2{font-size: 35px;}
	.banner-txt p{    font-size: 20px;}
}