
.logo {
  width: 150px;
  height: 40px;
}
.nav {
  width: 1200px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;

  line-height: 70px;
  color: #666;
}
.nav ul {
  display: flex;
  align-items: center;
}
.nav a:hover {
  opacity: 0.8;
}
.left-ul {
  color: #333;
}
.left-ul li {

  margin: 15px;
  font-size: 14px;
}

.left-ul li.active{
  color: #0bc096;

}

.left-ul li.active .up{
  display: block;
  border-right: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #0bc096;
  border-left: 3px solid #0bc096;
  margin-left: 5px;
  margin-top: 5px;
  transform: rotate(45deg);
}
.left-ul li .down{
  display: block;
  content: '';
  border-right: 3px solid #666;
  border-bottom: 3px solid #666;
  border-top: 3px solid transparent;
  border-left: 3px solid transparent;
  margin-left: 5px;
  margin-top: -5px;
  transform: rotate(45deg);
}
.left-ul li:hover {
  color: #0bc096;
  cursor: pointer;
}
.left-ul li:hover::after{
  display: none;
}
.left-ul li:hover .up{
  border-right: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #0bc096;
  border-left: 3px solid #0bc096;
}
.nav img {
  width: 150px;
}
.search {
  border-left: 1px solid #e5e5e5;
  border-right: 1px solid #e5e5e5;
  padding: 0 15px;
}
.search input {
  outline: none;
  border: none;
}
.search input::placeholder {
  color: #999;
  font-size: 12px;
}
.search img {
  width: 12px;
}
.right-ul li {
  margin: 0 10px;
  color: #999;
  font-size: 12px;
}
.phone {
  border: 1px solid #0bc096;
  width: 140px;
  height: 34px;
  line-height: 34px;
  display: flex;
  align-items: center;
  border-radius: 34px;
  padding-left: 1px;
}
.phone img {
  width: 28px;
  height: 28px;
}
.phone span {
  margin-left: 5px;
  color: #0bc096;
  font-size: 18px;
  font-weight: bold;
  white-space: nowrap; /* 防止换行 */
}

/* 头部下拉模块 */
header{
  width: 100%;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 99999999;
  background: #fff;
}
.model{
  border-top: 1px solid #e5e5e5;
  box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.1);
  width: 100%;
  height: 0;
  overflow: hidden;
}


.model-con{
  width: 1200px;
  margin: 0 auto;
}

.model .m-nav{
  font-size: 14px;
  color: #666;
  padding: 20px 0 10px;
}

.model .content{
  display: flex;
  flex-wrap: wrap;
  
}

.model .model-item{
  
  width: 294px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  padding: 20px 10px 20px 20px;
  border: 1px solid #E2E2E2;
  margin-right: 8px;
}

.model .model-item:nth-child(4n){
  margin-right: 0;
}


.model-item div{
  font-size: 14px;
  color: #000;
  margin-bottom: 5px;
}

.model-item p{
  font-size: 12px;
  color: #999;
}

.model-item .img-icon{
  width: 30px;
  height: 30px;
  background-position-y: 0;
}

.model-item .hot{
  padding: 2px 8px;
  font-size: 12px;
  border-radius: 20px;
  color: #fff;
  margin-left: 5px;
  background: linear-gradient(90deg, #FF9944 0%, #FF7602 100%);
}

.model-con{
  display: none;
}


/* 资质许可 下拉 图标 */
.model-con:nth-child(1) .img-icon{
  background: url('../imgs/m-z-icon.png');
}

/* 认证服务 下拉 图标 */
.model-con:nth-child(2) .img-icon{
  background: url('../imgs/m-r-icon.png');
}

/* 网站服务 下拉 图标 */
.model-con:nth-child(3) .img-icon{
  background: url('../imgs/m-w-icon.png');
}

.model-con .model-item:nth-child(1) .img-icon{
  background-position-x: 0;
}
.model-con .model-item:nth-child(2) .img-icon{
  background-position-x: -30px;
}
.model-con .model-item:nth-child(3) .img-icon{
  background-position-x: -60px;
}
.model-con .model-item:nth-child(4) .img-icon{
  background-position-x: -90px;
}
.model-con .model-item:nth-child(5) .img-icon{
  background-position-x: -120px;

}
.model-con .model-item:nth-child(6) .img-icon{
  background-position-x: -150px;

}
.model-con .model-item:nth-child(7) .img-icon{
  background-position-x: -180px;

}
.model-con .model-item:nth-child(8) .img-icon{
  background-position-x: -210px;

}
.model-con .model-item:nth-child(9) .img-icon{
  background-position-x: -240px;

}
.model-con .model-item:nth-child(10) .img-icon{
  background-position-x: -270px;

}
.model-con .model-item:nth-child(11) .img-icon{
  background-position-x: -300px;

}
.model-con .model-item:nth-child(12) .img-icon{
  background-position-x: -330px;

}

.model a:hover{
  border: 1px solid #0bc096;
}

.model-con a.model-item:hover .img-icon{
  background-position-y: -30px;
}

.model a:hover p,
.model a:hover div{
  color: #0bc096;
}

