.section-list[data-v-4adca886] {
  display: flex;
  flex-wrap: wrap
}

.section-list>.section-item[data-v-4adca886]:nth-child(3n) {
  margin-right: 0
}

.section-list>.section-item[data-v-4adca886] {
  width: 32.6%;
  height: 423px;
  margin-right: 1.1%;
  margin-top: 20px;
  cursor: pointer;
  position: relative;
  color: #333;
  background-color: #fff;
  transition: all .5s
}

.section-list>.section-item[data-v-4adca886]:hover {
  box-shadow: 0 3px 6px 0 #ececec;
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px)
}

.section-list>.section-item:hover .cases-box-item-loader[data-v-4adca886] {
  width: 100%
}

.section-list>.section-item:hover .cases-box-item-img-introduce[data-v-4adca886] {
  opacity: 1
}

.section-list>.section-item:hover .cases-box-item-title[data-v-4adca886] {
  background-position: 98% top
}

.section-list>.section-item .cases-box-item-img[data-v-4adca886] {
  position: relative;
  width: 100%;
  height: 342px;
  overflow: hidden
}

.section-list>.section-item .cases-box-item-img img[data-v-4adca886] {
  width: 100%;
  height: 342px;
  -o-object-fit: cover;
  object-fit: cover;
  transition: all .3s linear .03s
}

.section-list>.section-item .cases-box-item-img-introduce[data-v-4adca886] {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 342px;
  opacity: 0;
  background: rgba(39, 132, 244, .95);
  -webkit-transform: all .4s .3s;
  transform: all .4s .3s;
  color: #fff;
  padding-left: 41px;
  font-family: Source Han Sans SC, Source Han Sans SC-Medium
}

.section-list>.section-item .cases-box-item-img-introduce-title[data-v-4adca886] {
  font-size: 25px;
  font-weight: 500;
  margin-top: 52px
}

.section-list>.section-item .cases-box-item-img-introduce-slide[data-v-4adca886] {
  width: 20px;
  height: 2px;
  background-color: #fff;
  margin: 16px 0 33px
}

.section-list>.section-item .cases-box-item-img-introduce-desc[data-v-4adca886] {
  width: 82%;
  font-size: 14px;
  line-height: 25px;
  letter-spacing: .42px;
  margin-bottom: 33px;
  display: -webkit-box;
  overflow: hidden;
  /*! autoprefixer: off; */
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4
}

.section-list>.section-item .cases-box-item-img-introduce-icon[data-v-4adca886] {
  display: flex;
  align-items: center;
  width: 35px !important;
  height: 35px !important;
  border-radius: 50%;
  border: 1px solid #fff
}

.section-list>.section-item .cases-box-item-img-introduce-icon .cases-box-item-img-introduce-arrow[data-v-4adca886] {
  margin-left: 6px;
  width: 18px;
  height: 13px;
  -webkit-animation: ani-svg2-data-v-4adca886 .85s linear 0s infinite alternate;
  animation: ani-svg2-data-v-4adca886 .85s linear 0s infinite alternate
}

@-webkit-keyframes ani-svg2-data-v-4adca886 {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px)
  }

  25% {
    opacity: .25;
    -webkit-transform: translateX(-3px);
    transform: translateX(-3px)
  }

  50% {
    opacity: .5;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }

  75% {
    opacity: .75;
    -webkit-transform: translateX(3px);
    transform: translateX(3px)
  }

  to {
    opacity: 1;
    -webkit-transform: translateX(6px);
    transform: translateX(6px)
  }
}

@keyframes ani-svg2-data-v-4adca886 {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px)
  }

  25% {
    opacity: .25;
    -webkit-transform: translateX(-3px);
    transform: translateX(-3px)
  }

  50% {
    opacity: .5;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }

  75% {
    opacity: .75;
    -webkit-transform: translateX(3px);
    transform: translateX(3px)
  }

  to {
    opacity: 1;
    -webkit-transform: translateX(6px);
    transform: translateX(6px)
  }
}

.section-list>.section-item .cases-box-item-title[data-v-4adca886] {
  font-size: 22px;
  padding: 0 13px;
  font-weight: 600;
  color: #333;
  font-family: Source Han Sans SC, Source Han Sans SC-Medium;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADoAAAAXCAYAAABaiVzAAAAAAXNSR0IArs4c6QAAAZ9JREFUWEfd1sFKG0EYB/D/f2kkh75G38EnsNEUobdeN9sIRbwJgju7ySSzEfQmUhrsJLmGll57VLBU36APUXpppKd0v7JdUZHE5OjMHGfmMD/+33wzhKOjkw3fAKimcThahsBlNj3FPdrYCcnngny/Fb89WHRGl6GvSY4BVCASpyrqPYZ1FlqgtLG3WAL7SdyYm6zT0DssxgArECSpaphZyToPLVDtrt0MAnwusdJLVRQ/xHoBXQbrDfQOy08AVh4m6xX0/53NPtaJ4EuJxWGqGnvFvHfQeVh2jP0KsrbowXVvXQBhGaVIj9oMLkmsugdZ4sRyU7MiP70s3SJKbUanpEQQ/M7Blz5CqY3tk2wCmOTCtbYKr3yDFj3nA8itAhkIako1vnvXdTvG9mchvYLqbPCewDsA14HIulLRt/vtyovSvY/EX26kaXjh3V9XZ/aE4LaI/GEe1GYhnS9dndljgjsFUiSvt5Pm+bzX1dnS7ZjBEYjdEhnU20k4F+l0otrYXySrMpVXrVZ0tuif5Gyi3e7wBTB9liTNH4uQxfo/y9SmqGPqsZIAAAAASUVORK5CYII=) 95% top no-repeat;
  background-size: 29px 11px;
  transition: all .3s
}

.section-list>.section-item .cases-box-item-desc[data-v-4adca886] {
  font-size: 14px;
  padding: 11px 13px 6px;
  overflow: hidden;
  color: #999;
  font-family: Source Han Sans SC, Source Han Sans SC-Medium
}

.section-list>.section-item .cases-box-item-loader[data-v-4adca886] {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  transition: all .5s ease-in-out;
  background: #2784f4;
  height: 2px
}

#example-page>.section-swiper[data-v-f99de104] {
  width: 100%
}

#example-page>.section-swiper[data-v-f99de104] .el-carousel__indicators {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  width: 85.416%;
  max-width: 1640px;
  min-width: 1200;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  bottom: 80px
}

#example-page>.section-swiper[data-v-f99de104] .el-carousel__indicator.is-active button {
  opacity: 1;
  background-color: #2784f4
}

#example-page>.section-swiper[data-v-f99de104] .el-carousel__button {
  opacity: .5
}

#example-page>.section-swiper .section-swiper-content[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default[data-v-f99de104] {
  position: relative;
  display: flex;
  justify-content: center
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner-wrap[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default .section-swiper-banner-wrap[data-v-f99de104] {
  position: relative;
  width: 85.416%;
  max-width: 1640px;
  min-width: 1200
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default .section-swiper-banner[data-v-f99de104] {
  position: absolute;
  top: 115px;
  left: 0;
  z-index: 3
}

@-webkit-keyframes mymove-data-v-f99de104 {
  0% {
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transform: translateY(100px) translateX(0);
    transform: translateY(100px) translateX(0);
    transition-timing-function: ease-in-out
  }

  to {
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0)
  }
}

@keyframes mymove-data-v-f99de104 {
  0% {
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transform: translateY(100px) translateX(0);
    transform: translateY(100px) translateX(0);
    transition-timing-function: ease-in-out
  }

  to {
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0)
  }
}

@-webkit-keyframes mymove2-data-v-f99de104 {
  0% {
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transform: translateY(0) translateX(-100px);
    transform: translateY(0) translateX(-100px);
    transition-timing-function: ease-in-out
  }

  to {
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0)
  }
}

@keyframes mymove2-data-v-f99de104 {
  0% {
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transform: translateY(0) translateX(-100px);
    transform: translateY(0) translateX(-100px);
    transition-timing-function: ease-in-out
  }

  to {
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0)
  }
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner .ani1[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default .section-swiper-banner .ani1[data-v-f99de104] {
  animation: mymove-data-v-f99de104 .6s;
  -webkit-animation: mymove-data-v-f99de104 .6s linear;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  animation-delay: .3s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-delay: .3s
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner .ani2[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default .section-swiper-banner .ani2[data-v-f99de104] {
  animation: mymove-data-v-f99de104 .6s;
  -webkit-animation: mymove-data-v-f99de104 .6s linear;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  animation-delay: .6s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-delay: .6s
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner .ani3[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default .section-swiper-banner .ani3[data-v-f99de104] {
  animation: mymove-data-v-f99de104 .5s;
  -webkit-animation: mymove-data-v-f99de104 .5s linear;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-delay: 1s
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner .ani4[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default .section-swiper-banner .ani4[data-v-f99de104] {
  animation: mymove2-data-v-f99de104 .5s;
  -webkit-animation: mymove2-data-v-f99de104 .5s linear;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-delay: 1s
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-title[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-title[data-v-f99de104] {
  font-size: 65px;
  font-family: Source Han Sans SC, Source Han Sans SC-Medium;
  font-weight: 500;
  color: #fff;
  letter-spacing: 1.95px;
  margin-left: -5px;
  opacity: 0
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-slide[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-slide[data-v-f99de104] {
  width: 51px;
  height: 3px;
  margin-top: 30px;
  background: #fff;
  opacity: 0
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-subtitle[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-subtitle[data-v-f99de104] {
  font-size: 20px;
  font-family: Source Han Sans SC, Source Han Sans SC-Light;
  color: #fff;
  letter-spacing: 2px;
  margin-top: 37px;
  margin-bottom: 64px;
  opacity: 0
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-btn[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-btn[data-v-f99de104] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 200px;
  height: 50px;
  border: 1px solid #fff;
  cursor: pointer;
  font-size: 15px;
  font-family: Source Han Sans SC, Source Han Sans SC-Normal;
  color: #fff;
  letter-spacing: .45px;
  opacity: 0;
  transition: all .3s
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-btn>.banner-btn-icon[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-btn>.banner-btn-icon[data-v-f99de104] {
  width: 34px;
  height: 9px;
  margin-left: 17px;
  transition: all .2s
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-btn[data-v-f99de104]:hover,
#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-btn[data-v-f99de104]:hover {
  margin-left: 15px
}

#example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-btn:hover .banner-btn-icon[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-btn:hover .banner-btn-icon[data-v-f99de104] {
  -webkit-transform: translateX(10px);
  transform: translateX(10px)
}

#example-page>.section-swiper .section-swiper-content>.section-swiper-img[data-v-f99de104],
#example-page>.section-swiper .section-swiper-default>.section-swiper-img[data-v-f99de104] {
  position: absolute
}

@media screen and (max-width:1820px) {

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner[data-v-f99de104] {
    top: 100px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-title[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-title[data-v-f99de104] {
    font-size: 60px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-slide[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-slide[data-v-f99de104] {
    margin-top: 25px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-subtitle[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-subtitle[data-v-f99de104] {
    font-size: 19px;
    margin-top: 32px;
    margin-bottom: 59px
  }
}

@media screen and (max-width:1680px) {

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner[data-v-f99de104] {
    top: 90px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-title[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-title[data-v-f99de104] {
    font-size: 57px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-slide[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-slide[data-v-f99de104] {
    margin-top: 20px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-subtitle[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-subtitle[data-v-f99de104] {
    font-size: 18px;
    margin-top: 27px;
    margin-bottom: 54px
  }
}

@media screen and (max-width:1366px) {

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner[data-v-f99de104] {
    top: 80px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-title[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-title[data-v-f99de104] {
    font-size: 53px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-slide[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-slide[data-v-f99de104] {
    margin-top: 15px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-subtitle[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-subtitle[data-v-f99de104] {
    font-size: 17px;
    margin-top: 22px;
    margin-bottom: 49px
  }
}

@media screen and (max-width:1280px) {

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner[data-v-f99de104] {
    top: 70px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-title[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-title[data-v-f99de104] {
    font-size: 50px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-slide[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-slide[data-v-f99de104] {
    margin-top: 10px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-subtitle[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-subtitle[data-v-f99de104] {
    font-size: 16px;
    margin-top: 17px;
    margin-bottom: 44px
  }
}

@media screen and (max-width:1200px) {

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner[data-v-f99de104] {
    top: 60px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-title[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-title[data-v-f99de104] {
    font-size: 45px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-slide[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-slide[data-v-f99de104] {
    margin-top: 10px
  }

  #example-page>.section-swiper .section-swiper-content .section-swiper-banner .swiper-banner-subtitle[data-v-f99de104],
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-subtitle[data-v-f99de104] {
    font-size: 15px;
    margin-top: 12px;
    margin-bottom: 39px
  }
}

#example-page>.section-swiper .section-swiper-default .section-swiper-banner[data-v-f99de104] {
  position: absolute;
  top: 90px;
  left: 0;
  z-index: 3
}

#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-decorate[data-v-f99de104] {
  width: 16px;
  height: 15px;
  opacity: 0
}

#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-title[data-v-f99de104] {
  font-size: 70px;
  margin-top: 57px
}

#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip[data-v-f99de104] {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 676px;
  height: 121px;
  padding: 20px 0;
  background: linear-gradient(85deg, rgba(39, 107, 244, .5) 2%, rgba(39, 132, 244, 0) 96%);
  font-size: 20px;
  font-family: Source Han Sans SC, Source Han Sans SC-Normal;
  color: #fff;
  letter-spacing: 2px;
  margin-top: 54px;
  letter-spacing: 1.78px;
  opacity: 0
}

#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip>.banner-tip-item[data-v-f99de104] {
  display: flex;
  align-items: center
}

#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip>.banner-tip-item .tip-item-circle[data-v-f99de104] {
  width: 9px;
  height: 9px;
  margin: 0 16px;
  opacity: .8;
  background: #fff;
  border-radius: 50%
}

#example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip>.banner-tip-item .tip-item-text[data-v-f99de104] {
  opacity: .9;
  font-size: 20px;
  font-family: Source Han Sans SC, Source Han Sans SC-Normal;
  color: hsla(0, 0%, 100%, .9);
  letter-spacing: 1.78px
}

@media screen and (max-width:1820px) {
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner[data-v-f99de104] {
    top: 90px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-title[data-v-f99de104] {
    font-size: 65px;
    margin-top: 52px
  }
}

@media screen and (max-width:1680px) {
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner[data-v-f99de104] {
    top: 80px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-title[data-v-f99de104] {
    font-size: 58px;
    margin-top: 40px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip[data-v-f99de104] {
    width: 576px;
    margin-top: 40px;
    height: 101px;
    padding: 18px 0
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip>.banner-tip-item .tip-item-circle[data-v-f99de104] {
    width: 8px;
    height: 8px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip>.banner-tip-item .tip-item-text[data-v-f99de104] {
    font-size: 17px
  }
}

@media screen and (max-width:1366px) {
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner[data-v-f99de104] {
    top: 70px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-title[data-v-f99de104] {
    font-size: 52px;
    margin-top: 35px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip[data-v-f99de104] {
    width: 576px;
    margin-top: 35px;
    height: 91px;
    padding: 16px 0
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip>.banner-tip-item .tip-item-circle[data-v-f99de104] {
    width: 8px;
    height: 8px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip>.banner-tip-item .tip-item-text[data-v-f99de104] {
    font-size: 16px
  }
}

@media screen and (max-width:1280px) {
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner[data-v-f99de104] {
    top: 60px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-title[data-v-f99de104] {
    font-size: 50px;
    margin-top: 32px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip[data-v-f99de104] {
    width: 526px;
    margin-top: 32px;
    height: 81px;
    padding: 14px 0
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip>.banner-tip-item .tip-item-circle[data-v-f99de104] {
    width: 7px;
    height: 7px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip>.banner-tip-item .tip-item-text[data-v-f99de104] {
    font-size: 15px
  }
}

@media screen and (max-width:1200px) {
  #example-page>.section-swiper .section-swiper-default .section-swiper-banner[data-v-f99de104] {
    top: 50px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-title[data-v-f99de104] {
    font-size: 45px;
    margin-top: 32px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip[data-v-f99de104] {
    width: 476px;
    margin-top: 30px;
    height: 81px;
    padding: 12px 0
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip>.banner-tip-item .tip-item-circle[data-v-f99de104] {
    width: 7px;
    height: 7px
  }

  #example-page>.section-swiper .section-swiper-default .section-swiper-banner .swiper-banner-tip>.banner-tip-item .tip-item-text[data-v-f99de104] {
    font-size: 14px
  }
}

#example-page>.section-containner[data-v-f99de104] {
  background: #fafafa
}

#example-page>.section-containner .section-body[data-v-f99de104],
#example-page>.section-containner>.section-search[data-v-f99de104] {
  width: 85.416%;
  max-width: 1640px;
  min-width: 1200px;
  margin: 0 auto
}

#example-page>.section-containner>.section-search[data-v-f99de104] {
  display: flex;
  justify-content: center;
  position: relative;
  /* min-height: 150px; */
  background-color: #fff;
  z-index: 999;
  margin-top: -66px;
  padding: 30px;
}
#example-page>.section-containner>.section-search .search-l{
  width: 85%;
}
#example-page>.section-containner>.section-search .search-l input{
  width: 100%;
  height: 50px;
  padding: 0 10px;
}
#example-page>.section-containner>.section-search .search-r{
  width: 10%;
}
#example-page>.section-containner>.section-search .search-r input{
  width: 100%;
  height: 50px;
  margin-left: 10px;
  font-size: 16px;
  color: #fff;
  background-color: #2784f4;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
#example-page>.section-containner>.section-search>.search-l[data-v-f99de104] {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  font-size: 18px;
  font-family: Source Han Sans SC, Source Han Sans SC-Normal;
  color: #333
}

#example-page>.section-containner>.section-search>.search-r[data-v-f99de104] {
  display: flex;
  align-items: center
}

#example-page>.section-containner>.section-search>.search-r>.search-hot[data-v-f99de104] {
  display: flex;
  align-items: center;
  width: 133px;
  height: 50px;
  justify-content: center;
  line-height: 50px;
  background: #f8f8f8;
  cursor: pointer
}

#example-page>.section-containner>.section-search>.search-r>.search-hot .search-hot-text[data-v-f99de104] {
  font-size: 17px;
  font-family: Source Han Sans SC, Source Han Sans SC-Normal;
  color: #333;
  margin-right: 6px
}

#example-page>.section-containner>.section-search>.search-r>.search-hot .search-hot-icon[data-v-f99de104] {
  width: 12px;
  height: 16px
}

#example-page>.section-containner>.section-search>.search-r>.search-hot-check[data-v-f99de104] {
  background: rgba(39, 132, 244, .1)
}

#example-page>.section-containner>.section-search .search-l-industry[data-v-f99de104],
#example-page>.section-containner>.section-search .search-l-serve[data-v-f99de104],
#example-page>.section-containner>.section-search .search-tab[data-v-f99de104] {
  display: flex
}

#example-page>.section-containner>.section-search .search-l-serve .search-tab-item[data-v-f99de104] {
  margin-bottom: 30px
}

#example-page>.section-containner>.section-search .search-l-industry .search-tab-item[data-v-f99de104] {
  margin-bottom: 15px
}

#example-page>.section-containner>.section-search .search-label[data-v-f99de104] {
  min-width: 95px
}

#example-page>.section-containner>.section-search .search-tab[data-v-f99de104] {
  flex-wrap: wrap
}

#example-page>.section-containner>.section-search .search-tab-item[data-v-f99de104] {
  margin: 0 20px;
  cursor: pointer
}

#example-page>.section-containner>.section-search .search-tab-item-active[data-v-f99de104] {
  position: relative;
  color: #2784f4
}

#example-page>.section-containner>.section-search .search-tab-item-active[data-v-f99de104]:after {
  content: "";
  width: 4px;
  height: 4px;
  background: #2784f4;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  bottom: -2px
}

#example-page>.section-containner>.section-body>.section-list[data-v-f99de104] {
  display: flex;
  flex-wrap: wrap;

}

#example-page>.section-containner>.section-body>.section-list>.section-item[data-v-f99de104]:nth-child(4n) {
  margin-right: 0
}

#example-page>.section-containner>.section-body>.section-list>.section-item[data-v-f99de104] {
  width: 24%;
  height: 435px;
  margin-right: 1.1%;
  margin-top: 20px;
  cursor: pointer;
  position: relative;
  color: #333;
  background-color: #fff;
  transition: all .5s
}

#example-page>.section-containner>.section-body>.section-list>.section-item[data-v-f99de104]:hover {
  box-shadow: 0 3px 6px 0 #ececec;
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px)
}

#example-page>.section-containner>.section-body>.section-list>.section-item:hover .cases-box-item-loader[data-v-f99de104] {
  width: 100%
}

#example-page>.section-containner>.section-body>.section-list>.section-item:hover .cases-box-item-img-introduce[data-v-f99de104] {
  opacity: 1
}

#example-page>.section-containner>.section-body>.section-list>.section-item:hover .cases-box-item-title[data-v-f99de104] {
  background-position: 98% top
}

#example-page>.section-containner>.section-body>.section-list>.section-item .cases-box-item-img[data-v-f99de104] {
  position: relative;
  width: 100%;
  height: 342px;
  overflow: hidden
}

#example-page>.section-containner>.section-body>.section-list>.section-item .cases-box-item-img img[data-v-f99de104] {
  width: 100%;
  height: 342px;
  -o-object-fit: cover;
  object-fit: cover;
  transition: all .3s linear .03s
}

#example-page>.section-containner>.section-body>.section-list>.section-item .cases-box-item-img-introduce[data-v-f99de104] {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 342px;
  opacity: 0;
  background: rgba(39, 132, 244, .95);
  -webkit-transform: all .4s .3s;
  transform: all .4s .3s;
  color: #fff;
  padding-left: 41px;
  font-family: Source Han Sans SC, Source Han Sans SC-Medium
}

#example-page>.section-containner>.section-body>.section-list>.section-item .cases-box-item-img-introduce-title[data-v-f99de104] {
  font-size: 25px;
  font-weight: 500;
  margin-top: 52px
}

#example-page>.section-containner>.section-body>.section-list>.section-item .cases-box-item-img-introduce-slide[data-v-f99de104] {
  width: 20px;
  height: 2px;
  background-color: #fff;
  margin: 16px 0 33px
}

#example-page>.section-containner>.section-body>.section-list>.section-item .cases-box-item-img-introduce-desc[data-v-f99de104] {
  width: 82%;
  font-size: 14px;
  line-height: 25px;
  letter-spacing: .42px;
  margin-bottom: 33px;
  display: -webkit-box;
  overflow: hidden;
  /*! autoprefixer: off; */
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4
}

#example-page>.section-containner>.section-body>.section-list>.section-item .cases-box-item-img-introduce-icon[data-v-f99de104] {
  display: flex;
  align-items: center;
  width: 35px !important;
  height: 35px !important;
  border-radius: 50%;
  border: 1px solid #fff
}

#example-page>.section-containner>.section-body>.section-list>.section-item .cases-box-item-img-introduce-icon .cases-box-item-img-introduce-arrow[data-v-f99de104] {
  margin-left: 6px;
  width: 18px;
  height: 13px;
  -webkit-animation: ani-svg2-data-v-f99de104 .85s linear 0s infinite alternate;
  animation: ani-svg2-data-v-f99de104 .85s linear 0s infinite alternate
}

@-webkit-keyframes ani-svg2-data-v-f99de104 {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px)
  }

  25% {
    opacity: .25;
    -webkit-transform: translateX(-3px);
    transform: translateX(-3px)
  }

  50% {
    opacity: .5;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }

  75% {
    opacity: .75;
    -webkit-transform: translateX(3px);
    transform: translateX(3px)
  }

  to {
    opacity: 1;
    -webkit-transform: translateX(6px);
    transform: translateX(6px)
  }
}

@keyframes ani-svg2-data-v-f99de104 {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px)
  }

  25% {
    opacity: .25;
    -webkit-transform: translateX(-3px);
    transform: translateX(-3px)
  }

  50% {
    opacity: .5;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }

  75% {
    opacity: .75;
    -webkit-transform: translateX(3px);
    transform: translateX(3px)
  }

  to {
    opacity: 1;
    -webkit-transform: translateX(6px);
    transform: translateX(6px)
  }
}

#example-page>.section-containner>.section-body>.section-list>.section-item .cases-box-item-title[data-v-f99de104] {
  font-size: 22px;
  padding: 0 13px;
  font-weight: 600;
  color: #333;
  font-family: Source Han Sans SC, Source Han Sans SC-Medium;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADoAAAAXCAYAAABaiVzAAAAAAXNSR0IArs4c6QAAAZ9JREFUWEfd1sFKG0EYB/D/f2kkh75G38EnsNEUobdeN9sIRbwJgju7ySSzEfQmUhrsJLmGll57VLBU36APUXpppKd0v7JdUZHE5OjMHGfmMD/+33wzhKOjkw3fAKimcThahsBlNj3FPdrYCcnngny/Fb89WHRGl6GvSY4BVCASpyrqPYZ1FlqgtLG3WAL7SdyYm6zT0DssxgArECSpaphZyToPLVDtrt0MAnwusdJLVRQ/xHoBXQbrDfQOy08AVh4m6xX0/53NPtaJ4EuJxWGqGnvFvHfQeVh2jP0KsrbowXVvXQBhGaVIj9oMLkmsugdZ4sRyU7MiP70s3SJKbUanpEQQ/M7Blz5CqY3tk2wCmOTCtbYKr3yDFj3nA8itAhkIako1vnvXdTvG9mchvYLqbPCewDsA14HIulLRt/vtyovSvY/EX26kaXjh3V9XZ/aE4LaI/GEe1GYhnS9dndljgjsFUiSvt5Pm+bzX1dnS7ZjBEYjdEhnU20k4F+l0otrYXySrMpVXrVZ0tuif5Gyi3e7wBTB9liTNH4uQxfo/y9SmqGPqsZIAAAAASUVORK5CYII=) 95% top no-repeat;
  background-size: 29px 11px;
  transition: all .3s
}

#example-page>.section-containner>.section-body>.section-list>.section-item .cases-box-item-desc[data-v-f99de104] {
  font-size: 14px;
  padding: 11px 13px 6px;
  overflow: hidden;
  color: #999;
  font-family: Source Han Sans SC, Source Han Sans SC-Medium
}

#example-page>.section-containner>.section-body>.section-list>.section-item .cases-box-item-loader[data-v-f99de104] {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  transition: all .5s ease-in-out;
  background: #2784f4;
  height: 2px
}

#example-page>.section-containner>.section-body>.section-page[data-v-f99de104] {
  display: flex;
  justify-content: center;
  margin-top: 50px;
  padding-bottom: 50px
}

#example-page>.section-containner>.section-body>.section-page[data-v-f99de104] .el-pagination.is-background .el-pager li {
  width: 48px;
  height: 48px;
  background: #fff;
  border-radius: 4px;
  line-height: 48px;
  font-size: 20px;
  color: #333
}

#example-page>.section-containner>.section-body>.section-page[data-v-f99de104] .el-pagination.is-background .el-pager li:hover,
#example-page>.section-containner>.section-body>.section-page[data-v-f99de104] .el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: #2784f4;
  color: #fff
}

#example-page>.section-containner>.section-body>.section-page[data-v-f99de104] .el-pagination.is-background .el-pager li:not(.disabled).active:hover {
  color: #fff
}

#example-page>.section-containner>.section-body>.section-page[data-v-f99de104] .el-pagination.is-background .btn-next,
#example-page>.section-containner>.section-body>.section-page[data-v-f99de104] .el-pagination.is-background .btn-prev {
  width: 48px;
  height: 48px;
  background: #fff;
  border-radius: 4px;
  line-height: 48px
}

#example-page .example-box-item[data-v-f99de104] {
  height: 830px;
  padding-top: 40px
}

#example-page .example-box-item-content[data-v-f99de104] {
  width: 1200px;
  height: 722px;
  margin: 0 auto
}

#example-page .example-box-item-content-title[data-v-f99de104] {
  height: 128px;
  padding-left: 65px
}

#example-page .example-box-item-content-title.even[data-v-f99de104] {
  padding-left: 735px
}

#example-page .example-box-item-content-title>.num[data-v-f99de104] {
  width: 60px;
  height: 60px;
  background: #4c9ffb;
  border-radius: 50%;
  color: #fff;
  font-size: 20px;
  line-height: 60px;
  display: inline-block;
  text-align: center;
  vertical-align: middle
}

#example-page .example-box-item-content-title>.txt[data-v-f99de104] {
  font-weight: 700;
  font-size: 36px;
  padding-left: 20px;
  color: #333
}

#example-page .example-box-item-content-info[data-v-f99de104] {
  height: 500px;
  background: #f8f8f8
}

#example-page .example-box-item-content-info.even[data-v-f99de104] {
  background: #fff
}

#example-page .example-box-item-content-info-detail[data-v-f99de104] {
  width: 450px;
  height: 500px;
  float: left;
  padding: 40px 0 0 80px
}

#example-page .example-box-item-content-info-detail.even[data-v-f99de104] {
  float: right;
  padding: 40px 80px 0 0
}

#example-page .example-box-item-content-info-detail>.case-title[data-v-f99de104] {
  padding-bottom: 30px
}

#example-page .example-box-item-content-info-detail>.case-title span[data-v-f99de104] {
  font-weight: 700;
  font-size: 22px
}

#example-page .example-box-item-content-info-detail>.case-title span.iconfont[data-v-f99de104] {
  color: #4c9ffb;
  font-size: 32px;
  padding-right: 15px
}

#example-page .example-box-item-content-info-detail>.case-desc[data-v-f99de104] {
  font-size: 16px;
  line-height: 30px;
  padding-bottom: 25px
}

#example-page .example-box-item-content-info-detail>.case-desc .case-desc-title[data-v-f99de104] {
  width: 70px;
  color: #666;
  font-weight: 700;
  justify-content: space-between
}

#example-page .example-box-item-content-info-detail>.case-desc .case-desc-fh[data-v-f99de104] {
  font-weight: 700;
  color: #666
}

#example-page .example-box-item-content-info-detail>.case-look span[data-v-f99de104] {
  font-size: 22px;
  margin-right: 25px
}

#example-page .example-box-item-content-info-detail>.case-look img[data-v-f99de104] {
  display: inline-block;
  width: 100px;
  height: 100px
}

#example-page .example-box-item-content-info-detail>.case-look span.btn[data-v-f99de104] {
  display: inline-block;
  width: 160px;
  line-height: 50px;
  background: #39b26f;
  border-radius: 25px;
  color: #fff;
  text-align: center;
  cursor: pointer;
  font-size: 20px;
  margin: 0
}

#example-page .example-box-item-content-info-img[data-v-f99de104] {
  width: 750px;
  float: right;
  height: 500px
}

#example-page .example-box-item-content-info-img img[data-v-f99de104] {
  display: block;
  width: 750px;
  height: 750px;
  position: relative;
  z-index: 10;
  top: -128px
}

#example-page .example-box-item[data-v-f99de104]:nth-child(2n) {
  background: #f8f8f8
}