shyaf-artist-platform-miniapp/pages/invoice/index/index.wxss

/* pages/invoice/index/index.wxss */
.top-banner{
    position: relative;
    background: #2C3039;
    margin-bottom: 20px;
    height:474rpx;
    display: flex;
    align-items: center;
    justify-content: center;
}

.top-banner>view{
    position: absolute;
    left: 50%;
    top:50%;
    transform: translate(-50%,-50%);
}
.top-banner .tool-btn{
    position: relative;
    width: 430rpx;
    height:114rpx;
    line-height: 114rpx;
    border:2rpx solid rgba(236,238,243,1);
    font-size: 32rpx;
    color: #FFFFFF;
    margin-bottom: 30rpx;
    box-sizing: border-box;
    padding-left: 130rpx;
    opacity: 0.7;
}
.top-banner .tool-btn:hover{
    opacity: 1;
}


.top-banner .tool-btn .icon{
    position: absolute;
    left: 40rpx;
    top:50%;
    transform: translate(0,-50%);
    display: inline-block;
    vertical-align: middle;
    width: 60rpx;
    height: 60rpx;
    margin-right: 30rpx;
   /* background: #ddd*/
}

.step-item-box{
    border-left:1px solid #343437;
    padding-left: 40rpx;
    margin-left: 100rpx;
    margin-bottom: 30px;
}

.step-item-box .step-item{
    position: relative;
    padding: 30rpx 0;

}

.step-item-box .step-item .icon{
    position: absolute;
    top:50%;
    left: -60rpx;
    transform: translate(0,-50%);
    background: #fff;
    display: inline-block;
    vertical-align: middle;
    width: 40rpx;
    height: 40rpx;
}
.step-item-box .step-item .number{
    font-size:28rpx;
    color:rgba(22,22,22,1);
    line-height:40rpx;
}
.step-item-box .step-item .text{
    font-size:28rpx;
    color:rgba(22,22,22,1);
    line-height:40rpx;
}