.swiper-tran {  transition: all 0.3s;  -webkit-transition: all 0.3s;}.swiper-box {  cursor: pointer;  width: 100%;  overflow-x: hidden;  position: relative;}.swiper-box .banner-item1,.swiper-box .banner-item2 {  background-size: cover;  background-position: 50%;  background-repeat: no-repeat;}.service .service-title .service-title-h2 {  font-size: 0.24rem;  font-weight: 600;}.service .service-title .service-title-h3 {  font-size: 0.12rem;  margin-left: 0.2rem;  color: #8a8a8a;  font-weight: 300;}.case .pc-case-ul a {  display: inline-block;  width: 100%;  height: 100%;}.case .pc-case-ul img {  width: 100%;  height: 100%;}.trust .hidden-detail-mask {  height: 0;  overflow: hidden;  border: 0;}.trust .show-detail-mask {  height: 100%;}.body-fix {  position: fixed;  width: 100%;  left: 50%;  transform: translate(-50%, 0);  -webkit-transform: translate(-50%, 0);}@media (max-width: 575px) {  .red-line {    background-color: #FD0000;    width: 0.4rem;    height: 1px;    border-radius: 0.5px;    border: 1px solid #FD0000;  }  .target-fix {    position: relative;    top: -0.86rem;    height: 1px;    overflow: hidden;  }  .service-box .service-li:first-child {    margin-top: 0.4rem;  }  .service-box .service-li {    margin-top: 0.48rem;  }  .service-box .service-item-title {    height: 0.4rem;  }  .service-box .service-item-title h4 {    font-weight: 400;  }  .service-li img {    width: 0.52rem;    height: 0.52rem;    vertical-align: middle;  }  .service-li h4 {    font-size: 0.28rem;    color: #0e0e0e;    margin-left: 0.32rem;    vertical-align: middle;    display: inline-block;  }  .service-li p {    margin-top: 0.22rem;    font-size: 0.24rem;    color: #929292;    line-height: 0.44rem;  }  .trust {    margin-top: 1.54rem;  }  .trust .trust-title {    margin: 0 0.64rem 0 0.64rem;    font-size: 0.4rem;  }  .trust .trust-box {    margin: 0.6rem auto 0;    max-width: 7.04rem;  }  .trust .trust-box li {    width: 3.4rem;    height: 4.2rem;    text-align: center;    margin-top: 0.48rem;    cursor: pointer;  }  /*  .trust .trust-box li:first-child {    margin-top: 0;  }  */  .trust .project {    border: 1px solid #E0E0E0;    /*padding-bottom: 0.64rem;*/    height: 100%;  }  .trust .project img {    width: 1.6rem;    height: 1.6rem;    border-radius: 0.8rem;    margin-top: 0.44rem;  }  .trust .project h3 {    margin-top: 0.26rem;    font-weight: 600;    font-size: 0.32rem;    line-height: 0.44rem;  }  .trust .project p {    font-size: 0.24rem;    color: #4a4a4a;    line-height: 0.34rem;    margin: 0.2rem 0 5px 0;    padding: 0 5px;  }  .trust .more-button {    margin-top: 0.88rem;  }  .trust .more-project {    margin-top: 0.88rem;  }  .mask-detail-info {    position: fixed;    top: 0.86rem;    right: 0;    bottom: 0;    left: 0;    background-color: rgba(255, 255, 255, 0.9);    text-align: center;    z-index: 11;    /* height: 100vh; */    overflow: auto;    padding-bottom: 0.4rem;  }  .mask-detail-info .mask-content {    width: 5.86rem;    margin: 0.58rem auto 0;  }  .mask-detail-info .mask-content img {    width: 1.6rem;    height: 1.6rem;    border-radius: 0.8rem;  }  .mask-detail-info .mask-content .close {    width: 0.5rem;    height: 0.5rem;    margin-top: 0.6rem;    cursor: pointer;  }  .mask-detail-info h3 {    font-weight: 600;    font-size: 0.32rem;    line-height: 0.44rem;    margin-top: 0.14rem;  }  .mask-detail-info h4 {    font-weight: 400;    margin-top: 0.1rem;    font-size: 0.24rem;    line-height: 0.34rem;    color: #4a4a4a;  }  .mask-detail-info .red-line {    margin-top: 0.04rem;  }  .mask-detail-info p {    margin-top: 0.56rem;    line-height: 0.64rem;    font-size: 0.32rem;    color: #4a4a4a;    text-align: left;  }  .animate-zoomIn {    animation: zoomIn 0.5s forwards;    -webkit-animation: zoomIn 0.5s forwards;  }  .animate-zoomOut {    animation: zoomOut 0.5s forwards;    -webkit-animation: zoomOut 0.5s forwards;  }  @keyframes zoomIn {    0% {      transform: scale3d(0, 0, 0);    }    100% {      transform: scale3d(1, 1, 1);    }  }  @-webkit-keyframes zoomIn {    0% {      -webkit-transform: scale3d(0, 0, 0);    }    100% {      -webkit-transform: scale3d(1, 1, 1);    }  }  @keyframes zoomOut {    0% {      transform: scale3d(1, 1, 1);    }    100% {      transform: scale3d(0, 0, 0);      display: none;    }  }  @-webkit-keyframes zoomOut {    0% {      -webkit-transform: scale3d(1, 1, 1);    }    100% {      -webkit-transform: scale3d(0, 0, 0);      display: none;    }  }}@media (min-width: 576px) {  .red-line {    background-color: #FD0000;    width: 0.4rem;    height: 1px;    border-radius: 0.5px;    border: 1px solid #FD0000;  }  .particle-left {    position: absolute;    top: 0;    bottom: 0;    left: 0;    width: calc(50% - 5rem);    z-index: 2;  }  .particle-right {    position: absolute;    top: 0;    right: 0;    bottom: 0;    width: calc(50% - 6.2rem);    z-index: 2;  }  .service-box {    margin-top: 1.6rem;  }  .service-ul li {    text-align: center;    width: 5.46rem;    box-sizing: border-box;  }  .service-ul li:nth-of-type(3n) {    padding-right: 0;  }  .service-ul li:nth-of-type(4) {    margin-top: 2.12rem;  }  .service-ul li:nth-of-type(5) {    margin-top: 2.12rem;  }  .service-ul li:nth-of-type(6) {    margin-top: 2.12rem;  }  .service-ul li img {    width: 1.28rem;  }  .service-ul li h4 {    margin-top: 0.64rem;    font-weight: 400;    font-size: 0.4rem;  }  .service-ul li p {    text-align: left;    font-size: 0.32rem;    color: #929292;    margin-top: 0.58rem;    line-height: 0.6rem;  }  .trust {    margin-top: 2.4rem;    padding-bottom: 1rem;  }  .trust-title {    font-size: 0.8rem;  }  .trust-box {    margin-top: 0.6rem;  }  .trust-ul li {    width: 6.56rem;    box-sizing: border-box;    text-align: center;    position: relative;    overflow: hidden;    cursor: pointer;  }  .trust-ul li:nth-of-type(4) {    margin-top: 0.2rem;  }  .trust-ul li:nth-of-type(5) {    margin-top: 0.2rem;  }  .trust-ul li:nth-of-type(6) {    margin-top: 0.2rem;  }  .project {    border: 1px solid #E0E0E0;    padding-bottom: 0.72rem;  }  .project img {    width: 2.7rem;    height: 2.7rem;    margin-top: 0.82rem;    border-radius: 1.36rem;  }  .project h3 {    font-weight: 500;    font-size: 0.44rem;    margin-top: 0.96rem;  }  .project p {    color: #666666;    font-size: 0.28rem;    line-height: 0.4rem;    margin: 0.4rem 0 0.2rem 0;  }  .detail-mask {    position: absolute;    bottom: 0;    left: 0;    width: 100%;    right: 0.16rem;    height: 100%;    transition: all 0.3s;    -webkit-transition: all 0.3s;    text-align: center;    background-color: #ffffff;    border: 1px solid #E0E0E0;  }  .detail-mask div {    width: 100%;    overflow: auto;    height: calc(100% - 3px);    padding: 0 0.36rem;    box-sizing: border-box;  }  .detail-mask div::-webkit-scrollbar {    width: 5px;    height: 0;  }  .detail-mask div::-webkit-scrollbar-thumb {    width: 5px;    background-color: #f5f5f5;    border-radius: 3px;  }  .detail-mask h3 {    font-weight: 500;    font-size: 0.44rem;    line-height: 0.6rem;    margin-top: 0.6rem;  }  .detail-mask h4 {    font-size: 0.28rem;    line-height: 0.64rem;    color: #4a4a4a;    font-weight: 400;    margin-top: 0.36rem;  }  .detail-mask p {    text-align: left;    margin: 0.56rem 0 0.32rem 0;    font-size: 0.32rem;    color: #4a4a4a;    line-height: 0.64rem;  }  .detail-mask .gradient-line {    position: absolute;    left: 0;    bottom: 0;    width: 100%;    height: 3px;    background: linear-gradient(to right, #fc801b, #ff250f);  }}@media (max-width: 575px) {  /* .banner-swiper {    height: 4.88rem;  } */  .banner-swiper .banner-item1 {    background-image: url('../images/banner1.png');  }  .banner-swiper .banner-item2 {    width: 100%;    background-image: url('../images/banner3.png');  }  .banner-swiper .banner-item3 {    width: 100%;  }  .banner-item3-pc {    display: none;  }  .circle-box {    position: absolute;    left: 50%;    bottom: 0.2rem;    width: 100%;    text-align: center;    transform: translate(-50%);  }  .circle-box span {    width: 0.1rem;    height: 0.1rem;    background-color: #ffffff;    border-radius: 4px;  }  .circle-box span.active {    width: 0.25rem;  }  .circle-box span:nth-of-type(2) {    margin-left: 0.13rem;  }  .service {    margin: 1rem auto 0;    max-width: 6.22rem;  }  .more-button {    text-align: center;  }  .more-button .button {    display: inline-block;    width: 2.82rem;    line-height: 0.64rem;    color: #FD0000;    font-size: 0.28rem;    border: 1px solid #FD0000;    border-radius: 0.1rem;  }  .more-button .button:active {    background-color: #eeeeee;  }  .container-title h2 {    font-size: 0.48rem;    display: inline-block;    font-weight: 600;  }  .container-title h3 {    font-size: 0.24rem;    margin-left: 0.2rem;    display: inline-block;    color: #8a8a8a;    font-weight: 300;  }  .case {    margin-top: 1.2rem;  }  .case .case-title {    margin: 0 0.66rem;  }  .case .pc-case-box {    margin-top: 0.46rem;  }  .case .pc-case-ul li {    width: 50%;    height: 2rem;  }  .case .pc-case-ul .more {    text-align: center;  }  .case .pc-case-ul .button {    display: inline-block;    width: 100%;    line-height: 2rem;    color: #FD0000;    font-size: 0.32rem;    background-color: #F5F5F5;    cursor: pointer;  }  .case .pc-case-ul .button:active {    background-color: #eeeeee;  }  .team {    margin: 1.2rem 0.66rem 0 0.66rem;  }  .team .team-introd {    font-size: 0.28rem;    margin-top: 0.64rem;  }  .team .team-introd p {    text-indent: 2em;    color: #4A4A4A;    line-height: 0.4rem;    margin-top: 0.5rem;  }  .team .team-introd p:nth-of-type(1) {    margin-top: 0;  }  .team .join-us {    margin-top: 0.7rem;  }  .team .company-swiper {    margin-top: 37px;  }  .team .swiper-wrapper {    padding-bottom: 24px;  }  .team .swiper-pagination-bullet-active {    background-color: #FD1717;  }  .pri-val {    margin: 1.2rem auto 0;    max-width: 6.24rem;  }  .pri-val .title {    font-size: 0.4rem;    line-height: 0.56rem;  }  .pri-val .content {    margin-top: 0.64rem;    font-size: 0.28rem;    line-height: 0.48rem;    color: #4A4A4A;  }  .pri-val .principle p {    margin-top: 0.64rem;  }  .pri-val .principle p:first-child {    margin-top: 0;  }  .pri-val .principle span {    display: block;  }  .pri-val .value {    margin-top: 1.2rem;  }  .pri-val .value .team-culture {    font-size: 0.4rem;    line-height: 0.56rem;  }  .customer {    margin: 1.1rem auto 1.1rem;    max-width: 6.2rem;  }  .customer .title {    line-height: 0.56rem;    font-size: 0.4rem;    font-weight: 400;  }  .customer .company-logo-wall {    margin-top: 0.86rem;  }  .customer li {    width: 33.3%;    height: auto;    margin: 0.24rem 0;  }  .customer li img {    width: 100%;    height: 100%;  }}@media (min-width: 576px) {  .target-fix {    position: relative;    top: -1.6rem;    height: 0;    overflow: hidden;  }  .mobile-style {    display: none;  }  .container {    max-width: 20.08rem;    margin: 0 auto;  }  .swiper-box .arrow {    position: absolute;    max-width: 20rem;    width: 100%;    height: 1.2rem;    top: 50%;    left: 50%;    z-index: 3;    transform: translate3d(-50%, -50%, 0);    -webkit-transform: translate3d(-50%, -50%, 0);  }  .swiper-box .arrow img {    width: 0.6rem;    height: 1.2rem;    position: absolute;  }  .swiper-box .arrow .left {    left: 0;    cursor: pointer;  }  .swiper-box .arrow .right {    right: 0;    cursor: pointer;  }  .swiper-box .circle-box {    position: absolute;    left: 50%;    bottom: 0.4rem;    width: 100%;    text-align: center;    transform: translate(-50%);  }  .swiper-box .circle-box span {    width: 0.2rem;    height: 0.2rem;    background-color: #ffffff;    border-radius: 4px;  }  .swiper-box .circle-box span.active {    width: 0.5rem;  }  .swiper-box .circle-box span:nth-of-type(2) {    margin-left: 0.26rem;  }  /* .banner-swiper {    height: 10rem;    max-height: 500px;  } */  .banner-swiper .copywriting {    position: absolute;    left: 50%;    top: 50%;    transform: translate(-50%, -50%);    background-repeat: no-repeat;    background-size: 100% 100%;  }  .banner-swiper .bg-bitmap {    position: absolute;    background-repeat: no-repeat;    background-size: 100% 100%;  }  .banner-swiper .banner-item1 {    width: 100%;    background-image: url('../images/bg1.png');    position: relative;  }  .banner-swiper .banner-item1 .copywriting {    width: 8rem;    height: 5.82rem;    max-width: 400px;    max-height: 291px;    background-image: url('../images/bg1-copywriting.png');  }  .banner-swiper .banner-item1 .bg-bitmap {    left: 50%;    bottom: 0.26rem;    transform: translateX(-50%);    width: 8.94rem;    height: 7.32rem;    max-width: 447px;    max-height: 366px;    background-image: url('../images/bg1-bitmap.png');  }  .banner-swiper .banner-item2 {    width: 100%;    overflow: hidden;    background-image: url('../images/bg2.png');    position: relative;  }  .banner-swiper .banner-item2 .copywriting {    width: 8rem;    height: 5.74rem;    max-width: 400px;    max-height: 287px;    background-image: url('../images/bg3-copywriting.png');  }  /* .banner-swiper .banner-item2 .bg-bitmap {    top: 50%;    left: 50%;    transform: translate(-50%, -50%);    width: 8.48rem;    height: 8.04rem;    max-width: 424px;    max-height: 402px;    background-image: url('../images/bg2-bitmap.png');  } */  .banner-swiper .banner-item3 {    width: 100%;  }  .banner-item3-h5 {      display: none;  }  .more-button {    text-align: center;    margin-top: 1rem;  }  .more-button .button {    display: inline-block;    width: 2.88rem;    line-height: 1rem;    color: #FD0000;    font-size: 0.32rem;    border: 1px solid #FD0000;    border-radius: 0.1rem;    cursor: pointer;  }  .more-button .button:active {    background-color: #eeeeee;  }  .container-title h2 {    font-weight: 600;    font-size: 1.28rem;    line-height: 1.8rem;  }  .container-title h3 {    font-weight: 300;    font-size: 0.72rem;    line-height: 1rem;  }  .service {    margin-top: 2.08rem;  }  .case {    margin-top: 2.6rem;  }  .case .pc-case-box {    margin-top: 1.4rem;  }  .case .pc-case-ul li {    width: 33.3%;    height: 3.56rem;  }  .case .pc-case-ul .more {    margin-top: 1rem;    text-align: center;    width: 100%;    height: 1rem;  }  .case .pc-case-ul .more .button {    display: inline-block;    width: 2.88rem;    line-height: 1rem;    box-sizing: border-box;    border: 1px solid #FD0000;    color: #FD0000;    font-size: 0.4rem;    border-radius: 0.2rem;    cursor: pointer;  }  .case .pc-case-ul .more .button:active {    background-color: #eeeeee;  }  .team {    margin-top: 2rem;  }  .team .team-introd {    margin-top: 1.6rem;    font-size: 0.4rem;  }  .team .team-introd p {    margin-top: 0.6rem;    text-indent: 2em;    line-height: 0.56rem;    color: #4A4A4A;  }  .team .team-introd p:nth-of-type(1) {    margin-top: 0;  }  .team .join-us {    margin-top: 0.8rem;  }  .team .swiper-slide {    width: 33.33%;    margin-right: 10px;  }  .team .company-swiper {      margin-top: 82px;  }  .team .swiper-slide:last-of-type {    margin-right: 0;  }  .pri-val {    margin: 2rem auto 0;  }  .pri-val .title {    font-size: 0.8rem;  }  .pri-val .content {    margin-top: 0.96rem;    font-size: 0.4rem;    color: #4A4A4A;    line-height: 0.8rem;  }  .pri-val .principle {    max-width: 9.64rem;    margin-right: 3.76rem;  }  .customer {    max-width: 20.6rem;    margin: 4.36rem auto 0.28rem;  }  .customer .title {    line-height: 1.12rem;    font-size: 0.8rem;    font-weight: 400;  }  .customer .company-logo-wall {    margin-top: 0.7rem;  }  .customer li {    width: 4.1rem;    height: auto;    margin: 0.48rem 0 0.48rem 0;  }  .customer li img {    width: 100%;    height: 100%;  }}