.solution-nav{text-align:center;border-bottom:1px solid #ccd1d9;padding-bottom:60px}
.solution-nav img{width:80px;height:80px;}
.solution-nav .name{font-size:16px;color:#3d444f;padding:80px 50px 50px;padding-left: 115px}

.solution-guide .heading-icon img{width:80px;height:80px}
.solution-guide .solution-mobile-btn{margin-top:30px}
.solution-guide .item{position:relative;text-align:left;margin-bottom:30px;border-radius:6px;overflow:hidden}
.solution-guide .item .cover{background:linear-gradient(transparent,rgba(0,0,0,.7));border-radius:6px;position:absolute;width:100%;height:100%;top:0;left:0}
.solution-guide .item img{width:100%}
.solution-guide .item .content{position:absolute;width:100%;bottom:0;left:0;padding:20px}
.solution-guide .item .content .title{color:#fff;font-size:20px}
.solution-guide .item .content .subtitle{color:#ccd1d9;font-size:14px}.solution-guide .item.more{position:relative;box-shadow:1px 1px 5px rgba(0,0,0,.15);display:block;font-size:20px;color:#1f2126}
.solution-guide .item.more:hover{box-shadow:0 5px 25px rgba(0,0,0,.15)}
.solution-guide .item.more .more{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}



.solution-business .heading-icon img{
  width:80px;
  height:80px
}
.solution-business .solution-mobile-btn{
  margin-top:30px
}
.solution-business .item{
  position:relative;
  text-align:left;
  margin-bottom:30px;
  background-color:transparent;
  border-radius:6px;
  overflow:hidden
}
.solution-business .item .cover{
  background:linear-gradient(transparent,rgba(0,0,0,.4));
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  border-radius:6px;
  overflow:hidden
}
.solution-business .item img{
  width:100%
}
.solution-business .item .bg-cover{
  transition:all .5s ease;
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  background:transparent url(../../../../qiniu-daowww-prod.daocloud.io/assets/resource/3-8.jpg_%3b%20filename_%3dutf-8%27%20%273-8.jpg) 50% no-repeat;
  background-size:cover;
  overflow:hidden;
  border-radius:6px
}
.solution-business .item .content{
  position:absolute;
  width:100%;
  bottom:0;
  left:0;
  padding:10px;
  overflow:hidden
}
.solution-business .item .content .title{
  color:#fff;
  font-size:20px;
  transition:transform .5s ease;
  transform:translateY(30px)
}
.solution-business .item .content .subtitle{
  color:#fff;
  font-size:14px;
  overflow:hidden;
  transition:transform .5s ease;
  height:22px;
  transform:translateY(30px)
}
.solution-business .item:hover .subtitle,.solution-business .item:hover .title{
  transform:translateY(0)
}
.solution-business .item.more{
  position:relative;
  -webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000);
  background-color:#fff;
  box-shadow:1px 1px 5px rgba(0,0,0,.15);
  display:block;
  font-size:20px;
  color:#fff;
  height:0;
  padding-bottom:79%
}
.solution-business .item.more:hover{
  box-shadow:0 5px 25px rgba(0,0,0,.15)
}
.solution-business .item.more:hover .bg-cover{
  transform:scale(1.1)
}
.solution-business .item.more .more{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%)
  }
@media (max-width:767px){
  .solution-business .item .content .subtitle,.solution-business .item .content .title{
    transform:translateY(0)
    }
  }
.solution-case .heading-icon img{
  width:80px;
  height:80px
}
.solution-case .solution-mobile-btn{
  margin-top:30px
}
.solution-case .item{
  position:relative;
  text-align:left;
  margin-bottom:30px;
  border:1px solid #ccd1d9;
  background-color:#f5f7fa;
  overflow:hidden;
  vertical-align:middle;
  border-radius:6px;
  -webkit-mask-image:-webkit-radial-gradient(circle,#fff,#000)
}
.solution-case .item img{width:100%}
.solution-case .item .content-wrapper{
  position:absolute;
  width:100%;
  bottom:0;
  left:0;
  transform:translateY(100%);
  transition:all .5s ease;
  background-color:rgba(0,0,0,.7)
}
.solution-case .item .content-wrapper .content{
  position:relative;
  width:100%;
  padding:10px
}
.solution-case .item .content-wrapper .title{
  color:#fff;
  font-size:20px
}
.solution-case .item .content-wrapper .subtitle{
  color:#ccd1d9;
  font-size:14px
}
.solution-case .item:hover .content-wrapper{
  transform:translateY(0)
}
.solution-case .item01{
  background-color:#186a58;
  border-color:#0f4035
}
.solution-case .item02{
  background-color:#f4f4f4;
  border-color:#dbdbdb
}
.solution-case .item03{
  background-color:#ee3b3b;
  border-color:#e21414
}
.solution-case .item04{
  background-color:#a2d100;
  border-color:#7a9e00
}
.solution-case .item05{
  background-color:#f8d73c;
  border-color:#f6cd0b
}
.solution-case .item06{
  background-color:#4abf5d;
  border-color:#389e48
}
.solution-case .item07{
  background-color:#2f5482;
  border-color:#213c5d
}
.solution-case .item.more{
  position:relative;
  box-shadow:1px 1px 5px rgba(0,0,0,.15);
  display:block;
  color:#1f2126;
  font-size:20px;
  border-color:#5998c7;
  background-color:#fff
}
.solution-case .item.more:hover{
  box-shadow:0 5px 25px rgba(0,0,0,.15)
}
.solution-case .item.more .more{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%)}
  @media (max-width:767px){
    .solution-case .item .content-wrapper{
      position:relative;
      transform:translateY(0);
      height:auto;
      bottom:0;
      top:auto;
      background-color:#fff
    }
.solution-case .item .content-wrapper .content{
  position:relative
}
.solution-case .item .content-wrapper .title{
  color:#1f2126;
  font-size:20px
}
.solution-case .item .content-wrapper .subtitle{
  color:#595f69;
  font-size:16px
  }}