.video-body {
  background-color: #F7F9FD;
}
.banner-bar {
  height: 180px;
  text-align: center;
  background-repeat: no-repeat, no-repeat;
  background-position: center, center;
  font-size: 0;
}
.banner-bar:after {
  content: '';
  display: inline-block;
  vertical-align: middle;
  height: 100%;
  width: 0;
}
.banner-bar .banner-img {
  width: 357px;
  vertical-align: middle;
  display: inline-block;
}
.banner-bar.video-banner {
  background-image: url("../img/banner-bg-video.png"), linear-gradient(90deg, #7028E4 0%, #E5B2CA 100%);
}
.banner-bar.video-banner .banner-img {
  width: 431px;
}
.video-tab {
  padding: 30px 0 10px 0;
}
.video-tab a {
  display: inline-block;
  cursor: pointer;
  padding: 6px 0;
  margin: 0 20px;
}
.video-tab a:hover {
  color: #fda32b;
}
.video-tab a.active {
  color: #fda32b;
  border-bottom: 2px solid #fda32b;
}
.video-cont {
  height: 200px;
  font-size: 14px;
  background: #FFFFFF;
  border-radius: 4px;
  margin: 30px 20px 20px 20px;
  cursor: pointer;
  text-align: center;
  background-image: linear-gradient(135deg, #7173ec, #7dc2fe);
  color: #fff;
}
.video-cont .title {
  padding-top: 65px;
  font-size: 18px;
  margin-bottom: 20px;
}
.video-cont .text {
  opacity: .65;
}
.dialog-view .dialog-body {
  width: 100%;
  max-width: 1000px;
}
.footer-bar {
  background: #1D1F38;
  font-size: 12px;
  color: #7782A1;
  text-align: center;
  padding: 40px 0;
}
.footer-bar .qr-code-wrap {
  margin-bottom: 12px;
}
.footer-bar .qr-code-wrap img {
  display: block;
  margin: 0 auto 10px;
  width: 100px;
  height: 100px;
  background-color: #e1eaf1;
}
.footer-bar .qr-code-wrap p {
  display: none;
}
.footer-bar .copyright {
  margin: 0 12px;
}
@media screen and (max-width: 600px) {
  .video-tab {
    padding: 12px 0;
  }
  .video-tab a {
    margin: 0 10px;
  }
  .video-cont {
    margin: 0 0 12px;
  }
}
@media screen and (min-width: 600px) {
  .banner-bar.video-banner {
    background-image: url("../img/banner-bg-video.png"), linear-gradient(90deg, #7028E4 0%, #E5B2CA 100%);
  }
}
@media screen and (min-height: 800px) {
  .video-body {
    padding-bottom: 250px;
  }
  .footer-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
  }
}
@media screen and (min-width: 600px) and (max-width: 780px) {
  .wrap-size {
    margin: 0 .24rem;
  }
}
