/*添加视频特殊处理*/
/*PC端*/
/*M端*/
.titFont {
  font-family: 'GalanoGrotesqueAltDEMO';
  font-weight: bold;
  background: -moz-linear-gradient(171deg, #b7f600 40%, #fff);
  background: linear-gradient(171deg, #b7f600 40%, #fff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  width: fit-content;
  margin: 0 auto;
  font-size: 0.9rem;
  line-height: 0.9rem;
}
@keyframes ease-right {
  0% {
    opacity: 0;
    transform: translateX(-100px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@-webkit-keyframes ease-right {
  0% {
    opacity: 0;
    transform: translateX(-100px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@-webkit-keyframes reveal {
  0% {
    -webkit-transform-origin: left;
    transform-origin: left;
    -webkit-transform: translateZ(0) skew(45deg) scaleX(0);
    transform: translateZ(0) skew(45deg) scaleX(0);
  }
  0.0001% {
    -webkit-transform-origin: left;
    transform-origin: left;
  }
  50% {
    -webkit-transform-origin: left;
    transform-origin: left;
    -webkit-transform: translateZ(0) skew(45deg) scaleX(1);
    transform: translateZ(0) skew(45deg) scaleX(1);
  }
  50.0001% {
    -webkit-transform-origin: right;
    transform-origin: right;
  }
  to {
    -webkit-transform-origin: right;
    transform-origin: right;
    -webkit-transform: translateZ(0) skew(45deg) scaleX(0);
    transform: translateZ(0) skew(45deg) scaleX(0);
  }
}
@keyframes reveal {
  0% {
    -webkit-transform-origin: left;
    transform-origin: left;
    -webkit-transform: translateZ(0) skew(45deg) scaleX(0);
    transform: translateZ(0) skew(45deg) scaleX(0);
  }
  0.0001% {
    -webkit-transform-origin: left;
    transform-origin: left;
  }
  50% {
    -webkit-transform-origin: left;
    transform-origin: left;
    -webkit-transform: translateZ(0) skew(45deg) scaleX(1);
    transform: translateZ(0) skew(45deg) scaleX(1);
  }
  50.0001% {
    -webkit-transform-origin: right;
    transform-origin: right;
  }
  to {
    -webkit-transform-origin: right;
    transform-origin: right;
    -webkit-transform: translateZ(0) skew(45deg) scaleX(0);
    transform: translateZ(0) skew(45deg) scaleX(0);
  }
}
@keyframes zoomSmall {
  0% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}
@-webkit-keyframes zoomSmall {
  0% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}
@-webkit-keyframes pulse-border {
  0% {
    -webkit-transform: translateZ(0) scale(1);
    transform: translateZ(0) scale(1);
    opacity: 1;
  }
  to {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 0;
  }
}
@keyframes pulse-border {
  0% {
    -webkit-transform: translateZ(0) scale(1);
    transform: translateZ(0) scale(1);
    opacity: 1;
  }
  to {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 0;
  }
}
@keyframes toRight {
  0% {
    right: 0.6rem;
  }
  100% {
    right: 0.7rem;
  }
}
@-webkit-keyframes toRight {
  0% {
    right: 0.6rem;
  }
  100% {
    right: 0.7rem;
  }
}
@keyframes toLeft {
  0% {
    left: 0.25rem;
  }
  100% {
    left: 0.35rem;
  }
}
@-webkit-keyframes toLeft {
  0% {
    left: 0.25rem;
  }
  100% {
    left: 0.35rem;
  }
}
.header {
  transition: height 0.5s ease-in-out;
}
.header .warning {
  position: fixed;
  top: 0;
  width: 100%;
  border: none;
}
.header .nav {
  background: none;
  border-bottom: none;
}
.header .nav.bgB {
  background-color: #000;
}
.header .nav.onBg {
  background: #000000;
}
.header .nav.fixed {
  top: 0;
}
.bannerLogo {
  display: none;
}
.banner-container {
  height: 100vh;
}
.banner-container .bannerBox {
  position: absolute;
  width: 100%;
  height: 100%;
}
.banner-container .bannerBox .swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
}
.banner-container .bannerBox .swiper-slide.swiper-slide-active {
  z-index: 2;
}
.banner-container .bannerBox .swiper-slide.swiper-slide-active .img .banner-img {
  opacity: 1;
  transform: scale(1);
}
.banner-container .bannerBox .swiper-slide.swiper-slide-active .img .banner-logo {
  clip-path: circle(200% at 50% 50%);
  transform: scale(1);
}
.banner-container .bannerBox .swiper-slide.swiper-slide-active .info {
  margin-left: calc(8.33333% + 1rem);
}
.banner-container .bannerBox .swiper-slide.swiper-slide-active .info .tit,
.banner-container .bannerBox .swiper-slide.swiper-slide-active .info .more {
  animation: ease-right 0.7s ease-in-out 0.2s both;
  -webkit-animation: ease-right 0.7s ease-in-out 0.2s both;
}
.banner-container .bannerBox .swiper-slide.swiper-slide-active .info .tit:after,
.banner-container .bannerBox .swiper-slide.swiper-slide-active .info .more:after {
  -webkit-animation: reveal 0.7s cubic-bezier(0.9, 0, 0.1, 1) 0.2s both;
  animation: reveal 0.7s cubic-bezier(0.9, 0, 0.1, 1) 0.2s both;
}
.banner-container .bannerBox .swiper-slide .img {
  width: 100%;
  position: relative;
  overflow: hidden;
}
.banner-container .bannerBox .swiper-slide .img .banner-img {
  object-fit: cover;
  height: 100vh;
  width: 100vw;
  opacity: 0.3;
  transition: opacity 0.7s ease-in-out 200ms, transform 7s ease-in-out;
  transform: scale(1.1);
  object-position: bottom center;
}
.banner-container .bannerBox .swiper-slide .img .banner-logo {
  opacity: 0.4;
  position: absolute;
  width: 16.61rem;
  inset: 0;
  margin: auto;
  clip-path: circle(9% at 50% 50%);
  transition: all 1s;
  transition-delay: 800ms;
  transform: scale(1.1);
}
.banner-container .bannerBox .swiper-slide .info {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 0;
  transition: all 0.7s ease-in-out;
  z-index: 3;
}
.banner-container .bannerBox .swiper-slide .info .curtain:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  left: -1em;
  right: -1em;
  width: auto;
  background: #fff;
  -webkit-transform-origin: left center;
  transform-origin: left center;
  -webkit-transform: skewX(45deg) scaleX(0) translateZ(0);
  transform: skewX(45deg) scaleX(0) translateZ(0);
}
.banner-container .bannerBox .swiper-slide .info .tit {
  font-size: 0.6rem;
  color: #fff;
  display: inline-block;
}
.banner-container .bannerBox .swiper-slide .info .more {
  font-size: 0.2rem;
  color: #bdff00;
  margin-top: 0.3rem;
  display: inline-block;
}
.banner-container .bannerBox .swiper-slide .info .more:after {
  background: #bdff00;
}
.banner-container .bannerBox .swiper-pagination {
  position: absolute;
  left: 0.6rem;
  bottom: 50%;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
  color: #000000;
  font-family: 'GalanoGrotesqueAltDEMO';
  font-size: 20px;
  font-weight: 400;
  width: fit-content;
}
.banner-container .bannerBox .swiper-pagination .swiper-pagination-bullet {
  background: none;
  position: relative;
  display: block;
  opacity: 0.5;
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  margin: 0.26rem 0;
  height: auto;
}
.banner-container .bannerBox .swiper-pagination .swiper-pagination-bullet:before {
  content: "";
  position: absolute;
  left: -0.6rem;
  width: 0.4rem;
  top: 50%;
  height: 0.01rem;
  background: #000000;
  opacity: 0;
  -webkit-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease;
}
.banner-container .bannerBox .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  pointer-events: none;
  opacity: 1;
  font-size: 30px;
}
.banner-container .bannerBox .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:before {
  opacity: 0.5;
}
.videoBox .part-video {
  height: 6.75rem;
  position: relative;
  margin-top: 1rem;
}
.videoBox .part-video .video-thumb {
  position: relative;
  z-index: 1;
  cursor: pointer;
  width: 12rem;
  height: 100%;
}
.videoBox .part-video .video-thumb:hover .play-button::after {
  -webkit-animation: pulse-border 1.5s ease infinite;
  animation: pulse-border 1.5s ease infinite;
}
.videoBox .part-video .video-thumb .play-button-hover-zone {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 50%;
}
.videoBox .part-video .video-thumb .play-button-hover-zone .piece,
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-piece-parallax,
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-piece-wrap,
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces {
  pointer-events: none;
  z-index: -1;
  -webkit-perspective: 300px;
  perspective: 300px;
  transition: all 1s ease-in-out;
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces .thumb-piece-parallax {
  -webkit-transition: -webkit-transform 0.1s ease;
  transition: -webkit-transform 0.1s ease;
  transition: transform 0.1s ease;
  transition: transform 0.1s ease, -webkit-transform 0.1s ease;
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces .thumb-piece-parallax.a .thumb-shadow {
  top: 0%;
  left: 57.7778%;
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces .thumb-piece-parallax.a .piece {
  -webkit-clip-path: polygon(57.77777778% 0%, 62.22222222% 0%, 62.22222222% 7.84313725%, 57.77777778% 7.84313725%);
  clip-path: polygon(57.77777778% 0%, 62.22222222% 0%, 62.22222222% 7.84313725%, 57.77777778% 7.84313725%);
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces .thumb-piece-parallax.b .thumb-shadow {
  top: 92.1569%;
  left: 0%;
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces .thumb-piece-parallax.b .piece {
  -webkit-clip-path: polygon(0% 92.15686275%, 4.44444444% 92.15686275%, 4.44444444% 100%, 0% 100%);
  clip-path: polygon(0% 92.15686275%, 4.44444444% 92.15686275%, 4.44444444% 100%, 0% 100%);
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces .thumb-piece-parallax.c .thumb-shadow {
  top: 15.6863%;
  left: 91.1111%;
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces .thumb-piece-parallax.c .piece {
  -webkit-clip-path: polygon(91.11111111% 15.68627451%, 100% 15.68627451%, 100% 31.37254902%, 91.11111111% 31.37254902%);
  clip-path: polygon(91.11111111% 15.68627451%, 100% 15.68627451%, 100% 31.37254902%, 91.11111111% 31.37254902%);
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces .thumb-piece-parallax.d .thumb-shadow {
  top: 76.4706%;
  left: 62.2222%;
  width: 13.3333%;
  height: 23.5294%;
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces .thumb-piece-parallax.d .piece {
  -webkit-clip-path: polygon(62.22222222% 76.47058824%, 75.55555556% 76.47058824%, 75.55555556% 100%, 62.22222222% 100%);
  clip-path: polygon(62.22222222% 76.47058824%, 75.55555556% 76.47058824%, 75.55555556% 100%, 62.22222222% 100%);
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces .thumb-piece-parallax .thumb-piece-wrap {
  transform: translateZ(25px);
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces .thumb-piece-parallax .thumb-piece-wrap .thumb-shadow {
  width: 4.44444%;
  height: 7.84314%;
  opacity: 1;
  position: absolute;
  -webkit-box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
}
.videoBox .part-video .video-thumb .play-button-hover-zone .thumb-pieces .thumb-piece-parallax .thumb-piece-wrap .piece {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}
.videoBox .part-video .video-thumb .video-overflow {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  overflow: hidden;
}
.videoBox .part-video .video-thumb .video-overflow video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.videoBox .part-video .video-thumb .play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -0.4rem;
  margin-left: -0.4rem;
  width: 0.8rem;
  height: 0.8rem;
  cursor: pointer;
  border: none;
  background: none;
}
.videoBox .part-video .video-thumb .play-button::after,
.videoBox .part-video .video-thumb .play-button::before {
  content: "\e654";
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  width: 0.8rem;
  height: 0.8rem;
  text-align: center;
  font-size: 0.8rem;
  -webkit-transition: color 0.35s ease;
  transition: color 0.35s ease;
  color: #fff;
  z-index: 3;
  -webkit-transform-origin: center;
  transform-origin: center;
}
.videoBox .part-video .video-text {
  z-index: 3;
  position: absolute;
  top: 3.1rem;
  right: 0;
}
.videoBox .part-video .video-text .dont-break-out h3.tit {
  font-size: 0.9rem;
  line-height: 0.9rem;
  background: -moz-linear-gradient(165deg, #b7f600 40%, #fff);
  background: linear-gradient(165deg, #b7f600 40%, #fff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  width: fit-content;
  margin-bottom: 0.15rem;
  font-weight: bold;
  font-family: 'GalanoGrotesqueAltDEMO';
}
.videoBox .part-video .video-text .dont-break-out h4.slogan {
  font-size: 0.24rem;
  line-height: 0.48rem;
  color: #bdff00;
  position: relative;
  font-weight: bold;
  padding-left: 0.75rem;
}
.videoBox .part-video .video-text .dont-break-out h4.slogan::before {
  display: inline-block;
  content: " ";
  text-shadow: none;
  background: #bdff00;
  width: 0.8rem;
  height: 0.02rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -0.3rem;
}
.aboutInfo {
  margin-top: 2.4rem;
}
.aboutInfo .content {
  padding-bottom: 3rem;
}
.aboutInfo .content .img-box {
  position: relative;
  margin-right: -1rem;
}
.aboutInfo .content .img-box .icon {
  position: absolute;
}
.aboutInfo .content .img-box .ace-logo {
  position: absolute;
  width: 4.55rem;
  top: 50%;
  left: 0.35rem;
  margin-top: -32%;
}
.aboutInfo .content .img-box .icon1 {
  width: 1rem;
  top: -0.13rem;
  left: -0.5rem;
}
.aboutInfo .content .img-box .icon2 {
  width: 0.5rem;
  top: 1.95rem;
  left: 2rem;
}
.aboutInfo .content .img-box .icon3 {
  width: 1rem;
  bottom: 0.1rem;
  left: -0.5rem;
}
.aboutInfo .content .img2 {
  width: 5.51rem;
}
.aboutInfo .content .info {
  color: #fff;
}
.aboutInfo .content .info h3.tit {
  font-size: 0.6rem;
  line-height: 0.6rem;
  background: -moz-linear-gradient(164deg, #b7f600 30%, #fff 80%);
  background: linear-gradient(164deg, #b7f600 30%, #fff 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  width: fit-content;
  margin: 1.1rem 0 0 0;
  font-weight: bold;
  font-family: 'GalanoGrotesqueAltDEMO';
}
.aboutInfo .content .info h4.slogan {
  font-size: 0.26rem;
  line-height: 0.26rem;
  color: #bdff00;
  position: relative;
  padding-left: 1.3rem;
}
.aboutInfo .content .info h4.slogan::after {
  display: inline-block;
  content: " ";
  text-shadow: none;
  background: #bdff00;
  width: 0.8rem;
  height: 0.02rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0rem;
}
.aboutInfo .content .info .con {
  width: 6.8rem;
  margin-top: 0.4rem;
  font-size: 0.18rem;
  line-height: 0.26rem;
}
.aboutInfo .content .info .con p {
  margin-bottom: 0.3rem;
}
.footer {
  background: url("../image/footer-bottom.jpg") no-repeat;
  background-size: 100% 0.36rem;
  background-position: bottom center;
}
@media (max-width: 750px) {
  .header .nav .navBox .iconfont {
    color: #fff;
  }
  .header-right {
    background: rgba(189, 255, 0, 0.38);
  }
  .container-fluid .banner-container {
    height: 100vh;
  }
  .container-fluid .videoBox {
    padding-top: 0;
    margin-bottom: 0;
  }
  .container-fluid .videoBox .part-video {
    width: 7rem;
    height: 3.94rem;
    margin-left: 0.25rem;
  }
  .container-fluid .videoBox .part-video .video-thumb {
    width: 100%;
  }
  .container-fluid .videoBox .part-video .video-thumb .play-button {
    margin-top: -0.4rem;
    margin-left: -0.4rem;
  }
  .container-fluid .videoBox .part-video .video-thumb .play-button::after,
  .container-fluid .videoBox .part-video .video-thumb .play-button::before {
    width: 0.8rem;
    height: 0.8rem;
    font-size: 0.8rem;
  }
  .container-fluid .videoBox .part-video .video-text {
    bottom: -0.9rem;
    top: inherit;
    right: inherit;
    left: 0;
  }
  .container-fluid .videoBox .part-video .video-text .dont-break-out h3.tit {
    padding-left: 0.4rem;
  }
  .container-fluid .videoBox .part-video .video-text .dont-break-out h4.slogan {
    font-size: 0.24rem;
    line-height: 0.24rem;
    padding-left: 1.3rem;
  }
  .container-fluid .videoBox .part-video .video-text .dont-break-out h4.slogan::before {
    width: 0.8rem;
    height: 0.02rem;
    left: 0.1rem;
  }
  .container-fluid .aboutInfo {
    padding: 0rem 0.3rem 0;
    margin-top: 2.1rem;
  }
  .container-fluid .aboutInfo .content {
    padding-bottom: 2rem;
    display: block;
  }
  .container-fluid .aboutInfo .content .img-box {
    float: left;
    margin: 0 0 0 -0.1rem;
  }
  .container-fluid .aboutInfo .content .img-box .img2 {
    width: 6.8rem;
  }
  .container-fluid .aboutInfo .content .img-box .ace-logo {
    position: absolute;
    width: 6.2rem;
    top: 50%;
    left: 50%;
    transform: translateX(-50%);
  }
  .container-fluid .aboutInfo .content .img-box .icon1 {
    width: 0.8rem;
    top: -0.23rem;
    left: 0rem;
  }
  .container-fluid .aboutInfo .content .img-box .icon2 {
    width: 0.63rem;
    top: 2.5rem;
    left: 2.38rem;
  }
  .container-fluid .aboutInfo .content .img-box .icon3 {
    width: 0.9rem;
    bottom: 0.5rem;
    left: 0rem;
  }
  .container-fluid .aboutInfo .content .info {
    width: 6rem;
    margin-left: 0.5rem;
  }
  .container-fluid .aboutInfo .content .info h3.tit {
    margin: -0.3rem 0 0 0;
    z-index: 1;
    position: relative;
  }
  .container-fluid .aboutInfo .content .info h4.slogan {
    font-size: 0.24rem;
    line-height: 0.24rem;
    padding-left: 1.3rem;
  }
  .container-fluid .aboutInfo .content .info h4.slogan::after {
    width: 0.8rem;
    height: 0.02rem;
  }
  .container-fluid .aboutInfo .content .info .con {
    width: 100%;
    margin: 0.2rem auto 0;
    font-size: 0.24rem;
    line-height: 0.3rem;
  }
}
