@media screen and (max-width: 768px) {
  .public-btn {
    padding: 10px 30px;
  }
  .public-btn .text {
    font-size: 10px;
  }
  .public-btn svg {
    margin-left: 15px;
  }
  .public-banner .banner-text {
    padding: 0 30px;
  }
  .public-title .text {
    font-size: 10px;
  }
  .public-title::after {
    bottom: -10px;
    width: 30px;
    height: 1px;
  }
  .get-more svg {
    width: 20px;
    margin-left: 15px;
  }
  header .header-container {
    padding: 20px 30px;
    background: #fff;
  }
  header .header-container .header-left {
    width: 120px;
  }
  header .header-container .header-center {
    display: none;
  }
  header .header-container .header-right {
    display: none;
  }
  header .header-container .header-mobile-btn {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 30px;
    transition: all ease 0.5s;
    cursor: pointer;
  }
  header .header-container .header-mobile-btn span {
    width: 100%;
    height: 1px;
    background: #000;
    margin-top: 5px;
    display: block;
    flex-shrink: 0;
    transition: all ease 0.5s;
  }
  header .header-container .header-mobile-btn span:first-child {
    margin-top: 0;
  }
  header .header-container .close-type span:nth-child(1) {
    transform: translate3d(0, 6px, 0) rotate(45deg);
  }
  header .header-container .close-type span:nth-child(2) {
    opacity: 0;
  }
  header .header-container .close-type span:nth-child(3) {
    transform: translate3d(0, -6px, 0) rotate(-45deg);
  }
  header .heder-mobile-show .header-main-container {
    display: block;
  }
  .heder-mobile-show .header-container .header-center {
    display: block;
    position: absolute;
    left: 0;
    top: 63px;
    width: 100%;
    height: calc(100vh - 63px);
    background: #fff;
  }
  .heder-mobile-show .header-container .header-center .nav-list {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .heder-mobile-show .header-container .header-center .nav-list .nav-item {
    margin-top: 30px;
    margin-right: 0;
  }
  .heder-mobile-show .header-container .header-center .nav-list .nav-item a {
    color: #000;
    font-size: 18px;
  }
  footer .footer-container {
    padding: 30px 30px 0 30px;
  }
  footer .footer-container .footer-top {
    flex-wrap: wrap;
    padding-bottom: 10px;
  }
  footer .footer-container .footer-top .top-left {
    width: 100%;
  }
  footer .footer-container .footer-top .top-left .desc {
    margin-top: 10px;
  }
  footer .footer-container .footer-top .top-right {
    margin-top: 20px;
    width: 100%;
  }
  footer .footer-container .footer-top .top-right input {
    padding: 10px 15px;
  }
  footer .footer-container .footer-center .center-top {
    display: none;
  }
  footer .footer-container .footer-center .center-bottom {
    margin-top: 0;
  }
  footer .footer-container .footer-center .center-bottom .link-item {
    height: 20px;
  }
  footer .footer-container .footer-bottom {
    flex-wrap: wrap;
  }
  .index-page .index1 {
    padding: 30px;
  }
  .index-page .index1 .index1-desc {
    padding: 30px 0 40px;
  }
  .index-page .index1 .index-list-container {
    padding-top: 30px;
    flex-wrap: wrap;
  }
  .index-page .index1 .index-list-container .index1-item-container {
    margin-top: 80px;
    width: 100%;
  }
  .index-page .index1 .index-list-container .index1-item-container .left-title {
    left: 20px;
    top: 20px;
  }
  .index-page .index2 {
    padding: 30px;
  }
  .index-page .index2 .index2-list-container {
    margin-top: 40px;
  }
  .index-page .index2 .index2-list-container .index2-item {
    width: 100%;
    margin-bottom: 30px;
    flex-wrap: wrap;
  }
  .index-page .index2 .index2-list-container .index2-item .index2-image {
    width: 100%;
    order: -2;
  }
  .index-page .index2 .index2-list-container .index2-item .index2-text {
    margin-left: 0;
  }
  .index-page .index2 .index2-list-container .index2-item .index2-text .title-container {
    padding-left: 30px;
  }
  .index-page .index2 .index2-list-container .index2-item .index2-text .title-container .title .no {
    left: -30px;
  }
  .index-page .index2 .index2-list-container .index2-item .index2-text .desc-container {
    padding-top: 10px;
  }
  .index-page .index2 .index2-list-container .index2-item .index2-text .index2-text-two {
    margin: 10px 0 0 20px;
  }
  .index-page .index2 .index2-list-container .index2-item .index2-text .index2-text-two .img-icon {
    width: 15px;
  }
  .index-page .index2 .index2-list-container .index2-item .index2-text .index2-image-two {
    margin-top: 10px;
    width: 80%;
  }
  .index-page .index3 {
    padding: 30px;
  }
  .index-page .index3 .index3-container .index3-type-container {
    margin-top: 40px;
    justify-content: flex-start;
  }
  .index-page .index3 .index3-container .index3-type-container .type-item {
    margin-left: 20px;
  }
  .index-page .index3 .index3-container .index3-type-container .active::before {
    bottom: -2px;
    height: 1px;
  }
  .index-page .index3 .index3-container .index3-box {
    flex-wrap: wrap;
    margin-top: 40px;
  }
  .index-page .index3 .index3-container .index3-box .left {
    width: 100%;
  }
  .index-page .index3 .index3-container .index3-box .left .date {
    padding: 10px 20px;
    right: 30px;
  }
  .index-page .index3 .index3-container .index3-box .left .year {
    padding-top: 10px;
  }
  .index-page .index3 .index3-container .index3-box .right {
    margin-left: 0;
  }
  .index-page .index3 .index3-container .index3-box .right .news-list-container .news-list .news-item {
    margin-top: 15px;
    padding-bottom: 10px;
    margin-bottom: 30px;
  }
  .index-page .index3 .index3-container .index3-box .right .news-list-container .news-list .news-item .title {
    padding: 5px 0;
  }
  .about-page .about-icon-title {
    display: flex;
    align-items: center;
  }
  .about-page .about-icon-title .title-icon {
    margin-right: 15px;
    width: 20px;
  }
  .about-page .about1 {
    padding: 30px;
  }
  .about-page .about1 .about1-image {
    margin-top: 30px;
  }
  .about-page .about2 .about2-text {
    padding: 30px;
  }
  .about-page .about2 .mask {
    height: 270px;
  }
  .about-page .about3 {
    padding: 30px;
  }
  .about-page .about3 .about3-top {
    flex-wrap: wrap;
    padding-right: 0;
  }
  .about-page .about3 .about3-top .left {
    width: 100%;
  }
  .about-page .about3 .about3-top .right {
    margin-top: 20px;
    width: 100%;
  }
  .about-page .about3 .about3-bottom {
    margin-top: 20px;
  }
  .about-page .about4 {
    padding: 30px;
  }
  .about-page .about4 .about4-container {
    margin-top: 10px;
    flex-wrap: wrap;
  }
  .about-page .about4 .about4-container .about4-item-container {
    margin-top: 30px;
    width: 100%;
    height: fit-content;
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .about-page .about4 .about4-container .about4-item-container .left {
    padding: 30px 10px;
    width: 100%;
  }
  .about-page .about4 .about4-container .about4-item-container .left .icon {
    width: 30px;
  }
  .about-page .about4 .about4-container .about4-item-container .left .text {
    margin-top: 20px;
  }
  .about-page .about4 .about4-container .about4-item-container .right {
    width: 100%;
  }
  .about-page .about4 .about4-container .about4-item-container .right .text {
    opacity: 1;
    position: relative;
    left: unset;
    top: unset;
    padding: 30px;
    transform: translateY(0) !important;
  }
  .about-page .about5 .about5-title {
    padding: 30px;
  }
  .about-page .about5 .about5-container img {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    object-fit: cover;
  }
  .about-page .about5 .about5-container .about5-text {
    padding: 30px;
    position: relative;
    left: unset;
    top: unset;
    transform: translate3d(0, 0, 0);
  }
  .about-page .about6 .about6-title {
    padding: 30px;
  }
  .about-page .about6 .about6-title .about6-nav {
    margin-top: 20px;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .about-page .about6 .about6-title .about6-nav .nav-item {
    width: 48%;
    margin-right: 0;
    margin-bottom: 15px;
  }
  .about-page .about6 .about6-container {
    margin-left: 30px;
  }
  .about-page .about6 .about6-container .about6-swiper .swiper-wrapper .swiper-slide {
    padding: 60px;
    width: 100% !important;
  }
  .about-page .about6 .about6-container .about6-swiper .swiper-wrapper .swiper-slide .text {
    margin-top: 15px;
  }
  .about-page .about7 .about7-title-container {
    padding: 30px;
  }
  .about-page .about7 .about7-container {
    margin: 30px;
    padding: 0;
  }
  .about-page .about7 .about7-container .about7-swiper .swiper-wrapper .swiper-slide img,
  .about-page .about7 .about7-container .about7-swiper .swiper-wrapper .swiper-slide video {
    width: 100%;
  }
  .about-page .about7 .about7-container .about7-swiper .swiper-wrapper .swiper-slide .mask-date {
    top: 20px;
    left: 20px;
  }
  .about-page .about7 .about7-container .about7-swiper .swiper-wrapper .swiper-slide .mask-player-container .mask-player {
    width: 50px;
    height: 50px;
  }
  .about-page .about7 .about7-container .about7-swiper .swiper-wrapper .swiper-slide .mask-player-container .mask-player img {
    width: 20px;
  }
  .about-page .time-line {
    padding: 30px;
  }
  .about-page .time-line .time-line-container {
    padding: 0 0 15px;
  }
  .about-page .time-line .time-line-container .line-item {
    font-size: 12px;
  }
  .about-page .time-line .time-line-container .line-item::before {
    width: 20px;
    height: 20px;
    bottom: -25px;
  }
  .about-page .time-line .time-line-container .line-item::after {
    width: 10px;
    height: 10px;
    bottom: -20px;
  }
  .about-page .about8 {
    padding: 30px;
  }
  .about-page .about8 .about8-container {
    margin-top: 40px;
    padding-left: 0;
  }
  .about-page .about8 .about8-container .about8-swiper .swiper-wrapper .swiper-slide {
    width: 100% !important;
  }
  .about-page .about8 .about8-container .about8-swiper .swiper-wrapper .swiper-slide-prev {
    width: 100% !important;
  }
  .about-page .about8 {
    padding: 30px;
  }
  .about-page .about8 .about8-container {
    margin-top: 40px;
    padding-left: 0;
  }
  .about-page .about8 .about8-banner {
    margin: 40px 0 0;
    padding: 0;
  }
  .about-page .about8 .about8-banner .player-mask .mask-player {
    width: 50px;
    height: 50px;
  }
  .about-page .about8 .about8-banner .player-mask .mask-player img {
    width: 20px;
  }
  .news-page .news1 {
    padding: 93px 30px 30px 30px;
  }
  .news-page .news1 .news-type-container {
    margin-top: 40px;
  }
  .news-page .news1 .news-type-container .type-item {
    margin-right: 30px;
    padding: 5px 15px;
    border-radius: 15px;
  }
  .news-page .news1 .news-nav-container {
    margin-top: 30px;
    flex-wrap: wrap;
  }
  .news-page .news1 .news-nav-container .news-nav {
    width: 100%;
    margin-right: 0;
    margin-bottom: 10px;
  }
  .news-page .news1 .news-list {
    justify-content: space-between;
  }
  .news-page .news1 .news-list .news-item-container {
    margin-top: 10px;
    width: 48%;
    margin-right: 0;
  }
  .news-page .news2 {
    padding: 30px;
  }
  .news-page .news2 .pd6-container {
    margin-top: 30px;
  }
  .news-page .news2 .pd6-container .pd6-item {
    padding-bottom: 10px;
  }
  .news-page .news2 .pd6-container .pd6-item .title-container .btn {
    width: 25px;
    height: 25px;
  }
  .news-page .news2 .pd6-container .pd6-item .title-container .btn span {
    width: 15px;
    height: 2px;
  }
  .news-page .news2 .pd6-container .pd6-item .desc {
    padding: 10px 0;
  }
  .news-detail-page .nd1 {
    padding: 93px 30px 30px 30px;
  }
  .news-detail-page .nd1 .date-container {
    margin-top: 30px;
  }
  .news-detail-page .nd1 .date-container .share img {
    width: 20px;
    margin-left: 10px;
  }
  .news-detail-page .nd1 .public-pagination {
    margin-top: 30px;
    gap: 10px;
  }
  .news-detail-page .nd1 .public-pagination .prev,
  .news-detail-page .nd1 .public-pagination .prev-more,
  .news-detail-page .nd1 .public-pagination .next,
  .news-detail-page .nd1 .public-pagination .next-more {
    width: 15px;
  }
  .news-detail-page .nd1 .public-pagination .list {
    gap: 10px;
  }
  .news-detail-page .nd2 {
    padding: 30px;
  }
  .news-detail-page .nd2 .news-list {
    margin-top: 30px;
  }
  .news-detail-page .nd2 .news-list .news-item-container {
    margin-top: 20px;
    width: 100%;
    margin-right: 0;
  }
  .products-page {
    padding: 93px 30px 30px 30px;
  }
  .products-page .products-container .products-box {
    margin-top: 40px;
    flex-wrap: wrap;
  }
  .products-page .products-container .products-box .left {
    width: 100%;
    margin-right: 0;
    padding-top: 40px;
  }
  .products-page .products-container .products-box .left .list {
    margin-top: 30px;
  }
  .products-page .products-container .products-box .left .list .item-container .second-item-container {
    padding-left: 15px;
  }
  .products-page .products-container .products-box .left .list .item-container .three-item-container {
    margin-left: 15px;
  }
  .products-page .products-container .products-box .left .list .item-container .checkbox {
    width: 15px;
    height: 15px;
    margin-right: 15px;
  }
  .products-page .products-container .products-box .right {
    margin-top: 30px;
  }
  .products-page .products-container .products-box .right .right-nav {
    flex-wrap: wrap;
  }
  .products-page .products-container .products-box .right .right-nav .pd-nav-item {
    margin-bottom: 15px;
    width: 48%;
    margin-right: 4%;
  }
  .products-page .products-container .products-box .right .right-nav .pd-nav-item:nth-of-type(2n) {
    margin-right: 0;
  }
  .products-page .products-container .products-box .right .right-list {
    margin-top: 30px;
    justify-content: space-between;
  }
  .products-page .products-container .products-box .right .right-list .product-item {
    width: 48%;
    margin-right: 0 !important;
  }
  .products-page .products-container .products-box .right .right-list .product-item .title-container svg {
    width: 20px;
  }
  .product-detail-page .download-detail {
    padding: 50px 30px 30px 30px;
  }
  .product-detail-page .download-detail .close {
    width: 20px;
    top: 15px;
  }
  .product-detail-page .download-detail .download-detail-container .params-btn-container {
    margin-top: 15px;
  }
  .product-detail-page .download-detail .download-detail-container .params-btn-container .banner-btn {
    padding: 8px 10px;
  }
  .product-detail-page .pd1 {
    margin: 93px 30px 30px 30px;
    flex-wrap: wrap;
  }
  .product-detail-page .pd1 .left {
    width: 100%;
    margin-right: 0;
    margin-bottom: 30px;
  }
  .product-detail-page .pd1 .right {
    width: 100%;
  }
  .product-detail-page .pd1 .right .desc {
    font-size: 14px;
  }
  .product-detail-page .pd2 {
    padding: 30px;
    flex-wrap: wrap;
  }
  .product-detail-page .pd2 .left {
    width: 100%;
    margin-right: 0;
  }
  .product-detail-page .pd2 .list {
    margin-top: 20px;
  }
  .product-detail-page .pd2 .list .item {
    padding-left: 15px;
  }
  .product-detail-page .pd2 .list .item::before {
    width: 6px;
    height: 6px;
  }
  .product-detail-page .pd2 .right {
    padding-right: 0;
    margin-top: 30px;
  }
  .product-detail-page .pd2 .right .pd2-swiper .swiper-wrapper .swiper-slide .text {
    margin-top: 30px;
  }
  .product-detail-page .pd3 {
    padding: 30px;
  }
  .product-detail-page .pd3 .pd3-container {
    flex-wrap: wrap;
  }
  .product-detail-page .pd3 .pd3-container .left,
  .product-detail-page .pd3 .pd3-container .right {
    margin-top: 20px;
    width: 100%;
  }
  .product-detail-page .pd3 .pd3-container .left .about-icon-title .title-icon,
  .product-detail-page .pd3 .pd3-container .right .about-icon-title .title-icon {
    width: 20px;
    margin-right: 10px;
  }
  .product-detail-page .pd3 .pd3-container .left .list,
  .product-detail-page .pd3 .pd3-container .right .list {
    margin-top: 20px;
  }
  .product-detail-page .pd3 .pd3-container .left .list .pd3-item,
  .product-detail-page .pd3 .pd3-container .right .list .pd3-item {
    margin-top: 10px;
    padding-bottom: 10px;
  }
  .product-detail-page .pd4 {
    padding: 30px;
  }
  .product-detail-page .pd4 .pd4-swiper-container {
    margin-top: 40px;
    padding: 0;
  }
  .product-detail-page .pd4 .pd4-swiper-container .pd4-swiper .prev,
  .product-detail-page .pd4 .pd4-swiper-container .pd4-swiper .next {
    display: none;
  }
  .product-detail-page .pd5 {
    padding: 30px;
  }
  .product-detail-page .pd5 .pd5-container {
    margin-top: 40px;
    flex-wrap: wrap;
  }
  .product-detail-page .pd5 .pd5-container .left {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-right: 0;
  }
  .product-detail-page .pd5 .pd5-container .left .nav-item {
    width: 48%;
    padding: 12px 15px;
    margin-top: 10px;
  }
  .product-detail-page .pd5 .pd5-container .left .nav-item:first-child {
    margin-top: 10px;
  }
  .product-detail-page .pd5 .pd5-container .left .active::before {
    width: 15px;
    height: 15px;
  }
  .product-detail-page .pd5 .pd5-container .right {
    width: 100%;
    margin-top: 30px;
  }
  .product-detail-page .pd5 .pd5-container .right .pd5-swiper {
    width: 100% !important;
  }
  .product-detail-page .pd5 .pd5-container .right .pd5-swiper .swiper-wrapper .swiper-slide {
    width: 100%;
    flex-wrap: wrap;
    padding: 30px;
  }
  .product-detail-page .pd5 .pd5-container .right .pd5-swiper .swiper-wrapper .swiper-slide .slide-left {
    width: 100%;
  }
  .product-detail-page .pd5 .pd5-container .right .pd5-swiper .swiper-wrapper .swiper-slide .slide-right {
    width: 100%;
    margin-left: 0;
  }
  .product-detail-page .pd6 {
    padding: 30px;
  }
  .product-detail-page .pd6 .pd6-container {
    margin-top: 30px;
  }
  .product-detail-page .pd6 .pd6-container .pd6-item {
    padding-bottom: 10px;
  }
  .product-detail-page .pd6 .pd6-container .pd6-item .title-container .btn {
    width: 25px;
    height: 25px;
  }
  .product-detail-page .pd6 .pd6-container .pd6-item .title-container .btn span {
    width: 15px;
    height: 2px;
  }
  .product-detail-page .pd6 .pd6-container .pd6-item .desc {
    padding: 10px 0;
  }
  .product-detail-page .pd7 {
    padding: 30px;
  }
  .product-detail-page .pd7 .pd7-container {
    margin-top: 40px;
    flex-wrap: wrap;
  }
  .product-detail-page .pd7 .pd7-container .product-item {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
  }
  .product-detail-page .pd7 .pd7-container .product-item .title-container {
    margin: 10px 0 5px;
  }
  .product-detail-page .pd7 .pd7-container .product-item .title-container svg {
    width: 25px;
  }
  .contact-page .cd1 {
    padding: 30px;
  }
  .contact-page .cd2 .max-image {
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
  }
  .contact-page .cd2 .cd2-text {
    padding: 30px;
    position: relative;
    left: unset;
    top: unset;
    transform: translate3d(0, 0, 0);
  }
  .contact-page .cd2 .cd2-text .desc {
    text-align: center;
  }
  .contact-page .cd2 .cd2-swiper-container {
    position: relative;
    height: 300px;
    width: 80%;
    top: unset;
    left: unset;
    transform: translate3d(10%, 0, 0);
  }
  .contact-page .cd2 .cd2-swiper-container .cd2-swiper .swiper-wrapper .swiper-slide {
    padding: 30px;
  }
  .contact-page .cd3 {
    padding: 30px;
  }
  .contact-page .cd3 .cd3-list {
    margin-top: 2.0833vw;
    justify-content: space-between;
  }
  .contact-page .cd3 .cd3-list .cd3-item {
    width: 100%;
    margin-right: 0;
    margin-bottom: 30px;
  }
  .contact-page .cd3 .cd3-list .cd3-item .mask {
    padding: 20px;
  }
  .contact-page .cd3 .cd3-list .cd3-item .btn {
    width: 30px;
    height: 30px;
    right: 20px;
    bottom: 20px;
  }
  .contact-page .cd3 .cd3-list .cd3-item .btn span {
    width: 15px;
    height: 2px;
  }
  .contact-page .cd3 .cd3-list .cd3-item .more-mask {
    padding: 20px;
  }
  .contact-page .cd4 {
    padding: 30px;
  }
  .contact-page .cd4 .cd4-form {
    margin-top: 40px;
  }
  .contact-page .cd4 .cd4-form .half-item {
    width: 100%;
  }
  .contact-page .cd4 .cd4-form .form-item {
    margin-bottom: 15px;
  }
  .contact-page .cd4 .cd4-form .form-item .input input,
  .contact-page .cd4 .cd4-form .form-item .input select,
  .contact-page .cd4 .cd4-form .form-item .input textarea {
    padding: 8px 15px;
  }
  .contact-page .cd4 .cd4-form .agree .checkbox {
    width: 15px;
    height: 15px;
    margin-right: 15px;
  }
  .contact-page .cd4 .cd4-form .submit {
    margin-top: 30px;
  }
}