/* 保留 px 样式，但动态适配*/.header-box {
  width:100%;
}
.banner-box #swiper1 {
  width:100%;
  height:100%;
}
.banner-box #swiper1 .swiper-slide {
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
}
.banner-box #swiper1 .swiper-slide .title-box {
  width:5rem;
  text-align:center;
}
.banner-box #swiper1 .swiper-slide .title-box .big-title {
  font-weight:bold;
  font-size:0.8rem;
  color:#FFFFFF;
  margin-bottom:0.34rem;
}
.banner-box #swiper1 .swiper-slide .title-box .small-title {
  font-weight:400;
  font-size:0.36rem;
  color:#FFFFFF;
}
.banner-box #swiper1 .swiper-slide .start-swiper {
  position:absolute;
  bottom:0.3rem;
  left:0;
  width:100%;
  height:0.6rem;
  display:flex;
  flex-direction:column;
  justify-content:space-around;
  align-items:center;
  animation:moveUpAndDown 3s ease-in-out infinite;
}
@keyframes moveUpAndDown {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(0.2rem);
  }
}
.banner-box #swiper1 .swiper-slide .start-swiper .mouse {
    width:0.24rem;
    height:0.36rem;
  }
.banner-box #swiper1 .swiper-slide .start-swiper .arrow-bottom {
  width:0.15rem;
  height:0.18rem;
}
.banner-box {
  width:100%;
  height:100vh;
}
.campany-box {
  width:100%;
  height:9.6rem;
  display:flex;
  background:#FFFFFF;
  position:relative;
}
.campany-box__left {
  width:50vw;
  box-sizing:border-box;
  padding:0.8rem 0.5rem 0 0.7rem;
  height:9.6rem;
}
.campany-box__left .campany-title {
  font-weight:bold;
  font-size:0.48rem;
  color:#222222;
  margin-bottom:0.3rem;
}
.campany-box__left .campany-content {
  height:5.8rem;
  overflow:auto;
  font-weight:400;
  font-size:0.2rem;
  color:#666666;
  line-height:0.46rem;
}
.campany-box__left .campany-more {
  width:1.6rem;
  height:0.44rem;
  margin-left:0.1rem;
  border-radius:0.06rem 0.06rem 0.06rem 0.06rem;
  border:1px solid #D52729;
  text-align:center;
  line-height:0.44rem;
  font-weight:400;
  font-size:0.16rem;
  color:#D52729;
  margin-top:0.27rem;
  margin-bottom:0.1rem;
  transition:background-color 0.2s ease;
  transition:color 0.2s ease;
  /*transition:transform 0.3s ease;*/;
}
.campany-box__left .campany-more:hover {
  color:white;
  background-color:#D52729;
  transform:scale(1.1) !important;
  box-shadow:0rem 0.06rem 0.16rem 0.01rem rgba(0,0,0,0.16);
}
.campany-box__left__bottom {
  width:50vw;
  position:absolute;
  bottom:0;
  left:0;
  display:flex;
}
.campany-box__left__bottom__item {
  cursor:pointer;
  width:25%;
  height:2rem;
  box-sizing:border-box;
  padding:0.42rem 0.4rem;
  color:#FFFFFF;
}
.campany-box__left__bottom__item:hover {
  transform:scale(1.1) !important;
  transition:transform 0.3s ease;
  box-shadow:0rem 0.06rem 0.16rem 0.01rem rgba(0,0,0,0.16);
}
.campany-box__left__bottom__item__title {
  white-space:nowrap;
  height:0.75rem;
  line-height:0.78rem;
  font-size:0.24rem;
}
.campany-box__left__bottom__item__title .big {
  line-height:0.75rem;
  font-weight:bold;
  font-size:0.52rem;
  color:#FFFFFF;
  margin-right:0.1rem;
}
.campany-box__left__bottom__item__desc {
  font-weight:400;
  font-size:0.2rem;
  color:#FFFFFF;
  line-height:0.3rem;
}
.campany-box__left__bottom__item:nth-child(1) {
  color:#222222;
  background:#F8F8F8;
}
.campany-box__left__bottom__item:nth-child(1) .campany-box__left__bottom__item__title {
  color:#222222;
}
.campany-box__left__bottom__item:nth-child(1) .campany-box__left__bottom__item__title .big {
  color:#222222;
}
.campany-box__left__bottom__item:nth-child(1) .campany-box__left__bottom__item__desc {
  color:#666666;
}
.campany-box__left__bottom__item:nth-child(2) {
  background:#BEC0C3;
}
.campany-box__left__bottom__item:nth-child(3) {
  background:#F13B22;
}
.campany-box__left__bottom__item:nth-child(4) {
  background:#D52729;
}
.campany-box__right {
  width:50%;
  height:9.6rem;
}
.campany-box__right img {
  width:100%;
  height:100%;
}
.service-box {
  width:100%;
  background:#FFFFFF;
}
.service-box__title {
  width:100%;
  height:3.14rem;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  background:#FFFFFF;
}
.service-box__content {
  width:100%;
  height:6.46rem;
  display:flex;
  overflow:hidden;
}
.service-box__content__item {
  width:20%;
  display:flex;
  justify-content:center;
  align-items:center;
}
.service-box__content__item .center-img {
  width:0.8rem;
  height:0.8rem;
}
.service-box__content__item:hover {
  transform:scale(1.1) !important;
  transition:transform 0.3s ease;
}
.service-box__content__item .mid {
  width:0.28rem;
  height:0.02rem;
  background:#FFFFFF;
  margin:0.3rem 0;
}
.service-box__content__item .word {
  /*width:0.48rem;*/
  height:0.35rem;
  line-height:0.35rem;
  text-align:center;
  font-weight:500;
  font-size:0.24rem;
  color:#FFFFFF;
}
:root {
  --my-width:100vw;
  --user-height:calc(var(--my-width) / 2.7);
  --user-height-2:calc(var(--my-width) /2);
  --bottom:calc(var(--user-height) * 0.1);
}
.component-box {
  width:100%;
  height:var(--user-height-2);
  position:relative;
}
.component-box .tab-box {
  /*width:8rem;*/
  height:0.46rem;
  line-height:0.46rem;
  box-sizing:border-box;
  /*padding:0 0.4rem;*/
  border-bottom:0.03rem solid #E6E6E6;
  display:flex;
  position:absolute;
  top:0.3rem;
  left:calc(50%);
  transform:translateX(-50%);
  z-index:2;
}
.component-box .tab-box__item {
  width:1.8rem;
  text-align:center;
  height:0.46rem;
  line-height:0.46rem;
  font-size:0.22rem;
  position:relative;
  cursor:pointer;
}
.component-box .tab-box__item.active {
  color:#D52729;
}
.component-box .tab-box__item.active::after {
  content:"";
  width:1.8rem;
  height:0.03rem;
  background:#D52729;
  position:absolute;
  bottom:0;
  left:0;
}
.component-box #swiper2 {
  width:100%;
  height:100%;
}
.component-box #swiper2 .swiper-slide {
  width:100%;
  height:100%;
  box-sizing:border-box;
  padding-top:1.85rem;
}
.component-box #swiper2 .swiper-slide .banner-title {
  width:100%;
  text-align:center;
  font-weight:bold;
  font-size:0.4rem;
  color:#222222;
  margin-bottom:0.2rem;
}
.component-box #swiper2 .swiper-slide .banner-desc {
  width:100%;
  text-align:center;
  font-weight:400;
  font-size:0.14rem;
  color:#444444;
  line-height:0.68rem;
}
.component-box #swiper2 .swiper-slide .get-more {
  width:2.6rem;
  height:0.44rem;
  background:#D52729;
  border-radius:0.06rem 0.06rem 0.06rem 0.06rem;
  font-size:0.16rem;
  color:#FFFFFF;
  text-align:center;
  line-height:0.44rem;
  position:absolute;
  bottom:0.9rem;
  left:calc(50% - 1.3rem);
}
.product-box {
  width:100%;
  height:9.6rem;
  box-sizing:border-box;
  padding-top:1.2rem;
  position:relative;
}
.product-box .box-title {
  font-weight:bold;
  font-size:0.4rem;
  color:#FFFFFF;
}
.product-box .box-desc {
  font-weight:400;
  font-size:0.2rem;
  color:#FFFFFF;
  margin-top:0.27rem;
}
.product-box__bottom {
  position:absolute;
  width:100%;
  bottom:1rem;
  display:flex;
  justify-content:space-between;
  align-items:center;
  box-sizing:border-box;
  padding:0 3rem;
}
.product-box__bottom__item {
  height:0.68rem;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:center;
  cursor:pointer;
}
.product-box__bottom__item:hover {
  transition-delay:0s !important;
  transform:scale(1.1) !important;
  transition:transform 0.1s ease;
}
.product-box__bottom__item img {
  width:0.36rem;
  height:0.36rem;
}
.product-box__bottom__item .title {
  font-weight:500;
  font-size:0.18rem;
  color:#FFFFFF;
  line-height:0.3rem;
}
.cases-box {
  overflow:hidden;
  background-image:url('/static/img/index/img_bg_jpal.png');
  background-size:100% 100%;
  margin:0 auto;
  width:100vw;
  /*height:9.6rem;*/
  box-sizing:border-box;
  padding-top:1.2rem;
  position:relative;
}
.cases-box .tab-box {
  width:fit-content;
  height:0.9rem;
  line-height:0.46rem;
  box-sizing:border-box;
  margin:0 auto;
  border-bottom:0.08rem solid #E6E6E6;
  display:flex;
  /*position:absolute;*/
  /*left:50%;*/
  /*transform:translate(-50%,-50%);*/
  /*z-index:2;*/;
}
.cases-more-btn {
  width:1.6rem;
  text-align:center;
  height:0.44rem;
  line-height:0.44rem;
  border-radius:0.06rem 0.06rem 0.06rem 0.06rem;
  border:1px solid #D52729;
  font-weight:400;
  font-size:0.16rem;
  color:#D52729;
  margin:0 auto;
  cursor:pointer;
  margin-top:0.3rem;
  margin-bottom:0.3rem;
}
.cases-more-btn:hover {
  transform:scale(1.1) !important;
  transition:transform 0.3s ease;
  background:#D52729;
  border:none;
  color:white;
  box-shadow:0rem 0.06rem 0.16rem 0.01rem rgba(0,0,0,0.16);
}
.cases-box .tab-box __item {
  width:1.8rem;
  text-align:center;
  height:0.46rem;
  line-height:0.46rem;
  position:relative;
  cursor:pointer;
}
.cases-box .tab-box __item.active {
  color:#D52729;
}
.cases-box .tab-box __item.active::after {
  content:"";
  width:1.8rem;
  height:0.03rem;
  background:#D52729;
  position:absolute;
  bottom:0;
  left:0;
}
.cases-box .tab-box__item {
  width:1.8rem;
  text-align:center;
  height:0.9rem;
  line-height:0.46rem;
  position:relative;
  cursor:pointer;
}
.cases-box .tab-box__item.active {
  color:#D52729;
}
.cases-box .tab-box__item.active::after {
  content:"";
  width:1.8rem;
  height:0.08rem;
  background:#D52729;
  position:absolute;
  bottom:0;
  left:0;
}
.cases-box .box-title {
  font-weight:bold;
  font-size:0.4rem;
  color:#000000;
  margin-bottom:0.75rem;
}
.cases-box #swiper3 {
  overflow:visible;
}
.cases-box #swiper3 .swiper-wrapper .swiper-slide {
  width:9.2rem;
  /*height:calc(var(--cases-width) /2);*/
  /*height:4.6rem;*/
  border-radius:0.16rem;
  box-sizing:border-box;
  /*padding:0.8rem 0.4rem;*/
  overflow:hidden;
}
.cases-box #swiper3 .swiper-wrapper .swiper-slide img {
  width:100% !important;
}
.cases-box #swiper3 .swiper-wrapper .swiper-slide .banner-title {
  width:3.8rem;
  height:0.56rem;
  line-height:0.56rem;
  background:#D52729;
  box-sizing:border-box;
  padding:0 0.2rem;
  margin-bottom:0.2rem;
  font-weight:500;
  font-size:0.24rem;
  color:#FFFFFF;
}
.cases-box #swiper3 .swiper-wrapper .swiper-slide .banner-desc {
  font-weight:400;
  font-size:0.18rem;
  color:#FFFFFF;
  line-height:0.36rem;
}
.cases-box #swiper3 .swiper3-pagination {
  width:3rem !important;
  top:5.35rem !important;
  left:calc(50% - 1.5rem);
}
.cases-box #swiper3 .swiper3-pagination .swiper-pagination-progressbar-fill {
  background:#D52729 !important;
}
.active-box {
  padding-left:1.2rem;
  padding-right:1.2rem;
  width:100%;
  height:8.9rem;
  position:relative;
  background:#FFFFFF;
  box-sizing:border-box;
  padding-top:1.2rem;
}
.active-box .box-title {
  font-weight:bold;
  font-size:0.4rem;
  color:#000000;
  margin-bottom:0.8rem;
}
.active-box #swiper4 {
  width:100%;
  height:4.28rem;
}
/*.active-box #swiper4 .swiper-wrapper {*/
/*  width:16.8rem;*/
/*  overflow:hidden;*/
/*  margin:0 auto;
}*/
.active-box #swiper4 .swiper-wrapper .swiper-slide {
  /*width:5rem !important;*/
  height:4.28rem;
}
.active-box #swiper4 .swiper-wrapper .swiper-slide img {
  width:100%;
  height:3.2rem;
}
.active-box #swiper4 .swiper-wrapper .swiper-slide .banner-title {
  width:100%;
  height:0.88rem;
  margin-top:0.2rem;
  line-height:0.44rem;
  font-weight:400;
  font-size:0.28rem;
  color:#222222;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
}
.active-box .swiper4-button {
  width:0.9rem;
  height:0.9rem;
  z-index:999;
  position:absolute;
  top:calc(50% - 0.75rem);
  border-radius:50%;
  box-shadow:0rem 0.06rem 0.16rem 0.01rem rgba(0,0,0,0.16);
}
.active-box .swiper4-next {
  right:0.6rem;
}
.active-box .swiper4-prev {
  left:0.6rem;
}
.friend-box {
  overflow:hidden;
  width:100vw;
  height:9.6rem;
  position:relative;
  box-sizing:border-box;
  /*padding:1.2rem 2.8rem 2.04rem 2.8rem;*/;
}
.friend-box .box-title {
  margin-top:0.9rem;
  font-weight:bold;
  font-size:0.4rem;
  color:#FFFFFF;
  margin-bottom:0.8rem;
}
.friend-box__content {
  padding:0.4rem;
  width:100%;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  grid-template-rows:repeat(4,1fr);
  grid-column-gap:0.4rem;
  grid-row-gap:0.46rem;
  cursor:pointer;
}
.friend-box__content .friend_item {
  margin:auto;
  width:2.4rem;
  height:0.9rem;
}
.friend-box__content .friend_item img {
  width:100%;
  height:100%;
}
.friend-box__content img:hover {
  transform:scale(1.1) !important;
  transition:transform 0.3s ease;
  box-shadow:0rem 0.06rem 0.16rem 0.01rem rgba(0,0,0,0.16);
}
#swiper3 .swiper-slide {
  text-align:center;
  font-size:0.18rem;
  background:#fff;
  /* Center slide text vertically*/
  display:-webkit-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:flex;
  -webkit-box-pack:center;
  -ms-flex-pack:center;
  -webkit-justify-content:center;
  justify-content:center;
  -webkit-box-align:center;
  -ms-flex-align:center;
  -webkit-align-items:center;
  align-items:center;
}
#swiper3 .swiper-slide img {
  display:block;
  width:9.2rem !important;
  height:100%;
  /*object-fit:cover;*/;
}
.more-btn {
  width:1.6rem;
  text-align:center;
  height:0.44rem;
  line-height:0.44rem;
  border-radius:0.06rem 0.06rem 0.06rem 0.06rem;
  border:1px solid #D52729;
  font-weight:400;
  font-size:0.16rem;
  color:#D52729;
  position:absolute;
  bottom:0.8rem;
  left:calc(50% - 0.8rem);
  cursor:pointer;
  transition:background-color 0.5s ease-in-out,color 0.5s ease-in-out;
  /* 设置过渡效果*/;
}
.product-j-btn {
  width:2.6rem;
  height:0.44rem;
  background:#D52729;
  border-radius:0.06rem 0.06rem 0.06rem 0.06rem;
  font-weight:400;
  font-size:0.16rem;
  color:#FFFFFF;
  text-align:center;
  line-height:0.44rem;
  position:absolute;
  left:calc(50% - 1.3rem);
  bottom:0.5rem;
}
.product-j-btn:hover {
  transform:scale(1.1) !important;
  transition:transform 0.3s ease;
  box-shadow:0rem 0.06rem 0.16rem 0.01rem rgba(0,0,0,0.16);
}
.more-btn:hover {
  transform:scale(1.1) !important;
  transition:transform 0.3s ease;
  background:#D52729;
  border:none;
  color:white;
  box-shadow:0rem 0.06rem 0.16rem 0.01rem rgba(0,0,0,0.16);
}
/*# sourceMappingURL=index.css.map*/