@charset "utf-8";


.sina-nav .sina-menu  .hover a { color: #0191ed;}
#navbar-menu .sina-menu  .hover a { color: #0191ed;}
/*******************************BANNER**********/
.banner { width: 100%; height: auto; overflow: hidden; position: relative;}
.banner  img { width: 100%;}
.banner .txt  { padding-right: 15px; text-align: right; position: absolute; top: 30%; left: 0; width: 100%;height: auto;font-size: 35px;font-family: SourceHanSansCN;font-weight: 500;color: #009CFF;}
/*******************************TITLE**********/
.title { width: 100%; height: auto; text-align: center;}
.title h3 {width: auto;height: auto;font-size: 24px;font-weight: bold;color: #313131;line-height: 35px;}
.title h4 {width: auto;height: auto;font-size: 14px;font-weight: bold;color: #959595;line-height: 24px;}
/*******************************PRODUCT TYPE**********/
.index-pro { width: 100%; padding: 60px 0;}
.index-pro-type ul { margin: 60px auto 70px auto;}
.index-pro-type ul li a { display: block; margin: 0 4px; padding: 6px 27px;  margin-bottom: 10px;border: 1px solid #b5b4b4; font-size: 14px;font-weight: 400;color: #747474;line-height: 24px;}
.index-pro-type ul li a:hover { color: #fff; background-color: #0191ed;}
.index-pro-type  .active a { background-color: #0191ed; color: #fff;}
.index-pro-type  .active a:hover { color: #fff; background-color: #0191ed;}
/******************************* Index Product **********/
.pro-list ul li { width: 19%; height: auto; background-color: #fff; margin: 12px 0.5%; }
.pro-list ul li img { width: 100%;}
.pro-list ul li .title {width: 100%;height: auto;  line-height: 24px;  text-align:center;margin-top: 20px;}
.pro-list ul li .title a { font-size: 14px;font-weight: 400;color: #747474;}
.pro-list ul li:hover .title a { color: #0191ed;}
/******************************* Index About **********/
.index-about { padding: 60px 0 ; background: url("../img/index_about_bg.jpg") no-repeat; height:100%;width:100%; overflow: hidden; background-size:cover;}
.index-about .txt { margin:40px  auto; width: 963px;height: auto;font-size: 16px; font-weight: 400; color: #FFFFFF; line-height: 30px;}
/******************************* INDEX CONTACT **********/
.index-contact { padding: 60px 0 ; background: url("../img/index_contact_bg.jpg") no-repeat; height:100%;width:100%;  overflow: hidden; background-color: #003d63; background-repeat: no-repeat;  background-position: center top}
.index-contact .txt { text-align: center; width: 910px; margin: 30px auto; }
.index-contact .txt ul {margin-left:-38px; }
.index-contact .txt ul li img { margin-bottom:10px;}
.index-contact .txt ul li:nth-child(2) { margin: 0px 130px 0px 70px;}
.index-contact .txt p  {width: 100%;height: auto;font-size: 14px;font-weight: 400;color: #FFFFFF; line-height: 22px; overflow: hidden; word-wrap: break-word;word-break: normal;}
.index-contact .txt h3 {width: auto;height: auto;font-size: 14px;font-weight: 600;color: #FFFFFF; line-height: 22px;}
/*******************************  FOOTER **********/
.footer { width: 100%; height: auto; background-color: #012942; padding: 40px 0px 20px 0px; text-align: center;}
.footer p {width: 100%;height: auto; font-size: 12px;font-family: SimSun;font-weight: 400;color: #FFFFFF;line-height: 24px;}
.footer  a { color: #FFFFFF;}
/*******************************  PRODUCT SHOW **********/
.pro-show { width: 1110px ; margin: 0 auto;  margin-bottom: 100px;}
.pro-show ul li { width: 34.5%;}
.pro-show ul li:last-child { width: 65.5%;}
.pro-show .right { padding-left: 50px; width: 100%; height: auto; overflow: hidden;}
.pro-show .title h2 { padding-bottom: 18px; border-bottom: 1px solid #b2b2b2; width: 100%;height: auto; text-align: left; font-size: 14px;font-weight: bold;color: #000000;}
.pro-show .txt {padding-top: 40px; width: 100%; height: auto; font-size: 14px;font-weight: 500; color: #747474;line-height: 24px;}
.pro-show .img { width: 100%;}
.pro-show .img img { width: 100%;}
/******************************* DEVICE **********/
.device-list { width:1260px; margin: 50px auto;}
.device-list ul li { width: 24%; height: auto; background-color: #fff; margin: 6px 0.47%; }
.device-list ul li img { width: 100%;}
.device-list .txt { width: 100%; position: relative;}
.device-list .txt .title { text-align: right; padding: 0 10px; position: absolute; bottom: 10px; width: 100%; height: auto;font-size: 16px;font-weight: bold; color: #FFFFFF;line-height: 27px; text-shadow: 0px 0px 11px rgba(0,0,0,0.74);}
/******************************* ABOUT **********/
.about { width: 100%; padding: 60px 0 45px 0;}
.about-txt { width: 100%; margin: 40px auto 0px auto;}
.about-txt ul li {width: 45.5%;}
.about-txt ul li .img {width: 100%;}
.about-txt ul li .img img{width: 100%; height: 100%;}
.about-txt ul li:last-child {width: 54.5%;}
.about-txt .txt {width: 100%; padding: 0 50px; height: auto;font-size: 16px;font-weight: 400;color: #747474; line-height: 30px;}

/******************************* ABOUT Main2**********/
.about-min2 .img { padding: 6px 6px; width: 100%; height: auto; background-color: rgba(255,255,255,0.4);}
.about-min2 .img img { width: 100%; height: 100%;}
/* 去除点击选项卡时出现的蓝色边框 */
.swiper-button-prev { outline: none;}
.swiper-button-next { outline: none;}
/******************************* CONTACT**********/
.contact {background: url("") no-repeat; }
.contact .txt h3 { color: #000;}
.contact .txt p { color: #000;}

#contactmap {width: 100%; height: 580px;}


/****************************一般手机**********/
@media (max-width: 575px){
/******************************* banner**********/
.banner .txt  { position: absolute; top: 25%;  font-size: 24px;}
/******************************* Index Product type**********/
.index-pro { padding: 40px 0;}
.index-pro-type ul { margin: 30px auto 40px auto;}
.index-pro-type ul li a { margin: 0 4px; padding: 10px 15px; text-align: center; min-width: 100px;  margin-bottom: 10px; }
/******************************* Index Product **********/
.pro-list ul li { width: 48%;  margin: 12px 1%; }
/******************************* Index About **********/
.index-about .txt { margin:20px  auto; width: 100%; font-size: 14px; }
/******************************* INDEX CONTACT **********/
.index-contact { padding:60px  0 0 0; height:auto; }
.index-contact .txt { text-align: center; width: 100%; margin: 10px auto; }
.index-contact .txt ul {margin-left:0px; margin-top: 20px; }
.index-contact .txt ul li:nth-child(2) { margin: 20px 0px 0px 0px;}
.index-contact .txt ul li { width: 32%; margin: 20px 1%; height: auto; }
.index-contact .txt p  {font-size: 14px; width: 100%;  padding: 10px 10px;}
/*******************************  PRODUCT SHOW **********/
.pro-show { width: 100% ;  margin-bottom: 50px;}
.pro-show ul li { width: 100%;}
.pro-show ul li:last-child { width: 100%;}
.pro-show .right { padding-left: 0px; }
.pro-show .title h2 {   margin-top: 30px;}
.pro-show .txt {padding-top: 20px; }
/******************************* DEVICE **********/
.device-list { width:100%; margin: 40px auto 20px auto;}
.device-list ul li { width: 49%; height: auto; background-color: #fff; margin: 3px 0.5%; }
.device-list .txt .title {  padding: 0 10px;  bottom: 10px; font-size: 14px;line-height: 20px; }
/******************************* ABOUT **********/
.about { width: 100%; padding: 40px 0;}
.about-txt { width: 100%; margin: 40px auto 0px auto;}
.about-txt ul li {width: 100%;}
.about-txt ul li:last-child {width: 100%;}
.about-txt .txt {width: 100%; padding: 20px 0px; }



}

/*******************智能手机或平板*********/
@media (min-width: 576px) and (max-width: 767px){ 
/******************************* banner**********/
.banner .txt  { position: absolute; top: 25%;  font-size: 24px;}
/******************************* Index Product type**********/
.index-pro { padding: 40px 0;}
.index-pro-type ul { margin: 30px auto 40px auto;}
.index-pro-type ul li a { margin: 0 4px; padding: 10px 15px; text-align: center; min-width: 85px;  margin-bottom: 10px; }
/******************************* Index Product **********/
.pro-list ul li { width: 48%;  margin: 12px 1%; }
/******************************* Index About **********/
.index-about .txt { margin:20px  auto; width: 100%; font-size: 14px; }
/******************************* INDEX CONTACT **********/
.index-contact { padding: 50px  0 0 0; height:auto;  }
.index-contact .txt { text-align: center; width: 100%; margin: 10px auto; }
.index-contact .txt ul {margin-left:0px; margin-top:20px; }
.index-contact .txt ul li:nth-child(2) { margin: 20px 0px 0px 0px;}
.index-contact .txt ul li { width: 32%; margin: 20px 1%; height: auto; }
/*******************************  PRODUCT SHOW **********/
.pro-show { width: 100% ;  margin-bottom: 50px;}
.pro-show ul li { width: 100%;}
.pro-show ul li:last-child { width: 100%;}
.pro-show .right { padding-left: 0px; }
.pro-show .title h2 {   margin-top: 30px;}
.pro-show .txt {padding-top: 20px; }
/******************************* DEVICE **********/
.device-list { width:100%; margin: 40px auto 20px auto;}
.device-list ul li { width: 32%; height: auto; background-color: #fff; margin:3px 0.5%; }
.device-list .txt .title {  padding: 0 10px;  bottom: 10px; font-size: 14px;line-height: 20px; }
/******************************* ABOUT **********/
.about { width: 100%; padding: 40px 0;}
.about-txt { width: 100%; margin: 40px auto 0px auto;}
.about-txt ul li {width: 100%;}
.about-txt ul li:last-child {width: 100%;}
.about-txt .txt {width: 100%; padding: 20px 0px; }


}

/*****************Ipad 平板***************/
@media (min-width: 768px) and (max-width: 991px) { 
/******************************* banner**********/
.banner .txt  { position: absolute; top: 25%;  font-size: 26px;}
/******************************* Index Product type**********/
.index-pro { padding: 40px 0;}
.index-pro-type ul { margin: 30px auto 40px auto;}
.index-pro-type ul li a { margin: 0 4px; padding: 10px 15px; text-align: center; min-width: 100px;  margin-bottom: 10px; }
/******************************* Index About **********/
.index-about .txt { margin:20px  auto; width: 100%; font-size: 14px; }
/******************************* INDEX CONTACT **********/
.index-contact { padding: 50px  0 0 0; height:auto;}
.index-contact .txt { text-align: center; width: 100%; margin: 10px auto; }
.index-contact .txt ul {margin-left:0px; margin-top:20px; }
.index-contact .txt ul li:nth-child(2) { margin: 20px 0px 0px 0px;}
.index-contact .txt ul li { width: 32%; margin: 20px 1%; height: auto; }
.index-contact .txt p  { padding: 20px 10px;}
/*******************************  PRODUCT SHOW **********/
.pro-show { width: 100% ;  margin-bottom: 80px;}
.pro-show ul li { width: 40%;}
.pro-show ul li:last-child { width: 60%;}
.pro-show .right { padding-left: 30px; }
.pro-show .txt {padding-top: 20px; }

/******************************* DEVICE **********/
.device-list { width:100%; margin: 40px auto 20px auto;}
.device-list ul li { width: 32%; height: auto; background-color: #fff; margin:3px 0.5%; }
.device-list .txt .title {  padding: 0 10px;  bottom: 10px; font-size: 14px;line-height: 20px; }
/******************************* ABOUT **********/
.about { width: 100%; padding: 40px 0;}
.about-txt { width: 100%; margin: 40px auto 0px auto;}
.about-txt ul li {width: 100%;}
.about-txt ul li:last-child {width: 100%;}
.about-txt .txt {width: 100%; padding: 20px 0px; }



}

/*****************Ipad Pro **************/
@media (min-width:  991px) and (max-width: 1024px) { 
/******************************* banner**********/
.banner .txt  { position: absolute; top: 25%;  font-size: 30px;}
 /******************************* Index About **********/
.index-about .txt { margin:20px  auto; width: 100%; font-size: 14px; } 

/******************************* INDEX CONTACT **********/
.index-contact { padding: 60px 0 60px 0;  }
/*******************************  PRODUCT SHOW **********/
.pro-show { width: 100% ;  margin-bottom: 80px;}

/******************************* DEVICE **********/
.device-list { width:100%; margin: 40px auto 20px auto;}
.device-list ul li { width: 32%; height: auto; background-color: #fff; margin:3px 0.5%; }
.device-list .txt .title {  padding: 0 10px;  bottom: 10px; line-height: 20px; }



}

/***********笔记本电脑或小屏显示器*********/ 
@media (min-width: 1025px) and (max-width: 1359.98px) { 
  /******************************* banner**********/
.banner .txt  { position: absolute; top: 25%;  font-size: 30px;}  
/*******************************  PRODUCT SHOW **********/
.pro-show { width: 100% ;  margin-bottom: 80px;}  


/******************************* DEVICE **********/
.device-list { width:100%; margin: 40px auto 20px auto;}
.device-list ul li { width: 32%; height: auto; background-color: #fff; margin:3px 0.5%; }
.device-list .txt .title {  padding: 0 10px;  bottom: 10px; line-height: 20px; }



}

/**********************大屏幕**************/  
@media (min-width: 1360px) and (max-width: 1549.98px) { 

/******************************* DEVICE **********/
.device-list { width:100%; margin: 40px auto 20px auto;}


}

    
/*****************超大屏幕**************/
@media (min-width: 1550px) { 
  
  .container {min-width:1350px;width:1350px; padding: 0 0; } 


}