﻿

/*1680*/



@media screen and (max-width:1680px){

 



}



@media screen and (max-width:1440px){



 .m_seabox{margin:20px 0 0 20px;}



}



@media screen and (max-width:1360px){



.m_navi ul li a{padding:0 10px;} 







}





/*1280*/



@media screen and (max-width:1280px){



.z_banner_bg font {

    float: left;

    font-size: 40px;

    font-weight: 500;

    letter-spacing: 0px;

    line-height: 60px;

    color: rgba(255, 255, 255, 1);

    text-align: left;

    margin-top: 7%;

}





.web{display:none;}



.mobile{display:block;}





 

.mobile1{width:50px;   position:relative; z-index:50; float:right;  margin:1.6% 8% 0 2%;}



.mobile1 img{width:100%; background:#fff; border:none; padding:5px; border-radius:50%;}



.mob_seabox{ 

width: 34px;

height: 34px;

float:right;

opacity: 1;

}



.mob1{width:90%;  height:44px; float:left; background:#fff; position:fixed; z-index:122;  left:4%; top:5rem; border-radius:60px; border: 1px solid #D9D9D9;  display:none; }





.mob1 .sinp1{width:82%; height:44px; float:left; background:transparent; padding-left:4%; border:none; border-radius:0px; font-size:16px; color:#B3B3B3; text-align:left; line-height:44px; font-weight:normal;  }





.mob1 .sinp2{width:14%; height:44px; float:left; background:transparent; border:none; border-radius:0px; font-size:16px; color:#333; text-align:center; line-height:44px; font-weight:normal;   border-top-right-radius:0px; border-bottom-right-radius:0px; cursor:pointer;  }







  .z_mhead { position: relative;  width: 100%; left: 0; height:5rem; box-sizing: border-box; padding: 0 0%; z-index: 45; background: #4184C9;  }

  

.z_mhead .logo{width:10%; float:left; margin:1% 2% 0 2%; overflow:hidden; }



.z_mhead .logo img{width:100%;}

 

 



   .z_mhead .nav { position: relative; width: 41px; height: 41px; background: url(../images/menu01.png) no-repeat center center; background-size: 100%;
 border-radius: 0px; right:2%; top:1rem; display: block; z-index: 55; float:right; }

  

   .z_nav { position: fixed; width: 100%; height: calc(100% - 0rem); left: 0%; top: 5rem; z-index: 99; display: none; }

  

   .z_nav .navleft { width: 30%; float: left; background: rgba(0, 0, 0, 0.1); height: 100vh; overflow: hidden; }

  

   .z_nav .nav { width: 70%; float: left; background: #fff; height: calc(100% - 0rem); overflow-y: auto; overflow-x: hidden; }

  

   .z_nav .nav ul { width: 100%; float: left; margin: 3% 0 3% 0%; border-top: 1px dashed #f2f3f5; }

  

   .z_nav .nav ul li { width: 100%; min-height: 3rem; float: left; border-bottom: 1px dashed #f2f3f5; }

  

   .z_nav .nav ul li.selected { }

  

   .z_nav .nav ul li a { height: 3rem; display: flex; align-items: center; justify-content: space-between; width: 100%; float: left; margin: 0 3%; font-size: 16px; color: #333; line-height: 3rem; }

  

   .z_nav .nav ul li a img.vimg1 { width: 1rem; display: block; margin: 4% 8% 4% 6%; }

  

   .z_nav .nav ul li a img.vimg2 { width: 1rem; display: none; margin: 4% 8% 4% 6%; }

  

   .z_nav .nav ul li.selected > a { color: #d12014; }

  

   .z_nav .nav ul li.selected a img.vimg1 { width: 1rem; display: none; margin: 4% 8% 4% 6%; }

  

   .z_nav .nav ul li.selected a img.vimg2 { width: 1rem; display: block; margin: 4% 8% 4% 6%; }

  

   .z_nav .nav ul li ul { background: #fff; margin: 0; padding: 1rem 1rem; box-sizing: border-box; }

  

   .z_nav .nav ul li ul li { border: 0; margin-bottom: 0.5rem; padding: 0; border-bottom: 1px solid #f2f3f5; }

  

   .z_nav .nav ul li ul li a { font-size: 14px; color: #333333; margin-bottom: 0; }

 

.b_banner{margin-top:0px;}

 



.s_pro_center {

    max-width: 1200px;

    display: block;

    margin: 0 2%;

}





 .m_foot_imgs {

    float: right;

    margin: 20px 0px 0 0;

}



}



/*768*/





@media screen and (max-width:768px){







.web{display:none;}



.mobile{display:block;}



.m_logo{width:300px; float:left;}



 
 .m_company img{max-width:100%;  display:block; margin:0 auto; }





.mobile1{width:60px; position:relative; z-index:50; float:right;  margin:1% 6% 0 2%;}



.mobile1 img{width:100%;}



.mob_seabox{ 

width: 50px; 

float:right;

opacity: 1;

}



.mob1{width:90%;  height:64px; float:left; background:#fff; position:fixed; z-index:122;  left:4%; top:82px; 

border-radius:60px; 

border: 1px solid #D9D9D9;  display:none; }





.mob1 .sinp1{width:76%; height:64px; float:left; background:transparent; padding-left:4%; border:none; border-radius:0px; font-size:16px; color:#B3B3B3; text-align:left; line-height:64px; font-weight:normal;  }





.mob1 .sinp2{width:20%; height:64px; float:left; background:transparent; border:none; border-radius:0px; font-size:20px; color:#333; text-align:center; line-height:64px; font-weight:normal;  border-top-right-radius:0px; border-bottom-right-radius:0px; cursor:pointer;  }







  .z_mhead { position: relative;  width: 100%; left: 0; height:82px; box-sizing: border-box; padding: 0 0%; z-index: 45;  display: block; background:#4184C9;  }

  

   

   .z_mhead .logo { width:100px; float: left; margin: 1rem 0 .2rem 1%; }



   .z_mhead .logo  img{width:100%;}





   .z_mhead .nav { position: relative; width: 52px; height: 52px; background: url(../images/menu01.png) no-repeat center center; background-size: 100%; border-radius: 0px; right:4%; top:1rem; display: block; z-index: 55; float:right; }

  

   .z_nav { position: fixed; width: 100%; height: calc(100% - 0rem); left: 0%; top: 82px; z-index: 99; display: none; }

  

   .z_nav .navleft { width: 30%; float: left; background: rgba(0, 0, 0, 0.1); height: 100vh; overflow: hidden; }

  

   .z_nav .nav { width: 70%; float: left; background: #fff; height: calc(100% - 0rem); overflow-y: auto; overflow-x: hidden; }

  

   .z_nav .nav ul { width: 100%; float: left; margin: 3% 0 3% 0%; border-top: 1px dashed #f2f3f5; }

  

   .z_nav .nav ul li { width: 100%; min-height: 3rem; float: left; border-bottom: 1px dashed #f2f3f5; }

  

   .z_nav .nav ul li.selected { }

  

   .z_nav .nav ul li a { height: 3rem; display: flex; align-items: center; justify-content: space-between; width: 100%; float: left; margin: 0 3%; font-size: 16px; color: #333; line-height: 3rem; }

  

   .z_nav .nav ul li a img.vimg1 { width: 1rem; display: block; margin: 4% 8% 4% 6%; }

  

   .z_nav .nav ul li a img.vimg2 { width: 1rem; display: none; margin: 4% 8% 4% 6%; }

  

   .z_nav .nav ul li.selected > a { color: #d12014; }

  

   .z_nav .nav ul li.selected a img.vimg1 { width: 1rem; display: none; margin: 4% 8% 4% 6%; }

  

   .z_nav .nav ul li.selected a img.vimg2 { width: 1rem; display: block; margin: 4% 8% 4% 6%; }

  

   .z_nav .nav ul li ul { background: #fff; margin: 0; padding: 1rem 1rem; box-sizing: border-box; }

  

   .z_nav .nav ul li ul li { border: 0; margin-bottom: 0.5rem; padding: 0; border-bottom: 1px solid #f2f3f5; }

  

   .z_nav .nav ul li ul li a { font-size: 14px; color: #333333; margin-bottom: 0; }

 



.m_banner{margin-top:0px;}



 





.m_foot_tylist{max-width:266px;}





.m_foot_imgs {

    float: right;

    margin: 60px 0px 0 0;

}





}



 

/*414*/

@media screen and (max-width:414px){




 

.z_mhead .logo {

    width: 100px;

    float: left;

    margin: 1rem 0 0.2rem 3%;

}

 

.z_mhead .nav{   width: 40px; height: 40px; right:3%;}



.mobile1 {

    width: 40px;

    position: relative;

    z-index: 50;

    float: right;

    margin: 3% 12% 0 2%;

}



.mob_seabox {

    width: 40px;

    float: right;

    opacity: 1;

}











.m_box {

    width: 100%;

    float: left;

    margin: 20px 0;

} 





.m_foot_logo {

    width: 40%;

    float: left;

    margin: 3% 1% 1% 0;

}



.m_foot_tylist {

    max-width: initial;

}



.m_foot_imgs {

    float: right;

    margin: 20px 0px 0 0;

}





.s_banner_bg ul li {

    display: inline-block;

    margin: 0 auto;

    width: 23%;

padding:0 1%;

}



.s_banner_bg ul li a{ padding:10px 5px 10px 15px; font-size:12px; line-height:20px;}



.m_inc_center {

    width: 94%;

    max-width: initial;

    display: block;

    margin: 0 auto;

}



.s_prolist dl {

    width: 105%;

    float: left;

}



.s_prolist dl dd {

    width: 43%;

    float: left;

    padding: 1%;

    margin: 1% 5% 3% 0;

    border-radius: 20px;

    background: #FFFFFF;

    box-shadow: 0px 0px 10px #7F9999;

}



.s_prolist dl dd h4{font-size:16px;}





.m_foot_tylist ul li:first-child font{font-size:14px;}

.m_foot_tylist ul li font{font-size:12px;}





.s_pro_imgs img {

    width: 100%;

    float: left;

}



.s_pro_txt {

    width: 96%;

    float: left;

    margin:3% 0 2% 4%;

}



.s_pro_txt h3{font-size:20px;}



.s_pro_center {

    max-width: 1200px;

    display: block;

    margin: 0 3%;

}



.m_footer_bot{

padding:5px 2%;

font-size:12px;

line-height:20px;

}

.z_banner_bg font {

    float: left;

    font-size: 20px;

    font-weight: 500;

    letter-spacing: 0px;

    line-height: 60px;

    color: rgba(255, 255, 255, 1);

    text-align: left;

    margin-top: 3%;

}



.s_applist dl dd:first-child .imgs1 {
    width: 100%;
    height:11.7rem;
    float: right;
    position: relative;
    overflow: hidden;
}


.s_applist dl dd .imgs1{width:100%; height:11.7rem; float:right; position: relative;  overflow:hidden;   }


.s_applist dl dd:nth-child(2n) .imgs1{width:100%;  height:11.7rem;  float:left;  position: relative;  overflow:hidden; }


.s_applist dl dd img,.s_applist dl dd:nth-child(2n) img {

    width: 100%;

    float: left;

}

.s_app_con h3 {

    width: 100%;

    float: left;

    font-size: 26px;

    font-weight: 500;

    letter-spacing: 0px;

    line-height: 50px;

    color: rgba(0, 0, 0, 1);

    text-align: left;

    padding: 0px 0 10px 0;

}



.s_applist dl dd .s_app_con{width:100%; margin:2% 0 4% 0; font-size:14px; }





 

.s_newimgs dl dd {

    width: 96%;

    float: left;

    padding: 0%;

    margin: 1% 4% 1% 0;

    border-radius: 10px;

    background: #FFFFFF;

    box-shadow: 0px 0px 10px #7F9999;

    position: relative;

    z-index: 20;

    overflow: hidden;

}



.s_newshow h3{font-size:18px;}







}











@media screen and (max-width:380px){



.z_mhead .logo {

    width: 34%;

    float: left;

    margin: 0.5rem 0 0.2rem 1%;

}



  .s_videos {
    width: 100%;
    float: left;
    margin: 2% 0%;
    height: auto;
    overflow: hidden;
}

.z_mhead .nav {

    width: 34px;

    height: 34px;

    right:2%;

}



.mob_seabox {

    width: 34px;

    float: right;

    opacity: 1;

    margin: 7px 0 0 0;

}



 



}



































