payProject/subPackagesD/pages/testSkin/testSkin.wxss

.skin-box{
  padding-left: 30rpx;
  padding-bottom: 40rpx;
}
/* 头部肤质 */
.skin-detail {
  width: 690rpx;
  height: 240rpx;
  background-color: #FFFFFF;
  border-radius: 12px;
  margin-top: 40rpx;
  padding: 30rpx 30rpx 40rpx 30rpx;
  box-sizing: border-box;
}
.skin-detail-top{
  display: flex;
  font-size: 24rpx;
  justify-content: space-between;
}
.skin-time{
  color: #999999;
}
.skin-history{
  color: #333;
}
.skin-detail-bottom{
  display: flex;
}
.skin-type{
  width: 270rpx;
  height: 100rpx;
  text-align: center;
  margin-top: 38rpx;
}
.skin-type:first-child{

  font-weight: 600;
  font-size: 36rpx;
  color: #333333;
}
.skin-type view:last-child{
  margin-top: 8rpx;
  color: #FA7D22;
  font-size: 28rpx;
}
.skin-line{
  height: 80rpx;
  width: 2rpx;
  background-color: #DEDEDE;
  margin-top: 52rpx;
  margin-left: 44rpx;
}
.skin-age{
  margin-left: 54rpx;
  margin-top: 10rpx;
  position: relative;
}
.skin-age-one{
  font-size: 36rpx; 
  color: #333;
}
.skin-age-text{
  font-weight: 600;
}
.skin-age .age{
  color: #FA7D22;
  font-size: 56rpx;
  margin: 0 12rpx;
}
.skin-age-two{
  margin-top: 14rpx;
  font-size: 24rpx;
  color: #333333;
  font-weight: 400;
  display: flex;
  align-items: center;
}
.skin-age image{
  width: 24rpx;
  height: 24rpx;
}
/* 皮肤状态 */
.skin-status{
  width: 690rpx;
  height: auto;
  background-color: #fff;
  border-radius: 24rpx;
  margin-top: 20rpx;
  padding: 30rpx;
  box-sizing: border-box;
}
.skin-status-title{
  font-size: 32rpx;
  color: #333;
  font-weight: 600;
  position: relative;
}
.skin-status-title .title{
  position: relative;
}
.title-line{
  position: absolute;
  width: 192rpx;
  height: 14rpx;
  background-color: #FA7D22;
  bottom: 0;
  left: 0;
}
.skin-status-content{
  font-size: 28rpx;
  color: #666666;
  margin-top: 40rpx;
}
.skin-status-problem{
  margin-top: 20rpx;
  color: #333333;
  font-weight: 600;
  display: flex;
  align-items: center;
}
.skin-status-problem-circle{
  width: 10rpx;
  height: 10rpx;
  background-color: #FF3007;
  border-radius: 50%;
  margin-right: 10rpx;
}
.problem-box{
  margin-top: 40rpx;
  font-size: 28rpx;
  color: #333;
}
.problem-box .problem-item{
  display: inline-block;
  margin-top: 20rpx;
}
.problem-box .problem-item:nth-child(1),.problem-item:nth-child(2){
  margin-top: 0;
}
.problem-box .problem-item:nth-child(n+1){
  margin-right: 168rpx;
}
/* 护理建议 */
.skin-suggest{
  width: 690rpx;
  height: auto;
  background: #fff;
  border-radius: 24rpx;
  margin-top: 20rpx;
  padding: 30rpx;
  box-sizing: border-box;
}
.skin-suggest-title{
  font-weight: 600;
  position: relative;
}
.skin-suggest-title .title{
  position: relative;
}
.suggest-title-line{
  width: 128rpx;
  height: 14rpx;
  background-color: #FA7D22;
  position: absolute;
  bottom: 0;
  left: 0;
}
.suggest-box{
}
.suggest-item{
  margin-top: 40rpx;
}
.suggest-item-title{
    color: #333333;
    font-size: 28rpx;
}
.suggest-item-content{
  margin-top: 20rpx;
  color: #666666;
  font-size: 28rpx;
}
/* 为你推荐 */
.skin-recommend{
  width: 690rpx;
  padding: 30rpx;
  box-sizing: border-box;
  background-color: #fff;
  margin-top: 20rpx;
  border-radius: 24rpx;
}
.skin-recommend-title{
  color: #333333;
  font-weight: 600;
  font-size: 32rpx;
  display: flex;
}
.recommend-line{
  width: 8rpx;
  height: 40rpx;
  border-radius: 4rpx;
  background-color: #FA7D22;
  margin-right: 10rpx;
}
.recommend-box{
  margin-top: 40rpx;
}
.recommend-item{
  margin-top: 20rpx;
  display: flex;
}
.recommend-item-image image{
  width: 80rpx;
  height: 80rpx;
  border-radius: 8rpx;
}
.recommend-item-title{
  flex: 1;
  margin-left: 20rpx;
  font-size: 28rpx;
  color: #292929;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space:nowrap;
}
.recommend-item-icon{
  width:48rpx ;
  height: 48rpx;
  text-align: center;
  line-height: 48rpx;
  margin-top: 16rpx;
}
.recommend-item-icon image{
  width:12rpx ;
  height: 24rpx;
}
/* 查看您的专属护理方案 */
.goPlan{
  width: 690rpx;
  height: 84rpx;
  background-color: #FA7D22;
  color: #fff;
  line-height: 84rpx;
  text-align: center;
  border-radius: 42rpx;
  margin-top: 40rpx;
}