﻿.category-filter {
    background: #fff;
    border-bottom: 1px solid #f2f2f2;
    font-size: .6rem;
    height: 2rem;
    padding: 0 .6rem
}

    .category-filter ul {
        margin: 0
    }

        .category-filter ul li {
            float: left;
            width: 25%;
            line-height: 2rem;
            text-align: center;
            display: flex;
            justify-content: center
        }

            .category-filter ul li label {
                float: left;
                position: relative
            }

    .category-filter .triangle-up {
        transform: rotate(-90deg);
        position: absolute;
        top: .7rem;
        left: .2rem;
        width: .4rem;
        height: .4rem
    }

    .category-filter .triangle-down {
        transform: rotate(90deg);
        position: absolute;
        top: .95rem;
        left: .2012rem;
        width: .4rem;
        height: .4rem
    }

    .category-filter .filter {
        position: absolute;
        top: .7rem;
        left: .1rem;
        width: .7rem;
    }

    .category-filter .active {
        color: #1296db
    }




.filter-box {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.3);
    z-index: 10000
}

    .filter-box .filter {
        position: absolute;
        width: 76%;
        left: 24%;
        background: #fff;
        top: 0;
        bottom: 3.3rem
    }

        .filter-box .filter .filter-head {
            font-size: .7rem;
            text-align: center;
            border-bottom: 1px solid #eee;
            line-height: 1.5rem;
            position: relative
        }

            .filter-box .filter .filter-head .back {
                position: absolute;
                left: .2rem;
                top: .3rem
            }

        .filter-box .filter .filter-container {
            height: 100%;
            background: #fff;
            overflow: auto
        }

            .filter-box .filter .filter-container .item {
                margin-bottom: .5rem;
                padding-left: .4rem
            }

                .filter-box .filter .filter-container .item p {
                    line-height: 1.5rem;
                    overflow: hidden
                }

                    .filter-box .filter .filter-container .item p .add-chose {
                        float: right;
                        padding-right: .42rem;
                        font-weight: 400;
                        font-size: .51rem;
                        color: #999
                    }

                .filter-box .filter .filter-container .item span {
                    display: inline-block;
                    font-size: .5rem;
                    margin-bottom: 10px;
                    min-width: 3rem;
                    padding: 0 .2rem;
                    line-height: 1rem;
                    text-indent: 0;
                    text-align: center;
                    border: 1px solid #f0f2f5;
                    background: #f0f2f5;
                    border-radius: .6rem;
                    margin-right: .17rem
                }

                    .filter-box .filter .filter-container .item span.cur {
                        color: #29a0ff;
                        border: 1px solid #29a0ff;
                        background: #fff
                    }

        .filter-box .filter .filter-bottom {
            position: relative;
            background: #fff;
            border-top: 1px solid #eee;
            height: 1.8rem;
            line-height: 1.8rem
        }

            .filter-box .filter .filter-bottom .filter-table {
                width: 100%
            }

            .filter-box .filter .filter-bottom span {
                width: 49%;
                display: inline-block;
                text-align: center;
                line-height: 1rem;
                margin-top: .4rem
            }

                .filter-box .filter .filter-bottom span:first-child {
                    border-right: 1px solid #dbdbdb
                }

                .filter-box .filter .filter-bottom span.ok {
                    position: absolute;
                    right: 0;
                    top: 0;
                    color: #29a0ff
                }




.category {
    padding: 2.8rem 0 0;
    box-sizing: padding-box;
    background: #fff;
    color: #333;
    height: 100%
}

    .category .content {
        display: flex;
        height: 100%
    }

        .category .content .right {
            width: 100%;
            padding: 0 0 7.5rem;
            box-sizing: padding-box;
            overflow: auto;
            -webkit-overflow-scrolling: touch
        }












.product-list {
    font-size: .5rem;
    width: 100%
}

    .product-list .no-more {
        width: 100%;
        height: 5.8rem;
        line-height: 5.8rem;
        font-size: .6rem;
        text-align: center;
        letter-spacing: .02rem;
        color: #848484;
        background: #f4f4f4
    }

    .product-list .hot-h2 {
        width: 100%;
        line-height: 1.7rem;
        padding-left: .64rem;
        box-sizing: border-box;
        background: #fff;
        font-size: .64rem
    }

    .product-list .second-search {
        width: 100%;
        line-height: .85rem;
        padding: .64rem .85rem;
        box-sizing: border-box;
        background: #fff;
        font-size: .56rem
    }

        .product-list .second-search .red {
            color: #e73c31
        }

    .product-list .more {
        text-align: center;
        font-size: .6rem;
        line-height: 1rem;
        padding: .5rem 0
    }

    .product-list .product-item {
        border-bottom: 1px solid #e8e8e8;
        display: flex;
        padding: 0 .4rem
    }

        .product-list .product-item .img-box {
            width: 4.7rem;
            height: 4.7rem;
            padding: .2rem 0;
            margin: auto 0;
            position: relative
        }

            .product-list .product-item .img-box img {
                width: 100%;
                height: 100%;
                border: 0
            }

            .product-list .product-item .img-box .sale-sign {
                position: absolute;
                top: .2rem;
                left: 0
            }

            .product-list .product-item .img-box .sale-txt-sign {
                display: inline-block;
                position: absolute;
                width: 1.1rem;
                height: 1.1rem;
                top: .25rem;
                left: 0;
                padding: .02rem .01rem;
                font-size: .48rem;
                border-bottom-left-radius: 1.5rem;
                border-bottom-right-radius: 1.5rem;
                text-align: center;
                font-weight: 100;
                color: #fff;
                background-color: #f75958;
                background: -moz-linear-gradient(to top right,#e4417e 0,#f75958 100%);
                background: -webkit-gradient(to top right,#e4417e 0,#f75958 100%);
                background: -webkit-linear-gradient(to top right,#e4417e 0,#f75958);
                background: -o-linear-gradient(to top right,#e4417e 0,#f75958 100%);
                background: -ms-linear-gradient(to top right,#e4417e 0,#f75958 100%);
                background: linear-gradient(to top right,#e4417e 0,#f75958)
            }

            .product-list .product-item .img-box .no-stock {
                position: absolute;
                width: 50%;
                height: auto;
                left: 50%;
                top: 50%;
                margin-top: -25%;
                margin-left: -25%;
                z-index: 1
            }

            .product-list .product-item .img-box .search-rec-icon {
                position: absolute;
                width: 1.66rem;
                height: 1rem;
                background-image: url(data:image/png;base64,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);
                background-repeat: no-repeat;
                background-size: contain;
                left: 0;
                top: .2rem
            }

        .product-list .product-item .content {
            flex: 1;
            padding: .2rem 0;
            margin-left: .768rem
        }

            .product-list .product-item .content .title {
                line-height: 1rem;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 3;
                word-break: break-all;
                text-overflow: ellipsis;
                overflow: hidden
            }

                .product-list .product-item .content .title span.content-tip {
                    display: inline-block;
                    padding: .1rem .17rem;
                    background: #ef334d;
                    color: #fff;
                    line-height: .55rem;
                    font-size: .48rem;
                    border-radius: 3px;
                    box-sizing: border-box;
                    margin-right: 6px
                }

            .product-list .product-item .content .price {
                line-height: 1rem;
                font-size: .68rem;
                color: #ef334d
            }

                .product-list .product-item .content .price .price-sign {
                    font-size: .47rem
                }

                .product-list .product-item .content .price .no-stock {
                    background-color: #aeb6c4;
                    color: #000;
                    border-radius: 5px;
                    padding: 0 10px
                }

            .product-list .product-item .content .no-stock {
                font-size: .5rem
            }

            .product-list .product-item .content .tip-box {
                font-size: .48rem
            }

                .product-list .product-item .content .tip-box .return {
                    display: inline-block
                }

                    .product-list .product-item .content .tip-box .return span {
                        padding: 0 4px;
                        border: 1px solid #ef334d;
                        color: #ef334d;
                        line-height: .55rem;
                        box-sizing: border-box;
                        border-radius: 3px;
                        margin-right: 3px
                    }

    .product-list .skeleton-wrapper {
        padding: .4rem
    }

        .product-list .skeleton-wrapper .skeleton-img {
            display: block;
            width: 100%
        }

.category-search input[type="text"] {
    width: 80%;
}
.category-search input[type="button"] {
    width: 16%;
    color: #1296db;
    background:none;
}