#banner , #banner .item { position: relative; background: #fff; z-index: 100; }
#banner .item a { position: absolute; width: 100%; height: 100%; background: rgb(31 31 31 / .3); top: 0; left: 0; z-index: 2; }
#banner .info { position: absolute; width: 100%; top: 25vh; left: 0; z-index: 3; }
#banner .info h3 { display: block; line-height: 110%; text-align: center; font-size: 40px; font-weight: 700; color: #fff; }
#banner .info p { margin-top: 10px; text-align: center; font-weight: 100; color: #fff; }
#banner .img { position: relative; width: 100vw; height: 100vh; background: no-repeat 50% / cover; }
#banner .img img , #banner .img video , #banner .img iframe { position: absolute; width: 100vw; height: 100vh; left: 0; top: 0; }
#banner .slick-active .img { -webkit-transform: scale(1); transform: scale(1); animation: banerBg 6s infinite linear; -webkit-animation: banerBg 6s infinite linear; }

/* scrolldown */
#scrolldown { position: absolute; padding: 0 0 25px 10px; border-left: 1px #fff solid; letter-spacing: .3em; font-weight: 300; font-size: 12px; color: #fff; white-space: nowrap; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; bottom: 0; left: 30px; animation: godown 1s infinite linear; -webkit-animation: godown 1s infinite linear; }

@-webkit-keyframes banerBg { 0% { -webkit-transform: scale(1); } 100% { -webkit-transform: scale(1.1); } }
@keyframes banerBg { 0% { transform: scale(1); } 100% { transform: scale(1.1); } }

@-webkit-keyframes godown { 0% , 100% { padding: 0 0 25px 10px; } 50% { padding: 10px 0 15px 10px; } }
@keyframes godown { 0% , 100% { padding: 0 0 25px 10px; } 50% { padding: 10px 0 15px 10px; } }