@media (max-width: 1380px) {
  .action--site-join_us .sec5 .item {
    aspect-ratio: 0.9;
  }

  .contact-sec .right .item {
    margin-bottom: 50px;
  }
}

@media (max-width: 1080px) {

  .header-r .nav,
  .header-r .search {
    display: none;
  }

  .mobile-nav {
    display: block;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .08);
  }

  .mobile-nav .ph_l {
    width: 61%;
    height: 100%;
    position: fixed;
    top: 80px;
    left: -61%;
    z-index: 1120;
    overflow: hidden;
    background: #fff;
    color: rgba(255, 255, 255, .6);
    transition: left .3s;
    box-shadow: 0 -1px 4px rgba(0, 0, 0, .08);
  }

  .mobile-nav .ph_r {
    display: block;
    width: 40%;
    height: 100%;
    background: rgba(0, 0, 0, .6);
    position: fixed;
    right: -40%;
    top: 80px;
    z-index: 1101;
    transition: right .3s;
    box-shadow: 0 -1px 4px rgba(0, 0, 0, .08);
  }

  .ph_l ul li {
    border-bottom: 1px solid #ccc;
    position: relative;
  }

  .ph_l ul li a {
    padding: 20px;
    color: #000;
  }

  .ph_l ul .mobile-nav_secont {
    margin-left: 5px;
  }

  .ph_l ul .mobile-nav_secont a {
    padding: 10px;
  }

  .btn-head-nav-toggle {
    display: block;
    margin-left: 10px;
  }

  .sec3 .swiper-slide {
    aspect-ratio: 7 / 10;
  }

  .contact-sec .wrap {
    flex-direction: column;
  }

  .contact-sec .wrap>div {
    width: 100%;
  }

  .contact-sec .wrap .right {
    padding-left: 0;
    margin-top: 30px;
  }

  .contact-sec .mlay {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
  }

  .sec9 .data-panel .data-num {
    height: auto;
    text-align: center;
  }
}

@media (max-width: 960px) {
  .cardWrap {
    --column: 2;
  }

  .cardWrap .item:nth-child(3n) {
    margin-right: var(--gap);
  }

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

  .sec14 .items {
    flex-direction: column;
  }

  .sec14 .item {
    width: 100%;
  }

  .shop-sec1 .qr-wrap {
    flex-direction: column;
  }
}

@media (max-width: 768px) {
  .sec3 .intro .left {
    flex-direction: column;
    align-items: flex-start;
  }

  .sec3 .intro .left .switch {
    margin-top: 40px;
    margin-left: 0;
  }

  .sec3 .intro .left .switch-btn {
    flex-shrink: 0;
  }

  .footer-center {
    display: none;
  }

  .sec10 .cardWrap {
    --column: 2;
  }

  .action--site-join_us .sec10 .cardWrap .item {
    margin-bottom: calc(var(--gap) * 4);
  }

  .sec11 .wrap,.sec11 .wrap .left  {
    flex-direction: column;
  }

  .sec11 .tel{
    margin: 10px 0;
  }
}

@media (max-width: 560px) {
  .layout1 .wrap {
    flex-direction: column;
  }

  .layout1 .wrap>div {
    width: 100% !important;
  }

  .sec2 .cont {
    flex-direction: column;
  }

  .sec2 .cont>div {
    width: 100%;
  }

  .sec2 .cont .details {
    aspect-ratio: 1.95;
  }

  .sec3 .swiper {
    height: 700px;
  }

  .sec4 .wrap {
    flex-direction: column;
  }

  .sec4 .wrap>div {
    width: 100% !important;
  }

  .sec4 .wrap .right {
    margin-top: 20px;
  }

  .contact-sec .mlay {
    flex-direction: column;
    align-items: flex-start;
  }

  .submit-wrap {
    flex-direction: column;
  }

  .submit-wrap .btn-wrap {
    margin-top: 20px;
  }

  .copyright .main {
    flex-direction: column;
  }

  .sidebar {
    display: none;
  }

  .backToTop .btn-cont {
    padding: 4px;
  }

  .backToTop .btn {
    width: 24px;
    height: 24px;
    padding: 3px;
  }

  .cardWrap {
    --column: 1;
  }

  .cardWrap .item {
    margin-right: 0 !important;
  }

  .panel {
    flex-direction: column;
  }

  .panel .cont {
    width: 100%;
    margin-top: 20px;
  }

  .sec8 .wrap .pic {
    padding: 0;
  }

  .sec8 .wrap .intro {
    padding-left: 0;
    margin-top: 20px;
  }

  .sec9 .items .item {
    flex-direction: column;
  }

  .sec9 .items .item>div {
    width: 100%;
  }

  .sec9 .items .item .txt {
    padding: 0;
    margin-bottom: 20px;
  }

  .sec14 .item .data-panel {
    flex-direction: column;
  }

  .sec14 .data-num {
    width: 100%;
  }

  .sec12 .captcha-wrap {
    display: block;
  }

  .sec12 .captcha-wrap .captcha {
    width: 50%;
  }

  .sec12 .form .trisection,
  .sec12 .form .halve {
    width: 100%;
  }

  .action--site-join_us .sec10 .cardWrap {
    --column: 1;
  }

  .action--site-join_us .sec10 .cardWrap .txt {
    padding-top: 10%;
    height: 35%;
  }

  .action--site-order .order {
    flex-direction: column;
    height: auto;
    margin-bottom: 10%;
  }

  .action--site-order .order>div {
    width: 100%;
  }

  .action--site-order .order-pic {
    padding: 20% 0;
  }

  .action--site-join_us .sec10 .cardWrap .item {
    margin-bottom: var(--gap);
  }

  .video-wrap {
    width: 100%;
  }

  .sec6 .txt p {
    max-width: 80%;
  }

  .shop-sec1 .qr-wrap .qr {
    margin-right: 0;
  }
}