@charset "utf-8";

/*
   CopyRight sem-cms.com
   developer:Hei mayi 
   QQ:1181698019
   E-mail:1181698019@qq.com
   Thank you for using! 
*/
 
html, body { 
  height: 100%; margin: 0px; padding: 0px; 
  margin:0px auto;
  }
a{color: #666; text-decoration: none;}
a:hover{color: #000;}
*{margin:0; padding:0;}
body,input,textarea{font-family:Arial, Helvetica, sans-serif; font-size: 12px; color: #666; }
img{max-width: 100%;border: 0;} 
ul,li{list-style:none;}
  .cb{clear: both;}

      .index_cent{width: 70%;margin:40px auto 0 auto; position: relative;}
      .index_cent_top{width: 100%;float: left; text-align: center; padding-top: 20px;}
      .index_cent_mid{width: 100%;float: left; margin-top:10px;}
      .index_cent_mid span{display: inline-block;width:40%; margin:auto; padding: 6px 0; line-height: 180%;background: #081d3a;float: left; margin:10px 5%; text-align: center; }
      .index_cent_mid span:nth-child(1){ display: inline-block;width:40%; margin:auto; padding: 6px 0; line-height: 180%;background: #081d3a;float: left; margin:10px 5%; text-align: center; }
      .index_cent_mid span:nth-child(2){ display: inline-block;width:40%; margin:auto; padding:6px 0; line-height: 180%;background: #192d4b;float: left; margin:10px 5%; text-align: center; }
      .index_cent_mid span a{color: #fff;font-size: 14px;}
      .index_cent_bot{ position: absolute;bottom: 25px; text-align: center; width: 100%;font-size: 12px;color: #999; }

.types{width: 1100px;margin:auto; background: #eee;    background: rgba(255,255,255,0.8); -webkit-box-shadow: 0px 15px 20px rgb(50 50 50 / 45%);
    -moz-box-shadow: 0px 15px 20px rgba(50, 50, 50, 0.45);
    box-shadow: 0px 15px 20px rgb(50 50 50 / 45%);}

.types_top{ width: 100%;float: left; padding: 7px 0; background: #003366; color: #fff;-webkit-box-shadow: 0px 12px 10px rgba(50, 50, 50, 0.6);
    -moz-box-shadow: 0px 12px 10px rgba(50, 50, 50, 0.6);
    box-shadow: 0px 12px 10px rgba(50, 50, 50, 0.6); z-index: 9999;position: relative
}
.types_top a{color: #fff; text-decoration: none;}
.types_top a:hover{color: #335c85;}
.shar{position: absolute; right: 20px; margin-top:5px;z-index: 10000;}
.shar img{margin-left: 5px;}
.types_top_left{ width: 20%;float: left; }
.types_top_left img{width: 180px; margin-left: 10px; display: block;}
.types_top_right{width: 80%;float: left;}
.types_top_right span{display: inline-block; padding: 10px 5px; position: relative; }
.types_top_right span:hover .xl1{ display:block; }
.types_top_right span div{width: 180px; background: #333;}
.types_top_right span div li{width: 100%;float: left;box-sizing: border-box; padding:8px 5px;border-bottom: 1px solid #666; color: #fff; position: relative;}
.types_top_right span div li:hover .xl2{display: block;}
.types_mid{width: 100%;float: left;}
.types_mid_banner{ width: 100%;float: left;z-index: 1; position: relative;  }

.types_mid_banner img{width: 100%;}
.types_mid_banner2{ width: 100%;float: left;z-index: 1; position: relative; }
.types_mid_banner2 img{max-width: 100%;}
.types_mid_b2{width: 100%;float: left;background: #fff;}
.types_mid_b2 div{width: 33.333%; padding: 10px 1%; box-sizing: border-box;float: left; background: #fff;text-align: center;}
.timg{position: absolute;right: 0; width: 50%;}
.ttext{position: absolute;left: 5%;top:20px;font-family: 'Roboto', Arial, Helvetica, sans-serif; color: #fff;font-weight:normal}
.ttext img{max-width: 100%;}
.ttext h1{font-size: 40px;font-weight:normal}
.types_mid_bot{width: 100%;float: left;background: #fff;padding: 20px 2.5%; font-size: 12px; box-sizing: border-box;}
.types_mid_bot div{width: 16.666%;float: left;}
.types_mid_bot div li{width: 100%;float: left; height: 30px; overflow: hidden;  }
.types_mid_bot div li:nth-child(1){color: #000;}
.types_mid_bot div li img{ height:30px; }
.types_mid_nrr{width: 90%; margin:auto;  top: -220px;  background: #fff;  z-index: 2;position: relative; margin-bottom: 40px;background: rgba(255,255,255,0.75); padding:1.5% 0;    -webkit-box-shadow: 0px 15px 20px rgb(50 50 50 / 45%);
    -moz-box-shadow: 0px 15px 20px rgba(50, 50, 50, 0.45);
    box-shadow: 0px 15px 20px rgb(50 50 50 / 45%);
    overflow: hidden;
}

.types_mid_nr{width: 90%; margin:auto;  top: -350px;  background: #fff;  z-index: 2;position: relative; margin-bottom: 40px;background: rgba(255,255,255,0.75); padding:1.5% 0;    -webkit-box-shadow: 0px 15px 20px rgb(50 50 50 / 45%);
    -moz-box-shadow: 0px 15px 20px rgba(50, 50, 50, 0.45);
    box-shadow: 0px 15px 20px rgb(50 50 50 / 45%);
    overflow: hidden;
}
.types_mid_nr2{width:97%; padding: 1.5%;box-sizing: border-box;   margin:auto;   z-index: 3;position: relative; background: #fff; line-height: 180%;}
.types_mid_nr3{width:97%; padding: 1.5%;box-sizing: border-box;   margin:auto;   z-index: 3;position: relative; line-height: 180%;}

.types_mid_pv{width: 100%;float: left;}
.types_mid_pv_1{width: 100%;float: left;}
.types_mid_pv_1_left{width: 60%;float: left; line-height: 180%;}
.types_mid_pv_1_right{ width: 38%;float: right; }
.types_mid_pv_1_right_1{width: 100%;float: left;}
.types_mid_pv_1_right_1 a{color: #69c;}
.types_mid_pv_1_right_1 li{list-style-type:disc; width: 100%;float: left;}
.types_mid_pv_1_right_2{width: 100%;float: left;}
.types_mid_pv_2{width: 100%;float: left;line-height: 180%; overflow: hidden;}

.types_news{width: 100%;float: left;}
.types_news div{width: 19%;float: left; padding: 0.5%;  box-sizing: border-box; border-top:2px solid #96acc6;border-bottom:2px solid #96acc6; margin: 10px 0.5%;}
.types_news div li:nth-child(1){text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;}
.types_news ul{width: 100%;float: left;}
.types_contact{width: 100%;float: left;}
.ly_1{width: 96%;float: left; padding: 10px;border:1px solid #efefef;}
.ly_2{width: 96%;float:left; height: 100px; border:1px solid #efefef;padding: 10px;}
.ly_3{width: 50%;float: left; padding: 10px;border:1px solid #efefef}
#button{ background: #036; color: #fff; padding: 10px 20px;border:none; cursor: pointer; }
#buynow td{padding: 10px 0;}
.xl1{display: none;position: absolute; cursor: pointer; top: 35px;}
.xl2{display: none; position: absolute;left:180px;top:0px; width: 180px; background: #000;color: #fff;}
.xl2 dd a{width: 100%;float: left; padding: 8px 5px;border-bottom: 1px solid #333;box-sizing: border-box;background: #000;}
.types_products{width: 100%;float: left;}
.types_products_1{width: 100%;float: left; padding: 10px 0; border-top: 2px solid #666;font-weight: bold;font-size: 18px; background: #fff; margin-top:20px;}
.types_products_1 span{display: inline-block; padding: 5px 15px; background: #003366; color: #fff;}
.types_products_2{width: 100%;float: left; background:#fff; }
.types_products_2 div{width: 20%;float: left; padding: 2%;box-sizing: border-box;}
.types_products_2 div li{width: 100%;float: left; padding: 5px 0; text-align: center;}
.types_products_2 div li:nth-child(1){   overflow: hidden; }
.types_products_2 a{color: #333;}
.types_products_3{text-transform:uppercase; width: 100%;float: left; text-align: center; padding: 30px 0;font-size: 30px;font-weight: bold; margin-top: 30px;}
.types_products_4{width: 100%;float: left; padding: 10px 0; background: #036; text-align: center; color: #fff;}
.types_products_4 span{display: inline-block;padding: 8px 20px;border-radius: 50px; }
.types_products_4 a{color: #fff;}
.spbg{background: #000;color: #fff;}
 

.types_prosp{width: 100%;float: left; background: #fff;}
.types_prosp ul:nth-child(1){background:#003366;color: #fff;}
.types_prosp ul{width: 100%;float: left; border-top:1px solid #eee; margin-bottom: 10px;}

.types_prosp dt{width: 20%;float:left;box-sizing: border-box;text-align: center; font-size:12px; padding: 20px 0;font-weight:bold;color:#000;}
.types_prosp dd{width: 80%;float: left;box-sizing: border-box;padding: 20px 1%;border-left:1px solid #eee;font-size: 12px;}
.types_prosp dd div{width: 20%;float: left; padding: 1%;box-sizing: border-box; }
.types_prosp dd div li:nth-child(1){ overflow: hidden;  }
.types_prosp dd div li{width: 100%;float: left; padding: 5px;text-align: center;}
.menus{display: none;padding: 8px 10px;background: #001933; color: #fff; position: absolute; z-index: 99999; right: 30%; top:15%;}


#rcat{width: 50px;  position: fixed;right: 0;bottom: 100px; z-index: 9999999;}
#rcat li{width: 50px; height: 50px;line-height: 55px;background: #036;color: #fff; text-align: center; margin-bottom: 2px; position: relative; cursor: pointer;}
#rcat li div{height: 50px; position: absolute; right: 50px; background: #036;color: #fff; display: none;top:0; padding: 0 10px;font-size: 16px;}

#rcat li a{color: #fff;}
#rcat li:hover div,#rcat li:hover{display: block;background: #335c85;}

#rcat li span{width: 100px; height: 100px; overflow: hidden; position: absolute;right: 50px;background: #fff; display: none;}
#rcat li:hover span{display: inline-block;}
@media screen   and (min-width:1px) and (max-width:1101px) {

.types{width: 100%;}
.index_cent{width: 90%;}
.types_mid_b2 div{width: 50%; padding: 10px 1%; box-sizing: border-box;float: left; background: #fff;text-align: center;}
.types_mid_bot div{width: 50%;float: left;}

.types_mid_nr{width: 90%; margin:auto;  top: -80px;  background: #fff;  z-index: 2;position: relative; margin-bottom: 40px;background: rgba(255,255,255,0.75); padding:1.5% 0;    -webkit-box-shadow: 0px 15px 20px rgb(50 50 50 / 45%);
    -moz-box-shadow: 0px 15px 20px rgba(50, 50, 50, 0.45);
    box-shadow: 0px 15px 20px rgb(50 50 50 / 45%);
}
 
.types_mid_nrr{width: 90%; margin:auto;  top: -100px;  background: #fff;  z-index: 2;position: relative; margin-bottom: 40px;background: rgba(255,255,255,0.75); padding:1.5% 0;    -webkit-box-shadow: 0px 15px 20px rgb(50 50 50 / 45%);
    -moz-box-shadow: 0px 15px 20px rgba(50, 50, 50, 0.45);
    box-shadow: 0px 15px 20px rgb(50 50 50 / 45%);
}
.types_mid_pv_1_left{width: 100%;float: left; line-height: 180%;}
.types_mid_pv_1_right{ width: 100%;float: right; }
.types_prosp dd div li:nth-child(1){height: auto; overflow: hidden; }
.types_products_2 div li:nth-child(1){ height: auto; overflow: hidden; }
.types_top_right{width: 100%;float: left;  position: absolute;top:30px; display: none;}
.types_top_left{ width: 100%;float: left; }
.types_top_left img{width: 40%; margin-left: 10px; display: block;}
.shar{position: absolute; right: 10px; margin-top:1%;z-index: 10000;}

.types_top_right span{display: block; padding: 10px 5px; position: relative; background: #036; }
.types_top_right span:hover .xl1{ display:block; }
.types_top_right span div{width: 100%;float: left; background: #333;}
.types_top_right span div li{width: 100%;float: left;box-sizing: border-box; padding:8px 5px;border-bottom: 1px solid #666; color: #fff; position: relative;}
.types_top_right span div li:hover .xl2{display: block;}
.types_top_right span div{width: 100%; background: #333;}
.xl1{display: none;position: relative; cursor: pointer; top: 0;width: 100%;z-index: 99999; margin:10px 0;}
.xl2{display: none; position: relative;left:0;top:0px; width: 100%; background: #000;color: #fff;z-index: 99999;margin:10px 0;}
.menus{display: inline-block;}
.types_news div{width: 49%;float: left; padding: 0.5%;  box-sizing: border-box; border-top:2px solid #96acc6;border-bottom:2px solid #96acc6; margin: 10px 0.5%;}
}