|  | /* pages/spellDetail/index.wxss */
page { 
    height: auto;
    overflow: auto; 
    background: #F4F5F9;
    /* background-image: url('https://s3.cn-northwest-1.amazonaws.com.cn/iformall-net/cimg/spelldetail-bg.png'); */
    background-size: cover;
    background-repeat: no-repeat;
  }
  .container{
    margin-bottom:40rpx;
  }
  .status{
    width: 690rpx;
    padding:0 28rpx;
    margin: 0 auto;
    box-sizing: border-box;
    background:rgba(255,255,255,1);
    border-radius:15rpx;
  }
  .edit{
    position: fixed;
    width: 750rpx;
    height: 185rpx;
    bottom: 60rpx;
    left: 0;
  }
  .status-top{
    width: 100%;
    height: 75rpx;
    box-sizing: border-box;
    border-bottom: 1rpx solid #F9F9F9;
    /* overflow: hidden; */
  }
  .p-status{
    float: left;
    width: 260rpx;
    font-size:32rpx;
    font-family:PingFang-SC-Bold;
    font-weight:bold;
    color:rgba(243,69,58,1);
    line-height: 75rpx;
  }
  .p-time{
    float: right;
    font-size:26rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(243,69,58,1);
    width: 38rpx;
    height: 30rpx;
    margin-top: 22rpx;
    background:rgba(252,220,221,1);
    border-radius:10rpx;
    line-height: 30rpx;
    text-align: center;
    margin: 22rpx 6rpx;
  }
  .p-mao{
    float: right;
    font-size:26rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(243,69,58,1);
    line-height: 75rpx;
  }
  .p-text{
    float: right;
    font-size:26rpx;
    font-family:PingFang-SC-Regular;
    font-weight:400;
    color:rgba(51,51,51,1);
    line-height:75rpx;
  }
  .status-center{
    width: 100%;
    overflow: hidden;
    padding: 20rpx 0;
    text-align: center;
    border-bottom: 1rpx solid #F9F9F9;
  }
  .tuanzhang{
    float: left;
    width: 120rpx;
    height: 120rpx;
    position: relative;
    box-sizing:border-box;
  }
  .touxiangitems{
    padding: 20rpx;
    margin: 0;
    overflow: hidden;
  }
  .touxiang{
    width: 80rpx;
    height: 80rpx;
    border-radius: 40rpx;
    overflow: hidden;
  }
  .no-touxiang{
    width: 80rpx;
    height: 80rpx;
    overflow: hidden;
    background:rgba(252,220,221,1);
    border:1rpx solid rgba(243,69,58,1);
    border-radius:50%;
    box-sizing: border-box;
    line-height: 78rpx;
    text-align: center;
    font-size:32rpx;
    font-family:PingFang-SC-Regular;
    font-weight:400;
    color:rgba(243,69,58,1);
    margin: 0;
    padding: 0;
  }
  .touxiang image{
    width: 80rpx;
    height: 80rpx;
  }
  .tuan-icon{
    position: absolute;
    bottom:20rpx;
    left:28rpx;
    width: 64rpx;
    height: 27rpx;
  }
  .tuan-icon image{
    display: block;
    width: 64rpx;
    height: 27rpx;
  }
  .status-bottom{
    width: 100%;
    height: auto;
    overflow: hidden;
  }
  .position-icon{
    width: 38rpx;
    float: left;
  }
  .position-icon image{
    width: 27rpx;
    height: 37rpx;
    margin-top: 17rpx;
  }
  .position{
    font-size:28rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(51,51,51,1);
    line-height: 72rpx;
  }
  .detail{
    position: relative;
    width: 690rpx;
    padding:0 28rpx;
    margin: 30rpx auto 0;
    box-sizing: border-box;
    background:rgba(255,255,255,1);
    border-radius:15rpx;
  }
  /* .return-index{
    position: absolute;
    right: 30rpx;
    top: 30rpx;
    width: 50rpx;
    height: 50rpx;
  }
  .return-index image{
    display: block;
    width: 50rpx;
    height: 50rpx;
  } */
  .return-index{
  position: fixed;
  right: 50rpx;
  top: 60rpx;
  width:100rpx!important;
  height:100rpx;
  z-index: 100;
  background:rgba(255,255,255,1);
  line-height: 95rpx;
  border:1rpx solid rgba(227,227,227,1);
  border-radius:50%;
}
.return-index image{
  position: absolute;
  width: 60rpx;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
  .detail-top{
    width: 100%;
    height: auto;
    overflow: hidden;
    padding-bottom: 12rpx;
  }
  .detail-top01{
    float: left;
    width: 180rpx;
  }
  .detail-top01 image{
    width: 180rpx;
    height: 180rpx;
    margin-top: 33rpx;
  }
  .detail-top02{
    width: 208rpx;
    float: left;
    margin-left: 16rpx;
  }
  .title{
    font-size:30rpx;
    font-family:PingFang-SC-Bold;
    font-weight:bold;
    color:rgba(51,51,51,1);
    line-height:44rpx;
    margin-top: 30rpx;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .des{
    font-size:26rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(134,134,134,1);
    line-height:40rpx;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .detail-top03{
    float: left;
    padding-top: 180rpx;
    width: 230rpx;
  }
  .detail-p-name{
    float: right;
    font-size:26rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:#FD782D;
    line-height:44rpx;
  }
  .detail-p-price{
    float: right;
    font-size:26rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:#FD782D;
    line-height:44rpx;
  }
  .detail-bottom{
    border-top: 1rpx solid #F9F9F9;
    width: 100%;
    overflow: hidden;
    height: 86rpx;
  }
  .b-unit{
    float: right;
    font-size:24rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(237,63,46,1);
    margin-top: 36rpx;
  }
  .b-price{
    float: right;
    font-size:40rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(237,63,46,1);
    margin-top: 18rpx;
  }
  .b-name{
    float: right;
    font-size:26rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(51,51,51,1);
    margin-right: 6rpx;
    margin-top: 34rpx;
  }
  .order{
    width: 690rpx;
    padding:10rpx 28rpx;
    margin: 30rpx auto 0;
    box-sizing: border-box;
    background:rgba(255,255,255,1);
    border-radius:15rpx;
  }
  .order-list{
    height: 55rpx;
  }
  .order-title{
    line-height: 55rpx;
    float: left;
    font-size:26rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(51,51,51,1);
  }
  .order-text{
    float: right;
    text-align: right;
    line-height: 55rpx;
    font-size:26rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:#FD782D;
  }
  .user-motto {
    border: 0;
    width:650rpx;
    height:85rpx;
    background:linear-gradient(90deg,rgba(248,85,45,1) 0%,rgba(241,60,66,1) 0%,rgba(248,86,46,1) 100%);
    border-radius:43rpx;
    font-size:36rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(254,254,254,1);
    line-height: 85rpx;
    margin-top: 100rpx;
  }
  .user-enough{
    border: 0;
    width:650rpx;
    height:85rpx;
    background:linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%);
    border-radius:43rpx;
    font-size:36rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(254,254,254,1);
    line-height: 85rpx;
    margin-top: 100rpx;
  }
  .user-motto::after {
    border: none;
  }
  .button button:nth-of-type(1){
    width:520rpx;
    height:95rpx;
    margin: 30rpx auto 38rpx;
    background:linear-gradient(90deg,rgba(248,85,45,1) 0%,rgba(241,60,66,1) 0%,rgba(248,86,46,1) 100%);
    border-radius:47rpx;
    color: #fff;
  }
  .button button:nth-of-type(2){
    width:520rpx;
    height:95rpx;
    background:rgba(255,255,255,1);
    border:1rpx solid rgba(190,190,190,1);
    border-radius:47rpx;
    color:#333333;
    margin-bottom: 50rpx;
  }
  .alert-bg{
    width: 100%;
    height: 100vh;
    position: fixed;
    opacity: 0.7;
    background: #000;
    top: 0;
    left: 0;
    z-index: 200;
  }
  .alert-box{
    width: 600rpx;
    height: 332rpx;
    position: fixed;
    z-index: 300;
    background: #fff;
    top: 50vh;
    margin-top: -162rpx;
    left: 85rpx;
    border-radius:15rpx;
  }
  .alert-close{
    position: absolute;
    width: 47rpx;
    height: 98rpx;
    top: -98rpx;
    right: 0;
  }
  .alert-close image{
    width: 47rpx;
    height: 98rpx;
  }
  .alert-title{
    text-align: center;
    font-size:30rpx;
    line-height: 30rpx;
    margin-top: 79rpx;
    font-family:PingFang-SC-Medium;
    font-weight:500;
    color:rgba(51,51,51,1);
  }
  .alert-button .share{
    width:500rpx;
    height:95rpx;
    background:linear-gradient(90deg,rgba(248,85,45,1) 0%,rgba(241,60,66,1) 0%,rgba(248,86,46,1) 100%);
    border-radius:47rpx;
    margin-top: 79rpx;
  }
  .al-bg{
  position: fixed;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  background:rgba(0,0,0,1);
  opacity:0.65;
  z-index: 200;
}
.al-content{
  background: #fff;
  position: fixed;
  width: 545rpx;
  z-index: 300;
  top: 200rpx;
  left: 102rpx;
  border-radius: 15rpx;
}
.al-top{
  width: 100%;
}
.al-top image{
  position: relative;
  height: 298rpx;
  margin-top: -96rpx;
  width: 545rpx;
}
.al-center{
  padding: 80rpx 30rpx;
  font-size:30rpx;
  font-family:PingFang-SC-Regular;
  font-weight:400;
  color:rgba(51,51,51,1);
}
.al-bottom{
  width:462rpx;
  height:95rpx;
  background:linear-gradient(90deg,rgba(248,85,45,1) 0%,rgba(241,60,66,1) 0%,rgba(248,86,46,1) 100%);
  border-radius:47rpx;
  font-size:30rpx;
  font-family:PingFang-SC-Medium;
  font-weight:500;
  color:rgba(255,255,255,1);
  text-align: center;
  line-height: 95rpx;
  margin: 0 auto 43rpx;
}
 |