/*响应式*/
@media (min-width:1200px){
    .menu>.list>ul>li{
        margin-left: 4.5%;
    }
    header .menu .submenu{
        width: 320px;
    }
}

@media (min-width:993px){
    .menu{
        overflow: visible;
    }
    .menu>.list>ul{
        flex:1;
        display: flex;
        justify-content: flex-end;
        height: 92px;
    }
    
    .menu>.list>ul>li{
        margin-left: 2.5%;
        position: relative;
        display: flex;
    }

    .menu>.list>ul>li>a.title{
        font-weight: bold;
        font-size: 16px;
        white-space: nowrap;
        display: flex;
        align-items: center;
        gap:6px;
    }

    header .menu .submenu{
        display: flex !important;
        width: 220px;
        position: absolute;
        top: 100%;
        left:-20px;
        transition: all .3s;
        -webkit-transition: all .3s;
        pointer-events: none;
        visibility: hidden;
        opacity: 0;
        transform: translateY(10px);
        -webkit-transform: translateY(10px);
        background-color: #ffffff;
        box-shadow: 0px 0px 10px rgba(0,0,0,.1);
        border-radius: 8px;
        padding: 35px 25px !important;
    }

    header .menu li.wide{
        position: static;
    }

    header .menu .wide .submenu{
        width: 100%;
        max-width: 1020px;
        left: 130px;
        right: 0;
    }

    header .menu .wide .submenu dd{
        flex:1;
    }

    .menu>.list>ul>li .submenu{
        display: flex;
        flex-direction: column;
        gap:25px;
    }

    .menu>.list>ul>li.wide .submenu{
        display: flex;
        flex-direction: row;
    }

    .menu>.list>ul>li:hover .submenu{
        pointer-events: visible;
        visibility: visible;
        opacity: 1;
        transform: translateY(0px);
        -webkit-transform: translateY(0px);
        height: auto !important;
    }

    .menu>.list>ul>li .submenu a:hover{
        color: var(--base-color);
    }

    .menu>.list>ul>li>a.title.active,
    .menu>.list>ul>li:hover>a.title{
        color: var(--base-color);
        position: relative;
    }

    .menu>.list>ul>li:hover>a.title::after{
        content: "";
        width: 100%;
        position: absolute;
        height: 3px;
        left: 0;
        bottom: 5px;
        background-color: var(--base-color);
    }

    .menu>.list>ul>li.wide .submenu .txt{
        font-size: 16px;
        font-weight: bold;
    }

    .menu>.list>ul>li.wide .submenu .txt .icon-shanglajiantou{
        display: none;
    }

    .menu>.list>ul>li.wide .submenu dd{
        display: flex;
        flex-direction: column;
        gap:35px;
    }

    .menu>.list>ul>li.wide .submenu dd:not(:last-child){
        border-right: solid 1px #f2f2f1;
        padding-right: 25px;
    }

    .menu>.list>ul>li.wide .submenu .sml_menu{
        display: flex !important;
        flex-direction: column;
        gap:25px;
    }

    header .menu .icon-shanglajiantou{
        font-size: 14px;
    }

    header .menu li:hover a .icon-shanglajiantou{
        transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
    }
}

@media (max-width:1199px){
    .index-industries ul li .more{
        zoom: .7;
    }
    header>.menu>.list>ul>li{
        margin-left: 3%;
    }
    header .container{
        gap:30px
    }
}

@media (max-width:992px){
    html{
        font-size: .8px;
    }

    header{
        background: transparent;
    }

    header .tool{
        position: absolute;
        gap:20px;
        right: 2.5%;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        z-index: 999;
    }

    header .container{
        width: 100%;
    }

    header .container .logo{
        flex:1;
        justify-content: flex-start;
        padding: 0 2.5%;
        height: 92px;
        margin: auto;
        background-color: rgba(255, 255, 255, .7);
        backdrop-filter: blur(40px);
    }

    footer .message{
        margin-right: 0;
    }
    footer .about{
        margin-right: 20px;
    }
    footer .copyright .container{
        padding-left: 0;
        padding-right: 0;
    }


    /*移动端菜单*/
    .menu-mc,
    .menubtn{
        display: flex;
    }

    .menu-mc {
        position: fixed;
        overflow: hidden;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #ffffff;
        z-index: 500;
        transition: all .5s;
        -webkit-transition: all .5s;
        transform: translateY(-100%);
        -webkit-transform: translateY(-100%);
        padding-top: 75px;
        display: flex;
        flex-direction: column;
        overflow-x: hidden;
    }
    
    .menu-mc.active {
        transform: translateY(0);
        -webkit-transform: translateY(0);
    }
    
    .menu-mc .list {
        flex: 1;
        overflow: auto;
        overflow-x: hidden;
        border-top: 1px solid rgba(255, 255, 255, .1);
    }
    
    .menu-mc .list ul li {
        line-height: 60px;
    }
    
    .menu-mc .list ul li .submenu {
        display: none;
    }
    
    .menu-mc .list ul li .title {
        border-bottom: 1px solid rgba(0, 0, 0, .1);
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 16px;
        color: #000;
        padding: 0px 5%;
    }
    
    .menu-mc .list ul li .title.active {
        background-color: #e1942b;
        color: #ffffff;
    }
    
    .menu-mc .list ul li .title .iconfont {
        transition: all .3s ease;
        -webkit-transition: all .3s ease;
    }
    
    .menu-mc .list ul li .title.active .iconfont {
        display: block;
        transform: rotate(180deg);
    }
    
    .menu-mc .list ul li a {
        display: block;
        font-size: 14px;
        color: #000000;
    }
    
    .menu-mc .list ul li .submenu {
        
        padding-bottom: 10px;
    }
    
    .menu-mc .list ul li .submenu .txt {
        padding: 15px 20px;
        line-height: 1.5;
        color: #666;display: flex; align-items: center; justify-content:space-between;
        border-bottom: 1px solid rgba(0, 0, 0, .1);
    }
    
    .menu-mc .list ul li .submenu .txt.active{
        background-color: #ffc474;
        color:#ffffff;
    }
    
    .menu-mc .list ul li .submenu a:hover {
    
        font-weight: 600;
    }
    .menu-mc .list ul li .submenu .sml_menu{display: none;}
    .menu-mc .list ul li .submenu .sml_menu a{ padding: 0px 30px; line-height: 45px;}
    html.active{ height:100%; overflow:hidden;}
    .menu-mc .list ul li .submenu .txt .iconfont{transition: all .3s ease;
        -webkit-transition: all .3s ease;}
    .menu-mc .list ul li .submenu .txt.active .iconfont{display: block;
        transform: rotate(180deg);}

    .menu>.list>ul>li.wide .submenu .sml_menu .split-line{
        padding-top: 0;
        border: none;
    }

    .industry-overview{
        gap:20px;
        flex-direction: column;
    }

    .industry-overview .content{
        margin-right: 0;
        width: 100%;
    }
    .left-menu{
        display: none;
    }
	footer .content{
		gap:20px;
	}
}

@media (max-width:768px){
    html{
        font-size: .7px;
    }
    .gap25{
        gap:15px;
    }
    
    .gap30{
        gap:20px;
    }
    
    .gap32{
        gap:22px;
    }
    
    .gap36{
        gap:26px;
    }
    
    .gap40{
        gap:30px;
    }
    
    .gap50{
        gap:40px;
    }

    header .container .logo,
    header .container{
        height: 80px;
    }

    .banner{
        height: 300px;
    }

    .menu-mc{
        padding-top: 80px;
    }

    .index-about{
        flex-direction: column;
        gap:30px;
    }

    .index-about .photo{
        width: 100%;
        margin: 0;
    }
    
    .industry-frid .info .title,
    .index-about .info .stitle{
        margin-top: 0;
    }

    .index-industries ul li .title{
        font-size: 14px;
    }

    .index-industries ul li .to,
    .index-industries ul li .more{
        display: none;
    }

    .index-news .block-title {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
        text-align: center;
    }
    .index-news .block-title .viewbtn {
        justify-self: auto;
    }

    .industry ul,
    .index-news ul,
    .index-product .list ul,
    .index-industries .list ul{
        grid-template-columns: repeat(2,1fr);
    }

    .about-history .desc{
        padding: 0 20px;
    }

    .industry ul{
        gap: 50px 20px;
    }

    .news .list li{
        flex-direction: column;
    }

    .news .list li .info{
        padding: 0 15px 15px;
    }

    .news .list .photo{
        width: 100%;
    }

    .detail{
        flex-direction: column;
    }

    .right-menu{
        width: 100%;
        box-shadow: none;
        padding: 0;
    }

    .detail-content .download{
        gap:0;
        justify-content: space-between;
    }

    .detail-content .download{
        font-size: 18px;
    }
}

@media (max-width:750px){
    .block-title{
        font-size: 20px;
    }
    
    .container{
        width: 90%;
    }

    html{
        font-size: .6px;
    }

    .menu-mc{
        padding-top: 70px;
    }

    header .container .logo,
    header .container{
        height: 70px;
    }

    header .logo img{
        height: 35px;
    }

    .banner{
        height: 200px;
    }

    .banner .desc{
        padding-top: 10px;
    }

    .banner .container{
        padding: 0;
    }

    .banner .desc .txt{
        width: 80%;
    }

    main{
        margin-top:10%;
    }

    .block{
        margin-bottom: 10%;
    }

    .index-news ul,
    .index-solution ul{
        grid-template-columns: repeat(1,1fr);
    }

    footer .content{
        padding-top: 30px;
    }

    footer .about{
        margin: 0;
        width: 100%;
        text-align: center;
    }

    footer .about .media{
        justify-content: center;
    }

    footer .list li{
        margin-top: 15px;
    }

    footer .message{
        margin: 0;
        width: 100%;
    }

    footer .message ul{
        display: grid;
        grid-template-columns: repeat(2,1fr);
    }

    footer .content .container{
        flex-direction: column-reverse;
        gap:30px;
    }

    footer .copyright .container{
        flex-direction: column;
        text-align: center;
    }

    .about-history .desc{
        padding: 0 10px;
    }

    .about-factory ul{
        grid-template-columns: repeat(2,1fr);
        gap:15px;
    }

    .about-factory ul li .info{
        padding: 10px;
    }

    .industry ul{
        gap: 20px 20px;
    }

    .industry-message .form ul{
        grid-template-columns: repeat(1,1fr);
    }

    .industry-message .form .span2 {
        grid-column: span 1;
    }

    .industry-message .form input[type='text']{
        height: 40px;
        font-size: 14px;
    }

    .industry-message .form textarea{
        height: 120px;
    }

    .industry-message .form .submit{
        width: 100%;
        height: 40px;
        border-radius: 40px;
    }

    .industry-overview .items ul{
        grid-template-columns: repeat(2,1fr);
        text-align: center;
    }

    .banner .desc .txt.underline{
        padding: 0;
    }

    .banner .desc .txt.underline::after{
        display: none;
    }

    .page-head{
        flex-direction: column;
        gap: 10px;
        align-items: unset;
    }
    
    .industry-product ul li .title{
        font-size: 14px;
    }

    .pager{
        gap:8px;
    }

    .pager a{
        height: 30px;
        line-height: 30px;
        min-width: 30px;
        border-width: 1px;
    }

    .block-description{
        width: 100%;
    }

    .solution ul li .info{
        padding: 0 10px 20px;
    }

    .news .list li{
        padding: 10px;
        padding: 0;
    }

    .news .list .title{
        font-size: 14px;
    }

    .news .list .desc{
        margin: 10px 0;
    }

    .crumb{
        display: none;
    }

    .contact .contact-info ul{
        grid-template-columns: repeat(1,1fr);
        gap:30px;
    }

    .contact .contact-info li::after{
        display: none;
    }

    .contact .contact-info .label{
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .detail-content .built-in {
        flex-direction: column;
    }

    .detail-content .key-benefits .grid{
        grid-template-columns: repeat(3,1fr);
        gap:20px 0;
    }

    .detail-content .key-benefits .item:nth-child(3){
        border: none;
    }

    .detail-content .download{
        flex-direction: column;
        gap:10px;
    }

    .right-menu .news .list li{
        flex-direction: row;
    }

    .right-menu .news .list li .info{
        padding: 0;
    }

    .tab-btns{
        background: none;
        padding: 0;
        border: none;
    }

    .tab-btns .btn{
        padding: 0 15px;
        height: 30px;
    }
	
	footer .content{
		gap:50px;
	}
	
	footer .pro ul{
		display: grid;
        grid-template-columns: repeat(2,1fr);
        text-align: center;
	}
	
	footer .link ul{
		display: grid;
        grid-template-columns: repeat(3,1fr);
        text-align: center;
    }
    
    footer .card-title{
        text-align: center;
    }
    footer .card-title::after {
        margin: 0 auto;
    }
}
