.swiper-pagination-bullet {
  width: 30px;
  height: 2px;
  border-radius: 0;
  background: #fff;
  opacity: .2;
}
  
.swiper-pagination-bullet-active {
  width: 60px;
  opacity: 1;
}

.product_wrapper{
    position: relative;
}
.product_wrapper .container .nav {
  height: 60px;
  line-height: 80px;
  display: flex;
  justify-content: flex-end;
}
.product_wrapper .container .nav li{ 
  margin: 0 10px;
}
.product_wrapper .container .content{
  /* padding: 0 390px; */
  /* background-color: yellow; */

}
.content1,.content2,.content3{
  display: none;
  word-break: break-word;
  word-wrap: break-word;
  margin: 0 auto;
}
.content1 .door_Mage, .check_Mage, .stuff_Mage, .parent_Mage, .kid_Mage, .group_Mage, .outIn_Mage, .tel_Mage,.map_Mage, .monitor_Mage, .breakfast_Mage, .info_Mage, .lock_Mage, .car_Mage,.shool_Mage, .face_Mage{
  display: flex;
  justify-content: space-around
} 

.doorMage_info, .checkMage_info, .stuffMage_info, .parentMage_info, .kidMage_info, .groupMage_info, .outInMage_info, .telMage_info, .mapMage_info, .monitorMage_info, .breakfastMage_info, .infoMage_info, .lockMage_info, .carMage_info, .shoolMage_info, .faceMage_info{
  align-self: center;
}
.doorMage_info h6,.checkMage_info h6,.stuffMage_info h6, .parent_Mage h6, .kidMage_info h6 , .groupMage_info h6, .outInMage_info h6 ,.telMage_info h6, .mapMage_info h6, .monitorMage_info h6, .breakfastMage_info h6,.infoMage_info h6, .lockMage_info h6, .carMage_info h6, .shoolMage_info h6,.faceMage_info h6{
  color: #FFAA33;
  font-size: 36px;
  font-family: MicrosoftYaHei;
  font-weight: Regular;
}
.doorMage_info p,.checkMage_info p, .stuffMage_info p, .parentMage_info p, .kidMage_info p,.groupMage_info p, .outInMage_info p, .telMage_info p, .mapMage_info p, .monitorMage_info p, .breakfastMage_info p, .infoMage_info p,.lockMage_info p, .carMage_info p, .shoolMage_info p,.faceMage_info p{
  font-size: 20px;
  font-family: MicrosoftYaHeiLight;
  font-weight: Light;
  color: #333333;
}

.doorMage_info p{
  width: 379px;
  height: 90px;
}
.doorMage_img{
  width: 620px;
  height: 650px;
}
/* 巡检 */
.checkMage_info p{
  width: 378px;
  height: 90px;
}
.check_img{
  width: 920px;
  height: 650px;
}

/* 考勤 */
.stuffMage_info p{
  width: 360px;
  height: 89px;
}
.stuffMage_img{
   width: 982px;
   height: 650px; 
}

/* 教师 */
.parent_Mage{
  /* width: 100%;
  background-color:#FFF2E2; */
}
.parentMage_info p{
  width: 377px;
  height: 89px;
}
.parentMage_img{
  width: 920px;
  height: 650px;
}

/* 幼儿园学生 */
.kidMage_info p{
  width: 341px;
  height: 124px;
}
.kidMage_img{
  width: 879px;
  height: 650px;
}
/* 集团 */
.groupMage_info p{
  width: 378px;
  height: 125px;
}
.groupMage_img{
  width: 920px;
  height: 650px;
}

/* 家长 */

/* 出入推送 */
.outInMage_info p{
  width: 366px;
  height: 55px;
}
.outInMage_img{
  width: 620px;
  height: 650px;
}

/* 即时通讯 */
.telMage_info p{
  width: 365px;
  height: 55px;
} 
.telMage_img{
  width: 920px;
  height: 650px;
}
/* 地图 */
.mapMage_info p{
  width: 347px;
  height: 55px;
}
.mapMage_img{
  width: 920px;
  height: 650px;
}
/* 实时监控 */
.monitorMage_info p{
  width: 378px;
  height: 90px;
}
.monitorMage_img{
  width: 640px;
  height: 650px;
}

/* 营养午餐 */
.breakfastMage_info p{
  width: 339px;
  height: 20px;                         
}
.breakfastMage_img{
  width: 920px;
  height: 650px;
}

/* 资讯 */
.infoMage_info p{
  width: 378px;
  height: 54px;
}
.infoMage_img{
  width: 920px;
  height: 650px;
}

/* 平安校园 */
/* 门禁 */
.lockMage_info p{
  width: 381px;
  height: 55px;
}
.lockMage_img{
  width: 640px;
  height: 650px;
}
/* 校车安全 */
.carMage_info p{
  width: 377px;
  height: 55px;
}
.carMage_img{
  width: 460px;
  height: 650px;
}
/* 环境监测 */
.shoolMage_info p{
  width: 360px;
  height: 89px;
}
.shoolMage_img{
  width: 560px;
  height: 650px;
}
/* 人脸识别抓拍 */
.faceMage_info p{
  width: 378px;
  height: 12px;
}
.faceMage_img{
  width: 800px;
  height: 650px;
}

/* .content1:target,.content2:target,.content3:target,.content4:target{
    display: block;
} */


.clickNav li :hover{
  border-bottom: 1px solid #FFAA33;
  color: #FFAA33;
}
 .clickNav li a {
  display: block;
  font-size: 16px;
  font-weight: 400;
  color: #000000;
  opacity: 0.7;
  padding: 0 24px;
  line-height: 40px;
  margin: 20px 0;
  position: relative;
}
.clickNav li .hover a:after {
  content: "";
  width: 100%;
  height: 1px;
  background: #FFAA33;
  position: absolute;
  left: 0;
  bottom: 0;
}
.clickNav li.active a{
  color: #FFAA33;
}
.clickNav li.active a:after {
  content: "";
  width: 100%;
  height: 1px;
  background: #FFAA33;
  position: absolute;
  left: 0;
  bottom: 0;
}