﻿.LawsProductList {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

        .LawsProductList .nav-menu {
            width: 1180px;
            margin: 24px 0;
        }

            .LawsProductList .nav-menu li {
                display: inline-block;
                font-size: 14px;
                color: #303031;
                line-height: 14px;
            }

            .LawsProductList .nav-menu .current {
                color: #666;
            }

        .LawsProductList .main {
            display: flex;
            justify-content: center;
            width: 1180px;
            margin-bottom: 100px;
        }

            .LawsProductList .main .main-left {
                width: 780px;
            }

                .LawsProductList .main .main-left .product-list {
                    padding: 30px 30px 40px;
                    background: #fff;
                }

                    .LawsProductList .main .main-left .product-list .item {
                        background: #fff;
                        border: 1px solid #eee;
                        display: flex;
                        align-items: center;
                        margin-bottom: 24px;
                    }

                        .LawsProductList .main .main-left .product-list .item img {
                            width: 220px;
                            height: 110px;
                        }

                        .LawsProductList .main .main-left .product-list .item .info {
                            padding: 0 40px 0 24px;
                            width: 331px;
                        }

                            .LawsProductList .main .main-left .product-list .item .info .title {
                                display: inline-block;
                                font-size: 16px;
                                color: #303031;
                                line-height: 16px;
                                margin-bottom: 12px;
                                width: 267px;
                                white-space: nowrap;
                                overflow: hidden;
                                text-overflow: ellipsis;
                            }

                            .LawsProductList .main .main-left .product-list .item .info .desc {
                                display: inline-block;
                                font-size: 12px;
                                color: #909399;
                                line-height: 12px;
                                width: 267px;
                                white-space: nowrap;
                                overflow: hidden;
                                text-overflow: ellipsis;
                            }

                        .LawsProductList .main .main-left .product-list .item .buy {
                            position: relative;
                            width: 168px;
                            padding: 0 40px;
                        }

                            .LawsProductList .main .main-left .product-list .item .buy:before {
                                position: absolute;
                                content: "";
                                height: 80px;
                                width: 1px;
                                background: #eee;
                                display: inline-block;
                                top: 50%;
                                left: 0;
                                transform: translateY(-50%);
                            }

                            .LawsProductList .main .main-left .product-list .item .buy .price {
                                display: flex;
                                align-items: center;
                                justify-content: center;
                                font-size: 16px;
                                color: #f66;
                                line-height: 16px;
                                margin-bottom: 8px;
                            }

                                .LawsProductList .main .main-left .product-list .item .buy .price i {
                                    font-size: 12px;
                                    line-height: 12px;
                                }

                            .LawsProductList .main .main-left .product-list .item .buy .el-button {
                                border-color: #0071f3;
                                background: #0071f3;
                                border-radius: 14px;
                                font-size: 12px;
                                color: #fff;
                                width: 88px;
                                height: 28px;
                                padding: 0;
                                font-weight: 200;
                            }

    .el-button {
        display: inline-block;
        line-height: 1;
        white-space: nowrap;
        cursor: pointer;
        background: #fff;
        border: 1px solid #dcdfe6;
        color: #606266;
        -webkit-appearance: none;
        text-align: center;
        box-sizing: border-box;
        outline: 0;
        margin: 0;
        transition: .1s;
        font-weight: 500;
        -moz-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        padding: 12px 20px;
        font-size: 14px;
        border-radius: 4px;
    }

    .LawsProductList .main .main-left .product-list .pagination {
        padding-top: 16px;
    }

    .el-pagination {
        white-space: nowrap;
        padding: 2px 5px;
        color: #303133;
        font-weight: 700;
    }

        .el-pagination:after, .el-pagination:before {
            display: table;
            content: "";
        }

        .el-pagination.is-background .btn-next.disabled, .el-pagination.is-background .btn-next:disabled, .el-pagination.is-background .btn-prev.disabled, .el-pagination.is-background .btn-prev:disabled, .el-pagination.is-background .el-pager li.disabled {
            color: #c0c4cc;
        }

        .el-pagination.is-background .btn-prev {
            margin-right: 24px;
        }

        .el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li {
            border: 1px solid #f0efef;
            border-radius: 2px;
            font-weight: 400;
            font-size: 16px;
            line-height: 36px;
            height: 36px;
            text-align: center;
            background-color: #fff;
        }

        .el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li {
            margin: 0 5px;
            background-color: #f4f4f5;
            color: #606266;
            min-width: 30px;
            border-radius: 2px;
        }

        .el-pager, .el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev {
            padding: 0;
        }

        .el-pagination button:disabled {
            color: #c0c4cc;
            background-color: #fff;
            cursor: not-allowed;
        }

        .el-pagination .btn-prev {
            padding-right: 12px;
        }

        .el-pagination .btn-next, .el-pagination .btn-prev {
            background: 50% no-repeat #fff;
            background-size: 16px;
            cursor: pointer;
            margin: 0;
            color: #303133;
        }

        .el-pagination button, .el-pagination span:not([class*=suffix]) {
            padding: 0 13px;
            height: auto;
            line-height: 36px;
        }

        .el-pagination button {
            border: none;
            padding: 0 6px;
            background: 0 0;
        }

        .el-pagination button, .el-pagination span:not([class*=suffix]) {
            display: inline-block;
            font-size: 13px;
            min-width: 35.5px;
            height: 28px;
            line-height: 28px;
            vertical-align: top;
            box-sizing: border-box;
        }

        .el-pagination .btn-next .el-icon, .el-pagination .btn-prev .el-icon {
            display: block;
            font-size: 12px;
            font-weight: 700;
        }

    [class*=" el-icon-"], [class^=el-icon-] {
        font-family: element-icons !important;
        speak: none;
        font-style: normal;
        font-weight: 400;
        font-feature-settings: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        vertical-align: baseline;
        display: inline-block;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    .el-icon-arrow-left:before {
        content: "<";
    }

    .el-pager, .el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev {
        padding: 0;
    }

        .el-pager, .el-pager li {
            vertical-align: top;
            display: inline-block;
            margin: 0;
        }

    .el-pager {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        list-style: none;
        font-size: 0;
    }

        .el-pager li, .el-pager li.btn-quicknext:hover, .el-pager li.btn-quickprev:hover {
            cursor: pointer;
        }

        .el-pager, .el-pager li {
            vertical-align: top;
            display: inline-block;
            margin: 0;
        }

            .el-pager li {
                padding: 0 4px;
                background: #fff;
                font-size: 13px;
                min-width: 35.5px;
                height: 28px;
                line-height: 28px;
                box-sizing: border-box;
                text-align: center;
            }

                .el-pager li.active {
                    color: #409eff;
                    cursor: default;
                }

    .el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li {
        margin: 0 5px;
        background-color: #f4f4f5;
        color: #606266;
        min-width: 30px;
        border-radius: 2px;
    }

    .el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li {
        border: 1px solid #f0efef;
        border-radius: 2px;
        font-weight: 400;
        font-size: 16px;
        line-height: 36px;
        height: 36px;
        text-align: center;
        background-color: #fff;
    }

    .el-pagination.is-background .el-pager li {
        width: 36px;
        background: #fff;
        margin-right: 24px;
    }

        .el-pagination.is-background .el-pager li:not(.disabled).active {
            background-color: #409eff;
            color: #fff;
        }

    .LawsProductList .main .main-left .product-list .pagination .el-pagination.is-background .el-pager li:not(.disabled).active, .LawsProductList .main .main-left .product-list .pagination .el-pagination.is-background .el-pager li:not(.disabled):not(.active):hover {
        background: #0071f3;
        border-color: #0071f3;
    }

    .el-pager li.active + li {
        border-left: 0;
    }

    .el-icon-arrow-right:before {
        content: ">";
    }

    .LawsProductList .main .main-right {
        margin-left: 20px;
    }

        .LawsProductList .main .main-right .consule-card {
            margin-bottom: 20px;
            background: #fff;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            width: 380px;
            height: 154px;
        }

            .LawsProductList .main .main-right .consule-card .num {
                display: inline-block;
                font-size: 26px;
                color: #0071f3;
                line-height: 26px;
                margin-bottom: 14px;
            }

            .LawsProductList .main .main-right .consule-card .text {
                display: inline-block;
                font-size: 14px;
                color: #333;
                line-height: 14px;
                margin-bottom: 20px;
            }

            .LawsProductList .main .main-right .consule-card .button {
                width: 240px;
                height: 40px;
                background: #0071f3;
                border-color: #0071f3;
                border-radius: 2px;
                color: #fff;
            }

    .hot-recommend {
        padding: 30px;
        background: #fff;
    }

    .LawsProductList .main .main-right .hot-recommend {
        margin-top: 20px;
    }

    .hot-recommend h4 {
        font-weight: 500;
        display: flex;
        align-items: center;
        font-size: 20px;
        color: #333;
        line-height: 20px;
        margin-bottom: 16px;
    }

        .hot-recommend h4:before {
            content: "";
            width: 3px;
            height: 18px;
            display: inline-block;
            background: #0071f3;
            margin-right: 8px;
        }

    .hot-recommend .recommends {
        padding-top: 30px;
        border-top: 1px solid #eee;
    }

        .hot-recommend .recommends .first-item {
            display: flex;
        }

            .hot-recommend .recommends .first-item img {
                width: 132px;
                height: 88px;
                margin-right: 10px;
                display: inline-block;
            }

            .hot-recommend .recommends .first-item .title {
                font-weight: 500;
                display: inline-block;
                font-size: 16px;
                color: #303031;
                text-align: justify;
                line-height: 16px;
                width: 180px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                margin-bottom: 12px;
            }

            .hot-recommend .recommends .first-item .desc {
                width: 180px;
                height: 60px;
                font-size: 14px;
                color: #909399;
                text-align: justify;
                line-height: 20px;
                text-overflow: ellipsis;
                overflow: hidden;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 3;
            }


        .hot-recommend .recommends .recommend-item {
            display: flex;
            align-items: center;
            margin-top: 24px;
        }

            .hot-recommend .recommends .recommend-item:before {
                content: "";
                width: 6px;
                height: 6px;
                display: inline-block;
                border-radius: 50%;
                background: #bfc2cc;
                margin-right: 12px;
            }

            .hot-recommend .recommends .recommend-item span {
                display: inline-block;
                width: 300px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                font-size: 14px;
                color: #303031;
                line-height: 14px;
            }

    .hot-recommend {
        padding: 30px;
        background: #fff;
    }

            .hot-recommend .recommends li {
                cursor: pointer;
                margin-top: 30px;
                display: flex;
                align-items: center;
            }

                .hot-recommend .recommends li:first-child {
                    margin-top: 0;
                }

                .hot-recommend .recommends li .index {
                    background: #edeff2;
                    border-radius: 2px;
                    margin-right: 12px;
                    width: 20px;
                    height: 20px;
                    display: inline-block;
                    line-height: 20px;
                    text-align: center;
                    font-size: 14px;
                    color: #606266;
                }

                .hot-recommend .recommends li .index-1 {
                    color: #fff;
                    background: #fe5f7b;
                }

                .hot-recommend .recommends li .title {
                    white-space: nowrap;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: inline-block;
                    width: 285px;
                    font-size: 14px;
                    color: #303031;
                    line-height: 14px;
                }

    .LawsProductList .main .main-right .share {
        margin-top: 20px;
        padding: 20px 30px;
        background: #fff;
        display: flex;
        align-items: center;
    }

        .LawsProductList .main .main-right .share img {
            width: 60px;
            height: 60px;
            margin-right: 10px;
        }

        .LawsProductList .main .main-right .share .share-info {
            font-size: 16px;
            color: #333;
            line-height: 16px;
        }

            .LawsProductList .main .main-right .share .share-info span {
                display: block;
            }

            .LawsProductList .main .main-right .share .share-info .desc {
                font-size: 14px;
                color: #666;
                line-height: 14px;
                margin-top: 14px;
            }

.btn_buy{
    cursor:pointer;
}