.banner {
  position: relative;
  margin: 8.75vw 1.45833vw 0
}

.banner .bg {
  width: 100%;
  display: block;
  object-fit: cover
}

.banner .text {
  position: absolute;
  left: 0;
  top: 4.6875vw;
  width: 100%;
  text-align: center
}

.banner .text .p1 {
  color: #3E2882;
  font-size: 10.41667vw;
  line-height: 1.5
}

.banner .text .p2 {
  color: #111;
  font-weight: 700;
  line-height: 1.5;
  margin: 1.35417vw 0 .625vw
}

.banner .text .p3 {
  width: 62.5vw;
  color: rgba(0, 0, 0, 0.6);
  font-weight: 400;
  line-height: 1.4;
  margin: 0 auto;
  margin-bottom: 40px;
}

.sec0 {
  padding: 7.29167vw 10.72917vw;
  /* display: flex;
  justify-content: space-between;
  align-items: center; */
  background: white
}
.sec0 .box {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.sec0 .lbox {
  width: 37.13542vw
}

.sec0 .lbox .pic {
  width: 100%;
  display: none
}

.sec0 .lbox .pic img {
  width: 100%;
  display: block;
  object-fit: cover;
  height: 24.84375vw;
  border-radius: 20px
}

.sec0 .lbox .pic.on {
  display: block
}

.sec0 .rbox {
  width: 28.90625vw;
  position: relative
}

.sec0 .rbox::before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 10.41667vw;
  background: linear-gradient(to bottom, #fff 0%, rgba(255, 255, 255, 0) 100%);
  z-index: 10;
  pointer-events: none
}

.sec0 .rbox::after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 10.41667vw;
  transform: rotate(180deg);
  background: linear-gradient(to bottom, #fff 0%, rgba(255, 255, 255, 0) 100%);
  z-index: 10;
  pointer-events: none
}

.sec0 .rbox .swiper0 {
  width: 100%;
  height: 31.25vw;
  overflow: hidden
}

.sec0 .rbox .swiper0 .swiper-slide {
  cursor: pointer
}

.sec0 .rbox .swiper0 .swiper-slide .info .p1 {
  font-size: 1.25vw;
  margin-bottom: .83333vw;
  transition: all 600ms
}

.sec0 .rbox .swiper0 .swiper-slide .info .des {
  color: #666;
  font-weight: 400;
  line-height: 1.5;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden
}

.sec0 .rbox .swiper0 .swiper-slide-active .info .p1 {
  color: #8942FE
}

.sec1 {
  padding: 7.29167vw 7.8125vw 0;
  position: relative
}

.sec1 .bg {
  position: absolute;
  z-index: -1;
  width: 73.95833vw;
  top: 0;
  left: 0
}

.sec1 .bg img {
  display: block;
  width: 100%
}

.sec1 .box {
  width: 84.375vw;
  height: 50vw;
  background: url("/images/dataCollection/bg2.png") no-repeat;
  background-size: 100% 100%;
  padding: 2.29167vw 0 0
}

.sec1 .box .title {
  color: #111;
  text-align: center;
  font-weight: 500;
  line-height: 150%;
  margin-bottom: 2.5vw
}

.sec1 .box .list {
  display: flex;
  justify-content: center;
  gap: 2.34375vw
}

.sec1 .box .list .item {
  width: 6.77083vw;
  height: 12.23958vw;
  background: url("/images/dataCollection/bg3.png") no-repeat;
  background-size: 100% 100%;
  padding: .78125vw .625vw
}

.sec1 .box .list .item ul li {
  color: #666;
  font-weight: 400;
  line-height: 150%
}

.sec1 .box .cir_box {
  width: 65.26042vw;
  margin: 2.34375vw auto 0;
  position: relative
}

.sec1 .box .cir_box .part {
  width: 100%
}

.sec1 .box .cir_box .part .part_img {
  width: 100%
}

.sec1 .box .cir_box .part .part_img svg {
  display: block;
  width: 100%;
  height: auto
}

.sec1 .box .cir_box .part .jts {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0
}

.sec1 .box .cir_box .part .jts .jt {
  position: absolute;
  offset-path: path("M1231 626.5C1231 281.03 955.639 1 616 1C276.361 1 1 281.03 1 626.5C1 971.97 276.361 1252 616 1252C955.639 1252 1231 971.97 1231 626.5Z");
  offset-distance: 90%;
  display: flex;
  align-items: center;
  justify-content: center
}

.sec1 .box .cir_box .part .jts .jt img {
  display: block;
  width: 1.45833vw;
  position: absolute;
  max-width: unset;
  transform: rotate(180deg)
}

.sec1 .box .cir_box .part .part_list .item {
  width: 5.72917vw;
  height: 5.72917vw;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  text-align: center;
  color: #FFF;
  font-weight: 700;
  line-height: 150%;
  box-shadow: 0 1.5625vw 1.5625vw-1.66667vw rgba(218, 208, 255, 0.5);
  z-index: 3
}

.sec1 .box .cir_box .part .part_list .item img {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: -1;
  animation-name: rotate;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-duration: 6s
}

.sec1 .box .cir_box .part .part_list .item:nth-child(1) {
  left: -1.19792vw;
  top: 18.22917vw
}

.sec1 .box .cir_box .part .part_list .item:nth-child(2) {
  left: 5.05208vw;
  top: 8.54167vw
}

.sec1 .box .cir_box .part .part_list .item:nth-child(3) {
  left: 14.6875vw;
  top: 1.66667vw
}

.sec1 .box .cir_box .part .part_list .item:nth-child(4) {
  left: 25vw;
  top: -2.08333vw
}

.sec1 .box .cir_box .part .part_list .item:nth-child(5) {
  left: 34.21875vw;
  top: -2.08333vw
}

.sec1 .box .cir_box .part .part_list .item:nth-child(6) {
  left: 44.94792vw;
  top: 1.66667vw
}

.sec1 .box .cir_box .part .part_list .item:nth-child(7) {
  left: 54.47917vw;
  top: 9.32292vw
}

.sec1 .box .cir_box .part .part_list .item:nth-child(8) {
  left: 60.41667vw;
  top: 18.22917vw
}

.sec1 .box .cir_box .img {
  width: 49.79167vw;
  position: absolute;
  top: 5.88542vw;
  left: 50%;
  transform: translateX(-50%)
}

.sec1 .box .cir_box .img img {
  display: block;
  width: 100%
}

.sec2 {
  padding: 6.25vw 0 0;
  position: relative
}

.sec2 .bg {
  position: absolute;
  z-index: -1;
  width: 95.15625vw;
  top: 0;
  left: 0
}

.sec2 .bg img {
  display: block;
  width: 100%
}

.sec2 .box {
  width: 84.375vw;
  height: 50vw;
  background: url("/images/dataCollection/bg2.png") no-repeat;
  background-size: 100% 100%;
  padding: 2.29167vw 0 0;
  margin: 0 auto
}
.sec0 .title {
  color: #111;
  text-align: center;
  font-weight: 500;
  line-height: 150%;
  margin-bottom: 2.65625vw
}
.sec2 .box .title {
  color: #111;
  text-align: center;
  font-weight: 500;
  line-height: 150%;
  margin-bottom: 2.65625vw
}

.sec2 .box .part {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15.57292vw;
  position: relative
}

.sec2 .box .part .center {
  position: absolute;
  display: flex;
  gap: .36458vw;
  pointer-events: none
}

.sec2 .box .part .center .center_bg {
  position: absolute;
  width: 35.26042vw;
  top: 50%;
  transform: translateY(-50%)
}

.sec2 .box .part .center .center_bg img {
  display: block;
  width: 100%
}

.sec2 .box .part .center .center_bg1 {
  right: 5.36458vw
}

.sec2 .box .part .center .center_bg2 {
  left: 5.36458vw
}

.sec2 .box .part .center .l,
.sec2 .box .part .center .r {
  width: 4.6875vw;
  position: relative;
  display: flex;
  align-items: center;
  z-index: 3
}

.sec2 .box .part .center .l img,
.sec2 .box .part .center .r img {
  display: block;
  width: 100%
}

.sec2 .box .part .center .l p,
.sec2 .box .part .center .r p {
  color: #63E;
  font-weight: 700;
  line-height: 150%;
  position: absolute;
  right: .36458vw
}

.sec2 .box .part .center .r p {
  left: .36458vw;
  right: unset
}

.sec2 .box .part .list:nth-child(2) .item {
  background: url("/images/dataCollection/d2.png") no-repeat;
  background-size: 100% 100%
}

.sec2 .box .part .list .item {
  width: 23.4375vw;
  height: 8.17708vw;
  background: url("/images/dataCollection/d1.png") no-repeat;
  background-size: 100% 100%;
  padding: .9375vw 0 0 2.08333vw;
  position: relative;
  transition: 0.6s
}

.sec2 .box .part .list .item:hover:after {
  opacity: 1
}

.sec2 .box .part .list .item:hover .h5 {
  color: #63E
}

.sec2 .box .part .list .item:hover .text .p p {
  color: rgba(102, 51, 238, 0.6)
}

.sec2 .box .part .list .item:after {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 1.04167vw;
  position: absolute;
  top: 0;
  left: 0;
  border: .05208vw solid rgba(102, 51, 238, 0.4);
  background: #FFF;
  box-shadow: 0 .20833vw 1.04167vw 0 rgba(102, 51, 238, 0.2);
  opacity: 0;
  transition: 0.6s
}

.sec2 .box .part .list .item:not(:last-child) {
  margin-bottom: 1.45833vw
}

.sec2 .box .part .list .item .h5 {
  color: #000;
  font-weight: 400;
  line-height: 150%;
  margin-bottom: .26042vw;
  position: relative;
  z-index: 3;
  transition: 0.6s
}

.sec2 .box .part .list .item .text {
  display: flex;
  gap: 1.35417vw;
  position: relative;
  z-index: 3
}

.sec2 .box .part .list .item .text .p p {
  color: #666;
  font-weight: 400;
  line-height: 150%;
  min-width: 3.64583vw;
  transition: 0.6s
}

.sec2 .box .part .list .item:hover:after {
  opacity: 1
}

.sec2 .box .part .list .item:hover .h5 {
  color: #63E
}

.sec2 .box .part .list .item:hover .text .p p {
  color: rgba(102, 51, 238, 0.6)
}

.sec3 {
  padding: 6.25vw 0 0;
  position: relative
}

.sec3 .bg {
  position: absolute;
  z-index: -1;
  width: 53.48958vw;
  top: -26.04167vw;
  left: 0
}

.sec3 .bg img {
  display: block;
  width: 100%
}

.sec3 .bg1 {
  width: 77.86458vw;
  left: unset;
  top: 15.625vw;
  right: 0
}

.sec3 .box {
  width: 84.375vw;
  height: 50vw;
  background: url("/images/dataCollection/bg2.png") no-repeat;
  background-size: 100% 100%;
  padding: 2.29167vw 0 0;
  margin: 0 auto
}

.sec3 .box .title {
  color: #111;
  text-align: center;
  font-weight: 500;
  line-height: 150%;
  margin-bottom: 1.92708vw
}

.sec3 .box .labels {
  display: flex;
  justify-content: center;
  gap: 1.35417vw;
  margin-bottom: 1.92708vw
}

.sec3 .box .labels .label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 8.33333vw;
  height: 2.08333vw;
  border-radius: 1.5625vw;
  background: linear-gradient(270deg, #8455E7 0%, #E298A6 100%);
  color: #FFF;
  font-weight: 400;
  transition: 0.6s
}

.sec3 .box .labels .label:hover {
  transform: scale(1.1)
}

.sec3 .box .part {
  position: relative;
  width: 33.75vw;
  margin: 0 auto 5.3125vw
}

.sec3 .box .part .cir {
  position: absolute;
  left: 50%;
  transform: translateX(-50%)
}

.sec3 .box .part .cir .img {
  width: 100%
}

.sec3 .box .part .cir .img img {
  display: block;
  width: 100%
}

.sec3 .box .part .cir .img p {
  color: #8942FE;
  text-align: center;
  font-weight: 700;
  line-height: 150%;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -1.19792vw
}

.sec3 .box .part .cir .cir_box .item {
  display: flex;
  width: 12.08333vw;
  height: 2.08333vw;
  justify-content: center;
  align-items: center;
  background: url("/images/dataCollection/btn.png") no-repeat;
  background-size: 100% 100%;
  border-radius: 5.20833vw;
  box-shadow: -.05208vw-.05208vw .30208vw 0 #F6EBFF inset, 0 .20833vw .20833vw 0 rgba(160, 130, 240, 0.25);
  color: #FFF;
  font-weight: 400;
  position: absolute;
  animation-name: floating;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  animation-duration: 6s
}

.sec3 .box .part .cir2 {
  width: 42.1875vw;
  top: 11.77083vw
}

.sec3 .box .part .cir2 .img p {
  top: 2.76042vw
}

.sec3 .box .part .cir2 .cir_box .item:nth-child(1) {
  top: .41667vw;
  left: -5.41667vw;
  animation-name: floating1
}

.sec3 .box .part .cir2 .cir_box .item:nth-child(2) {
  top: 3.95833vw;
  left: 1.19792vw
}

.sec3 .box .part .cir2 .cir_box .item:nth-child(3) {
  top: 2.76042vw;
  left: 28.17708vw;
  animation-name: floating1
}

.sec3 .box .part .cir2 .cir_box .item:nth-child(4) {
  top: -.625vw;
  left: 33.69792vw
}

.sec3 .box .part .cir2 .line_box .line {
  width: fit-content;
  height: 6.77083vw;
  position: absolute;
  clip-path: inset(100% 0 0 0)
}

.sec3 .box .part .cir2 .line_box .line img {
  display: block;
  height: 100%
}

.sec3 .box .part .cir2 .line_box .line:nth-child(1) {
  top: -.625vw;
  left: 1.19792vw
}

.sec3 .box .part .cir2 .line_box .line:nth-child(2) {
  top: 1.14583vw;
  left: 6.04167vw
}

.sec3 .box .part .cir2 .line_box .line:nth-child(3) {
  top: 1.875vw;
  left: 14.32292vw
}

.sec3 .box .part .cir2 .line_box .line:nth-child(4) {
  top: 1.875vw;
  left: 29.11458vw
}

.sec3 .box .part .cir2 .line_box .line:nth-child(5) {
  top: .72917vw;
  left: 36.25vw
}

.sec3 .box .part .cir2 .line_box .line:nth-child(6) {
  top: -1.61458vw;
  left: 40.83333vw
}

.sec3 .box .part .cir2 .line_box.animated .line {
  clip-path: inset(0% 0 0 0);
  transition: 1.4s
}

.sec3 .box .part .cir1 {
  width: 27.5vw;
  top: 6.875vw
}

.sec3 .box .part .cir1 .cir_box .item:nth-child(1) {
  top: -5.98958vw;
  left: -7.34375vw;
  animation-name: floating1
}

.sec3 .box .part .cir1 .cir_box .item:nth-child(2) {
  top: -2.70833vw;
  left: -14.79167vw
}

.sec3 .box .part .cir1 .cir_box .item:nth-child(3) {
  top: .88542vw;
  left: -3.90625vw;
  animation-name: floating1
}

.sec3 .box .part .cir1 .cir_box .item:nth-child(4) {
  top: -2.08333vw;
  left: 20.57292vw;
  animation-name: floating1
}

.sec3 .box .part .cir1 .cir_box .item:nth-child(5) {
  top: -7.44792vw;
  left: 22.86458vw
}

.sec3 .box .part .cir3 {
  width: 65.83333vw;
  top: 15.83333vw
}

.sec3 .box .part .cir3 .img p {
  top: 6.875vw
}

.sec3 .box .part .cir3 .label_box .label {
  width: 8.33333vw;
  height: 2.08333vw;
  border-radius: 1.5625vw;
  background: linear-gradient(270deg, #8455E7 0%, #E298A6 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  font-weight: 400;
  line-height: 150%;
  position: absolute
}

.sec3 .box .part .cir3 .label_box .label:nth-child(1) {
  top: 9.47917vw;
  left: 4.32292vw
}

.sec3 .box .part .cir3 .label_box .label:nth-child(2) {
  top: 11.5625vw;
  left: 29.73958vw
}

.sec3 .box .part .cir3 .label_box .label:nth-child(3) {
  top: 9.47917vw;
  left: 55.15625vw
}

.sec3 .box .part .cir3 .cir_box .item:nth-child(1) {
  top: 6.45833vw;
  left: 10vw
}

.sec3 .box .part .cir3 .cir_box .item:nth-child(2) {
  top: 6.97917vw;
  left: 45.88542vw;
  animation-name: floating1
}

.sec3 .box .part .cir3 .cir_box .item:nth-child(3) {
  top: 3.125vw;
  left: 49.73958vw
}

.sec3 .box .part .center {
  width: 100%;
  position: relative
}

.sec3 .box .part .center .color {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  mask-image: url("/images/dataCollection/d11.svg");
  mask-size: 100% 100%;
  z-index: 3
}

.sec3 .box .part .center .color .color_sq {
  width: 100%;
  position: absolute;
  top: 100%;
  height: 15.625vw;
  animation: img_go 4s infinite ease-in-out;
  background: linear-gradient(180deg, rgba(255, 207, 135, 0), #ffcf87, rgba(255, 207, 135, 0))
}

.sec3 .box .part .center img {
  display: block;
  width: 100%
}

.sec3 .box .texts {
  display: flex;
  justify-content: center;
  gap: 2.5vw;
  margin: 5.3125vw 0 0
}

.sec3 .box .texts .text {
  display: flex;
  width: 23.33333vw;
  height: 4.84375vw;
  justify-content: center;
  align-items: center;
  border-radius: .83333vw;
  background: #FFF;
  box-shadow: 0 2.08333vw 1.25vw-1.66667vw rgba(233, 147, 255, 0.2);
  padding: .52083vw 1.66667vw;
  transition: all 600ms
}

.sec3 .box .texts .text p {
  text-align: center;
  font-family: "Noto Sans SC";
  font-weight: 400;
  line-height: 150%;
  background: linear-gradient(90deg, #C4ADFF 0%, #63E 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent
}

.sec3 .box .texts .text:hover {
  transform: scale(1.05)
}

@keyframes floating {

  0%,
  to {
    transform: translate(0%, 0)
  }

  25% {
    transform: translate(.26042vw, .26042vw)
  }

  50% {
    transform: translate(0vw, .52083vw)
  }

  75% {
    transform: translate(-.26042vw, .26042vw)
  }
}

@keyframes floating1 {

  0%,
  to {
    transform: translate(0%, 0)
  }

  25% {
    transform: translate(-.26042vw, -.26042vw)
  }

  50% {
    transform: translate(0vw, -.52083vw)
  }

  75% {
    transform: translate(.26042vw, -.26042vw)
  }
}

.container {
  position: relative;
  overflow: hidden
}

.container .bg {
  position: absolute;
  width: 100%;
  z-index: -1
}

.container .bg img {
  display: block;
  width: 100%
}

.sec4 {
  padding: 7.65625vw 0 0
}

.sec4 .title {
  color: #111;
  text-align: center;
  font-weight: 700;
  line-height: 1.5
}

.sec4 .text {
  width: 34.375vw;
  color: rgba(0, 0, 0, 0.6);
  text-align: center;
  font-weight: 400;
  line-height: 1.4;
  margin: .625vw auto 4.84375vw
}

.sec4 .list {
  display: flex;
  justify-content: center;
  gap: 3.125vw
}

.sec4 .list .item {
  width: 40.625vw;
  height: 17.55208vw;
  position: relative;
  border-radius: 1.5625vw;
  display: flex;
  align-items: center;
  padding: .10417vw;
  gap: 1.71875vw
}

.sec4 .list .item .item_l {
  width: 18.85417vw;
  height: 17.34375vw;
  border-radius: 1.5625vw 0 0 1.5625vw;
  overflow: hidden
}

.sec4 .list .item .item_l img {
  display: block;
  width: 100%
}

.sec4 .list .item .item_r {
  width: 17.55208vw
}

.sec4 .list .item .item_r .item_title {
  display: flex;
  align-items: center;
  gap: .83333vw
}

.sec4 .list .item .item_r .item_title p {
  color: #000;
  font-weight: 400;
  line-height: 150%
}

.sec4 .list .item .item_r .item_title img {
  display: block;
  width: 1.66667vw
}

.sec4 .list .item .item_r .item_text {
  color: #666;
  font-weight: 400;
  line-height: 150%;
  margin: 1.66667vw 0 2.8125vw
}

.sec4 .list .item .item_r .item_bottom {
  display: flex;
  align-items: flex-end;
  color: #000;
  font-size: .83333vw;
  font-weight: 400;
  line-height: 150%;
  gap: .52083vw
}

.sec4 .list .item .item_r .item_bottom .num {
  position: relative
}

.sec4 .list .item .item_r .item_bottom .num span {
  display: block;
  font-size: 3.33333vw;
  font-weight: 700;
  background: linear-gradient(90deg, #C4ADFF 0%, #63E 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  line-height: 1;
  transition: 0.6s
}

.sec4 .list .item .item_r .item_bottom .num span:nth-child(2) {
  position: absolute;
  font-size: 3.33333vw;
  font-weight: 700;
  background: linear-gradient(270deg, #8455E7 0%, #E298A6 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  line-height: 1;
  top: 0;
  left: 0;
  opacity: 0
}

.sec4 .list .item .item_bg {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0
}

.sec4 .list .item .item_bg img {
  display: block;
  width: 100%;
  height: 100%;
  transition: 0.6s
}

.sec4 .list .item .item_bg img:nth-child(2) {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0
}

.sec4 .list .item:hover .item_r .item_bottom .num span:nth-child(1) {
  opacity: 0
}

.sec4 .list .item:hover .item_r .item_bottom .num span:nth-child(2) {
  opacity: 1
}

.sec4 .list .item:hover .item_bg img:nth-child(1) {
  opacity: 0
}

.sec4 .list .item:hover .item_bg img:nth-child(2) {
  opacity: 1
}

.sec5 {
  padding: 15.10417vw 0 17.39583vw;
  position: relative
}

.sec5 .bg1 {
  position: absolute;
  width: 98.33333vw;
  left: 50%;
  transform: translateX(-50%);
  top: 9.89583vw;
  z-index: -1
}

.sec5 .bg1 img {
  display: block;
  width: 100%
}

.sec5 .title {
  color: #111;
  text-align: center;
  font-weight: 700;
  line-height: 1.55
}

.sec5 .text {
  width: 58.22917vw;
  margin: .625vw auto 3.28125vw;
  color: rgba(0, 0, 0, 0.6);
  text-align: center;
  font-weight: 400;
  line-height: 1.4
}

.sec5 .box {
  width: 84.375vw;
  margin: 0 auto;
  border-radius: 1.5625vw;
  border: .10417vw solid #fff;
  background: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(5.20833vw);
  padding: 2.91667vw 0 4.27083vw
}

.sec5 .box .box_title {
  color: #111;
  text-align: center;
  font-weight: 500;
  line-height: 150%;
  margin-bottom: 4.79167vw
}

.sec5 .box .box_content {
  display: flex;
  justify-content: center;
  gap: 1.97917vw
}

.sec5 .box .box_content .jt1 {
  width: 2.5vw;
  margin-top: 14.58333vw
}

.sec5 .box .box_content .jt1 img {
  display: block;
  width: 100%
}

.sec5 .box .box_content .jt3 {
  width: 2.5vw;
  margin-top: 2.39583vw
}

.sec5 .box .box_content .jt3 img {
  display: block;
  width: 100%
}

.sec5 .box .box_content .items {
  height: fit-content;
  position: relative
}

.sec5 .box .box_content .items .sp {
  display: flex;
  gap: 7.8125vw;
  position: absolute;
  right: -1.71875vw;
  top: 9.375vw
}

.sec5 .box .box_content .items .sp .l {
  width: .625vw;
  margin: -.88542vw-.36458vw 0 0
}

.sec5 .box .box_content .items .sp .l img {
  display: block;
  width: 100%;
  height: 9.21875vw
}

.sec5 .box .box_content .items .sp .r .sp_item {
  width: 8.64583vw;
  height: 2.91667vw;
  border-radius: 3.125vw;
  background: #FFF;
  box-shadow: 0 1.5625vw 1.5625vw-1.66667vw rgba(218, 208, 255, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #000;
  font-weight: 400;
  margin-bottom: .9375vw;
  position: relative
}

.sec5 .box .box_content .items .sp .r .sp_item .line {
  position: absolute;
  top: 50%;
  left: 0;
  width: 8.07292vw;
  height: .10417vw;
  background: linear-gradient(90deg, #63e 0%, #c4adff 100%);
  transform: translate(-100%, -50%)
}

.sec5 .box .box_content .items .sp .r .sp_item .line p {
  position: absolute;
  color: rgba(0, 0, 0, 0.6);
  font-size: .83333vw;
  font-weight: 400;
  line-height: 150%;
  position: absolute;
  left: 50%;
  top: -.26042vw;
  width: max-content;
  transform: translate(-50%, -100%)
}

.sec5 .box .box_content .items .sp .r .sp_item:after {
  content: "";
  width: .10417vw;
  height: .9375vw;
  position: absolute;
  left: 50%;
  transform: translate(-50%, -100%);
  top: 0;
  background: #63E
}

.sec5 .box .box_content .items .sp .r .sp_item svg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0
}

.sec5 .box .box_content .items .jt {
  width: .9375vw;
  margin: .67708vw auto
}

.sec5 .box .box_content .items .jt img {
  display: block;
  width: 100%
}

.sec5 .box .box_content .items .item2 .circle {
  width: 5.52083vw;
  height: 5.52083vw;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto .9375vw
}

.sec5 .box .box_content .items .item2 .circle .cir_bg {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  animation-name: rotate;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  animation-duration: 20s
}

.sec5 .box .box_content .items .item2 .circle .icon {
  position: relative;
  z-index: 3
}

.sec5 .box .box_content .items .item2 p {
  text-align: center
}

.sec5 .box .box_content .item .icon {
  width: 2.5vw
}

.sec5 .box .box_content .item .icon img {
  display: block;
  width: 100%
}

.sec5 .box .box_content .item p {
  color: #000;
  font-weight: 400;
  line-height: 150%;
  text-align: center
}

.sec5 .box .box_content .item1 {
  width: 5.52083vw;
  height: 19.58333vw;
  border-radius: 3.125vw;
  background: #FFF;
  box-shadow: 0 1.5625vw 1.5625vw-1.66667vw rgba(218, 208, 255, 0.5);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .83333vw;
  position: relative
}

.sec5 .box .box_content .item1 svg {
  position: absolute;
  width: 100%;
  height: 100%
}

.sec6 {
  padding: 0 0 4.6875vw
}

.sec6 .title {
  color: #111;
  text-align: center;
  font-weight: 700;
  line-height: 150%;
  margin-bottom: 4.16667vw
}

.sec6 .swiper {
  width: 64.6875vw;
  margin: 3.54167vw auto
}

.sec6 .swiper .swiper-slide {
  width: 100%
}

.sec6 .swiper .swiper-slide .slide_box {
  width: 100%;
  height: 26.04167vw;
  padding: 1.66667vw;
  border-radius: 1.5625vw;
  border-radius: 1.5625vw;
  box-shadow: 0 .26042vw 1.97917vw 0 rgba(0, 0, 0, 0.1);
  background: url("/images/solution/bg9.png");
  background-size: 100% 100%;
  transition: 0.6s;
  transform: scale(0.84)
}

.sec6 .swiper .swiper-slide .slide_box .slide_content {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;
  padding: 2.86458vw 3.54167vw;
  border-radius: 1.5625vw;
  background: #F5F7FD;
  backdrop-filter: blur(5.20833vw)
}

.sec6 .swiper .swiper-slide .slide_box .slide_content .slide_content_l {
  width: 24.0625vw;
  height: 100%;
  border-radius: 1.5625vw;
  overflow: hidden
}

.sec6 .swiper .swiper-slide .slide_box .slide_content .slide_content_l img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 1s
}

.sec6 .swiper .swiper-slide .slide_box .slide_content .slide_content_r {
  width: 27.08333vw
}

.sec6 .swiper .swiper-slide .slide_box .slide_content .slide_content_r .h5 {
  color: #000;
  font-weight: 400;
  line-height: 150%;
  margin-bottom: 3.38542vw
}

.sec6 .swiper .swiper-slide .slide_box .slide_content .slide_content_r .p {
  color: #666;
  font-weight: 400;
  line-height: 150%
}

.sec6 .swiper .swiper-slide .slide_box:hover .slide_content .slide_content_l img {
  transform: scale(1.1)
}

.sec6 .swiper .swiper-slide.swiper-slide-active .slide_box {
  transform: scale(1)
}

.sec6 .swiper_control {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3.125vw
}

.sec6 .swiper_control .swiper-pagination {
  display: flex;
  gap: 1.04167vw;
  position: unset
}

.sec6 .swiper_control .swiper-pagination .swiper-pagination-bullet {
  display: block;
  width: .625vw;
  height: .625vw;
  border-radius: .625vw;
  background: rgba(0, 0, 0, 0.2);
  opacity: 1;
  margin: 0;
  cursor: pointer;
  transition: 0.6s
}

.sec6 .swiper_control .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: linear-gradient(270deg, #8455E7 0%, #E298A6 100%)
}

.sec6 .swiper_control .prev,
.sec6 .swiper_control .next {
  width: 3.125vw;
  height: 3.125vw;
  cursor: pointer;
  transition: 0.6s;
  background: url(../images/left.png) no-repeat;
  background-size: 100% 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 1.04167vw
}

.sec6 .swiper_control .prev img,
.sec6 .swiper_control .next img {
  display: block;
  width: .41667vw;
  transition: all 600ms
}

.sec6 .swiper_control .prev:hover,
.sec6 .swiper_control .next:hover {
  box-shadow: 0 4px 20px 0 rgba(102, 51, 238, 0.4)
}

.sec6 .swiper_control .prev:hover img {
  transform: translate(-.10417vw, -.10417vw) rotate(45deg)
}

.sec6 .swiper_control .next img {
  transform: rotateY(180deg)
}

.sec6 .swiper_control .next:hover img {
  transform: translate(.10417vw, -.10417vw) rotateY(180deg) rotate(45deg)
}

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

@media screen and (max-width: 768px) {
  .banner {
    margin: 80px 16px 0
  }

  .banner .bg {
    height: 300px;
    border-radius: 15px
  }

  .banner .text {
    top: 10px
  }

  .banner .text .p1 {
    font-size: 32px
  }

  .banner .text .p2 {
    font-size: 18px;
    margin: 8px 0 10px
  }

  .banner .text .p3 {
    font-size: 14px;
    width: 80%;
    line-height: 1.5;
    margin: 0 auto 15px
  }

  .banner .text .btns {
    gap: 15px
  }

  .banner .text .btns .btn {
    gap: 6px;
    padding: 6px 15px
  }

  .banner .text .btns .btn p {
    font-size: 14px
  }

  .banner .text .btns .btn img {
    width: 6px
  }

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

  .sec0 .lbox {
    width: 100%
  }
  .sec0 .box {
    flex-direction: column;
  }
  .sec0 .lbox .pic img {
    height: 226px
  }

  .sec0 .rbox {
    width: 100%
  }

  .sec0 .rbox::before,
  .sec0 .rbox::after {
    display: none
  }

  .sec0 .rbox .swiper0 {
    height: auto
  }

  .sec0 .rbox .swiper0 .swiper-slide .info .p1 {
    font-size: 18px;
    margin: 15px 0 10px 0
  }

  .sec0 .rbox .swiper0 .swiper-slide .info .des {
    font-size: 14px;
    display: block;
    max-height: 105px;
    overflow-y: auto
  }

  .sec1 {
    padding: 50px 5vw 20px
  }

  .sec1 .box {
    background: unset;
    width: 100%;
    padding: 0;
    height: unset
  }

  .sec1 .box .list {
    display: none
  }

  .sec1 .box .cir_box {
    display: none
  }

  .sec1 .box .ph {
    display: block !important;
    width: 100%;
    margin: 20px 0 0
  }

  .sec1 .box .ph img {
    display: block;
    width: 100%
  }

  .sec2 {
    padding: 30px 5vw 20px
  }

  .sec2 .box {
    background: unset;
    width: 100%;
    padding: 0;
    height: unset
  }

  .sec2 .box .part {
    display: none
  }

  .sec2 .box .ph {
    display: block !important;
    width: 100%;
    margin: 30px 0 0
  }

  .sec2 .box .ph img {
    display: block;
    width: 100%
  }

  .sec3 {
    padding: 30px 5vw 20px
  }

  .sec3 .box {
    background: unset;
    height: unset;
    width: 100%;
    padding: 0
  }

  .sec3 .box .part,
  .sec3 .box .texts {
    display: none
  }

  .sec3 .box .labels {
    display: none
  }

  .sec3 .box .ph {
    display: block !important;
    width: 100%;
    margin: 20px 0 0
  }

  .sec3 .box .ph img {
    display: block;
    width: 100%
  }

  .sec4 {
    padding: 20px 5vw 30px
  }

  .sec4 .text {
    width: 100%;
    font-size: 15px;
    margin: 10px 0 25px
  }

  .sec4 .list {
    display: block
  }

  .sec4 .list .item {
    width: 100%;
    height: unset;
    border-radius: 10px;
    border: 1px solid #8A43FE;
    display: block;
    padding: 20px;
    margin-bottom: 20px
  }

  .sec4 .list .item .item_l {
    width: 100%;
    height: unset
  }

  .sec4 .list .item .item_r {
    width: 100%;
    padding: 30px 0 0
  }

  .sec4 .list .item .item_r .item_title {
    gap: 6px;
    margin-bottom: 20px
  }

  .sec4 .list .item .item_r .item_title img {
    width: 20px
  }

  .sec4 .list .item .item_r .item_bottom {
    font-size: 14px
  }

  .sec4 .list .item .item_r .item_bottom .num {
    font-size: 30px
  }

  .sec4 .list .item .item_r .item_bottom .num span {
    font-size: 30px
  }

  .sec4 .list .item .item_bg {
    display: none
  }

  .sec5 {
    padding: 10px 5vw 0
  }

  .sec5 .bg1 {
    width: 100%;
    height: 100%
  }

  .sec5 .bg1 img {
    height: 100%;
    object-fit: cover
  }

  .sec5 .text {
    width: 100%;
    font-size: 15px;
    margin: 10px 0 25px
  }

  .sec5 .box {
    width: 100%;
    padding: 30px 20px;
    border-radius: 10px
  }

  .sec5 .box .box_title {
    margin-bottom: 30px
  }

  .sec5 .box .box_content {
    display: block
  }

  .sec5 .box .box_content .jt1,
  .sec5 .box .box_content .jt3 {
    transform: rotate(90deg);
    width: 20px;
    margin: 15px auto
  }

  .sec5 .box .box_content .items .sp {
    display: none
  }

  .sec5 .box .box_content .items .jt2 {
    transform: rotate(180deg);
    width: 7.5px;
    margin: 15px auto
  }

  .sec5 .box .box_content .items .item2 .circle {
    width: 60px;
    height: 60px;
    background: #FFFFFF;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center
  }

  .sec5 .box .box_content .items .item2 .circle .cir_bg {
    display: none
  }

  .sec5 .box .box_content .items .item2 .circle .icon {
    width: 50%
  }

  .sec5 .box .box_content .items .item2 p {
    font-size: 16px
  }

  .sec5 .box .box_content .items:nth-child(3) {
    display: flex;
    flex-direction: column-reverse
  }

  .sec5 .box .box_content .item1 {
    width: unset;
    height: unset;
    background: unset;
    box-shadow: unset
  }

  .sec5 .box .box_content .item1 .icon {
    width: 60px;
    height: 60px;
    background: #FFFFFF;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center
  }

  .sec5 .box .box_content .item1 .icon img {
    display: block;
    max-width: 50%;
    max-height: 50%
  }

  .sec5 .box .box_content .item1 p {
    font-size: 16px
  }

  .sec5 .box .box_content .item1 p br {
    display: none
  }

  .sec5 .box .box_content .item1 svg {
    display: none
  }

  .sec6 {
    padding: 30px 5vw
  }

  .sec6 .swiper {
    width: 100%
  }

  .sec6 .swiper .swiper-slide .slide_box {
    height: unset;
    display: block;
    padding: 20px;
    border-radius: 8px;
    transform: scale(1) !important
  }

  .sec6 .swiper .swiper-slide .slide_box .slide_content {
    display: block;
    border-radius: 6px;
    padding: 20px
  }

  .sec6 .swiper .swiper-slide .slide_box .slide_content .slide_content_l {
    width: 100%
  }

  .sec6 .swiper .swiper-slide .slide_box .slide_content .slide_content_r {
    width: 100%;
    margin: 15px 0 0
  }

  .sec6 .swiper .swiper-slide .slide_box .slide_content .slide_content_r .h5 {
    font-size: 17px;
    margin-bottom: 5px
  }

  .sec6 .swiper .swiper-slide .slide_box .slide_content .slide_content_r .p {
    font-size: 12px
  }

  .sec6 .swiper_control {
    gap: 20px;
    margin: 30px 0 0
  }

  .sec6 .swiper_control .prev,
  .sec6 .swiper_control .next {
    width: 30px;
    height: 30px;
    border-radius: 12px
  }

  .sec6 .swiper_control .prev img,
  .sec6 .swiper_control .next img {
    width: 5px
  }

  .sec6 .swiper_control .swiper-pagination {
    gap: 10px
  }

  .sec6 .swiper_control .swiper-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    border-radius: 8px
  }
}

@keyframes img_go {
  100% {
    transform: translateY(-43.02083vw)
  }
}



.DataService{ 
  /* background:#f3f7fc;  */
  position:relative; 
  overflow:hidden; 
  /* padding:50px 100px; */
  padding: 7.29167vw 10.72917vw;
}
.DataService::after,
.DataService:before{ float:left; width:26%; height:50%; position:absolute; content:''; z-index:1; background-size:contain !important;}
/* .DataService::after{ left:0; bottom:0; background:url(../old_img/main71.jpg) left bottom no-repeat;} */
/* .DataService::before{ right:0; top:0; background:url(../old_img/main70.jpg) right top no-repeat;} */
.DataService .list{ float:left; width:100%; background:#fff; border-radius:6px; overflow:hidden; margin:57px 0 61px 0; }  
.DataService .list ul{ float:left; width:100%;}
.DataService .list li{ float:left; width:100%; flex-wrap:wrap; display: flex;}
.DataService .list .img{ float:left; width:58.3%; line-height:0; overflow:hidden;}
.DataService .list .img img{ min-height:100%;}
.DataService .list .text{ float:left; width:41.7%; padding:5.75% 40px;}
.DataService .list .text h4{float:left; width:100%; color:#2c2f43; border-bottom:1px solid #dddddd; font-size:24px; line-height:34px; padding-bottom:6.1%; margin-bottom:5.7%;}
.DataService .list .text h5{float:left; width:100%; color:#666666; letter-spacing:1px; font-size:16px; line-height:30px;}
.DataService .more{ float:left; width:100%;flex-wrap:wrap; display: flex;  justify-content:center; align-items: center;}
.DataService .more a{ float:left; width:200px; text-align:center; border:1px solid #7245FF; color:#7245FF; font-size:18px; line-height:48px; border-radius:50px; margin:0 26px; }
.DataService .more a.on{ background:#7245FF; color:#fff;}
.DataService .more a:hover{ background:#fff; color:#7245FF; box-shadow:0 5px 10px rgba(0,0,0,0.2);}
.DataService .one{ float:left; width:100%; margin:57px 0 49px 0;}
.DataService .one ul{ margin:0 -20px; flex-wrap:wrap; display: flex;  justify-content:center; align-items: center;}
.DataService .one ul li{ float:left; margin:0 20px; }
.DataService .one ul li a{ float:left; background:#fff;border:1px solid #eee; border-radius:10px;flex-wrap:wrap; display: flex;  justify-content:center; align-items: center; color:#9ea4af; font-size:30px; line-height:48px; padding:25px 54px;}
.DataService .one ul li a img{ max-width:none; margin-right:30px; height:40px;}
.DataService .one ul li.on1 a, .DataService .one ul li a:hover{ background:#d3e4ff; border:1px solid #7245FF; color:#7245FF; box-shadow:0 8px 27px rgba(0,128,255,0.13); }
.DataService .two{ float:left; width:100%; position:relative;}
.DataService .two::after{ float:left; width:100%; height:1px; z-index:1; content:''; position:absolute; left:0; bottom:0; background:#dddddd; margin-left:0;}
.DataService .two ul{ float:left; width:100%; padding:0 4%; display:none;}
.DataService .two .ul2{ display:block;}
.DataService .two ul li{ float:left; width:25%;flex-wrap:wrap; display: flex;  justify-content:center; align-items: center;}
.DataService .two ul li a{ float:left; position:relative; z-index:3; color:#2c2f43; font-size:20px; line-height:30px; padding:28px 8px;}
.DataService .two ul li a::after{ float:left; width:0%; height:2px; content:''; position:absolute; left:50%; bottom:0; background:#7245FF;-oz-transition: all 0.5s linear;
-webkit-transition: all 0.5s linear;
     -o-transition: all 0.5s linear;
-webkit-transform:translateX(-50%);
    -ms-transform:translateX(-50%);
        transform:translateX(-50%);
   -moz-transform:translateX(-50%);
     -o-transform:translateX(-50%);}
.DataService .two ul li.on2 a{ color:#7245FF;}
.DataService .two ul li.on2 a::after{ width:100%;}
.DataService .three{ float:left; width:100%; margin-top:50px; }
.DataService .three ul{ float:left; width:100%;}
.DataService .three .slick-list{ padding:0 2.9%;}
.DataService .three ul li{ float:left; width:12.5%; text-align:center;}
.DataService .three ul li a{ float:left; color:#2c2f43; font-size:16px; line-height:26px;flex-wrap:wrap; display: flex;  justify-content:center;}
.DataService .three ul li a i{ display:block; margin:0 auto; width:94px; height:94px; position:relative; border-radius:50%;}
.DataService .three ul li a i img{ position:absolute; left:0; top:0; width:64px; height:64px; margin:15px;}
.DataService .three ul li a i .show{ opacity:1;}
.DataService .three ul li a i .hide{ opacity:0;}
.DataService .three ul li a span{ float:left; width:100%; margin-top:22px;}
.DataService .three ul li.slick-current a i{ background:#fff; box-shadow:0 13px 18px rgba(165,165,165,0.22);}
.DataService .three ul li.slick-current a i .show{ opacity:0;}
.DataService .three ul li.slick-current a i .hide{ opacity:1;}
.DataService .three ul li.slick-current a{ font-weight:bold; color:#7245FF;}
.DataService .three .slick-prev,
.DataService .three .slick-next{ left:0; width:10px; height:10px; border-left:1px solid #686868; border-bottom:1px solid #686868; top:47px; -webkit-transform: translate(0,0) rotate(45deg); -ms-transform: translate(0,0) rotate(45deg); transform: translate(0,0) rotate(45deg);}
.DataService .three .slick-next{ left:auto; right:0; -webkit-transform: translate(0,0) rotate(225deg); -ms-transform: translate(0,0) rotate(225deg); transform: translate(0,0) rotate(225deg);}
.DataService .three .slick-prev:hover,
.DataService .three .slick-next:hover{ border-left:1px solid #b3292c; border-bottom:1px solid #b3292c;}
.DataService .Serv1,
.DataService .Serv2{ float:left; width:100%; position:relative;  }
.DataService .sjul{margin-bottom:30px;}
.DataService .box1{ float:left; width:100%; position:absolute; left:0; top:0; z-index:1; opacity:0;}
.DataService .box1.on1{ position:relative; z-index:3; opacity:1;}
.DataService .box2{ float:left; width:100%; background:#f3f7fc; position:absolute; left:0; top:0; z-index:1; opacity:0; }
.DataService .box2.active{ position:relative; z-index:3; opacity:1;}
.DataService .box2.on2{ z-index:3; opacity:1;}


@media screen and (max-width: 1024px) {
.DataService{ padding:30px 15px 15px;}
.DataService .list{ margin:25px 0;}
.DataService .list .text{ padding:20px 15px;}
.DataService .list .text h4{ font-size:18px; line-height:28px; padding-bottom:10px; margin-bottom:10px;}
.DataService .list .text h5{ font-size:14px; line-height:24px;}
.DataService .more a{ margin:0 8px; width:130px; font-size:14px; line-height:34px; border-radius:36px;}
.DataService .one{ margin:25px 0 15px 0;}
.DataService .one ul{ margin:0 -7px;}
.DataService .one ul li{ margin:0 7px; }
.DataService .one ul li a{ font-size:17px; line-height:32px; padding:10px 15px;}
.DataService .one ul li a img{ max-width:none; margin-right:6px; height:30px;}
.DataService .one ul li.on1 a{ box-shadow:0 4px 12px rgba(0,128,255,0.13); }
.DataService .two ul li a{ font-size:14px; line-height:24px; padding:12px 0;}
.DataService .three{ margin-top:20px;}
.DataService .three .slick-list{ padding:0 10px;}
.DataService .three ul li a{ font-size:14px; line-height:24px;}
.DataService .three ul li a i{  width:74px; height:74px;}
.DataService .three ul li a i img{ margin:10px; width:54px; height:54px;}
.DataService .three ul li a span{ margin-top:10px;}
.DataService .three .slick-prev,
.DataService .three .slick-next{ top:38px; }
}
@media screen and (max-width: 767px) {
.DataService .list .img{ width:100%;}
.DataService .list .text{ width:100%;}
.DataService .two ul{ padding:0;}
}


.sjul{float: left;width: 100%;position: relative;}
.sjul ul{width: calc(100% + 30px);margin:-15px;float: left;
position: absolute;opacity: 0;z-index: -1;transition: all .5s ease;}


.sjul ul.on{position: relative;opacity: 1;z-index: 1;}
.sjul ul li{width: 33.3%;padding: 15px;float: left;}
.sjul ul li a{display: block;width: 100%;float: left;position: relative; overflow:hidden;border-radius:10px;}
.sjul ul li .pic{position: relative;padding-bottom: 73.7%;width: 100%;overflow: hidden;border-radius:0 0 15px 15px;}
.sjul ul li .picxin{position: relative;height: 200px;width: 100%;overflow: hidden;border-radius:0 0 15px 15px;}
.sjul ul li .pic img{position: absolute;top: 50%;border-radius: 8px;border-radius:10px;
left: 50%;transform: translate(-50%,-50%);transition: all .5s ease;min-height: 100%;}
.sjul ul li .tit{line-height: 60px;background: #EDF0F5;width:100%;transition: all .5s;
text-overflow: ellipsis;white-space: nowrap;overflow: hidden;position: absolute;bottom: 0;
text-align: center;font-size: 16px;color:#2c2f45;}
.sjul ul li .content{position: absolute;height:100%;width: 100%;top: 0;left: 0; opacity:0;-ms-transition: all .5s ease;transition: all .5s ease;background: rgba(114,69,255,0.75);padding:40px 35px 0 35px;}
.sjul ul li .content h4{color: #fff;font-size: 20px;line-height: 30px;
text-align: center;font-weight: bold;margin-bottom: 20px;}
.sjul ul li .content h6{color: #ffffff;font-size: 16px;line-height: 30px; height:60px; overflow:hidden;}
.sjul ul li .content .more{width:150px;height: 44px;border-radius: 22px;font-size: 16px;float: inherit;
background: #fff;margin: 34px auto 0 auto;color: #007EFE;text-align: center;line-height: 44px;}


.sjul ul li:hover .content{opacity: 1;}
.sjul ul li:hover .tit{opacity: 0;}
.sjul ul li:hover .pic{border-radius:0 0 10px 10px;}
.sjul ul li:hover .pic img{transform: translate(-50%,-50%)scale(1.1);}
.sjul{margin-top: 60px;float: left;width: 100%;}

@media screen and (max-width: 1400px){
  .sjul ul li .content{padding: 20px 20px 0 20px;}
}
@media screen and (max-width: 1024px){
  .sjul{margin-top: 20px;float: left;width: 100%;}
  .sjul ul{width: calc(100% + 20px);margin:-10px;}
  .sjul ul li{width: 50%;padding:7px;}
  .sjul ul li .tit{line-height:34px;font-size: 14px}



  .sjul ul li .content{padding:25px 15px 0 15px;}
  .sjul ul li .content h4{color: #fff;font-size: 16px;line-height: 18px;margin-bottom: 8px;}
  .sjul ul li .content h6{font-size: 14px;line-height: 22px; height:44px;}
  .sjul ul li .content .more{width:90px;height: 30px;border-radius: 15px;font-size: 14px;
  margin: 12px auto 0 auto;line-height: 30px;display: none !important;}
    

}