@charset "utf-8";
@media screen and (min-width:1921px){
  :root{
    font-size: 20px;
  }
}
@media screen and (max-width:1680px){
  :root{
    font-size: 14px;
  }
}
@media screen and (max-width:1440px){
  :root{
    font-size: 12px;
  }
}
@media screen and (max-width:1280px){
  
}
@media screen and (max-width:1024px){
  :root{
    font-size: 14px;
  }
  header{ padding: 5vw;}
  header .logo a img{ height: 1rem;}
  nav{ display: none;}
  .hamburger-btn{ display: flex;}
  
  .slideshow swiper-container swiper-slide .slide-inner .font{ width: 100%;}
  .slideshow swiper-container swiper-slide .slide-inner .font h1{ font-size: 1.65rem;}
  .slideshow swiper-container swiper-slide .slide-inner .font h2{ font-size: 1.25rem;}

  .slideshow .swiper-arrow{ display: none;}

  .row{ grid-gap: 5vw;}
  .row .row-tit .desc br{ display: none;}
  .row .row-tit .cn{ font-size: 1.5rem;}

  .vrshow{ padding: 10vw 0 10vw 5vw;}
  .vrshow .row{ grid-template-columns: 1fr;}
  
  .vrshow swiper-container swiper-slide{ width: 75vw;}

  .product{ padding-top: 10vw;}
  .product .row{ grid-gap: 5vw;}
  .pro-swiper swiper-slide .itm{ height: 150vw;}
  .pro-tit-swiper{ left: 5vw; width: 100%; overflow: hidden;}
  .pro-tit-swiper swiper-slide{ font-size: 1.125rem;}
  .pro-tit-swiper swiper-slide.swiper-slide-thumb-active:before{ height: 1.25em;}
  .pro-tit-swiper swiper-slide span{ font-size: 1.125rem; line-height: 1.5;}
  .product .swiper-arrow{ display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 0 5vw; top: 50%; right: 0; bottom: auto;}

  .case{ padding: 10vw 5vw;}
  .case .row{ grid-template-columns: 1fr;}
  .case .row .row-tit{ position: relative; grid-column: span 1; grid-row: 1 / 2;}
  .case .row .row-tit .other{ margin: 5vw 0 2.5vw;}
  .case .row .row-tit .other b{ font-size: 3.5rem;}
  .case .row .row-tit .more{ position: absolute; right: 0; bottom: 5vw;}
  .case .row .row-con{ grid-column: span 1; grid-row: 2 / 3;}

  .service{ padding: 10vw 0 0 0;}
  .service .row{ grid-template-columns: 1fr;}
  .service .row .row-tit{ padding: 0 5vw;}
  .service swiper-container swiper-slide .itm{ border: none;}
  .service swiper-container swiper-slide .itm:before{ backdrop-filter:blur(0);}
  .service swiper-container swiper-slide .itm .info{ padding: 20vw 5vw 0;}
  .service swiper-container swiper-slide .itm .info .ico{ width: 24vw; height: 24vw; font-size: 1.25rem;}
  .service swiper-container swiper-slide .itm .info .ico img{ width: 10vw; height: 10vw;}
  .service swiper-container swiper-slide .itm .info .tit{ font-size: 1.25rem;}
  .service swiper-container swiper-slide .itm .info .dsc br{ display: none;}

  footer{ background-size: 60vw;}
  .footer{ padding: 10vw 5vw; grid-gap: 5vw;}
  .footer:after{ display: none;}
  .footer .nav-bottom{ display: none;}
  .footer .contact{ grid-column: span 12; grid-gap: 0;}
  .footer .contact .logo{ grid-row: span 2; padding-bottom: 0;}
  .footer .contact .logo img{ height: 1.25rem;}
  .footer .contact .phone{grid-column: 2 / 3;}
  .footer .contact .email{grid-column: 2 / 3;}
  .footer .qrcode{ grid-column: span 12; grid-template-columns: repeat(4,1fr);}
  .footer .qrcode .itm .info{ display: none;}
  .footer .menu-overlay-bottom{ display: flex;}
  .copyright{ padding: 0 5vw 10vw;}
  .copyright p{ grid-column: span 12;}
  .copyright:after{ grid-column: span 12; text-align: left;}

  /* sub */
  .banner{ height: 56.25vw;}
  .banner .cover h1{ font-size: 1.25rem; padding: 0 5vw;}
  .banner .bread{justify-content:stretch; padding: 0;}
  .banner .bread .tab{ display: block; white-space: nowrap; width: 100%; gap: 0; overflow-x: auto;}
  .banner .bread .tab li{ display: inline-block; width: auto;}
  .banner .bread .tab a{ padding: 0.75em 1em;}
  .banner .location{ display: none;}
  
  .page-about{ padding: 5vw 5vw calc(5vw + 56.25vw);}
  .page-about .about-title{ grid-column: span 12;}
  .page-about .content{ grid-column: span 12;}
  
  .about-title{ grid-gap: 5vw;}
  .about-title .cn{ font-size: 1.5rem; text-indent: .5em;}
  .about-title .cn:before{ top: calc(50% - .25rem); width: 0.5rem; height: 0.5rem;}
  .about-title .en{ font-size: 2rem;}
  .about-title .desc{ font-size: 1.25rem;}

  .page-history .content swiper-container{ padding: 5vw 0 10vw;}
  .page-history .content .itm{ padding: 0 2.5vw 5vw 5vw;}
  .page-history .content .itm::before{ width: 0.5rem; height: 0.5rem;}
  .page-history .content .itm::after{ left: calc(.25rem - .5px);}
  .page-history .content .itm .year{ font-size: 2rem;}

  .page-list{ padding: 5vw;}
  .list-picture{ grid-template-columns: 1fr; grid-gap: 5vw;}
  .list-picture .itm{ grid-gap: 0.5rem;}
  .pagination{ grid-template-columns: repeat(2,1fr); grid-gap: 30%;}
  .pagination .button{ padding: .5em 0;}
  .pagination .num{ display: none;}

  .list-news .itm{ grid-template-columns: 1fr; grid-gap: 1rem;}
  .list-news .itm .info{ padding: 0;}
  .list-news .itm .info h4{ font-size: 1.25rem; line-height: 1.25;}
  .list-news .itm .info p{ margin: 0.5rem 0;}
  .list-news .itm .info b{ position: relative;}

  .page-service{ grid-gap: 5vw; padding: 5vw;}
  .page-service .svc-tit{ grid-column: span 12; grid-gap: 5vw;}
  .page-service .svc-row .svc-tit{ padding-top: 0; background: none;}
  .page-service .svc-cover{ grid-column: span 12;}
  .svc-list{ grid-gap: 5vw;}
  .svc-list .cover-xxl span{ font-size: 1.25rem; top: calc(50% - 1.5em); left: calc((100% - 13em) / 2);}
  .svc-list .cover-xxl span h4{ font-size: 1.25rem;}
  .svc-list .cover-xxl span h5{ font-size: 1rem;}
  .svc-list .cover-l{ grid-column: span 3;}
  .svc-list .cover-l span{ padding: .5em 0 0 0; font-size: 1rem;}
  .svc-list .cover-l span:before{ top: 50%;}

  .page-service .svc-row{ grid-gap: 5vw;}
  .svc-list .cover-xl{ grid-column: span 2;}

  .page-service.package .svc-tit{ grid-column: span 12;}
  .page-service.package .svc-cover{ grid-column: span 12;}

  .page-service-cases .cover{ padding-bottom: calc(100% / 4 * 3);}
  .page-service-cases-thumb .cover{ padding-bottom: calc(100% / 4 * 3);}
  
  .page-join .join-row{ padding: 5vw; grid-gap: 5vw;}

  .join-list-1{ grid-template-columns: repeat(2,1fr); grid-template-rows: auto; border: none;}
  .join-list-1 li{ padding: 5vw 3vw 10vw}
  .join-list-1 li:nth-child(1),
  .join-list-1 li:nth-child(4),
  .join-list-1 li:nth-child(5),
  .join-list-1 li:nth-child(8){ background: url('../img/join-list.webp') right 1.25vw bottom 1.25vw no-repeat #fafafa;}
  .join-list-1 li:nth-child(2),
  .join-list-1 li:nth-child(3),
  .join-list-1 li:nth-child(6),
  .join-list-1 li:nth-child(7){ background: url('../img/join-list.webp') right 1.25vw bottom 1.25vw no-repeat #fff;}
  .join-list-1 .ico{ width: 25vw; height: 25vw;}
  .join-list-1 .ico img{ width: 10vw; height: 10vw;}
  .join-list-1 .tit{ font-size: 1.25rem;}
  .join-list-1 .dsc br{ display: none;}
  
  .accordion-container{ grid-column: span 12;}
  .accordion-container .content-inner{ padding: 1rem;}
  .accordion-cover{ grid-column: span 12;}

  .join-list-2{ grid-template-columns: 1fr; grid-gap: 2.5vw;}
  .join-list-2:after{ display: none;}
  .join-list-2 li{ grid-template-rows: auto;}
  .join-list-2 .num{ display: none;}

  .page-contact{ grid-template-columns: 1fr; grid-gap: 5vw; padding: 5vw;}
  .gbook-list{ grid-gap: 2.5vw; padding: 5vw;}
}