 

/* CSS Document */
@media screen and (max-width: 1680px){
  .container{padding: 0 6%;}
  .page_topic .topicbox .swiper .box{padding-right:6%;}
  .page_topic .topicbox{width: 94% !important;}
  .inProduct .contprot .contthumb .left{ margin-left: 6%;}
  .catproduct .catitem .left{ margin-left:6%;}
  .catproduct .catitem:nth-child(2n) .left{margin-right:6%}
}


@media screen and (max-width: 1560px){
  .container{padding: 0 3%;}
  .page_topic .topicbox .swiper .box{padding-right:3%;}
  .header .nav .drop{ padding: 0 25px;}
  .page_topic .topicbox{width: 97% !important;}
  .inProduct .contprot .contthumb .left{ margin-left: 3%;}
  .catproduct .catitem .left{ margin-left:3%;}
  .catproduct .catitem:nth-child(2n) .left{margin-right:3%}
}

@media screen and (max-width: 1440px){
  .inProduct .contprot .contthumb .left{padding:80px 0;}
  .inProduct .contprot .contthumb .left .cont-item .cont{ margin-top:30px;}
  .inProduct .contprot .contthumb .left .cont-item .more{ margin-top:50px}
  .inProduct .contprot .contthumb .left .porbody{ margin-top:30px;}
  .catproduct .catitem .left{padding:80px 0;}
  .catproduct .catitem .left .cont-item .cont{ margin-top:30px;}
  .catproduct .catitem .left .cont-item .more{ margin-top:50px}
  .catproduct .catitem .left .porbody{ margin-top:30px;}
  .about_advant .advantbox .advant .item{ padding:30px;}
}


@media screen and (max-width: 1360px){
    .inProduct .catelist{ width:70%;}
   .header .nav {padding-left: 5%;}
}

@media screen and (max-width: 1280px){
 
    .inProduct .infor .tit{font-size:26px;}
    .inProduct .contprot .contthumb .left{padding:60px 0; width:42%;}
    .inProduct .contprot .contthumb .left .cont-item .name{font-size:28px;}
    .catproduct .catitem .left{padding:60px 0; width:42%;}
    .catproduct .catitem .left .cont-item .name{font-size:28px;}

    .inSolution{ padding:60px 0}
    .inSolution .infor .tit{font-size:26px;}
    .inSolution .solutbox .left{ padding:30px 10% 30px 30px}
    .inSolution .solutbox .left .related{margin-top:30px; padding-top:20px;}
    .inSolution .solutbox .left .related .infor{ width:100%; grid-gap:5px;}
    .inSolution .solut .tab .swiper-slide{width:19.2%; font-size: 17px; margin-right:1%;}
    .catsolution{ padding:60px 0}
    .catsolution .infor .tit{font-size:26px;}
    .catsolution .catsolut .left{padding:50px 40px;}

 
}

@media screen and (max-width: 1024px) and (min-width: 768px){
    .container{padding: 0 2%;}
 
    .sp_nav{display:block; width:45px;float:right;position:relative;cursor:pointer;height:30px; margin-left:15px; margin-top: 24px;-moz-transition: all .5s ease 0s;-ms-transition: all .5s ease 0s;-o-transition: all .5s ease 0s;-webkit-transition: all .5s ease 0s;transition: all .5s ease 0s;}
    .header.scroll .sp_nav{ margin-top:19px;}
    .sp_nav span{display:block;background:#ffffff;width:30px;height:2px;position:absolute;left:10px;transition:all ease 0.35s}
    .sp_nav span:nth-of-type(1){top:0px}
    .sp_nav span:nth-of-type(2){top:10px}
    .sp_nav span:nth-of-type(3){top:20px}
    .sp_nav_se span:nth-of-type(1){top:10px;transform:rotate(45deg)}
    .sp_nav_se span:nth-of-type(2){width:0}
    .sp_nav_se span:nth-of-type(3){top:10px;transform:rotate(-45deg)}
    .sjj_nav{display:block; position:fixed;z-index:999;background:#fff;width:100%;height:100vh;font-size:14px;line-height:40px;top:-100vh;left:0;overflow:auto;overflow-x:hidden;transition:top ease 0.35s;}
    .sjj_nav .bg{ width: 100%; height: 4px;background: #da251c;}
    .sjj_nav .hotline{ background-color: #0094da; padding-left: 20px; height: 60px;line-height: 60px; font-size: 14px; color: #fff; }
    .sjj_nav .hotline span{ font-size: 20px;font-weight: bold; }
    .nav_show{top:70px}
    .header.scroll .nav_show{top:60px}
    .sjj_nav>ul>li:first-child{overflow:hidden;border-top:0; width:100%;}
    .sjj_nav>ul>li:first-child>a{float:left;width:100%;}
    .sjj_nav>ul>li:first-child .language{float:right;width:22%;overflow:hidden;line-height:50px;}
    .sjj_nav>ul>li:first-child .language a{width:48%;float:left;border-left:1px #ddd solid;text-align:center;color:#999;}
    .sjj_nav ul li i{position:absolute;top:5px;right:0px;border-left:1px #ddd solid;height:30px;padding:0px 7px 0 7px;}
    .sjj_nav ul li i svg{transform:rotate(-90deg);transition:all ease 0.35s}
    .sjj_nav ul li .sjj_nav_i_se svg{transform:rotate(0deg)}
    .sjj_nav ul li{border-top:1px #ddd solid;position:relative;line-height:50px;font-size:16px}
    .sjj_nav ul li a{color:#666;padding:0 20px; width:100%; display: block; box-sizing:border-box}
    .sjj_nav ul>li:hover>a{ background-color:#da251c; color:#fff}
    .sjj_nav>ul >li:last-child{border-bottom:1px #ddd solid;}
    .sjj_nav ul li .dirnav{display:none}
    .sjj_nav ul li .dirnav .li{margin-left:10px;border-top:1px #ddd solid;}
    .sjj_nav ul li .dirnav .li a{ font-size:15px; color:#999;display:block;text-align:left;}
    .sjj_nav ul li i svg{width:20px;height:20px;fill:#555;}
    .sjj_nav ul li .sjj_nav_i_se svg{fill:#da251c}
 

    .inSolution{padding:40px 0;}
    .inSolution .infor .tit_en{font-size:15px;}
    .inSolution .infor .tit{font-size:20px;}
    .inSolution .solutbox .left{padding: 20px 8% 20px 20px;}
    .inSolution .solutbox .left .tit{font-size:20px;}
    .inSolution .solutbox .left .cont{ margin-top:20px; font-size:15px; line-height:26px; height:104px;}
    .inSolution .solutbox .left .more{ margin-top:30px;}
    .inSolution .solut .tab .swiper-slide{font-size:15px; line-height:40px; height:40px;}
    .inSolution .solutbox .right{ width:58%}
    .catsolution{ padding:40px 0}
    .catsolution .infor .tit_en{font-size:15px;}
    .catsolution .infor .tit{font-size:20px;}
    .catsolution .catsolut .left{width:50%; padding:40px 30px;}
    .catsolution .catsolut .left .tit{font-size:20px;}
    .catsolution .catsolut .left .cont{ margin-top:20px; font-size:15px; line-height:26px; height:104px;}
    .catsolution .catsolut .left .more{ margin-top:30px;}
    .catsolution .catsolut .right{ width:50%;}
 
    .application{padding:40px 0;}
    .application .application_title{ font-size:24px;}
    .application .application_video{ margin-top:20px;  grid-gap: 10px;}
    .application .application_video .item .infor{ padding:10px 4%;}
    .application .application_video .item .tit{font-size:16px;}



     .problem_show{padding:40px 0;}

     .page_about .aboutProfile .about_img .aboutImg_List{width:80%;}
    .solve_video .solveList{width:80%}
    #pictureViewer > .content{width:80%;}
}


@media screen and (max-width: 767px){
    .container{padding: 0 2%;}
    .page_topic .topicbox{width: 98% !important;}
 
    .sp_nav{display:block; width:45px;float:right;position:relative;cursor:pointer;height:30px; margin-left:5px; margin-top: 24px; -moz-transition: all .5s ease 0s;-ms-transition: all .5s ease 0s;-o-transition: all .5s ease 0s;-webkit-transition: all .5s ease 0s;transition: all .5s ease 0s;}
    .header.scroll .sp_nav{ margin-top:19px;}
    .sp_nav span{display:block;background:#ffffff;width:30px;height:2px;position:absolute;left:10px;transition:all ease 0.35s}
    .sp_nav span:nth-of-type(1){top:0px}
    .sp_nav span:nth-of-type(2){top:10px}
    .sp_nav span:nth-of-type(3){top:20px}
    .sp_nav_se span:nth-of-type(1){top:10px;transform:rotate(45deg)}
    .sp_nav_se span:nth-of-type(2){width:0}
    .sp_nav_se span:nth-of-type(3){top:10px;transform:rotate(-45deg)}
    .sjj_nav{display:block; position:fixed;z-index:999;background:#fff;width:100%;height:100vh;font-size:14px;line-height:40px;top:-100vh;left:0;overflow:auto;overflow-x:hidden;transition:top ease 0.35s;}
    .sjj_nav .bg{ width: 100%; height: 4px;background: #da251c;}
    .sjj_nav .hotline{ background-color: #0094da; padding-left: 20px; height: 60px;line-height: 60px; font-size: 14px; color: #fff; }
    .sjj_nav .hotline span{ font-size: 20px;font-weight: bold; }
    .header .nav_show{top:70px;}
    .header.scroll .nav_show{top:60px}
    .mbanner{display:block;}
    .pcbanner{display:none;}
 
    .inSolution{padding:40px 0;}
    .inSolution .infor .tit_en{font-size:15px;}
    .inSolution .infor .tit{font-size:20px;}
    .inSolution .solut{margin-top:30px;}
    .inSolution .solutbox .left{width:100%; padding:15px 10px;}
    .inSolution .solutbox .left .tit{font-size:18px;}
    .inSolution .solutbox .left .cont{ margin-top:15px; font-size:15px; line-height:26px; height:78px;-webkit-line-clamp: 3;line-clamp: 3;}
    .inSolution .solutbox .left .more{ margin-top:20px; width:35px;height:35px; line-height:35px;}
    .inSolution .solutbox .left .related{margin-top: 20px; padding-top: 10px;}
    .inSolution .solutbox .left .related .infor a{height:35px;line-height:35px;}
    .inSolution .solut .tab{position:relative;width:100%;}
    .inSolution .solut .tab .swiper-wrapper{display: grid; grid-gap: 8px;grid-template-columns: repeat(3,1fr);}
    .inSolution .solut .tab .swiper-slide{float:left; width:100%; font-size:15px; line-height:40px; height:40px;}
    .inSolution .solutbox{margin-top:20px;}
    .inSolution .solutbox .right{position:relative; width:100%;height:auto;}

    .catsolution{ padding:40px 0}
    .catsolution .infor .tit_en{font-size:15px;}
    .catsolution .infor .tit{font-size:20px;}
    .catsolution .catsolut .left{width:100%; padding:30px 20px;}
    .catsolution .catsolut .left .tit{font-size:18px;}
    .catsolution .catsolut .left .cont{ margin-top:15px; font-size:15px; line-height:26px; height:78px;-webkit-line-clamp: 3;line-clamp: 3;}
    .catsolution .catsolut .left .more{ margin-top:20px; width:35px;height:35px; line-height:35px;}
    .catsolution .catsolut .right{position:relative; float:left; width:100%;}

     .inNews{padding:40px 0;}
    .inNews .infor .tit_en{font-size:15px;}
    .inNews .infor .tit{font-size:20px;}
    .inNews .top .more{line-height: 35px; width:130px;}
    .inNews .newsbox{ margin-top:30px;grid-gap: 10px; grid-template-columns: repeat(2,1fr);}
    .inNews .newsbox .item:last-child{display:none;}
    .inNews .newsbox .item .img .infor{display:none;}
    .inNews .newsbox .item .cont .title{margin-top:15px; font-size:16px; line-height: 26px; height:52px;}
    .inNews .newsbox .item .cont .desc{line-height: 26px; height:52px;}

    .inAbout{padding:40px 0;}
    .inAbout .infor .tit_en{font-size:15px;}
    .inAbout .infor .tit{font-size:20px;}
    .inAbout .abocont{ margin-top:30px;}
    .inAbout .abocont .number{ margin-top:30px; width:100%;}
    .inAbout .abocont .number .item .c{font-size:14px;}
    .inAbout .abocont .number .item .T .timer{font-size:32px;}
    .inAbout .abocont .cont{width:85%; font-size:15px; line-height:26px;}
 
    .application{padding:40px 0;}
    .application .application_title{ font-size:20px;}
    .application .application_video{ margin-top:20px;  grid-gap: 10px;grid-template-columns: repeat(2,1fr);}
    .application .application_video .item .infor{ padding:10px 4%;}
    .application .application_video .item .tit{font-size:15px;}
 
 
    .solve_video .solveList{width:96%;padding:30px;}
    .solve_video .solveclose{right:5px; top:5px;}
    #pictureViewer > .content{width:96%; height:50vh;}

    .pages li{height:30px; line-height:30px;}
    .pages li a{ padding:0 12px;}

}