body .home .container {
  padding: 11.71875vw 9.41667vw 0 10.41667vw
}

body .home .container .sec1 .links {
  border-radius: 8px;
  border: 0.5px solid #4CA1FA;
  background: rgba(13, 24, 43, 0.4);
  backdrop-filter: blur(5px);
  padding: .46875vw 1.45833vw;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: .52083vw
}

body .home .container .sec1 .links a,
body .home .container .sec1 .links span {
  color: white;
  font-weight: 350
}

body .home .container .sec1 .links .on {
  background: linear-gradient(90deg, #177ABF 0%, #87BDE5 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 700
}

body .home .container .sec1 .content {
  display: flex;
  justify-content: space-between;
  margin-top: 2.60417vw;
  gap: 3.28125vw
}

body .home .container .sec1 .content .lbox {
  width: 41.66667vw
}

body .home .container .sec1 .content .lbox .b_pic {
  width: 100%
}

body .home .container .sec1 .content .lbox .b_pic .swiper1 {
  width: 100%
}

body .home .container .sec1 .content .lbox .b_pic .swiper1 .pic {
  display: flex;
  width: 100%;
  height: 27.76042vw;
  padding: 3.33333vw 3.4375vw 4.42708vw 3.4375vw;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  border-radius: 1.04167vw;
  border-bottom: 1px solid #5184BA;
  background: linear-gradient(123deg, rgba(76, 161, 250, 0.05) 0%, rgba(82, 203, 254, 0.05) 97.07%);
  position: relative;
  overflow: hidden
}

body .home .container .sec1 .content .lbox .b_pic .swiper1 .pic img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain
}

body .home .container .sec1 .content .lbox .b_pic .swiper1 .pic::after {
  position: absolute;
  left: 50%;
  top: 23.4375vw;
  width: 78.125vw;
  height: 78.125vw;
  border-radius: 50%;
  background: #4A94F9;
  filter: blur(16px);
  transform: translateX(-50%) translateY(80px);
  opacity: 0;
  transition: all 600ms;
  content: '';
  display: block
}

body .home .container .sec1 .content .lbox .b_pic .swiper1 .pic:hover::after {
  opacity: .3;
  transform: translateX(-50%) translateY(0)
}

body .home .container .sec1 .content .lbox .s_pic {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.25vw;
  margin-top: 1.45833vw
}

body .home .container .sec1 .content .lbox .s_pic .prev {
  transform: rotateY(180deg);
  cursor: pointer
}

body .home .container .sec1 .content .lbox .s_pic .next {
  cursor: pointer
}

body .home .container .sec1 .content .lbox .s_pic .swiper_thumb {
  width: 100%;
  flex: 1
}

body .home .container .sec1 .content .lbox .s_pic .swiper_thumb .swiper-slide {
  padding: 1.04167vw .52083vw
}

body .home .container .sec1 .content .lbox .s_pic .swiper_thumb .swiper-slide .pic {
  border-radius: 12px;
  background: #09131E;
  display: flex;
  width: 100%;
  height: 7.8125vw;
  justify-content: center;
  align-items: center;
  transition: all 600ms
}

body .home .container .sec1 .content .lbox .s_pic .swiper_thumb .swiper-slide .pic img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain
}

body .home .container .sec1 .content .lbox .s_pic .swiper_thumb .swiper-slide .pic:hover {
  box-shadow: 0 0 1.04167vw 0 rgba(81, 132, 186, 0.6)
}

body .home .container .sec1 .content .lbox .s_pic .swiper_thumb .swiper-slide-thumb-active .pic {
  box-shadow: 0 0 1.04167vw 0 rgba(81, 132, 186, 0.6)
}

body .home .container .sec1 .content .rbox {
  width: 34.21875vw;
  color: #FFF
}

body .home .container .sec1 .content .rbox .p1 {
  font-weight: 700;
  line-height: 1.5
}

body .home .container .sec1 .content .rbox .des {
  /* margin-top: 10.41667vw */
  margin-top:1.1458333333vw ;
}

body .home .container .sec1 .content .rbox .des ul {
  line-height: 2;
  padding-left: 1.30208vw
}

body .home .container .sec1 .content .rbox .des ul li {
  list-style: disc
}

body .home .container .sec2 {
  padding: 8.33333vw 0 10.20833vw 0
}

body .home .container .sec2 .p1 {
  background: linear-gradient(90deg, #4CA1FA 0%, #52CBFE 97.19%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 700;
  display: inline-block
}

body .home .container .sec2 .p2 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: .625vw 0 .41667vw 0
}

body .home .container .sec2 .p2 p {
  background: linear-gradient(90deg, #fff 1.64%, rgba(255, 255, 255, 0.6) 99.98%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 700
}

body .home .container .sec2 .p2 .line {
  width: 28.02083vw;
  height: 1.35417vw;
  position: relative;
  overflow: hidden
}

body .home .container .sec2 .p2 .line::before {
  width: 100%;
  height: 2.91667vw;
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0vw;
  background: radial-gradient(50% 50.75% at 50% 58.7%, rgba(90, 171, 255, 0.5) 0%, rgba(82, 203, 254, 0) 86.27%);
  transition: all 600ms
}

body .home .container .sec2 .p2 .line::after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, rgba(82, 203, 254, 0) 0%, #5AABFF 49.06%, rgba(82, 203, 254, 0) 100%)
}

body .home .container .sec2 .p2 .line:hover::before {
  top: -.625vw
}

body .home .container .sec2 .p3 {
  color: #FFF;
  line-height: 1.5
}

body .home .container .sec2 .pics {
  margin-top: 4.6875vw;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.66667vw
}

body .home .container .sec2 .pics .pic {
  width: 100%;
  border-radius: 17.576px;
  background: #19293A;
  overflow: hidden;
  height: 30.20833vw;
  display: flex;
  align-items: center;
  justify-content: center
}

body .home .container .sec2 .pics .pic img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain
}

body .home .container .sec3 {
  padding-bottom: 12.5vw
}

body .home .container .sec3 .p1 {
  background: linear-gradient(90deg, #4CA1FA 0%, #52CBFE 97.19%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 700;
  display: inline-block
}

body .home .container .sec3 .p2 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: .625vw 0 .41667vw 0
}

body .home .container .sec3 .p2 p {
  background: linear-gradient(90deg, #fff 1.64%, rgba(255, 255, 255, 0.6) 99.98%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 700
}

body .home .container .sec3 .p2 .line {
  width: 28.02083vw;
  height: 1.35417vw;
  position: relative;
  overflow: hidden
}

body .home .container .sec3 .p2 .line::before {
  width: 100%;
  height: 2.91667vw;
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0vw;
  background: radial-gradient(50% 50.75% at 50% 58.7%, rgba(90, 171, 255, 0.5) 0%, rgba(82, 203, 254, 0) 86.27%);
  transition: all 600ms
}

body .home .container .sec3 .p2 .line::after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, rgba(82, 203, 254, 0) 0%, #5AABFF 49.06%, rgba(82, 203, 254, 0) 100%)
}

body .home .container .sec3 .p2 .line:hover::before {
  top: -.625vw
}

body .home .container .sec3 .p3 {
  color: #FFF;
  line-height: 1.5
}

body .home .container .sec3 .tabs {
  display: flex;
  gap: 1.5625vw;
  margin: 3.02083vw 0 1.45833vw 0
}

body .home .container .sec3 .tabs div {
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  padding: .67708vw 2.29167vw .67708vw 1.92708vw;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 700;
  line-height: 1.5;
  cursor: pointer;
  width: fit-content
}

body .home .container .sec3 .tabs div p {
  width: auto;
  font-weight: 700
}

body .home .container .sec3 .tabs div.on p {
  background: linear-gradient(90deg, #4A94F9 0%, #53D9FF 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent
}

body .home .container .sec3 .pics {
  width: 100%;
  position: relative
}

body .home .container .sec3 .pics .prev {
  position: absolute;
  left: -3.64583vw;
  top: 50%;
  transform: rotateY(180deg) translateY(-50%);
  z-index: 10;
  cursor: pointer
}

body .home .container .sec3 .pics .next {
  position: absolute;
  right: -3.64583vw;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  cursor: pointer
}

body .home .container .sec3 .pics .swiper2 {
  width: 100%
}

body .home .container .sec3 .pics .swiper2 .pic {
  border-radius: 1.04167vw;
  overflow: hidden
}

body .home .container .sec3 .pics .swiper2 .pic img {
  width: 100%;
  height: 21.875vw;
  display: block;
  object-fit: cover;
  transition: all 600ms
}

body .home .container .sec3 .pics .swiper2 .pic:hover img {
  transform: scale(1.05)
}

body .home .container .sec3 .pics .swiper-pagination {
  position: absolute;
  left: 0;
  bottom: -2.5vw;
  display: flex;
  justify-content: center;
  gap: .41667vw;
  width: 100%
}

body .home .container .sec3 .pics .swiper-pagination .swiper-pagination-bullet {
  width: .625vw;
  height: .625vw;
  border-radius: 50%;
  opacity: 1;
  background: rgba(255, 255, 255, 0.5);
  transition: all 600ms
}

body .home .container .sec3 .pics .swiper-pagination .swiper-pagination-bullet-active {
  width: 2.5vw;
  border-radius: 8px;
  background: linear-gradient(145deg, #2599FA 8.68%, #104EBA 83.16%)
}

@media screen and (max-width: 768px) {
  body .home .container {
    padding: 80px 5% 0 5%
  }

  body .home .container .sec1 .links {
    padding: 6px 12px;
    gap: 6px
  }

  body .home .container .sec1 .links a,
  body .home .container .sec1 .links span {
    font-size: 14px
  }

  body .home .container .sec1 .content {
    flex-direction: column;
    gap: 30px;
    margin-top: 30px
  }

  body .home .container .sec1 .content .lbox {
    width: 100%
  }

  body .home .container .sec1 .content .lbox .b_pic .swiper1 .pic {
    height: 200px;
    padding: 30px;
    border-radius: 10px
  }

  body .home .container .sec1 .content .lbox .b_pic .swiper1 .pic::after {
    width: 500px;
    height: 500px;
    top: 170px
  }

  body .home .container .sec1 .content .lbox .s_pic {
    margin-top: 15px;
    gap: 12px
  }

  body .home .container .sec1 .content .lbox .s_pic .swiper_thumb .swiper-slide {
    padding: 10px 5px
  }

  body .home .container .sec1 .content .lbox .s_pic .swiper_thumb .swiper-slide .pic {
    height: 80px;
    border-radius: 8px
  }

  body .home .container .sec1 .content .lbox .s_pic .swiper_thumb .swiper-slide .pic:hover {
    box-shadow: 0 0 10px 0 rgba(81, 132, 186, 0.6)
  }

  body .home .container .sec1 .content .rbox {
    width: 100%
  }

  body .home .container .sec1 .content .rbox .p1 {
    font-size: 18px
  }

  body .home .container .sec1 .content .rbox .des {
    margin-top: 15px
  }

  body .home .container .sec1 .content .rbox .des ul {
    padding-left: 20px
  }

  body .home .container .sec1 .content .rbox .des ul li {
    font-size: 14px
  }

  body .home .container .sec2 {
    padding: 40px 0
  }

  body .home .container .sec2 .p2 {
    font-size: 20px;
    margin: 6px 0
  }

  body .home .container .sec2 .p2 .line {
    width: 100%;
    height: 16px
  }

  body .home .container .sec2 .p2 .line::before {
    height: 36px
  }

  body .home .container .sec2 .p3 {
    font-size: 14px
  }

  body .home .container .sec2 .pics {
    margin-top: 30px;
    grid-template-columns: 1fr;
    gap: 16px
  }

  body .home .container .sec2 .pics .pic {
    height: auto;
    border-radius: 10px
  }

  body .home .container .sec3 {
    padding-bottom: 30px
  }

  body .home .container .sec3 .p2 {
    font-size: 20px;
    margin: 6px 0
  }

  body .home .container .sec3 .p2 .line {
    width: 100%;
    height: 16px
  }

  body .home .container .sec3 .p2 .line::before {
    height: 36px
  }

  body .home .container .sec3 .p3 {
    font-size: 14px
  }

  body .home .container .sec3 .tabs {
    margin: 20px 0;
    gap: 10px;
    flex-wrap: wrap
  }

  body .home .container .sec3 .tabs div {
    padding: 8px 16px
  }

  body .home .container .sec3 .pics .swiper2 .pic img {
    height: 160px
  }

  body .home .container .sec3 .pics .swiper-pagination {
    bottom: -30px;
    gap: 5px
  }

  body .home .container .sec3 .pics .swiper-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px
  }

  body .home .container .sec3 .pics .swiper-pagination .swiper-pagination-bullet-active {
    width: 30px;
    border-radius: 6px
  }
}