epdc-cloud-dangjian-shibei/miniprogram/subpages/workguide/assets/work-guide.wxss

.guide-container{
    padding-top:262rpx
}
.list-view{
    height:calc(100vh - 272rpx)
}
.select{
    position:fixed;top:0;
    width:100%;
    z-index:3
}
.search-collect,.search-left,.search-right,.search-wrapper{
    display:flex;
    align-items:center
}
.search-wrapper{
    width:100%;
    box-sizing:border-box;
    padding:24rpx 20rpx 10rpx 20rpx
}
.search-wrapper .search-left{
    width:580rpx;
    height:70rpx;
    box-sizing:border-box;
    margin-right:20rpx;
    padding:0 20rpx;
    background:#f5f6f7;
    border-radius:10rpx;
    -webkit-border-radius:10rpx;
    -moz-border-radius:10rpx;
    -ms-border-radius:10rpx;
    -o-border-radius:10rpx
}
.search-wrapper .search-left image{
    flex-shrink:0;
    display:block;
    width:26rpx;
    height:30rpx;
    box-sizing:border-box;
    margin-right:20rpx
}
.search-wrapper .search-left input{
    flex:1;height:100%;
    font-size:26rpx;
    font-weight:500;
    color:#333
}
.search-wrapper .search-left .input-placeholder{
    font-size:26rpx;
    font-weight:500;
    color:#999
}
.search-wrapper .search-right{
    font-size:34rpx;
    font-weight:500;
    color:#333
}
.search-wrapper .search-right image{
    display:block;
    width:28rpx;
    height:24rpx;
    box-sizing:border-box;
    margin-right:8rpx
}
.m-filter{
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:420rpx;
    height:58rpx;
    box-sizing:border-box;
    margin:20rpx 0 0 20rpx;
    padding:0 20rpx;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    background:#f4f4f4;
    border-radius:29rpx;
    -webkit-border-radius:29rpx;
    -moz-border-radius:29rpx;
    -ms-border-radius:29rpx;
    -o-border-radius:29rpx
}
.m-filter text{
    width:100%;
    font-size:26rpx;
    font-family:Source Han Serif SC;
    font-weight:500;
    color:#bababa
}
.m-filter image{
    flex-shrink:0;
    display:block;
    width:32rpx;
    height:32rpx
}
.tabs-wrapper{
    position:relative;
    width:100%;
    min-height:89rpx;
    box-sizing:border-box;
    padding:30rpx 20rpx 0 20rpx;
    box-shadow:0rpx 10rpx 20rpx -5rpx rgba(217,217,217,.43)
}
.tabs-wrapper .tabs{
    width:100%;
    white-space:nowrap
}
.tabs-wrapper .tabs .tabs-list{
    display:flex;
    align-items:center;
    box-sizing:border-box
}
.tabs-wrapper .tabs .tabs-list .tabs-item{
    position:relative;
    height:60rpx;
    box-sizing:border-box;
    margin-right:39rpx;
    padding-bottom:26rpx;
    font-size:28rpx;
    font-family:Source Han Serif SC;
    font-weight:400;color:#999;
    line-height:1
}
.tabs-wrapper .tabs .tabs-list .tabs-on{
    font-weight:500;
    color:#333;
    transition:all .2s;
    -webkit-transition:all .2s;
    -moz-transition:all .2s;
    -ms-transition:all .2s;
    -o-transition:all .2s
}
.tabs-wrapper .tabs .tabs-list .tabs-on::after{
    content:'';
    position:absolute;
    left:50%;
    bottom:0;
    width:50rpx;
    height:6rpx;
    margin-left:-25rpx;
    background:#e2281b;
    border-radius:3rpx;
    -webkit-border-radius:3rpx;
    -moz-border-radius:3rpx;
    -ms-border-radius:3rpx;
    -o-border-radius:3rpx
}
.tabs-wrapper .tabs-down{
    position:absolute;
    top:4rpx;right:0rpx;
    display:flex;
    justify-content:center;
    align-items:center;
    width:80rpx;
    height:80rpx;
    background:linear-gradient(90deg,rgba(255,255,255,0) 0,#fff 100%)
}
.tabs-wrapper .tabs-down image{
    display:block;
    width:24rpx;
    height:13rpx
}
.tabs-no{
    height:0;
    overflow:hidden;
    transition:height .5s;
    -webkit-transition:height .5s;
    -moz-transition:height .5s;
    -ms-transition:height .5s;
    -o-transition:height .5s
}
.filter-wrapper{
    width:100%;
    height:0;
    overflow:scroll;
    transition:height .5s;
    -webkit-transition:height .5s;
    -moz-transition:height .5s;
    -ms-transition:height .5s;
    -o-transition:height .5s
}
.filter-wrapper .filter-arrow{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    box-sizing:border-box
}
.filter-wrapper .filter-arrow view{
    display:flex;
    justify-content:center;
    align-items:center;
    box-sizing:border-box;
    width:80rpx;
    height:80rpx
}
.filter-wrapper .filter-arrow image{
    display:block;
    width:24rpx;
    height:13rpx
}
.filter-wrapper .filter-list{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    width:100%;
    box-sizing:border-box;
    padding-left:20rpx
}
.filter-wrapper .filter-list .filter-item{
    height:46rpx;
    box-sizing:border-box;
    margin-right:20rpx;
    margin-bottom:28rpx;
    padding:0 24rpx;
    font-size:26rpx;
    font-weight:400;
    color:#333;
    text-align:center;
    line-height:46rpx;
    background:#f4f4f4;
    border:1rpx solid #f7f7f7;
    border-radius:23rpx;
    -webkit-border-radius:23rpx;
    -moz-border-radius:23rpx;
    -ms-border-radius:23rpx;
    -o-border-radius:23rpx
}
.show-wrapper{
    height:440rpx;
    transition:height .5s;
    -webkit-transition:height .5s;
    -moz-transition:height .5s;
    -ms-transition:height .5s;
    -o-transition:height .5s
}
.tabs-mask{
    position:absolute;
    top:0;
    right:0;
    z-index:2;
    width:100%;
    height:260rpx;
    background:rgba(0,0,0,.3);
    transition:height .5s;
    -webkit-transition:height .5s;
    -moz-transition:height .5s;
    -ms-transition:height .5s;
    -o-transition:height .5s
}
.show-mask{
    height:100vh;
    transition:height .5s;
    -webkit-transition:height .5s;
    -moz-transition:height .5s;
    -ms-transition:height .5s;
    -o-transition:height .5s
}
.m-list .item .title{
    width:100%;
    text-overflow:-o-ellipsis-lastline;
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical
}
.m-nothing{
    padding-top:200rpx
}
.m-nothing image{
    margin:0 auto
}