.swiper-container {
  position: relative;
  top: 0;
}
.banner-swiper .banner-item {
  position: relative;
  cursor: pointer;
}
.banner-swiper .banner-item-1 .banner-content {
  position: absolute;
  left: 0;
  right: 0;
  top: 14.74vw;
  padding-left: 40px;
}
.banner-item-1 .video_dom {
  width: 100%;
}
.banner-swiper .banner-item-1 .banner-content h3 {
  width: 50%;
  font-size: 60px;
  color: #ffffff;
  font-family: Impact;
  line-height: 58px;
  font-weight: 400;
}
.banner-swiper .banner-item-1 .banner-content > p {
  font-size: 16px;
  color: #ffffff;
  line-height: 28px;
  width: 44%;
  margin-top: 30px;
}
.banner-swiper .banner-item-1 .banner-content > div p a {
  display: block;
  width: 177px;
  text-align: center;
  color: #ffffff;
  border: 1px solid #ffffff;
  border-radius: 28px;
  height: 55px;
  line-height: 55px;
  margin-top: 40px;
}
.banner-container .tag-container {
  width: 62.5%;
  border: 1px solid rgba(255, 255, 255, 0.45);
  position: absolute;
  bottom: 100px;
  left: 0;
  right: 0;
  z-index: 1;
}
.banner-container .tag-container li {
  width: 25%;
  text-align: center;
  font-size: 16px;
  color: #ffffff;
  font-family: OpenSansbold;
  display: flex;
  padding: 20px 54px;
  cursor: pointer;
}
.banner-container .tag-container li + li {
  border-left: 1px solid rgba(255, 255, 255, 0.45);
}
.banner-container .tag-container li span {
  display: flex;
  text-align: left;
  align-items: center;
  color: #ffffff;
  font-size: 20px;
  margin-right: 16px;
}
.banner-container .tag-container li.active {
  background-color: #ffffff;
}
.banner-container .tag-container li.active span {
  color: #000000;
}

.product-container ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 0;
}
.product-container ul li {
  width: 49.74%;
  background: linear-gradient(90deg, #cad1d7, #f9fbfa, #cad1d7);
  margin-top: 10px;
  padding-top: 46px;
}
.product-container ul li .product-top,
.product-bottom {
  text-align: center;
}
.product-container .product-top span {
  color: #078f22;
  font-size: 13px;
  display: none;
}
.product-container .product-top h3 {
  text-transform: capitalize;
  font-size: 24px;
  color: #000000;
  font-family: OpenSansbold;
}
.product-container ul li:nth-child(1) .product-top h3 {
  width: 40%;
  margin: 0 auto;
}
.product-container ul li:nth-child(2) .product-top h3 {
  width: 50%;
  margin: 0 auto;
}
.product-container .product-top p {
  margin-top: 8px;
  font-size: 16px;
  color: #000000;
}
.product-container .product-mid {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}
.product-container .product-mid p a {
  border-radius: 23px;
}
.product-container .product-mid p:nth-child(1) a {
  background-color: #078f22;
  color: #ffffff;
  margin-right: 30px;
}
.product-container .product-mid p:nth-child(2) a {
  color: #078f22;
  border: 1px solid #078f22;
}
.product-container .product-mid p a {
  display: block;
  width: 150px;
  text-align: center;
  height: 47px;
  line-height: 47px;
}
.product-container .product-bottom {
  margin-top: 12px;
}
.product-container ul li:nth-child(1) {
  padding-bottom: 32px;
}

.product-container ul li:nth-child(2) .product-bottom {
  margin-top: 32px;
}

.product-container ul li:nth-child(3) .product-bottom {
  margin-top: 70px;
}
.product-container ul li:nth-child(3) {
  padding-bottom: 62px;
}

.product-container ul li:nth-child(4) .product-bottom {
  margin-top: 27px;
}
.do-left {
  padding-top: 116px;
  padding-bottom: 136px;
}
.do-right {
  padding-top: 178px;
  padding-bottom: 136px;
  border-right: 1px solid #ececec;
  text-align: center;
}
.do-left,
.do-right {
  border-left: 1px solid #ececec;
  width: 50%;
}
.do-title {
  margin-top: 10px;
  width: 23.875%;
  font-size: 13px;
  text-transform: uppercase;
}
.do-content {
  width: 76.125%;
}
.do-content h3 {
  font-size: 48px;
  color: #29364e;
  font-family: OpenSansbold;
  text-transform: capitalize;
  line-height: 58px;
}
.do-content > p {
  color: #29364e;
  line-height: 26px;
  margin-top: 40px;
  width: 90%;
}
.do-content > div {
  margin-top: 74px;
  display: flex;
}
.do-content > div p {
  color: #1f242c;
  font-family: OpenSanssemibold;
  width: 200px;
}
.do-content > div p:nth-child(1) {
  border-right: 1px solid #d7dce4;
  margin-right: 45px;
}
.do-content > div p span {
  display: block;
}
.do-content > div p span:nth-child(1) {
  color: #078f22;
  font-size: 55px;
  font-family: OpenSansbold;
}

.our-container {
  background: #fbfbfb;
}
.our-container > .wrap {
  position: relative;
}
.our-container .our-title {
  position: absolute;
  top: 90px;
}
.our-list {
  width: 100%;
  justify-content: space-between;
}
.our-list li {
  width: 33.33%;
  padding-top: 336px;
  padding-bottom: 336px;
  background: none;
}
.our-list li:nth-child(1) .our-title span {
  color: #5f708f;
  text-transform: uppercase;
  font-size: 13px;
}
.our-list li:nth-child(1):hover .our-title span {
  color: #ffffff;
}
.our-list li i {
  font-size: 60px;
  color: #078f22;
}
.our-list li > div {
  width: 76.74%;
  font-family: OpenSanssemibold;
  margin: 0 auto;
}
.our-list li > div p {
  font-size: 14px;
  color: #32353b;
  line-height: 50px;
  border-bottom: 1px solid #cccdcf;
  margin-top: 114px;
  padding-bottom: 4px;
}
.our-list li > div h3 {
  font-size: 28px;
  color: #1f242c;
  margin-top: 8px;
}
.our-list li > div span {
  font-size: 22px;
  color: #0c9226;
  margin-top: 8px;
}
.our-list li:nth-child(1):hover {
  background: url(../picture/picture2-1.webp) no-repeat center;
  background-size: cover;
}
.our-list li:nth-child(2):hover {
  background: url(../picture/picture2-2.webp) no-repeat center;
  background-size: cover;
}
.our-list li:nth-child(3):hover {
  background: url(../picture/picture2-3.webp) no-repeat center;
  background-size: cover;
}
/* .our-list li.on{
    background: url(../picture/picture2.webp) no-repeat center;
} */
.our-list li.on > div p,
.our-list li.on > div h3,
.our-list li.on i {
  color: #ffffff;
}
.history-container > .wrap {
  border-left: 1px solid #ececec;
  border-right: 1px solid #ececec;
  padding-top: 127px;
  padding-bottom: 127px;
}
.history-container .history-img-1 {
  margin-left: 3%;
  width: 23.125%;
}
.history-container .history-img-2 {
  margin-left: 1.75%;
  margin-top: 110px;
  width: 23.125%;
}
.histroy-right {
  width: 42%;
  margin-left: 6.8125%;
  padding-right: 35px;
}
.history-title {
  color: #5f708f;
  font-size: 13px;
  text-transform: uppercase;
  font-family: OpenSanssemibold;
}
.histroy-right h3 {
  font-size: 48px;
  font-family: OpenSansbold;
  color: #29364e;
  line-height: 58px;
  margin-top: 15px;
  text-transform: capitalize;
}
.histroy-right > p {
  margin-left: 74px;
  color: #29364e;
  font-size: 16px;
  line-height: 26px;
  margin-top: 60px;
}
.histroy-right > ul li > div {
  position: relative;
  width: 139px;
  height: 139px;
  border-radius: 50%;
}
@keyframes vision-right-1 {
  0% {
    background: conic-gradient(#078f22 0% 0%, transparent 0% 100%);
  }
  1.5% {
    background: conic-gradient(#078f22 0% 1%, transparent 1% 100%);
  }
  3% {
    background: conic-gradient(#078f22 0% 2%, transparent 2% 100%);
  }
  4.5% {
    background: conic-gradient(#078f22 0% 3%, transparent 3% 100%);
  }
  6% {
    background: conic-gradient(#078f22 0% 4%, transparent 4% 100%);
  }
  7.5% {
    background: conic-gradient(#078f22 0% 5%, transparent 5% 100%);
  }
  9% {
    background: conic-gradient(#078f22 0% 6%, transparent 6% 100%);
  }
  10.5% {
    background: conic-gradient(#078f22 0% 7%, transparent 7% 100%);
  }
  12% {
    background: conic-gradient(#078f22 0% 8%, transparent 8% 100%);
  }
  13.5% {
    background: conic-gradient(#078f22 0% 9%, transparent 9% 100%);
  }
  15% {
    background: conic-gradient(#078f22 0% 10%, transparent 10% 100%);
  }
  16.5% {
    background: conic-gradient(#078f22 0% 11%, transparent 11% 100%);
  }
  18% {
    background: conic-gradient(#078f22 0% 12%, transparent 12% 100%);
  }
  19.5% {
    background: conic-gradient(#078f22 0% 13%, transparent 13% 100%);
  }
  21% {
    background: conic-gradient(#078f22 0% 14%, transparent 14% 100%);
  }
  22.5% {
    background: conic-gradient(#078f22 0% 15%, transparent 15% 100%);
  }
  24% {
    background: conic-gradient(#078f22 0% 16%, transparent 16% 100%);
  }
  25.5% {
    background: conic-gradient(#078f22 0% 17%, transparent 17% 100%);
  }
  27% {
    background: conic-gradient(#078f22 0% 18%, transparent 18% 100%);
  }
  28.5% {
    background: conic-gradient(#078f22 0% 19%, transparent 19% 100%);
  }
  30% {
    background: conic-gradient(#078f22 0% 20%, transparent 20% 100%);
  }
  31.5% {
    background: conic-gradient(#078f22 0% 21%, transparent 21% 100%);
  }
  33% {
    background: conic-gradient(#078f22 0% 22%, transparent 22% 100%);
  }
  34.5% {
    background: conic-gradient(#078f22 0% 23%, transparent 23% 100%);
  }
  36% {
    background: conic-gradient(#078f22 0% 24%, transparent 24% 100%);
  }
  37.5% {
    background: conic-gradient(#078f22 0% 25%, transparent 25% 100%);
  }
  39% {
    background: conic-gradient(#078f22 0% 26%, transparent 26% 100%);
  }
  40.5% {
    background: conic-gradient(#078f22 0% 27%, transparent 27% 100%);
  }
  42% {
    background: conic-gradient(#078f22 0% 28%, transparent 28% 100%);
  }
  43.5% {
    background: conic-gradient(#078f22 0% 29%, transparent 29% 100%);
  }
  45% {
    background: conic-gradient(#078f22 0% 30%, transparent 30% 100%);
  }
  46.5% {
    background: conic-gradient(#078f22 0% 31%, transparent 31% 100%);
  }
  48% {
    background: conic-gradient(#078f22 0% 32%, transparent 32% 100%);
  }
  49.5% {
    background: conic-gradient(#078f22 0% 33%, transparent 33% 100%);
  }
  51% {
    background: conic-gradient(#078f22 0% 34%, transparent 34% 100%);
  }
  52.5% {
    background: conic-gradient(#078f22 0% 35%, transparent 35% 100%);
  }
  54% {
    background: conic-gradient(#078f22 0% 36%, transparent 36% 100%);
  }
  55.5% {
    background: conic-gradient(#078f22 0% 37%, transparent 37% 100%);
  }
  57% {
    background: conic-gradient(#078f22 0% 38%, transparent 38% 100%);
  }
  58.5% {
    background: conic-gradient(#078f22 0% 39%, transparent 39% 100%);
  }
  60% {
    background: conic-gradient(#078f22 0% 40%, transparent 40% 100%);
  }
  61.5% {
    background: conic-gradient(#078f22 0% 41%, transparent 41% 100%);
  }
  63% {
    background: conic-gradient(#078f22 0% 42%, transparent 42% 100%);
  }
  64.5% {
    background: conic-gradient(#078f22 0% 43%, transparent 43% 100%);
  }
  66% {
    background: conic-gradient(#078f22 0% 44%, transparent 44% 100%);
  }
  67.5% {
    background: conic-gradient(#078f22 0% 45%, transparent 45% 100%);
  }
  69% {
    background: conic-gradient(#078f22 0% 46%, transparent 46% 100%);
  }
  70.5% {
    background: conic-gradient(#078f22 0% 47%, transparent 47% 100%);
  }
  72% {
    background: conic-gradient(#078f22 0% 48%, transparent 48% 100%);
  }
  73.5% {
    background: conic-gradient(#078f22 0% 49%, transparent 49% 100%);
  }
  75% {
    background: conic-gradient(#078f22 0% 50%, transparent 50% 100%);
  }
  76.5% {
    background: conic-gradient(#078f22 0% 51%, transparent 51% 100%);
  }
  78% {
    background: conic-gradient(#078f22 0% 52%, transparent 52% 100%);
  }
  79.5% {
    background: conic-gradient(#078f22 0% 53%, transparent 53% 100%);
  }
  81% {
    background: conic-gradient(#078f22 0% 54%, transparent 54% 100%);
  }
  82.5% {
    background: conic-gradient(#078f22 0% 55%, transparent 55% 100%);
  }
  84% {
    background: conic-gradient(#078f22 0% 56%, transparent 56% 100%);
  }
  85.5% {
    background: conic-gradient(#078f22 0% 57%, transparent 57% 100%);
  }
  87% {
    background: conic-gradient(#078f22 0% 58%, transparent 58% 100%);
  }
  88.5% {
    background: conic-gradient(#078f22 0% 59%, transparent 59% 100%);
  }
  90% {
    background: conic-gradient(#078f22 0% 60%, transparent 60% 100%);
  }
  91.5% {
    background: conic-gradient(#078f22 0% 61%, transparent 61% 100%);
  }
  93% {
    background: conic-gradient(#078f22 0% 62%, transparent 62% 100%);
  }
  94.5% {
    background: conic-gradient(#078f22 0% 63%, transparent 63% 100%);
  }
  96% {
    background: conic-gradient(#078f22 0% 64%, transparent 64% 100%);
  }
  97.5% {
    background: conic-gradient(#078f22 0% 65%, transparent 65% 100%);
  }
  100% {
    background: conic-gradient(#078f22 0% 66%, transparent 66% 100%);
  }
}
@keyframes vision-right-2 {
  0% {
    background: conic-gradient(#078f22 0% 0%, transparent 0% 100%);
  }
  1.33% {
    background: conic-gradient(#078f22 0% 1%, transparent 1% 100%);
  }
  2.67% {
    background: conic-gradient(#078f22 0% 2%, transparent 2% 100%);
  }
  4% {
    background: conic-gradient(#078f22 0% 3%, transparent 3% 100%);
  }
  5.33% {
    background: conic-gradient(#078f22 0% 4%, transparent 4% 100%);
  }
  6.67% {
    background: conic-gradient(#078f22 0% 5%, transparent 5% 100%);
  }
  8% {
    background: conic-gradient(#078f22 0% 6%, transparent 6% 100%);
  }
  9.33% {
    background: conic-gradient(#078f22 0% 7%, transparent 7% 100%);
  }
  10.67% {
    background: conic-gradient(#078f22 0% 8%, transparent 8% 100%);
  }
  12% {
    background: conic-gradient(#078f22 0% 9%, transparent 9% 100%);
  }
  13.33% {
    background: conic-gradient(#078f22 0% 10%, transparent 10% 100%);
  }
  14.67% {
    background: conic-gradient(#078f22 0% 11%, transparent 11% 100%);
  }
  16% {
    background: conic-gradient(#078f22 0% 12%, transparent 12% 100%);
  }
  17.33% {
    background: conic-gradient(#078f22 0% 13%, transparent 13% 100%);
  }
  18.67% {
    background: conic-gradient(#078f22 0% 14%, transparent 14% 100%);
  }
  20% {
    background: conic-gradient(#078f22 0% 15%, transparent 15% 100%);
  }
  21.33% {
    background: conic-gradient(#078f22 0% 16%, transparent 16% 100%);
  }
  22.67% {
    background: conic-gradient(#078f22 0% 17%, transparent 17% 100%);
  }
  24% {
    background: conic-gradient(#078f22 0% 18%, transparent 18% 100%);
  }
  25.33% {
    background: conic-gradient(#078f22 0% 19%, transparent 19% 100%);
  }
  26.67% {
    background: conic-gradient(#078f22 0% 20%, transparent 20% 100%);
  }
  28% {
    background: conic-gradient(#078f22 0% 21%, transparent 21% 100%);
  }
  29.33% {
    background: conic-gradient(#078f22 0% 22%, transparent 22% 100%);
  }
  30.67% {
    background: conic-gradient(#078f22 0% 23%, transparent 23% 100%);
  }
  32% {
    background: conic-gradient(#078f22 0% 24%, transparent 24% 100%);
  }
  33.33% {
    background: conic-gradient(#078f22 0% 25%, transparent 25% 100%);
  }
  34.67% {
    background: conic-gradient(#078f22 0% 26%, transparent 26% 100%);
  }
  36% {
    background: conic-gradient(#078f22 0% 27%, transparent 27% 100%);
  }
  37.33% {
    background: conic-gradient(#078f22 0% 28%, transparent 28% 100%);
  }
  38.67% {
    background: conic-gradient(#078f22 0% 29%, transparent 29% 100%);
  }
  40% {
    background: conic-gradient(#078f22 0% 30%, transparent 30% 100%);
  }
  41.33% {
    background: conic-gradient(#078f22 0% 31%, transparent 31% 100%);
  }
  42.67% {
    background: conic-gradient(#078f22 0% 32%, transparent 32% 100%);
  }
  44% {
    background: conic-gradient(#078f22 0% 33%, transparent 33% 100%);
  }
  45.33% {
    background: conic-gradient(#078f22 0% 34%, transparent 34% 100%);
  }
  46.67% {
    background: conic-gradient(#078f22 0% 35%, transparent 35% 100%);
  }
  48% {
    background: conic-gradient(#078f22 0% 36%, transparent 36% 100%);
  }
  49.33% {
    background: conic-gradient(#078f22 0% 37%, transparent 37% 100%);
  }
  50.67% {
    background: conic-gradient(#078f22 0% 38%, transparent 38% 100%);
  }
  52% {
    background: conic-gradient(#078f22 0% 39%, transparent 39% 100%);
  }
  53.33% {
    background: conic-gradient(#078f22 0% 40%, transparent 40% 100%);
  }
  54.67% {
    background: conic-gradient(#078f22 0% 41%, transparent 41% 100%);
  }
  56% {
    background: conic-gradient(#078f22 0% 42%, transparent 42% 100%);
  }
  57.33% {
    background: conic-gradient(#078f22 0% 43%, transparent 43% 100%);
  }
  58.67% {
    background: conic-gradient(#078f22 0% 44%, transparent 44% 100%);
  }
  60% {
    background: conic-gradient(#078f22 0% 45%, transparent 45% 100%);
  }
  61.33% {
    background: conic-gradient(#078f22 0% 46%, transparent 46% 100%);
  }
  62.67% {
    background: conic-gradient(#078f22 0% 47%, transparent 47% 100%);
  }
  64% {
    background: conic-gradient(#078f22 0% 48%, transparent 48% 100%);
  }
  65.33% {
    background: conic-gradient(#078f22 0% 49%, transparent 49% 100%);
  }
  66.67% {
    background: conic-gradient(#078f22 0% 50%, transparent 50% 100%);
  }
  68% {
    background: conic-gradient(#078f22 0% 51%, transparent 51% 100%);
  }
  69.33% {
    background: conic-gradient(#078f22 0% 52%, transparent 52% 100%);
  }
  70.67% {
    background: conic-gradient(#078f22 0% 53%, transparent 53% 100%);
  }
  72% {
    background: conic-gradient(#078f22 0% 54%, transparent 54% 100%);
  }
  73.33% {
    background: conic-gradient(#078f22 0% 55%, transparent 55% 100%);
  }
  74.67% {
    background: conic-gradient(#078f22 0% 56%, transparent 56% 100%);
  }
  76% {
    background: conic-gradient(#078f22 0% 57%, transparent 57% 100%);
  }
  77.33% {
    background: conic-gradient(#078f22 0% 58%, transparent 58% 100%);
  }
  78.67% {
    background: conic-gradient(#078f22 0% 59%, transparent 59% 100%);
  }
  80% {
    background: conic-gradient(#078f22 0% 60%, transparent 60% 100%);
  }
  81.33% {
    background: conic-gradient(#078f22 0% 61%, transparent 61% 100%);
  }
  82.67% {
    background: conic-gradient(#078f22 0% 62%, transparent 62% 100%);
  }
  84% {
    background: conic-gradient(#078f22 0% 63%, transparent 63% 100%);
  }
  85.33% {
    background: conic-gradient(#078f22 0% 64%, transparent 64% 100%);
  }
  86.67% {
    background: conic-gradient(#078f22 0% 65%, transparent 65% 100%);
  }
  88% {
    background: conic-gradient(#078f22 0% 66%, transparent 66% 100%);
  }
  89.33% {
    background: conic-gradient(#078f22 0% 67%, transparent 67% 100%);
  }
  90.67% {
    background: conic-gradient(#078f22 0% 68%, transparent 68% 100%);
  }
  92% {
    background: conic-gradient(#078f22 0% 69%, transparent 69% 100%);
  }
  93.33% {
    background: conic-gradient(#078f22 0% 70%, transparent 70% 100%);
  }
  94.67% {
    background: conic-gradient(#078f22 0% 71%, transparent 71% 100%);
  }
  96% {
    background: conic-gradient(#078f22 0% 72%, transparent 72% 100%);
  }
  97.33% {
    background: conic-gradient(#078f22 0% 73%, transparent 73% 100%);
  }
  98.67% {
    background: conic-gradient(#078f22 0% 74%, transparent 74% 100%);
  }
  100% {
    background: conic-gradient(#078f22 0% 75%, transparent 75% 100%);
  }
}
@keyframes vision-right-3 {
  0% {
    background: conic-gradient(#078f22 0% 0%, transparent 0% 100%);
  }
  1.11% {
    background: conic-gradient(#078f22 0% 1%, transparent 1% 100%);
  }
  2.22% {
    background: conic-gradient(#078f22 0% 2%, transparent 2% 100%);
  }
  3.33% {
    background: conic-gradient(#078f22 0% 3%, transparent 3% 100%);
  }
  4.44% {
    background: conic-gradient(#078f22 0% 4%, transparent 4% 100%);
  }
  5.56% {
    background: conic-gradient(#078f22 0% 5%, transparent 5% 100%);
  }
  6.67% {
    background: conic-gradient(#078f22 0% 6%, transparent 6% 100%);
  }
  7.78% {
    background: conic-gradient(#078f22 0% 7%, transparent 7% 100%);
  }
  8.89% {
    background: conic-gradient(#078f22 0% 8%, transparent 8% 100%);
  }
  10% {
    background: conic-gradient(#078f22 0% 9%, transparent 9% 100%);
  }
  11.11% {
    background: conic-gradient(#078f22 0% 10%, transparent 10% 100%);
  }
  12.22% {
    background: conic-gradient(#078f22 0% 11%, transparent 11% 100%);
  }
  13.33% {
    background: conic-gradient(#078f22 0% 12%, transparent 12% 100%);
  }
  14.44% {
    background: conic-gradient(#078f22 0% 13%, transparent 13% 100%);
  }
  15.56% {
    background: conic-gradient(#078f22 0% 14%, transparent 14% 100%);
  }
  16.67% {
    background: conic-gradient(#078f22 0% 15%, transparent 15% 100%);
  }
  17.78% {
    background: conic-gradient(#078f22 0% 16%, transparent 16% 100%);
  }
  18.89% {
    background: conic-gradient(#078f22 0% 17%, transparent 17% 100%);
  }
  20% {
    background: conic-gradient(#078f22 0% 18%, transparent 18% 100%);
  }
  21.11% {
    background: conic-gradient(#078f22 0% 19%, transparent 19% 100%);
  }
  22.22% {
    background: conic-gradient(#078f22 0% 20%, transparent 20% 100%);
  }
  23.33% {
    background: conic-gradient(#078f22 0% 21%, transparent 21% 100%);
  }
  24.44% {
    background: conic-gradient(#078f22 0% 22%, transparent 22% 100%);
  }
  25.56% {
    background: conic-gradient(#078f22 0% 23%, transparent 23% 100%);
  }
  26.67% {
    background: conic-gradient(#078f22 0% 24%, transparent 24% 100%);
  }
  27.78% {
    background: conic-gradient(#078f22 0% 25%, transparent 25% 100%);
  }
  28.89% {
    background: conic-gradient(#078f22 0% 26%, transparent 26% 100%);
  }
  30% {
    background: conic-gradient(#078f22 0% 27%, transparent 27% 100%);
  }
  31.11% {
    background: conic-gradient(#078f22 0% 28%, transparent 28% 100%);
  }
  32.22% {
    background: conic-gradient(#078f22 0% 29%, transparent 29% 100%);
  }
  33.33% {
    background: conic-gradient(#078f22 0% 30%, transparent 30% 100%);
  }
  34.44% {
    background: conic-gradient(#078f22 0% 31%, transparent 31% 100%);
  }
  35.56% {
    background: conic-gradient(#078f22 0% 32%, transparent 32% 100%);
  }
  36.67% {
    background: conic-gradient(#078f22 0% 33%, transparent 33% 100%);
  }
  37.78% {
    background: conic-gradient(#078f22 0% 34%, transparent 34% 100%);
  }
  38.89% {
    background: conic-gradient(#078f22 0% 35%, transparent 35% 100%);
  }
  40% {
    background: conic-gradient(#078f22 0% 36%, transparent 36% 100%);
  }
  41.11% {
    background: conic-gradient(#078f22 0% 37%, transparent 37% 100%);
  }
  42.22% {
    background: conic-gradient(#078f22 0% 38%, transparent 38% 100%);
  }
  43.33% {
    background: conic-gradient(#078f22 0% 39%, transparent 39% 100%);
  }
  44.44% {
    background: conic-gradient(#078f22 0% 40%, transparent 40% 100%);
  }
  45.56% {
    background: conic-gradient(#078f22 0% 41%, transparent 41% 100%);
  }
  46.67% {
    background: conic-gradient(#078f22 0% 42%, transparent 42% 100%);
  }
  47.78% {
    background: conic-gradient(#078f22 0% 43%, transparent 43% 100%);
  }
  48.89% {
    background: conic-gradient(#078f22 0% 44%, transparent 44% 100%);
  }
  50% {
    background: conic-gradient(#078f22 0% 45%, transparent 45% 100%);
  }
  51.11% {
    background: conic-gradient(#078f22 0% 46%, transparent 46% 100%);
  }
  52.22% {
    background: conic-gradient(#078f22 0% 47%, transparent 47% 100%);
  }
  53.33% {
    background: conic-gradient(#078f22 0% 48%, transparent 48% 100%);
  }
  54.44% {
    background: conic-gradient(#078f22 0% 49%, transparent 49% 100%);
  }
  55.56% {
    background: conic-gradient(#078f22 0% 50%, transparent 50% 100%);
  }
  56.67% {
    background: conic-gradient(#078f22 0% 51%, transparent 51% 100%);
  }
  57.78% {
    background: conic-gradient(#078f22 0% 52%, transparent 52% 100%);
  }
  58.89% {
    background: conic-gradient(#078f22 0% 53%, transparent 53% 100%);
  }
  60% {
    background: conic-gradient(#078f22 0% 54%, transparent 54% 100%);
  }
  61.11% {
    background: conic-gradient(#078f22 0% 55%, transparent 55% 100%);
  }
  62.22% {
    background: conic-gradient(#078f22 0% 56%, transparent 56% 100%);
  }
  63.33% {
    background: conic-gradient(#078f22 0% 57%, transparent 57% 100%);
  }
  64.44% {
    background: conic-gradient(#078f22 0% 58%, transparent 58% 100%);
  }
  65.56% {
    background: conic-gradient(#078f22 0% 59%, transparent 59% 100%);
  }
  66.67% {
    background: conic-gradient(#078f22 0% 60%, transparent 60% 100%);
  }
  67.78% {
    background: conic-gradient(#078f22 0% 61%, transparent 61% 100%);
  }
  68.89% {
    background: conic-gradient(#078f22 0% 62%, transparent 62% 100%);
  }
  70% {
    background: conic-gradient(#078f22 0% 63%, transparent 63% 100%);
  }
  71.11% {
    background: conic-gradient(#078f22 0% 64%, transparent 64% 100%);
  }
  72.22% {
    background: conic-gradient(#078f22 0% 65%, transparent 65% 100%);
  }
  73.33% {
    background: conic-gradient(#078f22 0% 66%, transparent 66% 100%);
  }
  74.44% {
    background: conic-gradient(#078f22 0% 67%, transparent 67% 100%);
  }
  75.56% {
    background: conic-gradient(#078f22 0% 68%, transparent 68% 100%);
  }
  76.67% {
    background: conic-gradient(#078f22 0% 69%, transparent 69% 100%);
  }
  77.78% {
    background: conic-gradient(#078f22 0% 70%, transparent 70% 100%);
  }
  78.89% {
    background: conic-gradient(#078f22 0% 71%, transparent 71% 100%);
  }
  80% {
    background: conic-gradient(#078f22 0% 72%, transparent 72% 100%);
  }
  81.11% {
    background: conic-gradient(#078f22 0% 73%, transparent 73% 100%);
  }
  82.22% {
    background: conic-gradient(#078f22 0% 74%, transparent 74% 100%);
  }
  83.33% {
    background: conic-gradient(#078f22 0% 75%, transparent 75% 100%);
  }
  84.44% {
    background: conic-gradient(#078f22 0% 76%, transparent 76% 100%);
  }
  85.56% {
    background: conic-gradient(#078f22 0% 77%, transparent 77% 100%);
  }
  86.67% {
    background: conic-gradient(#078f22 0% 78%, transparent 78% 100%);
  }
  87.78% {
    background: conic-gradient(#078f22 0% 79%, transparent 79% 100%);
  }
  88.89% {
    background: conic-gradient(#078f22 0% 80%, transparent 80% 100%);
  }
  90% {
    background: conic-gradient(#078f22 0% 81%, transparent 81% 100%);
  }
  91.11% {
    background: conic-gradient(#078f22 0% 82%, transparent 82% 100%);
  }
  92.22% {
    background: conic-gradient(#078f22 0% 83%, transparent 83% 100%);
  }
  93.33% {
    background: conic-gradient(#078f22 0% 84%, transparent 84% 100%);
  }
  94.44% {
    background: conic-gradient(#078f22 0% 85%, transparent 85% 100%);
  }
  95.56% {
    background: conic-gradient(#078f22 0% 86%, transparent 86% 100%);
  }
  96.67% {
    background: conic-gradient(#078f22 0% 87%, transparent 87% 100%);
  }
  97.78% {
    background: conic-gradient(#078f22 0% 88%, transparent 88% 100%);
  }
  98.89% {
    background: conic-gradient(#078f22 0% 89%, transparent 89% 100%);
  }
  100% {
    background: conic-gradient(#078f22 0% 90%, transparent 90% 100%);
  }
}

.histroy-right > ul {
  justify-content: center;
  margin-top: 68px;
}
.histroy-right > ul li {
  margin-left: 45px;
  color: #1f242c;
  font-family: OpenSanssemibold;
  text-align: center;
}
.histroy-right > ul li > div span {
  width: 100px;
  height: 100px;
  background-color: #ececec;
  margin: 0 auto;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  font-size: 26px;
}
.histroy-right > ul li > div span i {
  font-style: normal;
}
.histroy-right > ul li > div::before {
  content: "";
  width: 135px;
  height: 135px;
  background-color: #ffffff;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border-radius: 50%;
}
.histroy-right > ul li:nth-child(1) > div {
  background: conic-gradient(#078f22 0% 66%, transparent 66% 100%);
  animation: normal;
}
.histroy-right > ul li:nth-child(2) > div {
  background: conic-gradient(#078f22 0% 75%, transparent 75% 100%);
  animation: normal;
}
.histroy-right > ul li:nth-child(3) > div {
  background: conic-gradient(#078f22 0% 90%, transparent 90% 100%);
  animation: normal;
}
.histroy-right > ul li > p:nth-of-type(1) {
  font-size: 16px;
  margin-top: 14px;
}

.histroy-right > ul li > p:nth-of-type(2) {
  font-size: 18px;
  color: #0c9226;
  margin-top: 8px;
}

.solution-container {
  background-color: #0c091f;
  padding-top: 66px;
  padding-bottom: 82px;
}
.solution-container .solution-title {
  font-family: OpenSansbold;
  font-size: 48px;
  color: #ffffff;
  text-align: center;
}
.solution-container .solution-title h3 {
  font-size: 48px;
}
.solution-content {
  padding-top: 30px;
  background-color: #03010f;
  margin-top: 35px;
}
.solution-content .solution-item > div {
  display: none;
}
.solution-content .solution-item > div.this-active {
  display: block;
}
.solution-content div p {
  color: #ffffff;
  font-size: 16px;
  text-align: center;
  width: 76.25%;
  margin: 0 auto;
  line-height: 24px;
}
.solution-content div img {
  display: block;
  margin-top: 35px;
}
.solution-content > div {
  padding-bottom: 20px;
}
.solution-content ul {
  width: 100%;
  flex-wrap: nowrap;
  overflow-x: scroll;
}
.solution-content ul li {
  width: 16.667%;
  color: #ffffff;
  position: relative;
  text-align: center;
  height: 60px;
  line-height: 60px;
  white-space: nowrap;
  padding: 0 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  cursor: pointer;
}
/* .solution-content ul li.active{
    font-family: OpenSansbold;
    border-top: 2px solid #078F22;
} */
.solution-content ul li.active::before {
  content: "";
  width: 100%;
  height: 3px;
  display: block;
  background-color: #078f22;
  position: absolute;
  top: -1px;
  left: 0;
}
.video-container {
  background: #fbfbfb;
  padding-top: 120px;
  padding-bottom: 120px;
}
.video-container h3 {
  font-size: 45px;
  color: #29364e;
  font-family: OpenSansbold;
}
.video-container .video-title p {
  font-size: 16px;
  color: #29364e;
  margin-top: 20px;
  line-height: 26px;
  width: 58.875%;
}
.video-container .video-item {
  margin-top: 45px;
  justify-content: space-between;
}
.video-container .video-item li {
  width: 15.5625%;
  border-radius: 10px;
}
.video-container .video-item li > video{
  width: 100%;
  cursor: pointer;
}
.video-container .video-item li p {
  color: #1d1d1f;
  font-size: 16px;
  line-height: 22px;
  margin-top: 16px;
}
.system-container {
  padding-top: 120px;
  padding-bottom: 120px;
}
.system-title h3 {
  font-size: 48px;
  color: #1f242c;
  font-family: OpenSansbold;
  text-align: center;
}
.system-title > p {
  text-align: center;
  font-size: 16px;
  color: #5f6167;
  margin-top: 16px;
}
.system-title > div {
  justify-content: center;
  margin-top: 35px;
}
.two-btn > p {
  width: 195px;
  text-align: center;
}
.two-btn > p a {
  display: block;
  font-size: 14px;
  line-height: 42px;
  border-radius: 21px;
  margin: 0 13px;
}
.two-btn > p:nth-of-type(1) a {
  background-color: #0c9126;
  color: #ffffff;
}
.two-btn > p:nth-of-type(2) a {
  border: 1px solid #32353b;
}
.system-swiper {
  margin-top: 73px;
}
.choose-container {
  color: #ffffff;
  padding-top: 107px;
  background: url(../picture/picture8.webp) no-repeat;
  padding-bottom: 200px;
  background-size: cover;
}
.choose-container .choose-title h3 {
  font-size: 48px;
  text-align: center;
  font-family: openSansbold;
}
.choose-container .choose-title > p {
  line-height: 26px;
  font-size: 16px;
  margin: 0 auto;
  margin-top: 23px;
  width: 66.4375%;
  text-align: center;
}
.choose-container ul {
  justify-content: space-between;
  width: 87.875%;
  margin: 0 auto;
  margin-top: 120px;
}
.choose-container ul li {
  width: auto;
}
.choose-container ul li i {
  display: block;
  font-size: 92px;
}
.choose-container ul li span {
  font-size: 50px;
  font-family: OpenSansbold;
  margin-top: 36px;
  display: block;
  margin-left: 6px;
}
.choose-container ul li p {
  margin-left: 6px;
  font-size: 18px;
  border-bottom: 1px solid #ffffff;
  margin-top: 10px;
}
.development-container {
  background-color: #f8f8f8;
  padding-top: 120px;
  padding-bottom: 120px;
}
.development-left {
  width: 35%;
}
.development-left span {
  font-size: 13px;
  color: #5f708f;
  font-family: OpenSanssemibold;
}
.development-left h3 {
  color: #29364e;
  font-size: 48px;
  font-family: OpenSansbold;
  line-height: 58px;
  margin-top: 20px;
}
.development-right {
  width: 60%;
  margin-left: 5%;
}
.development-right p {
  color: #29364e;
  font-size: 16px;
  line-height: 26px;
}
.development-right ul {
  margin-top: 40px;
  line-height: 34px;
  color: #29364e;
  font-size: 16px;
}
.development-right .two-btn {
  margin-top: 40px;
}
.development-container .development-swiper {
  padding-bottom: 90px;
}
.development-swiper .swiper-slide {
  text-align: center;
  background-color: #ffffff;
  padding-top: 32px;
  padding-bottom: 35px;
}
.development-swiper {
  margin-top: 118px;
}
.development-swiper .swiper-slide > p {
  font-family: OpenSansbold;
  font-size: 18px;
  line-height: 26px;
  color: #29364e;
  width: 85%;
  margin: 20px auto;
  height: 78px;
}
.development-swiper .swiper-slide .off {
  width: 38px;
  height: 38px;
  line-height: 38px;
  text-align: center;
  background-color: #333333;
  color: #ffffff;
  border-radius: 19px;
  display: block;
  margin: 0 auto;
}
.development-swiper .swiper-pagination-bullet {
  background-color: #bfbfbf;
  opacity: unset;
}
.development-swiper .swiper-pagination-bullet-active {
  background-color: #0c9126;
}
.case-container {
  background-color: #0c0920;
  padding: 120px 18px;
}
.case-container .case-title {
  text-align: center;
}
.case-container .case-title span {
  color: #0c9126;
  font-size: 16px;
  font-family: OpenSanssemibold;
}
.case-container .case-title p {
  font-size: 48px;
  color: #ffffff;
  line-height: 58px;
  font-family: OpenSansbold;
  margin-top: 10px;
}
.case-container .case-content {
  margin-top: 45px;
}
.case-container .case-content ul {
  justify-content: space-between;
}
.case-container .case-content ul li {
  position: relative;
  width: 32.8%;
}
.case-container .case-content ul li >div:nth-child(1){
  position: relative;
}
.case-container .case-content ul li .case-word {
  /* display: none; */
  position: absolute;
  width: 65%;
  left: 55px;
  background-color: #ffffff;
  padding: 40px;
  bottom: 100px;
  transition: opacity 1s, visibility 1s;
  opacity: 0;
  visibility: hidden;
}
.case-container .case-content ul li .case-word span {
  font-size: 16px;
  color: #0c9126;
}
.case-container .case-content ul li .case-word p {
  font-size: 20px;
  color: #29364e;
  font-family: OpenSansbold;
  margin-top: 16px;
}
.case-container .case-content ul li:hover {
  cursor: pointer;
}
.case-container .case-content ul li>div:hover>.case-word {
  display: block;
  opacity: 1;
  visibility: visible;
}
.case-container .case-content ul li img {
  width: 100%;
  height: 100%;
}
/* .case-container .case-content ul li:nth-of-type(2){
    width: 34%;
} */
.work-top {
  padding-top: 120px;
  /* border-right: 1px solid #ECECEC;
    border-left: 1px solid #ECECEC; */
}
.work-left {
  width: 50%;
}
.work-right {
  width: 50%;
}
.work-left .work-title {
  font-size: 13px;
  color: #5f708f;
  font-family: OpenSanssemibold;
  width: 22%;
}
.work-left h3 {
  font-size: 48px;
  color: #29364e;
  font-family: OpenSansbold;
  line-height: 58px;
  width: 41.5%;
  margin-top: -8px;
}
.work-right p {
  width: 79.25%;
  margin: 0 auto;
  line-height: 26px;
  font-size: 16px;
  color: #29364e;
}
.work-right p:nth-of-type(2) {
  margin-top: 20px;
}
.work-bottom {
  margin-top: 90px;
}
.work-bottom ul {
  width: 75%;
  margin: 0 auto;
}
.work-bottom ul li {
  height: 300px;
  width: 300px;
  border-radius: 50%;
  border: 1px solid #f1f2f2;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.work-bottom ul li span {
  position: absolute;
  left: 30px;
  top: 24px;
  background-color: #0c9126;
  display: block;
  width: 31px;
  height: 31px;
  line-height: 31px;
  text-align: center;
  color: #ffffff;
  border-radius: 50%;
}
.work-bottom ul li:nth-of-type(1) {
  margin-left: 30px;
}
.work-bottom ul li + li {
  margin-left: -17px;
}
.work-bottom ul li p:nth-of-type(1) {
  font-family: OpenSansbold;
  font-size: 24px;
  color: #29364e;
  line-height: 26px;
}
.work-bottom ul li p:nth-of-type(2) {
  line-height: 24px;
  font-size: 16px;
  color: #5f708f;
  line-height: 24px;
  margin-top: 30px;
  width: 60%;
}
.services-container {
  padding-top: 90px;
  background-color: #f6f6f6;
  margin-top: 126px;
}
.services-content {
  background: url(../picture/picture14.webp) no-repeat center;
  background-size: cover;
}
.services-title {
  font-size: 16px;
  color: #5f708f;
  text-align: center;
}
.services-title p {
  font-size: 48px;
  color: #29364e;
  font-family: OpenSansbold;
  margin-top: 10px;
}
.services-content {
  margin-top: 70px;
  padding-top: 160px;
  padding-bottom: 104px;
  justify-content: center;
}
.services-content ul {
  width: 24.5625%;
}
.services-content ul:nth-of-type(1) {
  margin-right: 22%;
}
.services-content ul li {
  background: rgba(0, 0, 0, 0.66);
  border-radius: 15px;
  border: 2px solid #ffffff;
  font-size: 18px;
  color: #ffffff;
  line-height: 30px;
  font-family: OpenSanssemibold;
  height: 105px;
  display: flex;
  align-items: center;
  text-align: center;
  padding: 0 23%;
  margin-bottom: 22px;
}
.blog-container {
  background: url(../picture/picture16.webp) no-repeat center;
  background-size: cover;
  margin-top: 123px;
  padding-top: 123px;
  padding-bottom: 123px;
}

.blog-left {
  width: 28%;
  margin-left: 8.333%;
  color: #ffffff;
}
.blog-right {
  width: 62.5%;
}
.blog-left span {
  font-size: 13px;
  color: #ffffff;
  line-height: 61px;
  font-family: OpenSanssemibold;
}
.blog-left h2 {
  font-size: 48px;
  color: #ffffff;
  line-height: 58px;
  font-family: OpenSansbold;
  width: 80%;
  font-weight: normal;
}
.blog-left p {
  font-size: 14px;
  color: #e5e4ea;
  margin-top: 29px;
}
.blog-left a {
  display: block;
  width: 195px;
  height: 42px;
  border-radius: 21px;
  border: 1px solid #ffffff;
  color: #ffffff;
  text-align: center;
  line-height: 42px;
  margin-top: 73px;
}
.blog-right .swiper-slide {
  background-color: #ffffff;
}
.blog-right .blog-content {
  padding: 17px;
  padding-bottom: 30px;
}
.blog-right .blog-content > span {
  font-size: 14px;
  color: #29364e;
  line-height: 58px;
}
.blog-right .blog-content > h3 {
  font-family: OpenSanssemibold;
  font-weight: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.blog-right .blog-content > h3 a {
  font-size: 18px;
  color: #29364e;
  line-height: 26px;
}
.blog-right .blog-content > p a {
  font-size: 14px;
  color: #29364e;
  line-height: 27px;
  margin-top: 70px;
  display: inline-block;
}
.blog-right .blog-content > p a::after {
  content: ">";
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid #8d94a1;
  display: inline-block;
  color: #8d94a1;
  text-align: center;
  line-height: 30px;
  margin-left: 10px;
}

.system-swiper .swiper-pagination-bullet {
  background-color: unset;
  margin: 0 16px !important;
  font-size: 16px;
  color: #5f6167;
  opacity: unset;
}
.system-swiper .swiper-pagination-bullet-active {
  color: #0c9226;
  font-family: OpenSanssemibold;
  font-size: 20px;
}

@media screen and (max-width: 768px) {
  .choose-container ul li i{
      font-size: 12vw;
  }
  .do-content > div p span:nth-child(1){
    font-size: 7.33vw;
  }
  .development-swiper .swiper-slide > p {
    height: 140px;
  }
  .m-header {
    background-color: unset;
  }

  .m-banner-content {
    position: absolute;
    color: #ffffff;
    top: 52.53vw;
    padding: 0 15px;
  }
  .m-banner-content h3 {
    font-weight: normal;
    font-size: 8vw;
    font-family: Impact, "Arial Narrow Bold", sans-serif;
  }
  .m-banner-content p {
    font-size: 3.2vw;
    line-height: 3.73vw;
    color: #ced3db;
    margin-top: 4vw;
  }
  .m-banner-content p a {
    display: block;
    width: 40vw;
    text-align: center;
    color: #ffffff;
    border: 1px solid #ffffff;
    border-radius: 5vw;
    height: 10vw;
    line-height: 10vw;
    margin-top: 40px;
  }
  .m-banner-container .swiper-pagination-bullet {
    width: 3.6vw;
    height: 3.6vw;
    border: 1px solid #ffffff;
    background-color: unset;
    opacity: unset;
    margin: 0 1.6vw !important;
  }
  .m-banner-container .swiper-pagination-bullets {
    bottom: 9.3vw !important;
  }
  .m-banner-container .swiper-pagination-bullet-active {
    background-color: #ffffff;
  }
  .product-container ul,
  .do-container,
  .do-left,
  .do-right {
    display: block;
  }
  .product-container ul li {
    width: 100%;
    padding-top: 13.33vw;
  }
  .product-container .product-top h3 {
    margin-top: 3vw;
    font-size: 4.533vw;
  }
  .product-container .product-top p {
    font-size: 3.733vw;
  }
  .product-container .product-top span {
    font-size: 3.467vw;
  }
  .product-container .product-mid {
    margin-top: 7.867vw;
  }
  .product-container .product-bottom {
    padding-top: 12.8vw !important;
    padding-bottom: 10vw !important;
  }
  .do-left,
  .do-right {
    width: 92vw;
    margin: 0 auto;
    border: unset;
  }
  .do-left {
    padding-top: 16vw;
    padding-bottom: 16vw;
  }
  .do-right {
    padding-top: 0;
    padding-bottom: 16vw;
  }
  .do-content {
    width: 100%;
  }
  .do-content h3 {
    margin-top: 6.3vw;
    font-size: 6.67vw;
    line-height: 7.73vw;
  }
  .do-content > p {
    font-size: 3.73vw;
    line-height: 6.113vw;
    margin-top: 10.267vw;
  }
  .do-content > div {
    display: block;
    margin-top: 12vw;
  }
  .do-content > div p:nth-child(1) {
    border-right: unset;
    margin-right: 0;
  }
  .do-content > div p {
    width: 100%;
    margin-bottom: 8.8vw;
  }
  .our-list {
    display: block;
  }
  .our-list li {
    width: 100%;
    padding-top: 48.8vw;
    padding-bottom: 36.667vw;
  }
  .our-container > .wrap {
    width: 100%;
  }
  .our-list li:nth-child(1):hover .our-title span {
    margin-left: 4vw;
  }
  .our-list li > div {
    width: 92vw;
  }
  .history-container {
    width: 92vw;
    margin: 0 auto;
  }
  .history-container > .wrap {
    border: unset;
  }
  .history-container .history-img-1,
  .history-container .history-img-2,
  .histroy-right {
    width: 100%;
    margin-left: 0;
  }
  .history-container .history-img-2 {
    margin-top: 3.6vw;
  }
  .history-container .history-img-1 img,
  .history-container .history-img-2 img {
    width: 100%;
  }
  .histroy-right {
    padding-right: 0;
    padding-top: 16vw;
  }
  .histroy-right > p,
  .histroy-right > ul li {
    margin-left: 0;
  }
  .histroy-right > ul li {
    margin-top: 15.6vw;
  }
  .histroy-right > ul {
    display: none;
    margin-top: 15.6vw;
  }
  .histroy-right > ul li > div {
    margin: auto;
  }
  .histroy-right > ul li > p:nth-of-type(1) {
    font-size: 3.733vw;
  }
  .histroy-right > ul li > p:nth-of-type(2) {
    font-size: 4.267vw;
  }
  .histroy-right h3 {
    font-size: 6.67vw;
    text-transform: uppercase;
    line-height: 7.733vw;
  }
  .histroy-right > p {
    margin-top: 10.133vw;
    font-size: 3.733vw;
  }

  .solution-container .solution-title h3 {
    font-size: 6.67vw;
  }
  .solution-content {
    background-color: #0c091f;
  }
  .solution-content div p {
    width: 100%;
    font-size: 3.467vw;
    line-height: 5.867vw;
  }
  .solution-content ul {
    flex-wrap: nowrap;
    overflow-x: scroll;
  }
  .solution-content .solution-img {
    display: none;
  }
  .wrap {
    width: 92vw;
  }
  .video-container {
    margin-top: 0;
    padding-top: 16vw;
    background-color: #f3f3f3;
    padding-bottom: 60px;
  }
  .video-container .video-title p {
    width: 100%;
  }
  .video-content {
    display: none;
  }
  .system-container {
    margin-top: 16vw;
    padding-top: 0;
    padding-bottom: 13.33vw;
  }
  .system-title h3 {
    font-size: 6.667vw;
  }
  .system-title > p {
    margin-top: 8vw;
    font-size: 3.467vw;
  }
  .system-title > div {
    display: block;
    margin-bottom: 20px;
  }
  .system-title > div > p {
    margin: 10px auto;
  }
  .system-swiper {
    padding-bottom: 8.1vw !important;
  }
  .choose-container {
    padding-top: 16vw;
    padding-bottom: 16vw;
    background: url(../picture/m/picture2.webp) no-repeat;
    background-size: cover;
  }
  .choose-container .choose-title h3 {
    font-size: 6.67vw;
  }
  .choose-container .choose-title > p {
    width: 100%;
    line-height: 6vw;
  }
  .choose-container ul {
    width: 100%;
    margin-top: 13.2vw;
  }
  .choose-container ul li {
    width: 40vw;
    margin-bottom: 30px;
  }
  .choose-container ul li span {
    font-size: 6.67vw;
    margin-top: 30px;
  }
  .choose-container ul li p {
    font-size: 3.733vw;
  }
  .development-container {
    padding: 16vw 0;
  }
  .development-left span {
    font-size: 3.2vw;
  }
  .development-left h3 {
    font-size: 6.67vw;
    line-height: 7.67vw;
  }
  .development-right {
    margin-top: 10.26vw;
    font-size: 3.733vw;
    line-height: 6.133vw;
  }
  .development-left,
  .development-right {
    width: 100%;
    margin-left: 0;
  }
  .development-right .two-btn {
    display: block;
  }
  .development-right .two-btn p {
    margin-bottom: 20px;
  }
  .development-container .development-swiper {
    margin-top: 10.667vw;
    padding-bottom: 8.4vw;
  }
  .case-container {
    padding-top: 16.133vw;
  }
  .case-container .case-title p {
    font-size: 6.67vw;
  }
  .work-top {
    border: unset;
    display: block;
    padding-top: 16vw;
  }
  .work-left {
    display: block;
    width: 100%;
  }
  .work-right,
  .work-left h3,
  .work-left .work-title,
  .work-right p,
  .work-bottom ul {
    width: 100%;
  }

  .work-left h3 {
    margin-top: 6.533vw;
  }
  .work-right {
    margin-top: 10vw;
  }
  .work-bottom {
    display: none;
  }
  .work-bottom ul li {
    left: 0;
    right: 0;
    margin: auto;
    width: 70vw;
    height: 70vw;
  }
  .work-bottom ul li span {
    left: 6vw;
    width: 7.2vw;
    height: 7.2vw;
    top: 6.6vw;
    line-height: 7.2vw;
    font-size: 3.2vw;
  }
  .work-bottom ul li:nth-of-type(1) {
    margin-left: auto;
  }
  .work-bottom ul li + li {
    margin-left: auto;
    margin-top: -15px;
  }
  .services-container {
    padding-top: 60px;
    /* margin-top: 11.6vw; */
    margin-top: 16vw;
  }
  .services-container .wrap {
    width: 100%;
  }
  .services-content {
    background: url(../picture/m/picture14.webp) no-repeat center;
    background-size: cover;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 60px 50px;
  }
  .services-content ul{
    width: 100%;
  }
  .services-content ul li{
    height: auto;
    font-size: 13px;
    color: #FFFFFF;
    line-height: 15px;
    border-radius: 7.5px;
    padding: 13px 18% 10px;
    border: 1px solid #ffffff;
    margin-bottom: 14px;
  }
  .services-content ul {
    width: 90%;
    margin: 0 auto;
  }
  .services-content ul:nth-of-type(1) {
    margin-right: auto;
    margin-bottom: 340px;
  }
  .services-content {
    margin-top: 7.33vw;
  }
  .blog-container .blog-box {
    display: block;
  }
  .blog-container {
    padding-top: 16vw;
    margin-top: 50px;
  }
  .form-container {
    margin-top: 50px;
}
  .blog-left {
    width: 100%;
    margin-left: 0;
    text-align: center;
  }
  .blog-left h2 {
    width: 100%;
    font-size: 6.667vw;
  }
  .blog-left p {
    width: 77%;
    margin: auto;
  }
  .blog-left a {
    margin: 9.3vw auto;
  }
  .blog-right {
    width: 96%;
    margin-left: 4vw;
  }

  .case-container .m-case-content ul li .case-word {
    position: absolute;
    width: 80.8vw;
    left: 24px;
    background-color: #ffffff;
    padding: 9vw;
    bottom: 12.8vw;
  }
  .case-container .case-content {
    display: none;
  }
  .case-container .m-case-content ul li img {
    width: 100%;
  }
  .case-container .m-case-content ul li .case-word span {
    font-size: 3.467vw;
    color: #0c9126;
  }
  .case-container .m-case-content ul li .case-word p {
    font-size: 4vw;
    color: #29364e;
    font-family: OpenSansbold;
    margin-top: 16px;
  }
  .m-banner-container .m-banner-item img {
    width: 100%;
  }
  .solution-content ul li{
    width: unset;
    font-size: 3.4vw;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .banner-container .tag-container {
    display: none;
  }
  .banner-swiper .banner-item-1 .banner-content h3 {
    width: 100%;
  }
}

@media screen and (max-width: 1280px) {
  .banner-container .tag-container {
    display: none;
  }
  .banner-swiper .banner-item-1 .banner-content h3 {
    width: 100%;
  }
}
@media (min-width: 1280px) and (max-width: 1448px) {
  .banner-container .tag-container {
    width: 80%;
  }
  .banner-swiper .banner-item-1 .banner-content h3 {
    width: 60%;
    font-size: 50px;
  }
  .banner-swiper .banner-item-1 .banner-content {
    top: 10vw;
  }
  .banner-container .tag-container li {
    padding: 4px 15px;
  }
}

@media (min-width: 1448px) and (max-width: 1900px) {
  .banner-swiper .banner-item-1 .banner-content h3,
  .banner-container .tag-container {
    width: 80%;
  }
}
@media screen and (max-width: 1448px) {
  .histroy-right > ul {
    display: none;
  }
  .histroy-right > p {
    margin-left: 50px;
  }
}