@charset "UTF-8";

.flex-grow[data-v-4014a192] {
  flex-grow: 1
}

.el-carousel__item h3[data-v-4014a192] {
  display: flex;
  color: #475669;
  opacity: .75;
  line-height: 300px;
  margin: 0
}

.el-carousel__item[data-v-4014a192]:nth-child(2n) {
  background-image: url(/assets/section-1-bg-about-BkNdaEz3.jpg);
  background-size: cover;
  background-repeat: no-repeat
}

.el-carousel__item[data-v-4014a192]:nth-child(odd) {
  background-image: url(/assets/section-9-bg-C89-dW_V.jpg);
  background-size: cover;
  background-repeat: no-repeat
}

.ad-text[data-v-4014a192] {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  text-align: center;
  width: 100%
}

.ad-text h1[data-v-4014a192] {
  font-size: 50px;
  font-weight: 900
}

.ad-text span[data-v-4014a192] {
  display: inline-block;
  width: 900px;
  font-size: 18px;
  line-height: 80px
}

@media (max-width: 768px) {
  .ad-text[data-v-4014a192] {
    font-size: 18px
  }
}

.award[data-v-4014a192] {
  width: 100%;
  height: 500px;
  background: linear-gradient(45deg, #8fe1f1 25%, transparent 25%, transparent 75%, #f6f5f5 75%), linear-gradient(45deg, #c7e0e1, #c8d6d9);
  background-size: 80px 0px, 100% 100%;
  background-attachment: fixed;
  display: flex;
  align-items: center;
  justify-content: center
}

.award img[data-v-4014a192] {
  margin-right: 30px;
  width: 300px;
  height: 340px
}

.award .award-title[data-v-4014a192] {
  width: 800px;
  color: #fff
}

.award .award-title .title[data-v-4014a192] {
  font-size: 60px;
  margin-bottom: 20px;
  line-height: 70px
}

.award .award-title span[data-v-4014a192] {
  font-size: 20px
}

.award .award-title .title-two[data-v-4014a192] {
  font-size: 30px;
  margin-top: 20px
}

.award .award-title .contact[data-v-4014a192] {
  width: 150px;
  height: 60px;
  border-radius: 20px;
  text-align: center;
  line-height: 60px;
  font-size: 20px;
  margin-top: 20px;
  background-color: #0f0
}

.common-plan[data-v-4014a192] {
  width: auto;
  height: 400px
}

.common-plan .cards[data-v-4014a192] {
  width: 400px;
  height: 400px
}

.common-plan .common-plan-title[data-v-4014a192] {
  text-align: center;
  margin-left: 40px;
  margin-top: 50px;
  transition: transform .5s ease-in-out
}

.common-plan .common-plan-title p[data-v-4014a192] {
  font-size: 40px;
  font-weight: 700;
  opacity: 0;
  transform: translate(-50px);
  background: linear-gradient(90deg, #00a6ff, #0f0);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent
}

.common-plan .common-plan-title span[data-v-4014a192] {
  display: inline-block;
  font-size: 18px;
  padding: 20px 0
}

.common-plan .common-img[data-v-4014a192] {
  width: 100%;
  padding: 20px 0
}

.common-plan .common-img .horizontal-list[data-v-4014a192] {
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 30px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 auto !important;
  width: 100% !important;
  white-space: nowrap
}

.common-plan .common-img .horizontal-list .app-icon[data-v-4014a192] {
  opacity: 0;
  transform: translate(-50px);
  width: 200px;
  height: 200px;
  -o-object-fit: contain;
  object-fit: contain;
  display: block
}

.Platform .Platform-title[data-v-4014a192] {
  text-align: center
}

.Platform .Platform-title p[data-v-4014a192] {
  font-size: 40px;
  background: linear-gradient(90deg, #00a6ff, #0f0);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent
}

.Platform .Platform-title span[data-v-4014a192] {
  font-size: 20px
}

.Platform .Platform-img[data-v-4014a192] {
  width: 60%;
  height: 400px;
  margin-left: 350px;
  margin-top: 50px
}

.apps[data-v-4014a192] {
  width: 90%;
  max-width: 1000px;
  height: auto;
  margin: 60px auto
}

.apps .apps-title[data-v-4014a192] {
  text-align: center;
  font-size: 30px;
  font-weight: 700;
  margin-bottom: 40px;
  background: linear-gradient(90deg, #00a6ff, #0f0);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent
}

.apps .apps-img[data-v-4014a192] {
  display: flex;
  justify-content: center;
  align-items: center
}

.apps ul[data-v-4014a192] {
  widows: 100%;
  height: 100%;
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px
}

.apps ul .app-icon[data-v-4014a192] {
  opacity: 0;
  transform: translate(-50px);
  transition: all .6s ease
}

.apps ul .slide-in-bounce[data-v-4014a192] {
  animation: slideInBounce-4014a192 1s cubic-bezier(.215, .61, .355, 1) forwards
}

.Data-detection[data-v-4014a192] {
  height: 500px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: transform .5s ease-in-out
}

.Data-detection .Data-detection-img[data-v-4014a192] {
  width: 300px;
  height: 400px;
  border-radius: 20px;
  margin-left: 50px
}

.Data-detection .Data-detection-title[data-v-4014a192] {
  width: 400px;
  margin-left: 50px
}

.Data-detection .Data-detection-title p[data-v-4014a192] {
  font-size: 30px;
  font-weight: 700;
  color: #02b2b5;
  padding-bottom: 20px
}

.Data-detection .Data-detection-title span[data-v-4014a192] {
  display: inline-block;
  font-size: 16px;
  line-height: 30px
}

.Story[data-v-4014a192] {
  width: 100%;
  height: 700px;
  background: linear-gradient(45deg, #8fe1f1 25%, transparent 25%, transparent 75%, #f6f5f5 75%), linear-gradient(45deg, #c7e0e1, #c8d6d9);
  background-size: 80px 0px, 100% 100%;
  background-attachment: fixed
}

.Story .Story-title[data-v-4014a192] {
  font-size: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 40px;
  padding-bottom: 50px;
  color: #fff
}

.Story .num-One[data-v-4014a192] {
  margin-bottom: 50px
}

.Story .Story-num[data-v-4014a192] {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 50px;
  color: #fff
}

.Story .Story-num div[data-v-4014a192] {
  width: 600px;
  text-align: center
}

.Story .Story-num div .count[data-v-4014a192] {
  transition: all .1s ease
}

.Story .Story-num div p[data-v-4014a192] {
  font-size: 100px;
  font-weight: 400
}

.Story .Story-num div span[data-v-4014a192] {
  font-size: 30px
}

.advanced[data-v-4014a192] {
  width: 100%;
  height: 720px
}

.advanced .advanced-title[data-v-4014a192] {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 30px;
  padding-bottom: 30px
}

.advanced .advanced-title p[data-v-4014a192] {
  font-size: 55px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(90deg, #00a6ff, #0f0);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent
}

.advanced .advanced-title span[data-v-4014a192] {
  font-size: 30px
}

.advanced .advanced-img[data-v-4014a192] {
  display: flex;
  justify-content: center;
  align-items: center
}

.advanced .advanced-img .clearfix[data-v-4014a192] {
  width: 80%;
  height: 100%;
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px
}

.slide-in-right[data-v-4014a192] {
  animation: slideInRightLinear .8s cubic-bezier(.25, .46, .45, .94) forwards
}

.slide-left[data-v-4014a192] {
  animation: bounceInLeft-4014a192 2s cubic-bezier(.215, .61, .355, 1) 0s 1 alternate forwards;
  -webkit-animation: bounceInLeft-4014a192 2s cubic-bezier(.215, .61, .355, 1) 0s 1 alternate forwards
}

@keyframes bounceInLeft-4014a192 {
  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0)
  }

  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0)
  }

  75% {
    transform: translate3d(-10px, 0, 0)
  }

  90% {
    transform: translate3d(5px, 0, 0)
  }

  to {
    transform: none
  }
}

.slide-right[data-v-4014a192] {
  animation: bounceInRight-4014a192 2s cubic-bezier(.215, .61, .355, 1) 0s 1 alternate forwards;
  -webkit-animation: bounceInRight-4014a192 2s cubic-bezier(.215, .61, .355, 1) 0s 1 alternate forwards
}

@keyframes bounceInRight-4014a192 {
  0% {
    opacity: 0;
    transform: translate3d(3000px, 0, 0)
  }

  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0)
  }

  75% {
    transform: translate3d(-10px, 0, 0)
  }

  90% {
    transform: translate3d(5px, 0, 0)
  }

  to {
    transform: none
  }
}

.slide-in-bounce[data-v-4014a192] {
  animation: slideInBounce-4014a192 1s cubic-bezier(.215, .61, .355, 1) forwards
}

@keyframes slideInBounce-4014a192 {
  0% {
    opacity: 0;
    transform: translate(-50px)
  }

  60% {
    opacity: 1;
    transform: translate(10px)
  }

  80% {
    transform: translate(-5px)
  }

  to {
    opacity: 1;
    transform: translate(0)
  }
}