﻿.stopScroll {
    overflow: hidden;
    height: 100vh;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
/*header包含三行筛选*/
.fixed-filter-tit{
    position: fixed;
    top: 0;
    width: 100%;
    max-width: 7.5rem;
    background: #fff;
    z-index: 100;
}
.fixed-filter-cont {
    margin-top: 3.3rem;
    overflow-y: scroll;
    padding-bottom: 0.2rem;
}
.fixed-filter-cont_top {
    margin-top: 5rem;
}
.fixed-filter-cont2 {
    margin-top: 4.48rem;
    overflow-y: scroll;
}
/*第二行筛选框*/
.filter-wrap{
    border: none;
}

.filter-wrap {
    display: flex;
    height: 0.6rem;
    font-weight: 500;
    font-size: 0.28rem;
    color: #0E0E0E;
}

.filter-item {
    width: 25%;
    display: flex;
    box-sizing: border-box;
    justify-content: center;
    align-items: center;
}

.filter-wrap .selected {
    color: #FE552E;
}
/*    .filter-wrap .selected .filter-item-icon {
        transform: rotate(180deg);
    }*/

.filter-item.selected:after {
    border-bottom: .1rem solid #e4393c;
    border-top: 0;
}
/*第四个筛选的icon不一样，样式得重新写*/
.filter-item-name{
    max-width: 75%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.filter-item.no-filters:after {
    border: 0;
}

.filter-item-name .iconfont{
    margin-left: .1rem;
    color: #666;
    font-size: .26rem;
}

.icon_filter:before {
    content: "\e601";
    font-size: 0.064rem;
}
.filter-item-name-selected .iconfont, .filter-item-name-selected{
    color: #e4393c;
}
/*第三行的横向的筛选*/
.filter-detail-box {
    display: flex;
    height: 0.82rem;
    line-height: 0.82rem;
    font-size: 0.26rem;
    color: #5F5E63;
}
/*横向筛选里的横向条件*/
.filter-label-box {
    display: flex;
    overflow-x: scroll;
    overflow-y: hidden;
    width: 100%;
    text-align: center;
    flex-wrap: nowrap;
    white-space: nowrap;
    padding: 0.12rem 0;
    margin: 0 0.128rem;
}
/*尾数规律*/
.label-item {
    min-width: 0.128rem;
    max-width: 3.2rem;
    width: auto;
    height: 0.58rem;
    margin: 0 0.07rem;
    padding: 0 0.28rem;
    border: 0.02rem solid #DDDDDD;
    border-radius: 0.32rem;
    box-sizing: border-box;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}

.filter-item-icon {
    width: 0.14rem;
    height: 0.14rem;
    margin-left: 0.12rem;
    transition: all 300ms ease;
}
.screening-icon {
    width: 0.22rem;
    height: 0.22rem;
    margin-left: 0.12rem;
}

.label_desc {
    overflow: hidden;
    text-overflow: ellipsis;
}

.show-filter {
    /*    height: 0.96rem;
    background: #f4f4f4;*/
    color: #FE552E;
    border: 0.02rem solid #FE552E;
}
    .show-filter .filter-item-icon {
        transform: rotate(180deg);
    }

.filter-selected-box:after, .label-item .arrow_icon:after {
    content: "";
    width: 0;
    height: 0;
    display: inline-block;
    border-top: 0.1rem solid #666;
    border-left: .08rem solid transparent;
    border-right: .08rem solid transparent;
    border-bottom: 0;
    margin-left: .1rem;
    -webkit-animation: all .5s;
    animation: all .5s;
    vertical-align: middle;
}

.filter-selected-box{
    width: 17%;
    text-align: center;
    font-size: 0.26rem;
    display: none;
}

    .filter-selected-box:after, .label-item .arrow_icon:after {
        content: "";
        width: 0;
        height: 0;
        display: inline-block;
        border-top: 0.1rem solid #666;
        border-left: .08rem solid transparent;
        border-right: .08rem solid transparent;
        border-bottom: 0;
        margin-left: .1rem;
        -webkit-animation: all .5s;
        animation: all .5s;
        vertical-align: middle;
    }

/*可发定位城市*/
.delivery_city_box {
    padding: 0.2rem 0.4rem;
    border-top: 0.02rem solid #f6f7f9;
    display: flex;
}
    .delivery_city_box .delivery_city {
        /*width: 2.86rem;*/
        height: 0.58rem;
        line-height: 0.58rem;
        border-radius: 0.27rem;
        border: 0.02rem solid #F53323;
        box-sizing: border-box;
        font-weight: 500;
        font-size: 0.28rem;
        color: #F53323;
        text-align: center;
        padding: 0 0.2rem;
    }
    .delivery_city_box .delivery_city_selected {
        color: #FFFFFF;
        background: #F53323;
    }

/*地址弹出框*/
.content-box{
    position: fixed;
    width: 100%;
    max-width: 7.5rem;
    height: 100vh;
    background: rgba(0,0,0,.4);
    z-index:1;
}

.options-wrap {
    max-height: 45vh;
    overflow: hidden;
    display: flex;
    background: #F8F8F8;
    border-radius: 0rem 0rem 0.2rem 0.2rem;
}

    .options-wrap:after {
        content: "";
        position: absolute;
        width: 100%;
        height: 100vh;
        bottom: -100vh;
        background: rgba(0,0,0,.4);
    }
/*省市样式*/
.options-column-wrap {
    overflow-y: auto;
    flex: 1;
    background: #fff;
}

#xzc {
    background: #F8F8F8;
}

.options-column-wrap {
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
}
.options-column-wrap::-webkit-scrollbar-track-piece {
    background-color: rgba(0, 0, 0, 0);
    border-left: 1px solid rgba(0, 0, 0, 0);
}
.options-column-wrap::-webkit-scrollbar {
    width: 5px;
    height: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.options-column-wrap::-webkit-scrollbar-thumb {
    background-color: rgba(191, 191, 191, 191);
    background-clip: padding-box;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    min-height: 28px;
}
.options-column-wrap::-webkit-scrollbar-thumb:hover {
    background-color: rgba(0, 0, 0, 0.5);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.options-item {
    position: relative;
    padding: 0 0.7rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: border-box;
    height: 0.84rem;
    line-height: 0.84rem;
    font-weight: 500;
    font-size: 0.28rem;
    color: #484848;
    box-sizing: border-box;
    border-bottom: 0.01rem solid #F2F2F2;
}
/*省份*/
.options-item-province{
    margin: 0;
}

.options-item-province{
    background: #fff;
}
    .options-item-province.item-selected {
        color: #F53323;
        background: url(../image/check_icon.png) left .3rem bottom .3rem no-repeat;
        background-size: 0.24rem auto;
        background-color: #F8F8F8;
    }
.options-item.item-selected {
    color: #F53323;
}
/*运营商弹出框*/
.options-item.item-checked-selected {
    color: #FE552E;
    background: url(../image/check_icon.png) left .3rem bottom .3rem no-repeat;
    background-size: 0.24rem auto;
    background-color: #F8F8F8;
}
/*排序弹出框*/
.icon-icon_down, .icon-icon_up {
   /* margin-top: 0.08rem;*/
}
.icon-icon_down:before,.icon-icon_up:before {
    font-size: 0.28rem;
}


/*筛选弹出框*/
.filter-bg{
    position: fixed;
    z-index: 10;
    top: 0;
    width: 100%;
    max-width: 7.5rem;
    background: rgba(0,0,0,.4);
    height: 100vh;
    transition: all .3s;
    padding-bottom: env(safe-area-inset-bottom);
}

.filter-panel{
    width: 88%;
    min-height: 100vh;
    background: #fff;
    flex-direction: column;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 15;
}

.filter-title{
    height: 1rem;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 .2025rem;
    color: #666;
    border-bottom: 0.01rem solid #e0e0e0;
}

.filter-title span{
    flex: 1;
}

.icon_prev:before {
    content: "\e608";
    margin-right: 0.064rem;
}

.filter-title .title-text{
    color: #333;
    font-size: .3008rem;
}

.fliter-content{
    min-height: 80vh;
    overflow: hidden;
    padding-bottom: env(safe-area-inset-bottom);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    -webkit-overflow-scrolling: touch;
}
/*筛选列表*/
.filter-list{
    background: #fff;
    overflow-y: scroll;
    max-height: 78vh;
    flex-shrink: 0;
    margin-bottom: .16rem;
}
/*模糊搜索*/
.filter-list .filter-search{
    border-top: 0.01rem solid #f60;
    border-bottom: 0.01rem solid #f60;
    background: #ffffe0;
    overflow: hidden;
}

.filter-search .item-desc{
    color: #e4393c;
}

.filter-search .item-value .iconfont{
    color: #e4393c;
}

.icon_clear:before {
    content: "\e602";
}
/*送货方式*/
.not-number-box{
    display: flex;
    flex-wrap: wrap;
    padding: .16rem 0.32rem;
    justify-content: space-between;
}

.not-number{
    position: relative;
    width: 30%;
    text-align: center;
    margin: .1rem 0;
    background: #f7f7f7;
    font-size: .272rem;
}

.not-number-box .not-number-selected{
    color: #e4393c;
}

.not-number-text{
    line-height: 0.64rem;
}

.not-number-box .not-number-selected{
    color: #e4393c;
}

    .not-number-box .not-number-selected:after {
        content: "";
        position: absolute;
        right: 0;
        bottom: 0;
        width: 0.3rem;
        height: 0.3rem;
        border-radius: 0 0 0.04rem 0;
        background: url('../image/redgoubg.png') no-repeat;
        background-size: 0.3rem auto;
        overflow: hidden;
        z-index: 1;
    }
/*号段*/
.filters-item{
    line-height: 0.8rem;
    padding: 0 .3008rem 0 0.128rem;
    font-size: .28rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #5a5a5a;
   /* border-bottom: 0.01rem solid #eee;*/
    white-space: nowrap;
}

.filters-item .item-value{
    display: flex;
    align-items: center;
    justify-content: center;
    color: #999;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: .256rem;
}

.filters-item .item-value span:first-child {
    margin-right: .1rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

.icon_next:before {
    font-size: 0.22rem;
    color: #aaa;
    content: "\e69b";
}

/*筛选的选项*/
.f_items ul li {
    font-size: .26rem;
}

/*筛选的两个按钮*/
.option-btns {
    display: flex;
    position: fixed;
    bottom: 0;
    width: 88%;
    max-width: 6.6rem;
    height: 0.96rem;
    align-items: center;
    margin-bottom: calc(.16rem + env(safe-area-inset-bottom));
    flex-shrink: 0;
    padding: 0 0.256rem;
}

.option-btns > div{
    align-items: center;
    font-size: .3008rem;
    height: 0.896rem;
    line-height: 0.896rem;
    text-align: center;
}

.option-btns .clear-choose{
    width: 50%;
    background: #fff;
    color: #898989;
    border: 0.01rem solid #e1e2e3;
    border-right: none;
    border-top-left-radius: 0.896rem;
    border-bottom-left-radius: 0.896rem;
}

.option-btns .confirm-btn{
    width: 50%;
    background: #e4393c;
    color: #fff;
    border-top: 0.01rem solid #e4393c;
    border-top-right-radius: 0.896rem;
    border-bottom-right-radius: 0.896rem;
}

/*下一级弹框*/
.filter-detail{
    background: #f4f5f7;
    overflow-y: scroll;
    height: calc(87% + env(safe-area-inset-bottom));
}

.filter-detail .filters-item{
    background: #fff;
}

.filter-desc{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.focus-color{
    color: #e4393c !important;
}
.filter-detail .yys_item {
    width: 1.2rem;
    height: .6rem;
    background: #fff;
    border-radius: .05rem;
    text-align: center;
    line-height: .6rem;
    float:left;
    margin:.3rem 0 0 .3rem;
}
.yys_items{
    background:#ef3030 !important;
    color:#fff;
}
/*第三行小模块筛选下面的小模块弹窗*/
.content-box {
    position: fixed;
    width: 100%;
    height: 100vh;
    background: rgba(0,0,0,.4);
}


.filters-box {
    max-height: 40vh;
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
    width: 100%;
    padding: 0.16rem 0.34rem 0;
    overflow: auto;
}
.filters-box::-webkit-scrollbar-track-piece {
    background-color: rgba(0, 0, 0, 0);
    border-left: 1px solid rgba(0, 0, 0, 0);
}
    .filters-box::-webkit-scrollbar {
        width: 5px;
        height: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
    }
    .filters-box::-webkit-scrollbar-thumb {
        background-color: rgba(191, 191, 191, 191);
        background-clip: padding-box;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        min-height: 28px;
    }
        .filters-box::-webkit-scrollbar-thumb:hover {
            background-color: rgba(0, 0, 0, 0.5);
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
        }

/* 价格列表 */
.filters-box .filter-price-list {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.18rem 0.26rem;
    padding-bottom: 0.5rem;
}

/* 靓号规律弹框 */
.filter-label-title {
    font-weight: 800;
    color: #0E0E0E;
    font-size: 0.32rem;
    line-height: 0.32rem;
    height: 0.32rem;
    width: 100%;
    margin: 0.14rem 0.1rem 0;
}

/* 规律列表 */
.filters-box .filter-rule-list, .filters-box .filter-rule-list {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.2rem;
    padding: 0.26rem 0;
}

/* 列表 三列 */
.filters-box .filter-rule-list {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.2rem;
    padding: 0.24rem 0;
}

.filter-label {
    padding: 0 0.15rem;
    height: 0.64rem;
    border-radius: 0.3rem;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.selected_active {
    color: #ef3030;
}
.selected-active {
    color: #fff;
    background: #FE552E;
}

.filter-label .close_icon {
    margin-left: 0.16rem;
    width: 0.16rem;
    height: 0.16rem;
    display: none;
}
.selected-active .close_icon {
    display: inline-block;
}

.filter-selected-box.selected-active:after {
    border-bottom: .1rem solid #e4393c;
    border-top: 0;
}

.icon-select:before {
    content: "\e72e";
}
/*选了之后*/
.filter-active {
    color: #FE552E;
    border: 0.02rem solid #FE552E;
}

.label-item.filter-active .arrow_icon:after {
    border-bottom: .1rem solid #fff;
    border-top: 0;
}
/*重置确认按钮*/
.btn-box {
    width: 100%;
    height: 1.26rem;
    background: #F1F1F1;
    font-size: 0.28rem;
    display: flex;
    align-items: center;
    justify-content: center;
}


.cancel-btn, .submit-btn {
    width: 2.6rem;
    text-align: center;
    color: #fff;
    height: 0.8rem;
    line-height: 0.8rem;
}

.cancel-btn {
    background: #fff;
    border-top-left-radius: 0.64rem;
    border-bottom-left-radius: 0.64rem;
    color: #6C6C6C;
}

.submit-btn{
    background: #e4393c;
    border-top-right-radius: 0.64rem;
    border-bottom-right-radius: 0.64rem;
}
/*筛选弹窗 新*/
.filter-options-wrap {
    min-height: 1.6rem;
    max-height: 70vh;
    display: flex;
    flex-wrap: wrap;
    background: #F8F8F8;
    flex-direction: row;
    align-content: flex-start;
    justify-content: space-between;
    font-size: 0.24rem;
    color: #666;
    border-radius: 0rem 0rem 0.2rem 0.2rem;
    overflow: hidden;
}

.filter-box-item {
    height: 0.6rem;
    line-height: 0.6rem;
    color: #e4393c;
    margin-top: 0.3rem;
    width: 48%;
    background: #fff;
    box-sizing: border-box;
    justify-content: space-between;
    align-items: center;
    display: flex;
    padding: 0 .128rem;
    margin-bottom: .1rem;
}
.qk {
    height: 0.6rem;
    line-height: .6rem;
    color: #e4393c;
    margin-top: .3rem;
    width: 48%;
    background: #fff !important;
    box-sizing: border-box;
    /*justify-content: space-between;
    align-items: center;*/
    display: inline-block;
    padding: 0 .128rem;
    margin-bottom: .1rem;
}
.qk .iconfont{
    float:right;
}
.filter-desc{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.filter-options-wrap .reset_box {
    width: 100%;
    height: 1.26rem;
    background: #F1F1F1;
    display: flex;
    align-items: center;
    justify-content: center;
}
    .filter-options-wrap .reset_box .reset_btn {
        width: 5.2rem;
        height: 0.8rem;
        line-height: 0.8rem;
        text-align: center;
        background: #FFFFFF;
        border-radius: 0.4rem;
        font-weight: 500;
        font-size: 0.28rem;
        color: #6C6C6C;
    }

    
.hid {
    display: none;
}
.show {
    display: block;
}
/*新添加的价格区间里的自定义价格*/
.opt_box {
    width: 100%;
    padding: 0.16rem 0 0.26rem;
    display: flex;
    align-items: center;
}

    .opt_box .input-box {
        background: #fff;
        border-radius: 0.125rem;
        color: #9C9FA1 !important;
        width: 1.6rem;
        max-width: 2rem;
        height: 0.78rem;
        font-size: 0.28rem;
        padding: 0 0.2rem;
        box-sizing: border-box;
    }
    
    .opt_box .input-box::placeholder {
        color: #5D5D5D;
    }
    .opt_box .input-box:focus-visible {
        outline: none;
    }
    .opt_box span {
        padding: 0 0.1rem;
        color: #666;
        line-height: 0.6rem;
    }

.btn-confirm {
    background: #f3bebe;
    color: #d71c23 !important;
    border: 0.02rem solid #d71c23;
    padding: 0;
    display: block;
    width: 1.2rem;
    text-align: center;
    font-size: 0.28rem;
    line-height: 0.6rem;
    height: 0.6rem;
    margin-left: 0.2rem;
    border-radius: 0.1rem;
}
.slideUp {
    /*display: block;*/
}

.slideDown {
    display: none;
}