.container{
  width: 670rpx;
  margin: 0 auto;
  background-color: #fff;
  padding: 10rpx 10rpx;
}
.wrap1{
  display: flex;
  box-shadow: 0rpx 4rpx 16rpx 0rpx rgba(176,135,113,0.2);
  border-radius: 8rpx;
  padding: 30rpx;
  height: 140rpx;
  .ai{
    width: 80rpx;
    height: 80rpx;
    display: flex;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    margin-right: 24rpx;
    background: rgba(176,135,113,0.14);
    image{
      width: 56rpx;
      height: 56rpx;
    }
  }
  .content{
    flex: 1;
    .name{
      font-weight: 600;
      font-size: 32rpx;
      color: #111111;
      margin-bottom: 6rpx;
    }
    .desc{
      font-weight: 300;
      font-size: 24rpx;
      color: #333333;
    }
  }
  .btn{
    font-weight: 300;
    font-size: 26rpx;
    line-height: 32rpx;
    width: 68rpx;
    height: 140rpx;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: -30rpx -30rpx -30rpx 24rpx;
    color: #FFFFFF;
    background: #B08771;
    border-radius: 0rpx 8rpx 8rpx 0rpx;
  }
}
.wrap2{
  .header{
    display: flex;
    align-items: center;
    .left{
      flex: 1;
      .name{
        display: flex;
        align-items: center;
        font-weight: 600;
        font-size: 36rpx;
        .icon{
          width: 36rpx;
          margin-right: 12rpx;
          
        }
      }
      .desc{
        margin-top: 10rpx;
        font-weight: 300;
        font-size: 26rpx;
        color: #333333;
      }
    }
    .right{
      width: 16rpx;
    }
  }
  .list{
    padding: 40rpx 8rpx;
    display: flex;
    width: 710rpx;
    overflow: auto;
    .item{
      flex-shrink: 0;
      width: 305rpx;
      height: 184rpx;
      background: rgba(176,135,113,0.05) #FFFFFF;
      box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(0,0,0,0.12);
      border-radius: 8rpx;
      padding: 20rpx;
      margin-right: 20rpx;
      .name{
        display: flex;
        margin-bottom: 20rpx;
        font-size: 28rpx;
        .icon{
          width: 60rpx;
          height: 60rpx;
          background: rgba(176,135,113,0.14);
          border-radius: 50%;
          display: flex;
          justify-content: center;
          align-items: center;
          margin-right: 20rpx;
          image{
            width: 36rpx;
          }
        }
        .text{
          flex: 1;
          overflow : hidden;
          text-overflow: ellipsis;
          display: -webkit-box;
          -webkit-line-clamp: 2;
          -webkit-box-orient: vertical;
        }
      }
      .addr{
        display: flex;
        justify-content: space-between;
        align-items: center;
        .left{
          display: flex;
          align-items: center;
          font-size: 24rpx;
          color: #999999;
          .icon{
            width: 24rpx;
          }
        }
        .right{
          display: flex;
          align-items: center;
          color: #B08771;
          font-size: 26rpx;
        }
      }
    }
  }
}
.wrap3{
  display: flex;
  box-shadow: 0rpx 4rpx 16rpx 0rpx rgba(176,135,113,0.2);
  border-radius: 8rpx;
  padding: 30rpx;
  height: 140rpx;
  .ai{
    image{
      width: 40rpx;
      height: 40rpx;
    }
  }
}