.container{padding: 0 2%}
.btn{height: 35px;line-height: 35px;}
#header .menu-box .btn{display: none;}
#footer{margin-top: 60px;}
#footer .contact{flex-direction: column;}
#footer .contact .l,#footer .contact .r{width: 100%;}
#footer .contact .l h3{padding-bottom: 15px}
#footer .contact .l .qr{text-align: center;padding-bottom: 20px;}
#footer .contact .l .qr img{width: 25%;}
#footer .contact .r .footer-msg ul li{margin-bottom: 10px;}
#footer .contact .r .footer-msg ul li textarea{height: 70px;}
#main .x-title{font-size: 2.5rem;margin-bottom: 10px;}
#main .x-title-sub{font-size: 1.6rem}
#main .top-banner{height: 250px;}
#main .section-title{padding: 60px 0 30px;}
#main .section-title span:nth-of-type(1){top: 45px;font-size: 2.3rem;}
#main .section-title span:nth-of-type(2){font-size: 1.6rem;}

#index.index .banner{height: 250px;}
#index.index .about{padding: 20px 2%;flex-direction: column;}
#index.index .about .l,#index.index .about .r{width: 100%;}
#index.index .about .l{display: none;}
#index.index .about .l img{height: 250px;object-fit: cover;}
#index.index .about .r{padding-top: 15px;}
#index.index .about .r h3{font-size: 2rem;}
#index.index .about .r h3:last-of-type{margin-bottom: 20px;}
#index.index .about .r .btn{margin: 0 auto;}
#index.index .product{padding: 40px 0;}
#index.index .product .list a {width: calc(50% - 12px);}
#index.index .product .list a img{aspect-ratio: 3 / 2;}
#index.index .product .list a .title{padding-top:10px;margin-bottom: 10px;}
#index.index .product .list a .bar{padding-top: 15px;}
#index.index .news {padding:40px 5%;}
#index.index .news .list a {flex-direction: column;}
#index.index .news .list a .img{width: 100%;}
#index.index .news .list a .con{padding: 15px 0 0;}
#index.index .news .list a .title{font-weight: bold;}
#index.index .news .list a .time{padding: 5px 0;}
#index.index .technology{padding: 40px 0;}
#index.index .slogan .container{display: flex;align-items: center;}
#index.index .slogan .con{padding: 10px 0 0 10px;height:auto;position: relative;}
#index.index .slogan .con .logo img{width: 60%;}
#index.index .slogan .con h3{line-height: 1.5;}
#index.index .slogan .con h3:nth-of-type(1){font-size: 1.8rem;}
#index.index .slogan .con h3:nth-of-type(2){font-size: 1.6rem;padding-bottom: 15px}

#product.index .classify{justify-content: space-between;flex-wrap: wrap;}
#product.index .classify a{width: calc(50% - 10px);margin: 0 0 20px 0;box-sizing: border-box;padding: 10px 0;text-align: center;}
#product.index .content ul.list li{width: 50%;padding: 10px;}
#product.index .content ul.list li img{aspect-ratio: 3/2;}
#product.detail .content{padding: 30px 5%;}
#news.index .content .list .item {width: 100%;margin-right: 0;}
#news.index .content .list .item:nth-of-type(3n){margin-right:0}
#news.index .content .list .item .img{height: 150px;}
#news.index .content .list .item .txt{padding: 10px;}
#news.index .content .list .item .desc{margin-bottom: 15px;}
#news.detail .content{padding: 30px 5%;}

#contact.index .content{flex-direction: column;}
#contact.index .content .l,#contact.index .content .r{width: 100%;}