.content{
  margin-bottom: 1.225rem;
}
.content .topBg{
    height: 7.1875rem;
    background: url('../static/caseBg.png') no-repeat;
    background-size: cover;
    position: relative;
}
.topBg .title{
  font-weight: bold;
  color: #FFFFFF;
  font-size: .625rem;
  width: 13.75rem;
  position: absolute;
  left: 50%;
  top: 2.475rem;
  transform: translateX(-50%);
}
.topBg .message{
  position: fixed;
  top: 3.5875rem;
  right: 0;
}
.topBg .message img{
    display: block;
    padding-bottom: .05rem;
  }
 .caseBox{
  display: flex;
  justify-content: center;
 } 
 .caseBox .caseContet{
    margin-top: .8125rem;
 } 
 .caseBox .caseContet .title{
   color: #171a1d;
   font-size: .4rem;
   text-align: center;
   line-height: .6rem;
   padding-bottom: .6rem;
} 
.tagList .tagItem{
  display: flex;
  align-items: center;
  margin-bottom: .2625rem;   
}
.tagList .tagItem .tagTitle{
color: #585858;  
font-size: .225rem;
}
.tagList .tagItem ul{
    color: #585858;  
    font-size: .225rem;
    display: flex;
}
.tagList .tagItem ul li{
    color: #333333;
    background-color: #F6F6F6;
    text-align: center;
    margin-left: .15rem;
    line-height: 1;
    border-radius: .075rem .075rem .075rem .075rem;
    cursor: pointer;
    padding: .1125rem .2rem;
}
.tagList .tagItem ul .allData{
   background-color: #ecf5ff;
   color: #0089ff;
}
.tagList .tagItem .searchBtn{
padding: .2rem .75rem; 
font-size: .225rem;   
color: #333333;
background: #FFFFFF;
border: .0125rem solid #AFAFAF;
line-height: 1;
margin-left: .35rem;
cursor: pointer;
}
.caseContet{
}
.caseContet .caseList{
}
.caseContet .caseList .flow-default{
  height: 14.2875rem;
  width: 15rem;
  margin-right: 0 !important;
}
.caseContet .caseList .flow-default li{
 display: inline-block;
 margin-right: .45rem;
 border-radius: .1rem;
 margin-top: .6rem;
 box-shadow: 0 .1rem .3rem 0 rgb(34 38 48 / 12%);
 background-color: transparent;
 height:4.125rem;
 width:4.6625rem;
 padding: .5rem .4rem 0;
 position: relative;
 transition: all 0.4s;
}
.caseContet .caseList .flow-default li:hover{
  transform:translate(0,-0.125rem);
}
.caseContet .caseList .flow-default li:nth-child(3n+3){
  margin-right: 0;
}
.flow-default li .logo {
  height: .95rem;
}
.flow-default li .logo img{
  height: .45rem;
  max-width: 3.9rem;
  margin: .0875rem 0;
}
.flow-default li .infoTitle{
  height: .4rem;
  width: 3.9rem;
  font-size: .25rem;
  color: #171a1d;
  line-height: .4rem;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-bottom: .25rem;
}
.flow-default li .infoContent{
    margin: .175rem 0 .4rem;
    height: .9rem;
    width: 3.9rem;
    font-size: .1875rem;
    color: rgba(23,26,29,.6);
    line-height: .3rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.flow-default li .infoTag{
  margin-top: .4rem;
  height: .35rem;
}
.flow-default li .infoTag span{
  display: inline-block;
  box-sizing: border-box;
  height: .35rem;
  padding: .05rem .1rem;
  font-size: .15rem;
  color: rgba(23,26,29,.6);
  border: .0125rem solid rgba(126,134,142,.24);
  border-radius: .05rem;
  text-align: center;
  margin-right: .1rem;
}
.flow-default li .infoTag .skyBlueColor{
  border: .0125rem solid rgba(0,137,255,.48);
  color: #0089ff;
}
.flow-default .hoverColor-container{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  border-radius: .1rem;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  background-color: #0089ff;
  box-shadow: 0 .1rem .3rem 0 rgb(34 38 48 / 16%);
  opacity: 0;
  transition: .2s;
  cursor: pointer;
}
.flow-default .hoverColor-container:hover{
 opacity: 0.8;
}
 .hoverColor-container .hoverColor-icon{
  width: .725rem;
  height: .525rem;
  animation: moveScaleEnd .2s linear;
 }
 .layui-flow-more{
  display: none;
 }
 .caseList .seeMore{
  margin-top: .7rem;
  font-size: .225rem;
  color: #0089ff;
  text-align: center;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
 }
 .seeMore p {
  position: relative;
  box-sizing: border-box;
  height: .575rem;
  text-align: center;
  line-height: .575rem;
  margin: 0 auto;
  cursor: pointer;
}
.seeMore p span{
  position: relative;
  cursor: pointer;
  color: #0089ff;
}

 .seeMore p span:after {
  content: "";
  display: block;
  position: absolute;
  bottom: -0.05rem;
  left: 0;
  width: 0;
  height: .0375rem;
  background-color: #0089ff;
  transition: all .2s linear;
}
.seeMore p span:hover:after {
  content: "";
  display: block;
  position: absolute;
  bottom: -0.05rem;
  left: 0;
  width: 0;
  height: .0375rem;
  width: 100%;
  background-color: #0089ff;
}