.pc-box {
  display: block;
}

.phone-box {
  display: none;
}

.strategy3 .map .map_swiper .swiper .swiper-wrapper {
  align-items: flex-end;
}

@media (max-width: 1024px) {
  .w1400 {
    width: 100%;
    max-width: 90%;
  }

  .pc-box {
    display: none;
  }

  .phone-box {
    display: block;
  }

  .banner .banner-img {
    height: 127.467vw;
  }

  .about .ani-box {
    height: auto;
  }

  .pos-center {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 21px;
  }

  .side-tit {
    font-size: 26px;
  }

  .about .box1 {
    position: relative;
    padding: 80px 0;
  }

  .about .box1 .tit {
    width: 100%;
    font-size: 26px;
    margin-bottom: 30px;
  }

  .about .box1 .container {
    margin-top: 0;
    flex-direction: column;
  }

  .about .box1 .lf {
    width: 100%;
    margin-bottom: 40px;
  }

  .about .box1 .lf::after {
    display: none;
  }

  .about .box1 .box1-swiper .swiper-slide img {
    transform: translateY(0);
  }

  .about .box1 .lf .item {
    bottom: auto;
    padding: 0;
    top: 0;
  }

  .about .box1 .lf .item .txt {
    margin-top: 20px;
  }

  .about .box1 .lf .item.show {
    position: relative;
  }

  .about .box1 .rg {
    width: 100%;
  }

  .about .box1 .box1-swiper .swiper-slide {
    height: auto;
    aspect-ratio: 976 / 668;
  }

  .about .box1 .rg .swiper-pagination {
    display: none;
  }

  .about .ani-box2 {
    height: auto;
    position: static;
  }

  .about .box2 {
    padding: 80px 0;
    height: auto;
    position: relative;
  }

  .about .box2 .line {
    width: 100%;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    position: relative;
    background-color: transparent;
  }

  .about .box2 .line .phone-box {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px solid var(--logoColor);
    margin-right: 3px;
    position: relative;
  }

  .about .box2 .line .phone-box::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50%;
    height: 50%;
    border-radius: 50%;
    background-color: var(--logoColor);
  }

  .about .box2 .swiper-box::after {
    display: none;
  }

  .about .box2 .swiper-box::before {
    display: none;
  }

  .about .box2 .line .line-bar {
    /*width: 100%;*/
    position: relative;
    flex: 1;
    height: 2px;
    background-color: rgba(51, 51, 51, 0.3);
  }

  .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--logoColor) !important;
  }

  .about .box2 .box2-swiper {
    height: auto;
    padding-bottom: 50px;
  }

  .about .box2 .box2-swiper .swiper-button-prev,
  .about .box2 .box2-swiper .swiper-button-next {
    display: flex !important;
    top: auto !important;
    bottom: 3px;
  }

  .about .box2 .box2-swiper .swiper-button-prev {
    left: 50%;
    transform: translateX(-120%);
  }

  .about .box2 .box2-swiper .swiper-button-next {
    right: 50%;
    transform: translateX(120%);
  }

  .about .box2 .box2-swiper .swiper-button-next {}

  .about .box2 .box2-swiper .swiper-button-prev::after,
  .about .box2 .box2-swiper .swiper-button-next::after {
    font-size: 0.3rem;
  }

  .about .box2 .box2-swiper .swiper-slide {
    display: flex;
    overflow: hidden;
    height: auto;
    flex-direction: column !important;
    justify-content: flex-start !important;
    overflow: hidden;
    margin-bottom: 0;
  }

  .about .box2 .box2-swiper .swiper-slide .year {
    position: relative;
    width: 100%;
    line-height: 1;
    height: auto;
    text-align: center;
    left: 0 !important;
    top: 0 !important;
    right: 0 !important;
    transform: none;
    font-size: 30px;
    margin-bottom: 20px;
  }

  .about .box2 .box2-swiper .swiper-slide .intro {
    width: 100%;
    flex: 1;
    font-size: 16px;
    display: flex;
    align-items: center;
  }

  .about .box3 {
    position: relative;
    padding: 0;
    flex-direction: column-reverse;
    height: auto;
  }

  .about .box3 .bg {
    position: relative;
    width: 100%;
    height: auto;
    aspect-ratio: 1920 / 1080;
  }

  .about .box3 .pos-cont {
    flex-direction: column;
    padding: 60px 0;
    opacity: 1;
    transform: none;
  }

  .about .box3 .pos-cont .lf {
    width: 100%;
    color: #333;
  }

  .about .box3 .pos-cont .lf p {
    color: #333;
    font-size: 26px;
    margin-bottom: 30px;
  }

  .about .box3 .pos-cont .rg {
    width: 100%;
  }

  .about .box3 .pos-cont .rg .intro {
    color: #333;
    font-size: 16px;
  }

  .main-more {
    background-color: var(--logoColor);
    color: #fff;
    width: fit-content;
    height: auto;
    padding: 5px 10px;
  }

  .about .box4 .box4-swiper .swiper-slide {
    width: 90%;
    height: auto;
  }

  .about .box4 {
    padding: 80px 0;
  }

  .about .box4 .box4-swiper .swiper-slide .intro .eyes {
    height: auto;
    position: relative;
  }

  body .side-swiper .swiper-pagination .swiper-pagination-current {
    font-size: 12px;
  }

  body .side-swiper .swiper-pagination {
    font-size: 12px;
  }

  .about .box4 .tab span {
    width: fit-content;
    height: auto;
    line-height: 1.5;
    padding: 5px 10px;
  }

  .strategy1 {
    padding: 80px 21px 0;
  }

  .strategy1 .tit {
    font-size: 26px;
    margin-bottom: 30px;
  }

  .strategy1 .p {
    width: 100%;
    font-size: 16px;
  }

  .strategy2 .swiper {
    height: auto;
    background-color: #f6f6f6;
  }

  .strategy2 .swiper .swiper-slide {
    flex-direction: column-reverse;
    height: auto;
  }

  .strategy2 .swiper .swiper-slide .text {
    padding: 80px 21px 30px;
  }

  .strategy2 .swiper .swiper-slide .img {
    width: 100%;
  }

  .strategy2 .swiper .swiper-slide .text .h1 {
    font-size: 26px;
    margin-bottom: 30px;
  }

  .strategy2 .swiper .swiper-slide .text .p1 {
    font-size: 16px;
  }

  .strategy2 .swiper .swiper-slide .text .swiper-pagination .swiper-pagination-bullet {
    width: 20px;
  }

  .strategy3 {
    padding: 80px 0;
  }

  .strategy3 .tit {
    margin: 0;
    width: 100%;
    padding: 0 21px;
    font-size: 26px;
    margin-bottom: 30px;
  }

  .strategy3 .map .map_swiper {
    position: relative;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding: 0 21px;
    margin-bottom: 30px;
  }

  .strategy3 .map .map_swiper .swiper {
    /*width: 100%;*/
    width: auto;
  }

  .strategy3 .map .map_anno {
    position: relative;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: auto;
    margin: 0 21px;
  }

  .strategy2 .swiper .swiper-slide .text .p1 {
    margin-bottom: 20px;
    line-height: 26px;
    height: 156px;
    overflow: auto;
    padding-right: 8px;

  }

  .strategy3 .map .map_swiper .swiper {
    box-shadow: 0 0 0;
  }

  .strategy3 .map .map_box {
    margin-bottom: 30px;
  }

  .govern1 {
    /*padding: 80px 0;*/
    padding: 0;
  }

  .govern1 .govern1_cont {
    padding: 80px 21px 0;
  }

  .govern1 .govern1_cont .tit {
    width: 100%;
    font-size: 26px;
    margin-bottom: 30px;
  }

  .govern1 .govern1_cont .list_box {
    flex-direction: column;
  }

  .govern1 .govern1_cont .list_box .img {
    width: 100%;
    height: auto;
    margin: 0 0 20px 0;
  }

  .govern1 .govern2_cont {
    padding: 80px 5%;
  }

  .govern1 .govern2_cont .list {
    flex-direction: column;
    align-items: center;
  }

  .govern1 .govern2_cont .list .item {
    width: 100%;
    margin: 0;
    margin-bottom: 20px;
    height: auto;
  }

  .business .ani-box {
    height: auto;
  }

  .business .box1 {
    position: relative;
    overflow: hidden;
    padding: 80px 0;
  }

  .business .box1 .cont {
    margin-bottom: 30px;
    font-size: 16px;
  }

  .business .box1 .box1-swiper {
    margin-top: 0;
  }

  .business .box1 .box1-swiper .swiper-slide {
    width: 80%;
    height: auto;
  }

  .business .box1 .box1-swiper .swiper-slide .h {
    text-align: center;
  }

  .business .box1 .box1-swiper .swiper-slide .icon {
    height: auto;
    aspect-ratio: 310 / 98;
  }

  .business .box1 .box1-swiper .swiper-slide .icon img {
    width: 100%;
  }

  .business .box2 {
    padding: 80px 0 0;
  }

  .business .box2 .main-tit {
    padding: 0 21px;
  }

  .business .box2 .sub {
    padding: 0 21px;
  }

  .business .box3 {
    padding: 0;
  }

  .business .box3 .li-box .li {
    flex-direction: column-reverse;
    margin: 0;
  }

  .business .box3 .li-box .li .pic {
    width: 100%;
    height: auto;
    overflow: hidden;
    aspect-ratio: 2 / 1;
  }

  .business .box3 .li-box .li .cont {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    transform: none;
    height: auto;
    padding: 80px 21px 30px;
  }

  .business .box3 .li-box .li:nth-child(2n) .cont {
    left: 0;
  }

  .business .box3 .wrap {
    margin-top: 0;
    padding: 30px 21px;
  }

  .business .box3 .item-box .item {
    width: 47%;
    margin-right: 6%;
    margin-bottom: 5%;
  }

  .business .box3 .item-box .item:nth-child(3n) {
    margin-right: 3%;
  }

  .business .box3 .item-box .item:nth-child(2n) {
    margin-right: 0;
  }

  .business .box4 {
    padding: 80px 0;
  }

  .business .box4 .wrap {
    flex-direction: column;
  }

  .business .box4 .tit {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    padding: 0;
  }

  .business .box4 .box4-swiper {
    transform: none;
  }

  .business .box4 .box4-swiper .swiper-slide {
    width: 80%;
    margin-right: 20px;
    height: auto;
  }

  .service .box1 {
    padding: 80px 0;
  }

  .service .box1 .wrap {
    padding: 0 21px;
  }

  .service .box1 .pos-cont {
    display: none;
  }

  .service .box1 .item--box-container {
    overflow-x: auto;
    width: 100%;
    padding: 30px;
  }

  .service .box1 .item--box-container::-webkit-scrollbar {
    height: 2px;
  }

  .service .box1 .item--box-container::-webkit-scrollbar-thumb {
    background-color: var(--logoColor);
  }

  .service .box1 .li-box .li {
    width: 100%;
    margin-right: 0;
    padding: 21px 10px;
    margin-top: 1.25rem;
  }

  .service .box1 .li-box .li>div {
    width: 100%;
  }

  .service .box2 {
    display: flex;
    padding: 0;
    flex-direction: column-reverse;
  }

  .service .box2 .wrap {
    padding: 80px 21px 30px;
  }

  .service .main-tit.white {
    color: #333;
  }

  .service .box2 .cont {
    margin: 0;
    color: #333;
  }

  .service .box2 .bg {
    position: relative;
    width: 100%;
    height: auto;
    aspect-ratio: 2 / 1;
  }

  .service .box1 .item-box {
    width: 260%;
    aspect-ratio: 6 / 1;
    margin: 0;
  }

  .service .box1 .item-box::after {
    width: 100%;
    top: 18%;
    height: auto;
    aspect-ratio: 2054 / 233;
  }

  .service .box1 .item-box .item {
    /*.*/
    width: 8%;
    font-size: 74%;
    height: auto;
    aspect-ratio: 1 / 1;
    padding: 0;
  }

  .supply .box1 {
    padding: 0;
  }

  .supply .box1 .li-box {
    flex-direction: column;
  }

  .supply .box1 .li {
    display: flex;
    margin-bottom: 0;
    flex-direction: column-reverse;

  }

  .supply .box1 .li .pic {
    width: 100%;
    height: auto;
    overflow: hidden;
    aspect-ratio: 2 / 1;
  }

  .supply .box1 .li .intro .num-box .item {
    margin-bottom: 20px;
  }

  .supply .box1 .li .intro {
    width: 100%;
    padding: 80px 21px 30px;
  }

  .supply .box1 .li .intro .cont {
    margin-top: 0;
  }

  .supply .box1 .li .intro .num-box .item {
    width: 48%;
    margin-right: 4%;
  }

  .supply .box1 .li .intro .num-box .item:nth-child(3n) {
    margin-right: 4%;
  }

  .supply .box1 .li .intro .num-box .item:nth-child(2n) {
    margin-right: 0%;
  }

  .supply .box2 {
    padding: 0;
    display: flex;
    flex-direction: column-reverse;
  }

  .supply .box2 .wrap {
    padding: 60px 0 30px;
    flex-direction: column;
  }

  .supply .box2 .wrap .lf {
    width: 100%;
    padding: 0 21px;
    margin-bottom: 20px;
  }

  .supply .box2 .wrap .rg {
    width: 100%;
  }

  .supply .box2 .bg {
    width: 100%;
    height: 100%;
    background-size: cover;
  }

  .supply .box3 {
    padding: 80px 0 0;
  }

  .supply .box3 .wrap {
    flex-direction: column;
  }

  .supply .box3 .lf .item {
    padding: 0 21px 30px;
    margin-bottom: 0;
  }

  .supply .box3 .lf {
    width: 100%;
  }

  .supply .box3 .rg {
    width: 100%;
    padding-bottom: 50px;
  }

  .supply .box3 .rg .box3-swiper .swiper-slide {
    width: 85%;
  }

  .supply .box3 .rg .swiper-button-prev {
    display: none;
  }

  .supply .box3 .rg .swiper-button-next {
    display: none;
  }

  .supply .box4 {
    padding: 80px 0;
  }

  .supply .box4 .li-box .li {
    position: static;

    flex-direction: column;
  }

  .supply .box4 .li-box .li .intro {
    width: 100%;
    padding: 0;
    margin-bottom: 30px;
  }

  .supply .box4 .li-box .li .pic {
    border-radius: 0;
    width: 100%;
    opacity: 1;
  }
  
  .supply .box4 .li-box .li .pic img {
      opacity: 1;
  }

  .govern1 .govern1_cont .list_box .list {
    width: 100%;
  }

  .service .box2 .wrap {
    padding-top: 0;
  }

  .about .box4 .box4-swiper .swiper-slide .intro .eyes {
    margin-top: 20PX;
    position: static
  }
}