shyaf-artist-platform-miniapp/app.wxss

/**app.wxss**/
.img-full{
  display: block;
  width: 100%;
  height: 100%;
}

.default-btn{
  height:100rpx;
  background:rgba(236,238,243,1);
  line-height: 100rpx;
  color:rgba(178,178,191,1);
  font-size: 32rpx;
  text-align: center;
  border: 0;
  padding: 0;
}

.default-btn.primary{
  background: #161616;
  color: #fff !important;
}
.default-btn.disable{
  background:rgba(236,238,243,1);
  color: #B2B2BF !important;
}
/****/
.planer-box{
  background: #fff;
  margin-bottom: 20rpx;
  padding: 1rpx 0;
}
.planer-box.none{
  margin-bottom: 0;
}
.planer-box .planer-header{
  position: relative;
  margin-bottom: 20rpx;
}

.planer-box .planer-header .name{
  height: 100rpx;
  line-height: 100rpx;
  font-size: 40rpx;
  color: #161616;
  padding-left: 50rpx;
}
.planer-box .planer-header.title{
  position: relative;
  padding-top: 10rpx;
  margin-bottom: 10rpx;
}
.planer-box .planer-header.title .name{
  font-size:28rpx;
  color:rgba(22,22,22,1);
}
.planer-box .planer-header.title .name>text{
  color: #707377;
  font-size: 24rpx;
}
.planer-box .planer-header.title::after{
  display: none;
}

.planer-box .planer-header.title .add{
  position: absolute;
  right:50rpx;
  top:40rpx;
  width: 50rpx;
  height: 50rpx;
}

.planer-box .planer-header:after{
  position: absolute;
  left: 0;
  top:50%;
  width:6rpx;
  height:40rpx;
  transform: translate(0,-50%);
  background:rgba(22,22,22,1);
  content: "";
}

.planer-box .planer-content{
  padding: 0 50rpx;
}
.planer-box .form-box{
  margin-bottom: 40rpx;
}

/** 表单样式 **/
.form-box{
  margin-bottom: 40rpx;
}
.form-box .form-list{
  position: relative;
  border-bottom: 1rpx solid rgba(236,238,243,1);
  margin-bottom: 20rpx;
}
.form-box.none .form-list{
  border-bottom: 0;
}
.form-box .form-list .form-label{
  font-size: 24rpx;
  color: #707377;
}
.form-box .form-list .input-text{
  position: relative;
  z-index: 2;
  display: block;
  font-size: 28rpx;
  color: #161616;
  height: 80rpx;
  line-height: 80rpx;
  margin-top: -6rpx;
}
.form-box .form-list .textarea-text{
  width: 100%;
  display: block;
  height:202rpx;
  background:rgba(255,255,255,1);
  border:1rpx solid rgba(236,238,243,1);
  margin-top: 30rpx;
  box-sizing: border-box;
  padding: 20rpx;
  font-size: 28rpx;
  color: #161616;
}
.form-box .form-list .get-phone{
  position: absolute;
  z-index: 3;
  right: 0;
  bottom: 12rpx;
  width:160rpx;
  height:54rpx;
  line-height: 54rpx;
  text-align: center;
  background:rgba(236,238,243,1);
  color: #9B9B9B;
  font-size: 24rpx;
  padding: 0;
  margin: 0;
  border: 0;
}

.form-box .form-list .icon-arrow{
  position: absolute;
  right: 0;
  top:50%;
  transform: translate(0,-50%);
  z-index: 2;
  display: inline-block;
  vertical-align: middle;
  width: 12rpx;
  height: 20rpx;
}
.form-box .form-list .add-file{
  padding:100rpx 0 60rpx 0;
}

.form-box .form-list .add-file .img-wrap{
  position: relative;
  height: 300rpx;
}

.form-box .form-list .add-file .img-wrap .close{
  position: absolute;
  top: -24rpx;
  right: -24rpx;
  width: 46rpx;
  height: 46rpx;
}

.form-box .form-list .add-file .icon{
  display: block;
  width: 62rpx;
  height: 62rpx;
  margin: 0 auto 20rpx auto;
}
.form-box .form-list .add-file .text{
  text-align: center;
  font-size:24rpx;
  color:rgba(22,22,22,1);
}

.step-tool{
  display: flex;
  justify-content: space-between;
  background: #fff;
  padding: 30rpx;
}

.step-tool .step-btn{
  display: flex;
  align-items: center;
  justify-content: center;
  width:100rpx;
  height:100rpx;
  background:rgba(236,238,243,1);
}
.step-tool .step-btn:hover{
  background:rgba(236,238,243,0.8);
}
.step-tool .step-btn.disable{
  background: none;
}

.step-tool .step-btn.active{
  background:rgba(29,182,150,1);
}
.step-tool .step-btn.active{
  background:rgba(29,182,150,.8) url("https://resource.artouchstone.com/miniapp/artist/images/next-green@2x.png");
  background-size:cover;
}
.step-tool .step-btn.active .icon{
  display: none;
}
.step-tool .step-btn .icon{
  display: inline-block;
  vertical-align: middle;
  width: 32rpx;
  height: 32rpx;
  margin-right: 10rpx;
  margin-top: -4rpx;
}
.step-tool .step-btn.text{
  width: 200rpx;
  padding: 0 30rpx;
  white-space: nowrap;

}
.step-tool .step-btn.text .text-view{
  display: inline-block;
  vertical-align: middle;
  color: #fff;
  margin-right: 20rpx;
  margin-top: -6rpx;
}
.step-tool .step-btn.text .icon{
  display: inline-block;
}
.footer-btn{
  height: 160rpx;
}

.footer-btn .footer-btn-content{
  width: 100%;
  padding: 30rpx 50rpx;
  background: #fff;
  position: fixed;
  left: 0;
  bottom:0;
  box-sizing: border-box;
}

/**身份证上传框**/

.user-card-box{
  /*height:790rpx;*/
  background:rgba(255,255,255,1);
  box-shadow:0px 10rpx 20rpx 0px rgba(0,0,0,0.08);
  padding: 50rpx 50rpx 50rpx 50rpx;
  margin-bottom: 50rpx;
}
.user-card-box .card-img-box{
  position: relative;
  height:348rpx;
  background:rgba(255,255,255,1);
  border:1rpx dashed rgba(233,233,233,1);
  margin-bottom: 30rpx;
}
.user-card-box .card-img-box .img-wrap{
    position: relative;
    height: 100%;
}
.user-card-box .card-img-box .img-wrap>image{
    display: block;
    width: 100%;
    height: 100%;
}
.user-card-box .card-img-box.big{
  height:628rpx;
}
.user-card-box .card-img-box.big .img-wrap{
  position: relative;
  height: 400rpx;
}
.user-card-box .card-img-box .close,
.user-card-box .card-img-box.big .img-wrap .close{
  position: absolute;
  right:-23rpx;
  top:-23rpx;
  width: 46rpx;
  height: 46rpx;
}

.user-card-box .card-img-box.big .img-wrap>image{
  display: block;
  width: 100%;
  height: 100%;
}
.user-card-box .card-img-box.big  .item-info{

}
.user-card-box .card-img-box.big  .item-info{
  top: 36%;
}
.user-card-box .card-img-box .item-info{
  position: absolute;
  left: 50%;
  top:50%;
  transform: translate(-50%,-50%);
}


.user-card-box .card-img-box .item-info .text{
  font-size: 24rpx;
  color: #262628;
  line-height: 62rpx;
  padding-top: 10rpx;
  text-align: center;
}
.user-card-box .card-img-box .icon{
  margin: 0 auto;
  width: 124rpx;
  height: 124rpx;
  display: block;
  z-index: 2;
}
.user-card-box .card-img-box .info{
  color: #9B9B9B;
  font-size: 24rpx;
  white-space: nowrap;
}
.user-card-box .card-info-text{
  position: absolute;
  left: 50%;
  transform: translate(-50%,0);
  bottom: 60rpx;
  width: 80%;
  margin: 0 auto;
}
.user-card-box .card-info-text .text{
  color:rgba(38,38,40,1);
  line-height:34rpx;
  font-size: 24rpx;
  text-align: center;
}

.user-card-box .card-info-text .info{
  color:rgba(155,155,155,1);
  line-height:34rpx;
  font-size: 24rpx;
  text-align: center;
}

.user-card-box .look-sample{
  display: block;
  margin:50rpx auto 0 auto;
  width:200rpx;
  height:64rpx;
  line-height: 64rpx;
  text-align: center;
  background:rgba(255,255,255,1);
  border:1rpx solid rgba(22,22,22,1);
  color: #161616;
  font-size: 26rpx;
}

/**弹框样式**/
.pop-box{
  position: fixed;
  top:0;
  right: 0;
  bottom:0;
  left: 0;
  background:rgba(29,33,41,0.67);
  z-index: 11;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pop-box .pop-inner{
  position: absolute;
  left: 50%;
  transform: translate(-50%,0);
  background:rgba(255,255,255,1);
  border-radius:4rpx;
  width: 540rpx;
  padding: 40rpx;
  box-sizing: border-box;
}

.pop-box .pop-inner .img-simple{

}

.pop-box .pop-inner .img-simple>image{
  display: block;
  width: 100%;
}
.pop-box .pop-inner .pop-close{
  position: absolute;
  top:100%;
  left: 50%;
  transform: translate(-50%,80rpx);
  display: block;
  width: 100rpx;
  height: 100rpx;
  cursor: pointer;
}
.pop-box .pop-inner-text{
    padding: 60rpx 0;
}
.pop-box .pop-inner .title{
  padding-top: 10rpx;
  height:44rpx;
  font-size:32rpx;
  font-family:PingFangSC-Regular,PingFang SC;
  font-weight:400;
  color:rgba(22,22,22,1);
  line-height:44rpx;
  text-align: center;
}
.pop-box .pop-inner-text> view{
    color:rgba(22,22,22,1);
    line-height:44rpx;
    font-size: 28rpx;
    text-align: center;
}

.pop-box .pop-inner-text>view.pop-choose-item{
  font-size: 32rpx;
  color: #161616;
  border-bottom: 1rpx solid #ECEEF3;
  height: 100rpx;
  line-height: 100rpx;
}

.pop-box .pop-inner-text>view.pop-choose-item .icon{
  display: inline-block;
  vertical-align: middle;
  margin-right: 12rpx;
  width: 52rpx;
  height: 52rpx;
}

.pop-box .pop-inner-text>view.pop-choose-item .icon.icon-01{
  background: url("https://resource.artouchstone.com/miniapp/artist/images/icon-choose-file-chat.png");
  background-size: 100% 100%;
}

.pop-box .pop-inner-text>view.pop-choose-item .icon.icon-02{
  background: url("https://resource.artouchstone.com/miniapp/artist/images/icon-choose-file.png");
  background-size: 100% 100%;
}

/**纳税人识别号列表**/
.rise-list-box{
  max-height:552rpx;
  background: #fff;
  /*background:rgba(44,48,57,1);*/
  overflow: auto;
  padding:50rpx 30rpx;
  border:1rpx solid rgba(236,238,243,0.3);
}
.rise-list-box .item{
  position: relative;
  color: #333;
  font-size: 28rpx;
  height: 50rpx;
  line-height: 50rpx;
  margin-bottom: 10rpx;
  border-bottom:1rpx solid rgba(236,238,243,0.3);
}
.rise-list-box .item .close{
  position: absolute;
  right: 0;
  top:50%;
  transform: translate(0,-50%);
  width: 24rpx;
  height: 24px;
}
.rise-list-box .delete{
  width: 36rpx;
  height: 36rpx;
}
.fixed-zx{
  position: fixed;
  right: 10rpx;
  top:560rpx;
  width: 113rpx !important;
  height: 113rpx;
  background: url("https://resource.artouchstone.com/miniapp/artist/images/index/index-zx.png");
  background-size: 100% 100%;
  z-index: 10;
  border: 0 solid rgba(0,0,0,0) !important;
  padding: 0;
}

.red{
  color: #ff0000;
  padding-right: 6rpx;
}