.huake-indexA{
  padding:clamp(30px,4.166667vw,80px) 0;
}
.huake-indexA .tit{ text-align:center; }
.huake-indexA .tit h3{
  margin:0;
  font-size:clamp(24px,1.88vw,36px);
  color:#333;
}
.huake-indexA .tit p{
  margin:20px 0 0;
  font-size:clamp(14px,.83vw,16px);
  color:#333;
  line-height:clamp(24px,1.8vw,36px);
}

.huake-indexA ul{
  list-style:none;
  margin:50px 0 0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}
.huake-indexA ul li{
  display:flex;
  flex-direction:column;   
  background:#fff;
  overflow:hidden;
  transition:box-shadow .3s,transform .3s;
}
.huake-indexA ul li:hover{
  box-shadow:0 10px 26px rgba(0,0,0,.10);
  transform:translateY(-4px);
}

.huake-indexA ul li .pic{
  overflow:hidden;
  background:#dfe3e2;
}
.huake-indexA ul li .pic img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .4s;
}
.huake-indexA ul li:hover .pic img{ transform:scale(1.03); }

.huake-indexA ul li .txt{
  flex:1;
  display:flex;
  align-items:flex-start;
  gap: 10px;
  padding: 15px 10px 15px;
  background: #f6f8f7;
}
.huake-indexA ul li .num{
  flex:none;
  width:38px;
  height:38px;
  border-radius:50%;
  background:#52655c;
  color:#fff;
  font-size: clamp(14px, 0.78vw, 15px);
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.huake-indexA ul li .num:empty{ display:none; }

.huake-indexA ul li .txt-body{
  flex:1;
  min-width:0;         
}
.huake-indexA ul li .txt-body h6{
  margin:0;
  font-size:clamp(17px,1.04vw,20px);
  font-weight:500;
  color:#333;
  line-height:1.4;
}
.huake-indexA ul li .txt-body p{
  margin: 5px 0 0;
  font-size:14px;
  color:#7d7d7d;
  line-height: 1.4;
}

.huake-indexA ul li .ul-txt{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap: 10px;
  margin-top: 15px;
}
.huake-indexA ul li .ul-txt span{
  display:flex;
  align-items:flex-start;
  gap: 5px;
  font-size: 13px;
  color:#555;
  line-height:1.5;
}
.huake-indexA ul li .ul-txt span i{
  flex:none;
  margin-top:2px;
  color:#52655c;
  font-size: clamp(12px, 0.73vw, 14px);
}


@media screen and (max-width:996px){
  .huake-indexA ul{
    grid-template-columns:repeat(2,1fr);
    margin-top:36px;
    gap:20px;
  }
}
@media screen and (max-width:768px){
  .huake-indexA .tit p{ line-height:24px; margin-top:10px; }
  .huake-indexA ul li .txt{padding: 10px;}
}
@media screen and (max-width:640px){
  .huake-indexA ul{
    margin-top:20px;
    gap:10px;
    grid-template-columns:1fr;
  }
  .huake-indexA ul li .ul-txt{gap: 7px;}
}
@media screen and (max-width:576px){
  .huake-indexA ul li .ul-txt{ grid-template-columns:1fr; }
}