img {
  max-width: 100%;
  max-height: 100%;
  object-fit: cover
}

.common_bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1
}

.index1 {
  height: 100vh;
  position: relative;
  overflow: hidden
}

.index1 video {
  height: 100%;
  width: 100%;
  object-fit: cover;
  position: relative;
  left: 15vw
}

.index1 .wrap {
  position: absolute;
  width: 100%;
  padding: 0 13.54167vw;
  top: 50%;
  transform: translateY(-50%);
  z-index: 6
}

.index1 .wrap .p1 {
  color: #5A5A5A;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin: 0 0 4.375vw
}

.index1 .wrap .p2 {
  color: #666;
  font-style: normal;
  font-weight: 400;
  line-height: 150%
}

@keyframes pattern {
  0% {
    transform: translate(4px, -4px)
  }

  100% {
    transform: translate(-4px, 4px)
  }
}

@keyframes roteA {
  100% {
    transform: rotate(360deg)
  }
}

@keyframes roteA2 {
  100% {
    transform: rotate(-360deg)
  }
}

.index2 {
  height: calc(100vh + 1000px)
}

.index2 .fix {
  height: 100vh;
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  overflow: hidden
}

.index2 .fix .position_top {
  position: absolute;
  left: 50%;
  top: 0;
  width: 101.30208vw;
  transform: translateX(-50%);
  z-index: 15;
  border-radius: 1.25vw;
  border: .20833vw solid #EBEBEB;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(24.65px);
  padding: 3.95833vw 2.03125vw 3.95833vw 13.125vw;
  display: flex;
  justify-content: space-between;
  transition: .3s ease
}

.index2 .fix .position_top.on {
  opacity: 0
}

.index2 .fix .position_top .zuo .p1 {
  color: #00378A;
  font-style: normal;
  font-weight: 500;
  text-transform: capitalize;
  margin: 0 0 1.35417vw
}

.index2 .fix .position_top .zuo .p2 {
  color: #5A5A5A;
  font-style: normal;
  font-weight: 700;
  line-height: normal
}

.index2 .fix .position_top .you {
  width: 52.08333vw
}

.index2 .fix .position_top .you .swiper1 {
  width: 52.34375vw;
  margin: auto
}

.index2 .fix .position_top .you .swiper1 .swiper-slide .item {
  height: 13.8125vw;
  width: 100%;
  border-radius: 1.25vw;
  border: 1px solid #FFF;
  background: rgba(13, 78, 144, 0.24);
  padding: .9375vw 1.5625vw;
  display: block;
  position: relative;
  z-index: 1
}

.index2 .fix .position_top .you .swiper1 .swiper-slide .item .bg {
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1
}

.index2 .fix .position_top .you .swiper1 .swiper-slide .item .more {
  color: #FFF;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5.83333vw;
  height: 1.875vw;
  border-radius: 5.15625vw;
  border: 1px solid #FFF;
  margin: 0 0 1.04167vw;
  transition: all 600ms
}

.index2 .fix .position_top .you .swiper1 .swiper-slide .item .more:hover {
  background: #00378A;
  border-color: transparent
}

.index2 .fix .position_top .you .swiper1 .swiper-slide .item .p1 {
  color: #FFF;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
  font-style: normal;
  font-weight: 700;
  margin: 0 0 .72917vw
}

.index2 .fix .position_top .you .swiper1 .swiper-slide .item .p2 {
  color: #FFF;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
  font-style: normal;
  font-weight: 400
}

.index2 .fix .position_text {
  padding: 0 13.54167vw;
  position: absolute;
  width: 100%;
  top: 55%;
  z-index: 9;
  left: 0
}

.index2 .fix .position_text.hide {
  opacity: 0
}

.index2 .fix .position_text .l {
  width: 26.77083vw
}

.index2 .fix .position_text .l .p1 {
  color: #5A5A5A;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin: 0 0 1.45833vw
}

.index2 .fix .position_text .l .p2 {
  color: #666;
  font-style: normal;
  font-weight: 400;
  line-height: 160%;
  margin: 0 0 4.0625vw
}

.index2 .fix .last {
  position: absolute;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  z-index: 10;
  padding: 0 14.0625vw 0 13.54167vw;
  display: flex;
  align-items: center;
  justify-content: space-between
}

.index2 .fix .last.on .l {
  opacity: 1;
  transform: translateY(0);
  transition: .6s ease;
  transition-delay: .6s
}

.index2 .fix .last.on .r {
  opacity: 1;
  transition: .3s;
  transition-delay: .6s
}

.index2 .fix .last .r {
  width: 43.28125vw;
  height: 43.28125vw;
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0
}

.index2 .fix .last .r .rote {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1;
  animation: roteA 20s linear infinite
}

.index2 .fix .last .r .rote img {
  width: 5.15625vw;
  height: 5.15625vw;
  position: absolute;
  bottom: 5.98958vw;
  left: 1.09375vw;
  animation: roteA2 20s linear infinite
}

.index2 .fix .last .r .rote2 {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1;
  animation: roteA 20s linear infinite
}

.index2 .fix .last .r .rote2 img {
  width: 5.15625vw;
  height: 5.15625vw;
  position: absolute;
  bottom: 5.98958vw;
  right: 1.09375vw;
  animation: roteA2 20s linear infinite
}

.index2 .fix .last .r .rote3 {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1;
  animation: roteA 20s linear infinite
}

.index2 .fix .last .r .rote3 img {
  width: 5.15625vw;
  height: 5.15625vw;
  position: absolute;
  top: -3.229167vw;
  right: 19.09375vw;
  animation: roteA2 20s linear infinite
}

.index2 .fix .last .r .flex {
  display: flex;
  justify-content: center;
  position: relative
}

.index2 .fix .last .r .flex:first-child {
  z-index: 2
}

.index2 .fix .last .r .flex:last-child {
  top: -5.46875vw
}

.index2 .fix .last .r .flex:last-child .circle:first-child {
  left: .98958vw
}

.index2 .fix .last .r .flex:last-child .circle:last-child {
  left: -.98958vw
}

.index2 .fix .last .r .flex .circle {
  width: 18.59375vw;
  height: 18.59375vw;
  border-radius: 50%;
  background: rgba(13, 78, 144, 0.9);
  text-align: center;
  position: relative;
  z-index: 1;
  padding: 4.6875vw 0 0 0;
  background: transparent !important
}

.index2 .fix .last .r .flex .circle .bg {
  position: absolute;
  width: 5.20833vw;
  left: 50%;
  bottom: .9375vw;
  transform: translateX(-50%);
  z-index: -1
}

.index2 .fix .last .r .flex .circle .bg2 {
  position: absolute;
  width: 5.20833vw;
  left: 50%;
  bottom: .9375vw;
  transform: translateX(-50%);
  z-index: -1
}

.index2 .fix .last .r .flex .circle .bg3 {
  width: 5.20833vw;
  position: absolute;
  left: 50%;
  bottom: .9375vw;
  transform: translateX(-50%);
  z-index: -1
}

.index2 .fix .last .r .flex .circle p {
  color: #FFF;
  font-style: normal;
  font-weight: 700;
  margin: 0 0 .78125vw
}

.index2 .fix .last .r .flex .circle .white {
  width: 4.16667vw;
  height: 4.16667vw;
  border-radius: 50%;
  background: #fff;
  margin: auto
}

.index2 .fix .last .l {
  width: 21.97917vw;
  opacity: 0;
  transform: translateY(50px)
}

.index2 .fix .last .l .p1 {
  color: #5A5A5A;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin: 0 0 2.96875vw
}

.index2 .fix .last .l .p2 {
  color: #666;
  font-style: normal;
  font-weight: 400;
  line-height: 160%;
  margin: 0 0 4.0625vw
}

.index2 .fix .last .l .more {
  width: 8.69792vw;
  height: 3.33333vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 2.86458vw;
  border: 1px solid #FFF;
  background: #FFF;
  box-shadow: 0 0 15px 0 rgba(0, 55, 138, 0.4);
  color: #00378A;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.5px;
  text-transform: capitalize;
  transition: .6s ease
}

.index2 .fix .last .l .more:hover {
  background: #00378A;
  color: #FFF;
  border: 1px solid #00378A
}

.index2 .fix .joke {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 5;
  transition: .3s
}

.index2 .fix .joke .tp1 {
  width: 9.375vw;
  height: 9.375vw;
  position: absolute;
  right: 9.89583vw;
  bottom: 20.83333vw;
  -webkit-animation: pattern 2.4s ease-in-out infinite alternate;
  animation: pattern 2.4s ease-in-out infinite alternate;
  transition: .6s ease
}

.index2 .fix .joke .tp2 {
  position: absolute;
  width: 6.19792vw;
  height: 6.19792vw;
  left: 25vw;
  top: 20.83333vw;
  -webkit-animation: pattern 2.4s ease-in-out infinite alternate;
  animation: pattern 2.4s ease-in-out infinite alternate;
  transition: .6s ease
}

.index2 .fix .joke.on {
  transition: transform .3s, opacity .6s .3s;
  transform: translate(1.7vw, -1.2vw)
}

.index2 .fix .joke.on .js-mv-bg {
  opacity: 0
}

.index2 .fix .joke.on .tp1,
.index2 .fix .joke.on .tp2 {
  opacity: 0
}

.index2 .fix .joke.on .js-mv-circle-box {
  height: 29.84375vw;
  width: 32.65625vw;
  left: 61.30208vw;
  top: 47vh;
  z-index: -1
}

.index2 .fix .joke.on .js-mv-circle-box .l-main-img__circle {
  mix-blend-mode: unset
}

.index2 .fix .joke.on .js-mv-circle-box .bg_circle {
  opacity: 1;
  transition-delay: .3s
}

.index2 .fix .joke.on .js-mv-circle-box .js-mv-circle01 {
  border-width: 9.375vw;
  height: 18.75vw;
  width: 18.75vw;
  left: 7.5vw;
  top: -.36458vw
}

.index2 .fix .joke.on .js-mv-circle-box .js-mv-circle02 {
  border-width: 9.375vw;
  height: 18.75vw;
  width: 18.75vw;
  left: -.83333vw;
  top: 12.65625vw
}

.index2 .fix .joke.on .js-mv-circle-box .js-mv-circle03 {
  border-width: 9.375vw;
  height: 18.75vw;
  width: 18.75vw;
  left: 15.72917vw;
  top: 12.65625vw
}

.index2 .fix .js-mv-circle-box {
  height: 8.59375vw;
  width: 10.3125vw;
  animation: 4.5s linear 0s 1 normal none running none;
  left: 44.6875vw;
  top: 34.32292vw;
  z-index: 3;
  position: absolute;
  opacity: 1;
  transform: translate(-50%, -50%);
  transition: .6s ease
}

.index2 .fix .js-mv-circle-box .bg_circle {
  width: 43.28125vw;
  height: 43.28125vw;
  position: absolute;
  top: -4vw;
  left: -5vw;
  max-width: unset;
  max-height: unset;
  z-index: -1;
  opacity: 0;
  transition: 1s ease
}

.index2 .fix .js-mv-circle-box .l-main-img__circle {
  position: absolute;
  will-change: border-radius, transform;
  transform-origin: 55% 55%;
  box-sizing: border-box;
  background-origin: border-box;
  background-clip: border-box;
  -webkit-mask-image: linear-gradient(#fff 0 0), linear-gradient(#fff 0 0);
  -webkit-mask-clip: padding-box, border-box;
  mask-clip: padding-box, border-box;
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  border: solid transparent;
  border-radius: 50%;
  mix-blend-mode: multiply;
  transition: .6s ease
}

.index2 .fix .js-mv-circle-box .js-mv-circle01 {
  height: 41.35417vw;
  width: 41.35417vw;
  left: 25.26042vw;
  top: -17.70833vw;
  border-width: 8.33333vw;
  background-image: url(/images/bg_circle03.png);
  z-index: 22
}

.index2 .fix .js-mv-circle-box .js-mv-circle02 {
  border-width: 8.33333vw;
  height: 41.35417vw;
  width: 41.35417vw;
  left: -2.60417vw;
  top: -41.66667vw;
  background-image: url(/images/bg_circle01.png);
  z-index: 18
}

.index2 .fix .js-mv-circle-box .js-mv-circle03 {
  border-width: 8.33333vw;
  height: 41.35417vw;
  width: 41.35417vw;
  left: -10.41667vw;
  top: -5.20833vw;
  background-image: url(/images/bg_circle02.png);
  z-index: 19
}

.index2 .fix .js-mv-bg {
  position: absolute;
  top: 50%;
  right: 143px;
  transform: translate(0, -50%);
  width: 62.5vw;
  height: 62.5vw;
  transition: .6s ease
}

.index2 .fix .js-mv-bg img {
  width: 100%;
  height: 100%
}

.index3 {
  padding: 7.8125vw 5.88542vw 18.125vw 5.88542vw;
  display: flex;
  justify-content: center;
  gap: 2.08333vw
}

.index3 .item {
  width: 27.96875vw;
  height: 41.64583vw;
  border-radius: 1.66667vw;
  background: #F6F6F6;
  padding: 3.125vw 2.08333vw
}

.index3 .item .label {
  width: 14.70833vw;
  height: 2.5vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid #666;
  color: #5A5A5A;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin: 0 0 6.25vw
}

.index3 .item .p1 {
  margin: 0 0 0 .83333vw;
  width: 20.15625vw;
  color: #666;
  font-style: normal;
  font-weight: 400;
  line-height: 160%;
  height: 14.66667vw;
  -webkit-line-clamp: 4;
  display: -webkit-box;
  /* -webkit-box-orient: vertical; */
  overflow: hidden
}

.index3 .item .num {
  overflow: hidden;
  height: 12.5vw
}

.index3 .item .num p {
  color: #5A5A5A;
  font-size: 12.5vw;
  font-style: normal;
  font-weight: 400;
  line-height: normal
}

.index4 {
  padding: 0 7.70833vw 12.34375vw 13.54167vw;
  display: flex;
  justify-content: space-between
}

.index4 .l {
  width: 32.86458vw
}

.index4 .l .p1 {
  color: #0D4E90;
  font-style: normal;
  font-weight: 400;
  margin: 0 0 1.30208vw
}

.index4 .l .p2 {
  color: #666;
  font-style: normal;
  font-weight: 400;
  line-height: 158.333%
}

.index4 .l .figure {
  margin: 4.16667vw 0 0 0;
  width: fit-content;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 4.6875vw
}

.index4 .l .figure .item {
  width: 12.60417vw
}

.index4 .l .figure .item .flex {
  color: #5A5A5A;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  padding: 0 0 .67708vw;
  margin: 0 0 .83333vw;
  border-bottom: 1px solid rgba(49, 49, 49, 0.3);
  display: flex
}

.index4 .l .figure .item .flex .number-animate {
  line-height: 3.33333vw;
  height: 3.33333vw;
  overflow: hidden;
  display: inline-block;
  position: relative
}

.index4 .l .figure .item .flex .number-animate .number-animate-dot {
  width: 3.33333vw;
  float: left;
  text-align: center
}

.index4 .l .figure .item .flex .number-animate .number-animate-dom {
  width: 2.08333vw;
  text-align: center;
  float: left;
  position: relative;
  top: 0
}

.index4 .l .figure .item .flex .number-animate .number-animate-dom span,
.index4 .l .figure .item .flex .number-animate .number-animate-dot span {
  float: left;
  width: 100%;
  height: 3.64583vw;
  line-height: 1.1
}

.index4 .l .figure .item p {
  color: #666;
  font-style: normal;
  font-weight: 400;
  line-height: normal
}

.index4 .r .img {
  width: 39.0625vw;
  height: 44.79167vw;
  position: relative;
  border-radius: 1.66667vw;
  display: flex;
  align-items: center;
  justify-content: center
}

.index4 .r .img .pic {
  width: 30.98958vw
}

.index4 .r .img .more {
  width: 8.69792vw;
  height: 3.33333vw;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #00378A;
  text-align: center;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.5px;
  text-transform: capitalize;
  position: absolute;
  bottom: 2.91667vw;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  border-radius: 2.86458vw;
  border: 1px solid #FFF;
  background: #FFF;
  box-shadow: 0 0 15px 0 rgba(0, 55, 138, 0.4);
  transition: .6s ease
}

.index4 .r .img .more:hover {
  border: 1px solid #00378A;
  background: #00378A;
  color: #FFF
}

.index4 .r .other {
  margin: .9375vw 0 0 0;
  color: rgba(113, 113, 113, 0.5);
  font-style: normal;
  font-weight: 400
}

.index5 {
  padding: 0 5.88542vw 17.29167vw 5.88542vw
}

.index5 .title {
  margin: 0 0 0 7.65625vw
}

.index5 .title .p1 {
  color: #0D4E90;
  font-style: normal;
  font-weight: 400;
  margin: 0 0 1.30208vw
}

.index5 .title .p2 {
  color: #5A5A5A;
  font-style: normal;
  font-weight: 600;
  line-height: normal
}

.index5 .content {
  margin: 4.84375vw 0 0 0;
  display: flex;
  justify-content: space-between;
  align-items: center
}

.index5 .content .img {
  width: 44.16667vw;
  height: 27.70833vw;
  background: rgba(0, 0, 0, 0.1);
  border-radius: 1.25vw;
  overflow: hidden;
  position: relative
}

.index5 .content .img:hover img {
  transform: scale(1.05)
}

.index5 .content .img .more {
  width: 8.69792vw;
  height: 3.33333vw;
  bottom: 2.55208vw;
  left: 2.29167vw;
  position: absolute;
  z-index: 5;
  border-radius: 2.86458vw;
  border: 1px solid #FFF;
  background: #FFF;
  box-shadow: 0 0 15px 0 rgba(0, 55, 138, 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #00378A;
  text-align: center;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.5px;
  text-transform: capitalize;
  transition: .6s ease
}

.index5 .content .img .more:hover {
  border: 1px solid #00378A;
  background: #00378A;
  color: #FFF
}

.index5 .content .img img {
  width: 100%;
  height: 100%;
  transition: .6s ease
}

.index5 .content .r {
  width: 37.44792vw
}

.index5 .content .r .flex1 {
  border-radius: 1.25vw;
  background: #F6F6F6;
  padding: 1.82292vw 3.125vw;
  display: block
}

.index5 .content .r .flex1 .dis {
  display: flex;
  align-items: center;
  gap: 1.25vw
}

.index5 .content .r .flex1 .dis p {
  color: #666;
  font-style: normal;
  font-weight: 400
}

.index5 .content .r .flex1 .dis .line {
  width: 1px;
  height: .625vw;
  background: #666
}

.index5 .content .r .flex1 .p1 {
  margin: 1.875vw 0 .83333vw;
  color: #5A5A5A;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-transform: capitalize
}

.index5 .content .r .flex1 .p2 {
  color: #838B93;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-transform: capitalize
}

.index5 .content .r .list {
  margin: 1.82292vw 0 0 0;
  padding: 1.82292vw 3.125vw;
  border-radius: 1.25vw;
  border: .10417vw solid #D6D6D6;
  color: #666;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-transform: capitalize;
  display: block
}

@media screen and (max-width: 1440px) {
  .index2 .fix .last.on .r {
    /* left: -.78125vw */
  }
}

@media screen and (max-width: 768px) {
  .index1 {
    height: 100vh
  }

  .index1 video {
    left: 0
  }

  .index1 .wrap {
    padding: 0 5%;
    top: auto;
    bottom: 0;
    transform: translateY(-35%);
  }

  .index1 .wrap .p1 {
    margin: 0;
  }

  .index2 {
    height: auto !important
  }

  .index2 .fix {
    height: auto !important;
    overflow: unset
  }

  .index2 .fix .position_text {
    display: none
  }

  .index2 .fix .joke {
    display: none
  }

  .index2 .fix .position_top {
    position: static;
    width: 90%;
    transform: none;
    flex-direction: column;
    gap: 20px;
    margin: 30px auto;
    padding: 20px 5%;
    border-radius: 15px
  }

  .index2 .fix .position_top .zuo .p1 {
    margin: 0 0 15px
  }

  .index2 .fix .position_top .you {
    width: 100%
  }

  .index2 .fix .position_top .you .swiper1 {
    width: 90vw
  }

  .index2 .fix .position_top .you .swiper1 .swiper-slide .item {
    height: 280px;
    border-radius: 15px;
    padding: 30px 5%
  }

  .index2 .fix .position_top .you .swiper1 .swiper-slide .item .more {
    width: fit-content;
    height: 45px;
    padding: 0 20px;
    border-radius: 30px;
    margin: 0 0 20px
  }

  .index2 .fix .position_top .you .swiper1 .swiper-slide .item .p1 {
    margin: 0 0 10px
  }

  .index2 .fix .last {
    position: static;
    height: auto;
    padding: 0 5%;
    margin: 30px 0 0 0;
    flex-direction: column;
    gap: 30px
  }

  .index2 .fix .last .l {
    width: 100%;
    opacity: 1;
    transform: none
  }

  .index2 .fix .last .l .p1 {
    margin: 0 0 15px
  }

  .index2 .fix .last .l .p2 {
    margin: 0 0 30px
  }

  .index2 .fix .last .l .more {
    width: fit-content;
    height: 45px;
    padding: 0 20px;
    border-radius: 30px
  }

  .index2 .fix .last .r {
    width: 80vw;
    height: 80vw;
    opacity: 1 !important
  }

  .index2 .fix .last .r .common_bg {
    display: block !important
  }

  .index2 .fix .last .r .rote img {
    width: 32px;
    height: 32px;
    bottom: auto;
    top: 50%;
    transform: translateY(-50%);
    left: -15px
  }

  .index2 .fix .last .r .rote2 img {
    width: 32px;
    height: 32px;
    bottom: 0;
    right: 75px
  }

  .index2 .fix .last .r .rote3 img {
    width: 32px;
    height: 32px;
    top: 0px;
    right: 75px
  }

  .index2 .fix .last .r .flex:last-child .circle:first-child {
    background: rgba(53, 181, 227, 0.9) !important
  }

  .index2 .fix .last .r .flex:last-child .circle:last-child {
    background: #FFD284 !important
  }

  .index2 .fix .last .r .flex .circle {
    width: 30vw;
    height: 30vw;
    padding: 20px 0 0 0;
    background: rgba(13, 78, 144, 0.9) !important
  }

  .index2 .fix .last .r .flex .circle p {
    font-size: 12px
  }

  .index2 .fix .last .r .flex .circle .bg,
  .index2 .fix .last .r .flex .circle .bg2,
  .index2 .fix .last .r .flex .circle .bg3 {
    width: 30px;
    bottom: 15px
  }

  .index3 {
    padding: 30px 5%;
    flex-direction: column;
    gap: 20px
  }

  .index3 .item {
    width: 100%;
    height: auto;
    padding: 20px 10px
  }

  .index3 .item .label {
    min-width: 190px;
    width: max-content;
    height: 45px;
    border-radius: 30px;
    padding: 0 15px;
    margin: 0 0 15px
  }

  .index3 .item .p1 {
    margin: 0 0 10px;
    width: 100%;
    height: auto
  }

  .index4 {
    padding: 30px 5%;
    flex-direction: column
  }

  .index4 .l {
    width: 100%
  }

  .index4 .l .p1 {
    margin: 0 0 10px
  }

  .index4 .l .figure {
    margin: 20px 0 0 0;
    gap: 15px;
    width: 100%
  }

  .index4 .l .figure .item {
    width: 100%
  }

  .index4 .l .figure .item .flex {
    padding: 0 0 10px;
    margin: 0 0 10px
  }

  .index4 .l .figure .item .flex .number-animate {
    line-height: 30px;
    height: 30px
  }

  .index4 .l .figure .item .flex .number-animate .number-animate-dot {
    width: 30px
  }

  .index4 .l .figure .item .flex .number-animate .number-animate-dom {
    width: 20px
  }

  .index4 .l .figure .item .flex .number-animate .number-animate-dom span,
  .index4 .l .figure .item .flex .number-animate .number-animate-dot span {
    height: 35px
  }

  .index4 .r {
    width: 100%;
    margin: 25px 0 0 0;
    height: auto;
    border-radius: 15px
  }

  .index4 .r .img {
    width: 100%;
    height: 300px;
    border-radius: 15px;
    overflow: hidden
  }

  .index4 .r .img .pic {
    width: 260px
  }

  .index4 .r .img .more {
    width: fit-content;
    height: 45px;
    padding: 0 20px;
    border-radius: 30px;
    bottom: 15px
  }

  .index4 .r .other {
    margin: 15px 0 0 0
  }

  .index5 {
    padding: 30px 5%
  }

  .index5 .title {
    margin: 0
  }

  .index5 .title .p1 {
    margin: 0 0 5px
  }

  .index5 .content {
    flex-direction: column;
    margin: 25px 0 0 0
  }

  .index5 .content .img {
    width: 100%;
    height: auto;
    border-radius: 15px
  }

  .index5 .content .img .more {
    width: fit-content;
    height: 45px;
    padding: 0 20px;
    border-radius: 30px;
    left: 5%;
    bottom: 15px
  }

  .index5 .content .r {
    width: 100%;
    margin: 20px 0 0 0
  }

  .index5 .content .r .flex1 {
    padding: 20px 15px;
    border-radius: 20px
  }

  .index5 .content .r .flex1 .dis {
    gap: 10px
  }

  .index5 .content .r .flex1 .dis .line {
    width: 1px;
    height: 16px
  }

  .index5 .content .r .flex1 .p1 {
    margin: 15px 0
  }

  .index5 .content .r .list {
    margin: 20px 0 0 0;
    padding: 20px 15px;
    border-radius: 20px
  }

  .home {
    overflow: hidden
  }
}