@charset "UTF-8";

@keyframes fadein {
    0% {
        opacity: 0;
        transform: scale(0.95);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes slide_in {
    0% {
        opacity: 0;
        transform: translateY(100px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.gray-filter {
    -webkit-filter: grayscale(1.5);
    filter: grayscale(1.5);
}

.capitalize {
    text-transform: capitalize;
}

.wrap-account * {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

    .wrap-account *:not(input):not(textarea) {
        -webkit-touch-callout: none;
        -webkit-tap-highlight-color: transparent;
    }

._flex-center {
    display: flex;
    justify-content: center;
}

#center-m {
    padding: 8px;
}

.page_member {
    width: 100%;
    background: #f7f7f7;
    height: 100%;
}

    .page_member p {
        font-size: 12px;
    }

    .page_member a {
        display: block;
        text-decoration: none;
        color: #333;
        padding: 0;
        margin: 0;
    }

    .page_member ul {
        margin: 0;
        padding: 6px;
        list-style: none;
    }

        .page_member ul::-webkit-scrollbar {
            display: none;
        }

    .page_member li {
        display: inline-block;
    }

    .page_member .ptop-member.hide-info .profiles-member {
        display: none;
    }

    .page_member .profiles-member {
        background: #fff;
        height: 60px;
    }

        .page_member .profiles-member .box-mb {
            display: flex;
            align-items: center;
        }

        .page_member .profiles-member .ava-mb {
            width: 50px;
            height: 50px;
            text-align: center;
            display: inline-block;
            vertical-align: middle;
        }

            .page_member .profiles-member .ava-mb img {
                max-width: 100%;
                border-radius: 50%;
            }

        .page_member .profiles-member .name-mb {
            margin-left: 12px;
            -webkit-line-clamp: 1;
            -webkit-box-orient: vertical;
            overflow: hidden;
            display: -webkit-box;
        }

    .page_member .bd-member {
        margin-top: 10px;
    }

        .page_member .bd-member .box-bd {
            background: #fff;
            padding: 5px;
            margin-bottom: 10px;
        }

        .page_member .bd-member .title-tab {
            display: inline-block;
        }

            .page_member .bd-member .title-tab img {
                vertical-align: -5px;
                margin-right: 5px;
                width: 24px;
                height: 24px;
            }

        .page_member .bd-member .view-hiso {
            float: right;
            margin-top: 4px;
        }

            .page_member .bd-member .view-hiso img {
                margin-left: -4px;
                vertical-align: -4px;
            }

        .page_member .bd-member .tab-box-bd {
            border-bottom: 1px solid #eee;
            padding-bottom: 5px;
        }

        .page_member .bd-member .main-box-bd {
            display: flex;
            padding-top: 5px;
        }

        .page_member .bd-member .item-bd {
            margin: 5px;
            width: 24%;
            text-align: center;
        }

            .page_member .bd-member .item-bd a {
                height: 100%;
                width: 100%;
            }

        .page_member .bd-member .icon-progess {
            position: relative;
            width: 30px;
            margin: auto;
        }

            .page_member .bd-member .icon-progess img {
                width: 28px;
            }

        .page_member .bd-member .prog-sl {
            background: #da251c;
            min-width: 16px;
            height: 16px;
            line-height: 16px;
            border-radius: 8px;
            padding: 0 3px;
            color: #fff;
            font-size: 12px;
            position: absolute;
            top: -4px;
            right: -4px;
        }

        .page_member .bd-member .prog-name {
            margin-top: 10px;
        }

        .page_member .bd-member .list-prd-repur {
            display: flex;
            overflow-x: auto;
            overflow-y: hidden;
            -webkit-overflow-scrolling: touch;
        }

        .page_member .bd-member .img-prd-repur {
            text-align: center;
        }

            .page_member .bd-member .img-prd-repur img {
                width: 80px;
                height: 80px;
                object-fit: contain;
            }

        .page_member .bd-member .name-prd-repur {
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            display: -webkit-box;
            margin: 5px 0;
            height: 40px;
        }

        .page_member .bd-member .am-buy {
            color: #c3c3c3;
            font-size: 11px;
        }

        .page_member .bd-member .pri-prd-meta {
            font-weight: bold;
            color: #da251c;
            margin-top: 5px;
            height: 16px;
        }

        .page_member .bd-member .pri-prd-old {
            color: #c3c3c3;
            font-size: 11px;
            text-decoration: line-through;
            height: 16px;
        }

        .page_member .bd-member .buy-prd {
            padding: 5px;
            background: #0fa80f;
            color: #fff;
            text-align: center;
            border-radius: 3px;
            margin-top: 5px;
        }

        .page_member .bd-member .flashsale-sp ~ .pri-prd-meta,
        .page_member .bd-member .flashsale-sp ~ .pri-prd-old,
        .page_member .bd-member .flashsale-sp ~ .buy-prd {
            display: none;
        }

    .page_member .item-prd-repur {
        margin: 5px;
        border: 1px solid #eee;
        border-radius: 3px;
        padding: 5px;
        flex: 0 0 110px;
        position: relative;
    }

        .page_member .item-prd-repur.last {
            display: flex;
            justify-content: center;
            flex-direction: column;
        }

            .page_member .item-prd-repur.last a {
                text-align: center;
                vertical-align: middle;
                margin: auto;
            }

                .page_member .item-prd-repur.last a img {
                    vertical-align: -4px;
                    margin-left: -5px;
                }

@media (hover: hover) {
    .page_member .item-prd-repur.last a:hover .name-prd-repur {
        color: #da251c;
    }
}

.page_member .pacc-member {
    background: #fff;
}

    .page_member .pacc-member.hide-info .profiles-member {
        display: none;
    }

    .page_member .pacc-member .profiles-member {
        background: #fff;
        height: 60px;
        border-bottom: 1px solid #eee;
        display: none;
    }

        .page_member .pacc-member .profiles-member .ava-mb {
            width: 50px;
            height: 50px;
            display: inline-block;
            vertical-align: middle;
        }

            .page_member .pacc-member .profiles-member .ava-mb img {
                max-width: 100%;
                border-radius: 50%;
            }

        .page_member .pacc-member .profiles-member .name-mb {
            display: inline-block;
            margin-left: 5px;
        }

    .page_member .pacc-member .item-acc {
        display: block;
        width: 100%;
        position: relative;
        padding: 8px 0;
        border-bottom: 1px solid #eee;
    }

        .page_member .pacc-member .item-acc.is-current {
            font-weight: bolder;
        }

            .page_member .pacc-member .item-acc.is-current a {
                color: #da251c;
            }

@media (hover: hover) {
    .page_member .pacc-member .item-acc:hover a {
        color: #da251c;
    }
}

.page_member .pacc-member .ite-acc-left img {
    vertical-align: -5px;
    margin-right: 10px;
    width: 20px;
}

.page_member .title-tab-order {
    display: inline-block;
    display: -moz-box;
    display: -ms-flexbox;
    display: inline-flex;
    display: flex;
    flex-direction: row;
    overflow: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    background: #fff;
    scroll-behavior: smooth;
}

    .page_member .title-tab-order::-webkit-scrollbar {
        display: none;
    }

    .page_member .title-tab-order > input[type="radio"] {
        position: absolute;
        left: -100px;
        top: -100px;
    }

        .page_member .title-tab-order > input[type="radio"] + label {
            display: inline-block;
            color: #333;
            cursor: pointer;
            border-bottom: 2px solid #fff;
            margin-right: 10px;
            font-size: 16px;
            text-align: center;
            padding: 7px 10px;
            white-space: nowrap;
        }

        .page_member .title-tab-order > input[type="radio"]:checked + label {
            border-bottom: 2px solid #da251c;
            color: #da251c;
        }

.page_member .zone-order {
    position: relative;
}

    .page_member .zone-order section {
        display: none;
        padding: 10px 0 0;
    }

    .page_member .zone-order .wrap-list-order {
        min-height: 150px;
        position: relative;
    }

    .page_member .zone-order .history-summary {
        padding: 8px 0;
        text-align: right;
        font-size: 16px;
        background: #fff;
    }

        .page_member .zone-order .history-summary .money {
            font-weight: 600;
            color: #da251c;
        }

.page_member .tab-content.active {
    display: block;
    margin-bottom: 10px;
}

.page_member .input-search-txt {
    width: calc(100% - 2px);
    border: 1px solid #eee;
    border-radius: 3px;
    height: 30px;
    text-indent: 5px;
    font-size: 16px;
}

.page_member .search-order {
    background: #fff;
    padding: 10px 0;
    position: relative;
}

.page_member .icon-search-order img {
    width: 16px;
    position: absolute;
    right: 10px;
    top: 18px;
}

.page_member .item-list-order {
    padding: 10px;
    background: #fff;
}

    .page_member .item-list-order + .item-list-order {
        margin-top: 10px;
    }

    .page_member .item-list-order ~ .not-order {
        display: none;
    }

.page_member .cancel-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1001;
    border-radius: 3px;
    animation-name: fadein;
    animation-duration: 0.3s;
    animation-timing-function: ease-in-out;
}

    .page_member .cancel-popup .cancel-wrap {
        width: 100%;
        margin: auto;
        max-width: 450px;
        padding: 10px 10px 20px;
        background: #fff;
        border-radius: 3px;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        margin: auto;
    }

    .page_member .cancel-popup .cancel-close {
        position: absolute;
        width: 30px;
        height: 30px;
        opacity: 0.54;
        padding: 7px;
        top: 2px;
        right: 2px;
    }

@media (hover: hover) {
    .page_member .cancel-popup .cancel-close:hover {
        transition: background 0.5s;
        background-color: #eee;
        border-radius: 50%;
    }
}

.page_member .cancel-popup .cancel-popup-title {
    font-size: 18px;
    text-align: center;
    margin: 10px 0 24px;
}

.page_member .cancel-popup .cancel-popup-reason {
    margin: 10px 0 24px;
}

    .page_member .cancel-popup .cancel-popup-reason .reason-list .reason-item {
        position: relative;
        padding: 3px 5px;
        min-height: 36px;
        transition: background 0.3s;
        border-radius: 5px;
        cursor: pointer;
    }

        .page_member
        .cancel-popup
        .cancel-popup-reason
        .reason-list
        .reason-item
        .reason-item-title {
            position: relative;
            padding-left: 25px;
            padding-top: 7px;
        }

        .page_member
        .cancel-popup
        .cancel-popup-reason
        .reason-list
        .reason-item
        .cancel-popup-input {
            font-size: 16px;
            border: 1px solid #eee;
            border-radius: 3px;
            padding: 8px 10px;
            width: 100%;
            margin-top: 5px;
        }

@media (hover: hover) {
    .page_member
    .cancel-popup
    .cancel-popup-reason
    .reason-list
    .reason-item:hover:not(.current) {
        background: #eae9e9;
    }
}

.page_member
.cancel-popup
.cancel-popup-reason
.reason-list
.reason-item::before {
    content: "";
    display: block;
    position: absolute;
    width: 8px;
    height: 8px;
    background: #fff;
    border-radius: 100%;
    top: 12px;
    border: solid 3px #fff;
    box-shadow: 0 0 0 1px #aaa;
}

.page_member
.cancel-popup
.cancel-popup-reason
.reason-list
.reason-item.current
.reason-item-title {
    padding-top: 7px;
}

.page_member
.cancel-popup
.cancel-popup-reason
.reason-list
.reason-item.current::before {
    background: rgba(218, 37, 28, 0.87);
    border-radius: 100%;
    top: 12px;
    border: solid 3px #fff;
    box-shadow: 0 0 0 1px rgba(218, 37, 28, 0.87);
}

.page_member .cancel-popup .popup-btn {
    margin-top: 10px;
    display: flex;
    justify-content: center;
}

    .page_member .cancel-popup .popup-btn .popup-submit,
    .page_member .cancel-popup .popup-btn .popup-skip {
        width: 140px;
        text-align: center;
        line-height: 36px;
        border-radius: 3px;
        margin: 10px;
        cursor: pointer;
        font-size: 15px;
        user-select: none;
        -webkit-user-select: none;
    }

        .page_member .cancel-popup .popup-btn .popup-submit a,
        .page_member .cancel-popup .popup-btn .popup-skip a {
            color: #aaa;
        }

    .page_member .cancel-popup .popup-btn .popup-skip {
        background: #0fa80f;
        position: relative;
    }

        .page_member .cancel-popup .popup-btn .popup-skip a {
            color: #fff;
        }

@media (hover: hover) {
    .page_member .cancel-popup .popup-btn .popup-skip:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member .cancel-popup .popup-btn .popup-skip:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .cancel-popup .popup-btn .popup-submit {
    background: #fafafa;
}

    .page_member .cancel-popup .popup-btn .popup-submit.enable {
        background: #da251c;
        position: relative;
    }

@media (hover: hover) {
    .page_member .cancel-popup .popup-btn .popup-submit.enable:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member .cancel-popup .popup-btn .popup-submit.enable:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .cancel-popup .popup-btn .popup-submit.enable a {
    color: #fff;
}

.page_member .cancel-popup-bg {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 1000;
    background: rgba(0, 0, 0, 0.35);
}

.page_member .list-order-more {
    text-align: center;
    padding: 20px 0;
    background: #fff;
}

    .page_member .list-order-more a {
        color: #0071c4;
        padding: 8px 16px;
        border: 1px solid #0071c4;
        border-radius: 3px;
        display: inline-block;
        position: relative;
    }

@media (hover: hover) {
    .page_member .list-order-more a:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member .list-order-more a:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .code-order {
    display: inline-block;
    font-weight: bold;
}

.page_member .status-order {
    float: right;
    color: #0fa80f;
}

    .page_member .status-order.is-cancel {
        color: #555;
    }

    .page_member .status-order img {
        vertical-align: middle;
        width: 16px;
        margin-left: 5px;
    }

.page_member .row-list-prd {
    margin-top: 10px;
}

.page_member .l-item-prd {
    display: inline-block;
    width: calc(100% - 80px);
}

.page_member .r-item-prd {
    vertical-align: top;
    text-align: right;
    float: right;
}

.page_member .img-prd {
    width: 70px;
    display: inline-block;
}

    .page_member .img-prd img {
        width: 100%;
    }

.page_member .gr-info-prd {
    display: inline-block;
    width: calc(100% - 80px);
    vertical-align: top;
    margin-left: 5px;
}

.page_member .name-prd {
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    display: -webkit-box;
    margin: 5px 0;
}

.page_member .att-prd {
    margin-bottom: 5px;
    color: #9d9d9d;
    font-size: 12px;
}

.page_member .pri-prd-m {
    font-size: 12px;
    font-weight: bold;
}

.page_member .pri-prd-o {
    text-decoration: line-through;
    color: #9d9d9d;
    font-size: 12px;
}

.page_member .gift-prd {
    font-size: 12px;
}

.page_member .row-item-prd {
    border-bottom: 1px solid #eee;
    padding: 5px 0;
}

.page_member .sl-prd {
    font-size: 12px;
    color: #9d9d9d;
}

.page_member .l-r-total {
    display: inline-block;
    color: #9d9d9d;
}

.page_member .r-r-total {
    float: right;
}

.page_member .sum-money {
    color: #da251c;
    text-align: right;
    font-weight: bold;
}

.page_member .time-order {
    font-size: 12px;
}

.page_member .row-total-prd {
    padding: 10px 0;
    border-bottom: 1px solid #eee;
}

.page_member .btn-style {
    user-select: none;
    -webkit-user-select: none;
    text-align: center;
    border: 1px solid #eee;
    background: #fff;
    display: inline-block;
    margin-right: 5px;
    min-width: 100px;
}

    .page_member .btn-style.find {
        background: #1a73e8;
        border: 1px solid #1a73e8;
    }

    .page_member .btn-style.rate {
        background: #ffc107;
        border: 1px solid #ffc107;
    }

    .page_member .btn-style.buyer,
    .page_member .btn-style.call {
        background: #0fa80f;
        border: 1px solid #0fa80f;
    }

    .page_member .btn-style.cancel {
        background: #c0c0c0;
        border: 1px solid #c0c0c0;
    }

        .page_member .btn-style.cancel a {
            color: #333;
        }

    .page_member .btn-style.disable {
        background: #fafafa;
        border: 1px solid #fafafa;
    }

        .page_member .btn-style.disable a {
            cursor: not-allowed;
            color: #888;
        }

    .page_member .btn-style a {
        color: #fff;
        padding: 5px 10px;
        z-index: 1;
    }

    .page_member .btn-style:not(.disable) a {
        position: relative;
    }

@media (hover: hover) {
    .page_member .btn-style:not(.disable) a:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member .btn-style:not(.disable) a:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .row-btn-prd {
    text-align: center;
    margin-top: 10px;
}

.page_member .not-order {
    text-align: center;
    padding: 40px 0 10px;
    font-size: 12px;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #fff;
}

.page_member .icon-not-order {
    width: 80px;
    margin: auto;
}

    .page_member .icon-not-order img {
        width: 100%;
    }

.page_member .zone-account {
    background: #fff;
}

.page_member .avata-edit {
    text-align: center;
}

.page_member .frame-ava-mb {
    width: 80px;
    height: 80px;
    margin: auto;
    position: relative;
}

    .page_member .frame-ava-mb img {
        width: 100%;
        border-radius: 50%;
    }

.page_member .change-img {
    width: 80px;
    height: 80px;
    background: #86868685;
    border-radius: 50%;
    line-height: 80px;
    color: #fff;
    cursor: pointer;
    position: absolute;
    top: 0;
}

.page_member .acc-edit {
    padding: 10px 0;
}

    .page_member .acc-edit + .acc-edit {
        border-top: 1px solid #eee;
    }

    .page_member .acc-edit.editable {
        cursor: pointer;
    }

@media (hover: hover) {
    .page_member .acc-edit.editable:hover .acc-edit-right .edit {
        color: #0748ff;
        text-decoration: underline;
    }

    .page_member .acc-edit.editable:hover .acc-edit-right .edit-img {
        display: inline-block;
    }
}

.page_member .acc-edit-right {
    display: inline-block;
    vertical-align: middle;
    color: #4f4f4f;
    width: calc(100% - 105px);
    position: relative;
}

    .page_member .acc-edit-right .verifed {
        margin-left: 5px;
    }

    .page_member .acc-edit-right .edit {
        float: right;
        color: #0748ff;
    }

    .page_member .acc-edit-right .edit-img {
        padding-top: 4px;
        vertical-align: -1px;
        margin-left: 2px;
        float: right;
        display: none;
    }

.page_member .acc-edit-left {
    display: inline-block;
    width: 100px;
    vertical-align: middle;
}

.page_member .name-dn {
    color: #9d9d9d;
}

.page_member .zone-progess-order {
    background: #fff;
}

.page_member .top-zone-order {
    text-align: center;
    font-size: 16px;
    padding-bottom: 10px;
}

.page_member .notice-order {
    background: #45a546;
    color: #fff;
    padding: 5px;
    border-radius: 2px;
}

.page_member .noti-order-ship {
    position: relative;
    padding: 5px;
    border-bottom: 1px solid #eee;
}

.page_member .row-title-ship {
    font-weight: bold;
    margin-bottom: 5px;
}

    .page_member .row-title-ship img {
        vertical-align: -2px;
        margin-right: 5px;
        width: 16px;
    }

.page_member .row-detail-ship,
.page_member .row-detail-add,
.page_member .row-detail-pay {
    margin-left: 20px;
}

.page_member .note-status {
    color: #45a546;
    margin-bottom: 5px;
}

.page_member .date-ship {
    color: #9d9d9d;
}

.page_member .view-ship {
    color: #45a546;
    text-decoration: underline;
    margin: 5px 0;
}

.page_member .noti-ship {
    padding: 5px 0;
    border-bottom: 1px solid #eee;
}

.page_member .name-cus {
    margin-bottom: 5px;
}

.page_member .noti-pro-ship {
    padding: 5px 0;
}

.page_member .box-prd-viewed {
    background: #fff;
    position: relative;
}

    .page_member .box-prd-viewed .empty-viewed {
        padding: 50px;
        text-align: center;
        font-size: 15px;
        border-top: 1px solid #ccc;
    }

.page_member .title-prd-viewed {
    font-weight: bold;
    margin-bottom: 10px;
}

    .page_member .title-prd-viewed .clear-prd-viewed {
        display: inline-block;
        border: 0;
        background: #eee;
        color: #999;
        padding: 5px 13px;
        border-radius: 3px;
        font-size: 14px;
        font-weight: normal;
        vertical-align: bottom;
        cursor:pointer;
    }

@media (hover: hover) {
    .page_member .title-prd-viewed .clear-prd-viewed:hover {
        background: #f00;
        color: #fff !important;
    }
}

.page_member .list-prd-viewed {
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid #eee;
    padding: 0;
}

.page_member .it-prd-viewed {
    flex: 0 1 50%;
    padding: 10px 5px;
    position: relative;
    border: 1px solid #eee;
}

    .page_member .it-prd-viewed:nth-child(2n) {
        border-left: 0;
        border-bottom: 0;
    }

    .page_member .it-prd-viewed:nth-child(2n + 1) {
        border-bottom: 0;
    }

.page_member .img-sp {
    width: 100px;
    height: 100px;
    margin: auto;
    margin-bottom: 10px;
}

    .page_member .img-sp img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

.page_member .name-sp {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    display: -webkit-box;
    margin: 5px 0;
    min-height: 40px;
}

.page_member .flashsale-sp {
    height: 55px;
}

    .page_member .flashsale-sp ~ .price-sp {
        display: none;
    }

    .page_member .flashsale-sp .time-box-item {
        box-sizing: content-box;
    }

.page_member .price-sp {
    margin-right: 30px;
    display: flex;
    flex-wrap: wrap;
}

    .page_member .price-sp .pri-prd-m {
        color: #da251c;
        margin-right: 5px;
    }

.page_member .dis-sp {
    position: absolute;
    right: 5px;
    top: 5px;
    background: #da251c;
    padding: 2px 5px;
    border-radius: 3px;
    color: #fff;
    font-size: 11px;
}

.page_member .pick-order {
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 10px;
    text-align: right;
    z-index: 99;
    height: 36px;
    width: 36px;
    cursor: pointer;
}

    .page_member .pick-order:active:before {
        content: "";
        background: rgba(0, 0, 0, 0.05);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 18px;
    }

.page_member .zone-myrate {
    background: #fff;
}

.page_member .bar-title-rate {
    font-size: 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
    font-weight: bold;
    position: relative;
}

    .page_member .bar-title-rate .rate-filter {
        position: absolute;
        right: 0;
        top: 4px;
        font-size: 13px;
    }

        .page_member .bar-title-rate .rate-filter input {
            display: none;
        }

            .page_member .bar-title-rate .rate-filter input:checked + label:after {
                opacity: 1;
                transform: rotate(-45deg) scale(0.8);
            }

        .page_member .bar-title-rate .rate-filter label {
            display: flex;
            position: relative;
            font-weight: normal;
            cursor: pointer;
            user-select: none;
            -webkit-user-select: none;
        }

            .page_member .bar-title-rate .rate-filter label::before {
                content: " ";
                height: 12px;
                width: 12px;
                border: solid 2px #888;
                border-radius: 3px;
                background: #fff;
                margin-right: 5px;
            }

            .page_member .bar-title-rate .rate-filter label::after {
                content: " ";
                position: absolute;
                top: 3px;
                height: 4px;
                width: 9px;
                left: 2px;
                border-bottom: solid 3px #333;
                border-left: solid 3px #333;
                background: none;
                transform: rotate(-45deg) scale(0);
                transition: transform 0.1s ease, opacity 0.1s ease;
                transform-origin: center center;
                z-index: 1;
            }

.page_member .body-myrate.rated {
    display: flex;
    flex-direction: column-reverse;
}

.page_member .my-not-rate ~ .donot-rate,
.page_member .my-rated ~ .donot-rate {
    display: none;
}

.page_member .myrate-item {
    border-bottom: 1px solid #ddd;
    padding: 10px 0;
}

.page_member .star {
    background: url(https://meta.vn/Data/image/2022/04/07/rate-not.png) no-repeat;
    width: 14px;
    height: 14px;
    display: inline-block;
    margin-right: -2px;
}

    .page_member .star.rated {
        background: url(https://meta.vn/Data/image/2022/04/07/rated.png) no-repeat;
    }

.page_member .time-rate {
    font-size: 12px;
    color: #9d9d9d;
    margin-bottom: 5px;
}

.page_member .comm-rate-box {
    line-height: 20px;
}

.page_member .comm-img {
    margin-top: 5px;
}

.page_member .img-item {
    width: 90px;
    height: 90px;
    overflow: hidden;
    display: inline-block;
    margin-right: 5px;
}

    .page_member .img-item img {
        max-width: 100%;
    }

.page_member .rate-bx {
    background: #f7f7f7;
    margin-left: 10px;
    padding: 5px;
}

.page_member .name-comm.meta-rep {
    color: #da251c;
}

.page_member .comm-rate-row {
    margin-bottom: 10px;
}

    .page_member .comm-rate-row.rep-more {
        margin-left: 10px;
    }

    .page_member .comm-rate-row .img-list {
        animation-name: fadein;
        animation-duration: 0.3s;
        animation-timing-function: ease-in-out;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        z-index: 1001;
        position: fixed;
    }

        .page_member .comm-rate-row .img-list .img-list-wrap {
            position: relative;
            top: 50%;
            transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -moz-transform: translateY(-50%);
            -webkit-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            margin: auto;
            width: 100%;
            height: calc(100vh - 150px);
            background-color: rgba(255, 255, 255, 0.05);
        }

            .page_member .comm-rate-row .img-list .img-list-wrap .img-list-container {
                position: relative;
                width: 100%;
                height: 100%;
                display: flex;
            }

                .page_member
                .comm-rate-row
                .img-list
                .img-list-wrap
                .img-list-container
                .img-list-item {
                    height: 100%;
                    text-align: center;
                    flex: 1 0 100%;
                    display: none;
                }

                    .page_member
                    .comm-rate-row
                    .img-list
                    .img-list-wrap
                    .img-list-container
                    .img-list-item.actived {
                        display: block;
                    }

                    .page_member
                    .comm-rate-row
                    .img-list
                    .img-list-wrap
                    .img-list-container
                    .img-list-item
                    img {
                        width: 100%;
                        height: 100%;
                        object-fit: contain;
                    }

            .page_member .comm-rate-row .img-list .img-list-wrap .left-arrow,
            .page_member .comm-rate-row .img-list .img-list-wrap .right-arrow {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                -moz-transform: translateY(-50%);
                -webkit-transform: translateY(-50%);
                -o-transform: translateY(-50%);
                margin: 0;
                border: 1px solid #eee;
                width: 36px;
                height: 36px;
                border-radius: 18px;
                background: #fff;
                text-align: center;
                line-height: 42px;
                cursor: pointer;
            }

@media (hover: hover) {
    .page_member .comm-rate-row .img-list .img-list-wrap .left-arrow:hover,
    .page_member .comm-rate-row .img-list .img-list-wrap .right-arrow:hover {
        box-shadow: rgba(0, 0, 0, 0.12) 0 1px 12px 0;
    }
}

.page_member .comm-rate-row .img-list .img-list-wrap .left-arrow .fa,
.page_member .comm-rate-row .img-list .img-list-wrap .right-arrow .fa {
    font-size: 30px;
}

.page_member .comm-rate-row .img-list .img-list-wrap .left-arrow {
    left: 0;
}

.page_member .comm-rate-row .img-list .img-list-wrap .right-arrow {
    right: 0;
}

    .page_member .comm-rate-row .img-list .img-list-wrap .right-arrow .fa {
        margin-left: 4px;
    }

.page_member .comm-rate-row .img-list-close {
    position: fixed;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    padding: 10px;
    z-index: 1002;
    -webkit-filter: grayscale(1) invert(1);
    filter: grayscale(1) invert(1);
}

    .page_member .comm-rate-row .img-list-close img {
        position: relative;
    }

@media (hover: hover) {
    .page_member .comm-rate-row .img-list-close img:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member .comm-rate-row .img-list-close img:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .comm-rate-row .img-list-bg {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
    background: rgba(0, 0, 0, 0.87);
}

.page_member .name-comm {
    font-weight: bold;
}

.page_member .donot-rate {
    text-align: center;
    margin-bottom: 10px;
    padding-bottom: 20px 0;
}

.page_member .buy-cont a {
    background: #45a546;
    color: #fff;
    padding: 5px;
    border-radius: 2px;
    width: 150px;
    text-align: center;
    margin: auto;
}

.page_member .icon-not p {
    font-size: 14px;
    margin-top: 0;
}

.page_member .again-more,
.page_member .viewed-more {
    text-align: center;
    padding: 0 0 10px;
    margin-top: 15px;
}

    .page_member .again-more a,
    .page_member .viewed-more a {
        color: #0071c4;
        padding: 8px 16px;
        border: 1px solid #0071c4;
        border-radius: 3px;
        display: inline-block;
    }

.page_member .address-board {
    width: 100%;
}

    .page_member .address-board .board {
        background: #fff;
    }

    .page_member .address-board .board-title {
        font-size: 16px;
        padding-bottom: 10px;
        font-weight: bold;
        position: relative;
    }

    .page_member .address-board .board-content {
        max-height: calc(100% - 60px);
        overflow: auto;
    }

        .page_member .address-board .board-content .address-row {
            padding: 10px;
            line-height: 24px;
            border: 1px solid #ddd;
            margin: 0 6px 10px;
            border-radius: 3px;
            position: relative;
            min-height: 72px;
            cursor: pointer;
        }

            .page_member .address-board .board-content .address-row.empty {
                position: relative;
            }

@media (hover: hover) {
    .page_member .address-board .board-content .address-row.empty:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member .address-board .board-content .address-row.empty:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .address-board .board-content .address-row.empty a {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.page_member .address-board .board-content .address-row .add-default {
    color: #26bc4e;
    text-transform: none;
    position: absolute;
    right: 5px;
    top: 0;
}

.page_member .address-board .board-content .address-row .name {
    font-size: 15px;
}

.page_member .address-board .board-content .address-row .name,
.page_member .address-board .board-content .address-row .add {
    margin-right: 60px;
}

.page_member .address-board .board-content .address-row .edit {
    padding: 3px 10px;
    background: #f1f1f1;
    border: 1px solid #fff;
    border-radius: 5px;
    cursor: pointer;
}

@media (hover: hover) {
    .page_member .address-board .board-content .address-row .edit:hover {
        background: #fafafa;
    }
}

.page_member .address-board .board-content .address-row .add-action {
    display: flex;
    position: absolute;
    right: 5px;
    bottom: 5px;
}

    .page_member .address-board .board-content .address-row .add-action .edit,
    .page_member .address-board .board-content .address-row .add-action .del {
        padding: 3px 10px;
        background: #f1f1f1;
        border: 1px solid #fff;
        border-radius: 5px;
        cursor: pointer;
    }

@media (hover: hover) {
    .page_member
    .address-board
    .board-content
    .address-row
    .add-action
    .edit:hover,
    .page_member
    .address-board
    .board-content
    .address-row
    .add-action
    .del:hover {
        background: #fafafa;
    }
}

.page_member .address-board .board-content .address-row .add-action .del {
    margin-left: 5px;
    color: #da251c;
}

.page_member .address-board .board-btn {
    display: none;
    font-size: inherit;
}

    .page_member .address-board .board-btn a {
        padding: 5px 10px;
        border-radius: 3px;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        border: 1px solid #ccc;
        position: relative;
    }

@media (hover: hover) {
    .page_member .address-board .board-btn a:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member .address-board .board-btn a:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .address-board .address-row {
    padding: 10px 10px 0;
    position: relative;
}

    .page_member .address-board .address-row .address-row-title {
        font-size: 13px;
        color: #666;
    }

    .page_member .address-board .address-row .address-row-info {
        padding-right: 75px;
    }

    .page_member .address-board .address-row .address-row-btn {
        position: absolute;
        right: 10px;
        top: 6px;
    }

        .page_member .address-board .address-row .address-row-btn a {
            padding: 7px 10px;
            color: #da251c;
            background: #fafafa;
        }

@media (hover: hover) {
    .page_member .address-board .address-row .address-row-btn a:hover {
        background: #f6f6f6;
        border-radius: 3px;
    }
}

.page_member .address-board .form-input-wrap {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.54);
    z-index: 999;
}

    .page_member .address-board .form-input-wrap .form-input-add {
        width: calc(100% - 20px);
        background: #fff;
        border-radius: 3px;
        margin: 50px auto;
        position: relative;
        max-width: 600px;
        max-height: 500px;
        animation-name: fadein;
        animation-duration: 0.3s;
        animation-timing-function: ease-in-out;
    }

    .page_member .address-board .form-input-wrap .title-creat-add {
        color: #fff !important;
        display: inline-block;
        margin-left: 5px;
    }

    .page_member .address-board .form-input-wrap .bar-creat-add {
        background: #0071c4;
        line-height: 32px;
        text-align: left;
    }

    .page_member .address-board .form-input-wrap .close-creat-add {
        float: right;
        margin-right: 5px;
        color: #fff;
        display: inline;
    }

    .page_member .address-board .form-input-wrap .account-edit-row {
        margin: 5px 0 8px;
    }

    .page_member .address-board .form-input-wrap .edit-row-left {
        display: none;
        vertical-align: middle;
        width: 81px;
        font-weight: 500;
        text-align: right;
        margin-right: 10px;
    }

    .page_member .address-board .form-input-wrap .edit-row-right {
        width: 100%;
        display: inline-block;
        vertical-align: middle;
        position: relative;
        text-align: left;
    }

        .page_member .address-board .form-input-wrap .edit-row-right .warning-msg {
            font-size: 12px;
            margin-top: 2px;
            color: #da251c;
            animation-name: fadein;
            animation-duration: 0.3s;
            animation-timing-function: ease-in-out;
        }

    .page_member .address-board .form-input-wrap .txt-account-input {
        width: 100%;
        margin: auto;
        height: 32px;
        font-size: 16px;
        border: 1px solid #ddd;
        border-radius: 3px;
        text-indent: 10px;
    }

    .page_member .address-board .form-input-wrap .checkbox input[type="checkbox"] {
        display: inline-block;
    }

    .page_member .address-board .form-input-wrap .select-form-add {
        border: 1px solid #ddd;
        height: 28px;
        width: 180px;
        border-radius: 3px;
        width: 100%;
    }

    .page_member .address-board .form-input-wrap .label-title {
        margin-left: 20px;
    }

    .page_member .address-board .form-input-wrap .member-check {
        display: inline;
        position: relative;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .page_member .address-board .form-input-wrap .item-check {
        position: absolute;
        top: 1px;
        left: 0;
        height: 12px;
        width: 12px;
        background: #fff;
        border: 1px solid #2196f3;
        border-radius: 3px;
    }

    .page_member .address-board .form-input-wrap .submit-account {
        margin: 40px auto 10px;
        display: flex;
        justify-content: center;
    }

        .page_member .address-board .form-input-wrap .submit-account .save,
        .page_member .address-board .form-input-wrap .submit-account .del {
            margin: 0 5px;
            padding: 10px 15px;
            background-color: #f90;
            border-radius: 3px;
            text-align: center;
            color: #fff;
            text-transform: uppercase;
            font-weight: bold;
            min-width: 110px;
        }

        .page_member .address-board .form-input-wrap .submit-account .del {
            background-color: #da251c;
        }

    .page_member .address-board .form-input-wrap .bar-form-add-new {
        padding: 5px;
    }

    .page_member .address-board .form-input-wrap .disable .select .value {
        color: #ccc;
    }

    .page_member .address-board .form-input-wrap .select.large {
        max-width: 100%;
    }

    .page_member .address-board .form-input-wrap .select .value {
        border: 1px solid #d1d2dd;
        border-radius: 3px;
        padding: 5px 10px;
    }

        .page_member .address-board .form-input-wrap .select .value::before {
            right: 5px;
        }

    .page_member .address-board .form-input-wrap .filter-text {
        font-size: 16px !important;
    }

.page_member .input-add-user {
    width: 100% !important;
    height: 52px !important;
    padding: 6px 10px;
    font-size: 16px;
    border: 1px solid #ddd;
    border-radius: 3px;
    outline: none;
    font-family: "Roboto", Arial, sans-serif;
    box-sizing: border-box;
}

    .page_member .input-add-user.story {
        height: 104px !important;
    }

.page_member .popup-buyagain-bg {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 999;
    background: rgba(0, 0, 0, 0.35);
}

.page_member .popup-buyagain {
    position: fixed;
    z-index: 1000;
    background: #fff;
    left: 0;
    bottom: 0;
    width: 100% !important;
    max-height: 80%;
    padding: 10px 10px 20px;
    border-radius: 3px;
    max-width: 600px;
    animation-name: fadein;
    animation-duration: 0.3s;
    animation-timing-function: ease-in-out;
}

    .page_member .popup-buyagain .close {
        width: 16px;
        height: 16px;
        position: absolute;
        right: 10px;
        top: 10px;
        cursor: pointer;
        opacity: 0.54;
    }

    .page_member .popup-buyagain .again-row {
        border-bottom: 1px solid #eee;
        padding: 15px 0;
    }

        .page_member .popup-buyagain .again-row.head-zone {
            display: flex;
            align-items: center;
        }

        .page_member .popup-buyagain .again-row .again-img {
            width: 80px;
            height: 80px;
        }

            .page_member .popup-buyagain .again-row .again-img img {
                width: 100%;
                height: 100%;
                object-fit: contain;
            }

        .page_member .popup-buyagain .again-row .again-title {
            margin-right: 0;
            font-size: 16px;
        }

        .page_member .popup-buyagain .again-row .attr-left {
            color: rgba(0, 0, 0, 0.54);
        }

        .page_member .popup-buyagain .again-row .attr-right {
            display: flex;
            flex-wrap: wrap;
        }

        .page_member .popup-buyagain .again-row .attr-opt {
            padding: 10px 15px;
            border: 1px solid #ddd;
            border-radius: 3px;
            margin-bottom: 8px;
            margin-right: 8px;
        }

            .page_member .popup-buyagain .again-row .attr-opt.is-selected {
                color: #fff;
                background: #19abe0;
                border-color: transparent;
            }

@media (hover: hover) {
    .page_member .popup-buyagain .again-row .attr-opt:hover {
        color: #fff;
        background: #19abe0;
        border-color: transparent;
    }
}

.page_member .popup-buyagain .again-row .qty-right {
    border: 1px solid #ccc;
    display: flex;
    align-items: center;
    margin-left: 10px;
}

.page_member .popup-buyagain .again-row .qty-btn {
    border: none;
    background: #fff;
    display: block;
    padding-top: 0;
    width: 32px;
    font-size: 22px;
    cursor: pointer;
}

.page_member .popup-buyagain .again-row .qty-txt {
    border: none;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    background: #fff;
    font-size: 16px;
    width: 36px;
    height: 32px;
    text-align: center;
    vertical-align: middle;
    border-radius: 0 !important;
    outline: none;
}

.page_member .popup-buyagain .again-row.qty-zone {
    display: flex;
    align-items: center;
}

.page_member .popup-buyagain .again-btn {
    text-align: center;
    width: 100%;
}

    .page_member .popup-buyagain .again-btn .add-cart {
        display: block;
        cursor: pointer;
        font-size: 15px;
        height: 40px;
        line-height: 40px;
        width: 200px;
        border-radius: 3px;
        background: #da251c;
        border: 1px solid #da251c;
        padding: 0 5px;
        margin: 10px auto 0;
        color: #fff;
        position: relative;
    }

@media (hover: hover) {
    .page_member .popup-buyagain .again-btn .add-cart:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member .popup-buyagain .again-btn .add-cart:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .avatar-edit-wrap,
.page_member .account-edit-wrap {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1001;
    border-radius: 3px;
    animation-name: fadein;
    animation-duration: 0.3s;
    animation-timing-function: ease-in-out;
}

    .page_member .avatar-edit-wrap > div,
    .page_member .account-edit-wrap > div {
        width: 100%;
        margin: auto;
        max-width: 500px;
        padding: 10px 10px 80px;
        background: #fff;
        border-radius: 3px;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        margin: auto;
    }

    .page_member .avatar-edit-wrap ~ .account-edit-wrap-bg,
    .page_member .account-edit-wrap ~ .account-edit-wrap-bg {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        top: 0;
        z-index: 1000;
        background: rgba(0, 0, 0, 0.35);
    }

    .page_member .avatar-edit-wrap .acc-edit-left,
    .page_member .account-edit-wrap .acc-edit-left {
        width: 90px;
        text-align: right;
    }

    .page_member .avatar-edit-wrap .avatar-edit-row {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .page_member .avatar-edit-wrap .crop-wrap {
        width: 90%;
        text-align: center;
    }

        .page_member .avatar-edit-wrap .crop-wrap img {
            object-fit: scale-down;
            max-height: 250px;
            max-width: 100%;
            display: block;
        }

    .page_member .avatar-edit-wrap .preview-wrap {
        text-align: center;
        width: 150px;
        height: 150px;
    }

        .page_member .avatar-edit-wrap .preview-wrap canvas,
        .page_member .avatar-edit-wrap .preview-wrap img {
            width: 100% !important;
            height: 100% !important;
            border: 1px solid #eee !important;
        }

    .page_member .account-edit-wrap input[type="text"],
    .page_member .account-edit-wrap input[type="password"] {
        font-size: 16px;
        border: 1px solid #eee;
        border-radius: 3px;
        padding: 8px 10px;
        width: 100%;
        max-width: 300px;
    }

    .page_member .account-edit-wrap input[type="password"] {
        text-align: left;
    }

    .page_member .account-edit-wrap .acc-edit-right {
        min-height: 32px;
        width: calc(100% - 90px);
        padding-left: 5px;
    }

    .page_member .account-edit-wrap .birth-row,
    .page_member .account-edit-wrap .gender-row {
        display: inline-flex;
        min-height: 32px;
    }

    .page_member .account-edit-wrap .gender-item {
        margin-right: 10px;
        padding: 5px 5px 5px 22px;
        position: relative;
        border-radius: 3px;
    }

        .page_member .account-edit-wrap .gender-item.is-current .chk-icon::before {
            background: #19abe0;
            border-radius: 100%;
            top: 11px;
            border: solid 2px #fff;
            box-shadow: 0 0 0 1px #19abe0;
        }

        .page_member .account-edit-wrap .gender-item .chk-icon {
            position: absolute;
            top: -3px;
            left: 5px;
        }

            .page_member .account-edit-wrap .gender-item .chk-icon::before {
                content: "";
                display: block;
                position: absolute;
                width: 10px;
                height: 10px;
                background: #fff;
                border-radius: 100%;
                top: 12px;
                border: solid 1px #aaa;
            }

    .page_member .account-edit-wrap select {
        margin-right: 5px;
        border: 1px solid #ccc;
        border-radius: 3px;
        outline: none;
        font-size: 16px;
    }

    .page_member .account-edit-wrap.phone-change .phone-change-title {
        font-size: 18px;
        margin: 10px 0 24px;
        text-align: center;
    }

    .page_member .account-edit-wrap.phone-change .phone-change-tip {
        text-align: center;
        margin: 0 0 24px;
    }

    .page_member .account-edit-wrap.phone-change .phone-change-input {
        margin: 0 0 24px;
        text-align: center;
    }

        .page_member
        .account-edit-wrap.phone-change
        .phone-change-input
        input[type="text"] {
            max-width: 250px;
        }

    .page_member .account-edit-wrap.phone-change .phone-change-msg {
        color: #da251c;
        min-height: 20px;
        font-size: 13px;
        text-align: center;
        margin: 0 0 14px;
    }

    .page_member .account-edit-wrap.phone-change .phone-change-action {
        display: flex;
        justify-content: center;
    }

        .page_member
        .account-edit-wrap.phone-change
        .phone-change-action
        .submit-change,
        .page_member
        .account-edit-wrap.phone-change
        .phone-change-action
        .cancel-change {
            width: 140px;
            text-align: center;
            line-height: 36px;
            border-radius: 3px;
            margin: 10px;
            cursor: pointer;
            font-size: 15px;
            user-select: none;
            -webkit-user-select: none;
        }

            .page_member
            .account-edit-wrap.phone-change
            .phone-change-action
            .submit-change
            a,
            .page_member
            .account-edit-wrap.phone-change
            .phone-change-action
            .cancel-change
            a {
                color: #aaa;
            }

        .page_member
        .account-edit-wrap.phone-change
        .phone-change-action
        .cancel-change {
            background: #f0f0f0;
            position: relative;
        }

@media (hover: hover) {
    .page_member
    .account-edit-wrap.phone-change
    .phone-change-action
    .cancel-change:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member
.account-edit-wrap.phone-change
.phone-change-action
.cancel-change:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member
.account-edit-wrap.phone-change
.phone-change-action
.submit-change {
    background: #fafafa;
}

    .page_member
    .account-edit-wrap.phone-change
    .phone-change-action
    .submit-change.enable {
        background: #da251c;
        position: relative;
    }

@media (hover: hover) {
    .page_member
    .account-edit-wrap.phone-change
    .phone-change-action
    .submit-change.enable:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member
.account-edit-wrap.phone-change
.phone-change-action
.submit-change.enable:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member
.account-edit-wrap.phone-change
.phone-change-action
.submit-change.enable
a {
    color: #fff;
}

.page_member .account-edit-wrap.pwd-change .acc-edit-sub {
    text-align: right;
}

    .page_member .account-edit-wrap.pwd-change .acc-edit-sub a {
        display: inline-block;
        color: #0748ff;
    }

.page_member .avatar-btn-row,
.page_member .acc-edit-btn-row {
    display: flex;
    justify-content: center;
    position: absolute;
    width: calc(100% - 20px);
    bottom: 0;
}

    .page_member .avatar-btn-row div,
    .page_member .acc-edit-btn-row div {
        width: 100px;
        background: #fff;
        border: 1px solid #eee;
        text-align: center;
        line-height: 32px;
        border-radius: 3px;
        margin: 10px;
        cursor: pointer;
    }

        .page_member .avatar-btn-row div a,
        .page_member .acc-edit-btn-row div a {
            position: relative;
        }

@media (hover: hover) {
    .page_member .avatar-btn-row div a:hover:before,
    .page_member .acc-edit-btn-row div a:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member .avatar-btn-row div a:active:before,
.page_member .acc-edit-btn-row div a:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .acc-edit-btn-row {
    bottom: 15px;
}

.page_member .new-crop-wrap {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #00000040;
    z-index: 1000;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

    .page_member .new-crop-wrap .new-crop-container {
        width: 100%;
        height: 100%;
        max-width: 500px;
        max-height: 500px;
        background-color: #fff;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        margin: auto;
    }

    .page_member .new-crop-wrap .crop-container {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 100px;
    }

        .page_member
        .new-crop-wrap
        .crop-container
        .reactEasyCrop_Container:empty::before {
            content: "Vui lòng chọn một ảnh.";
        }

    .page_member .new-crop-wrap .controls {
        position: absolute;
        bottom: 45px;
        width: 100%;
        height: 40px;
        display: flex;
        align-items: center;
        flex-direction: column;
    }

        .page_member .new-crop-wrap .controls .control-zoom {
            width: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
        }

            .page_member .new-crop-wrap .controls .control-zoom > span {
                font-size: 13px;
                color: #888;
            }

@media (hover: hover) {
    .page_member
    .new-crop-wrap
    .controls
    .control-zoom:hover
    input[type="range"]::-webkit-slider-thumb {
        box-shadow: 0 0 0 8px rgba(63, 81, 181, 0.16);
        border-radius: 50%;
    }

    .page_member
    .new-crop-wrap
    .controls
    .control-zoom:hover
    input[type="range"]::-moz-range-thumb {
        box-shadow: 0 0 0 8px rgba(63, 81, 181, 0.16);
    }
}

.page_member .new-crop-wrap .controls .control-action {
    margin-top: 5px;
    display: flex;
    justify-content: center;
}

    .page_member .new-crop-wrap .controls .control-action > div {
        background: #fff;
        border: 1px solid #eee;
        text-align: center;
        line-height: 32px;
        border-radius: 3px;
        margin: 10px;
        cursor: pointer;
    }

        .page_member .new-crop-wrap .controls .control-action > div a {
            padding: 0 10px;
            position: relative;
        }

@media (hover: hover) {
    .page_member .new-crop-wrap .controls .control-action > div a:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member .new-crop-wrap .controls .control-action > div a:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .new-crop-wrap .slider {
    padding: 22px 0;
}

.page_member .new-crop-wrap .zoom-range {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 2px;
    border-top: 5px solid #fff;
    border-bottom: 5px solid #fff;
    background: #3f51b5;
    width: 100%;
    max-width: 240px;
    margin: 0 8px;
    box-sizing: unset;
}

    .page_member .new-crop-wrap .zoom-range::-moz-range-thumb {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        border: 1px solid #3f51b5;
        background: #3f51b5;
        border-radius: 50%;
        width: 12px;
        height: 12px;
        transition: box-shadow 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    }

    .page_member .new-crop-wrap .zoom-range::-webkit-slider-thumb {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        border: 1px solid #3f51b5;
        background: #3f51b5;
        border-radius: 50%;
        width: 12px;
        height: 12px;
        transition: box-shadow 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
    }

.page_member .zone-myvoucher {
    background-color: #fff;
}

    .page_member .zone-myvoucher .bar-title-voucher {
        padding: 15px 0;
        font-size: 18px;
        border-bottom: 1px solid #ddd;
    }

    .page_member .zone-myvoucher .body-voucher {
        position: relative;
    }

    .page_member .zone-myvoucher .title-tab-vou > input[type="radio"] {
        position: absolute;
        left: -100px;
        top: -100px;
    }

        .page_member .zone-myvoucher .title-tab-vou > input[type="radio"] + label {
            display: inline-block;
            color: #333;
            cursor: pointer;
            border-bottom: 2px solid #fff;
            font-size: 16px;
            text-align: center;
            padding: 10px 0 5px;
            white-space: nowrap;
            width: 33.3333333333%;
        }

        .page_member
        .zone-myvoucher
        .title-tab-vou > input[type="radio"]:checked + label {
            border-bottom: 2px solid #da251c;
            color: #da251c;
        }

    .page_member .zone-myvoucher .body-voucher section {
        display: none;
        padding: 10px 0 0;
    }

        .page_member .zone-myvoucher .body-voucher section .list-voucher {
            padding: 0;
        }

    .page_member .zone-myvoucher .tab-vou.active {
        display: block;
    }

    .page_member .zone-myvoucher .title-tab-order {
        display: inline-block;
        display: -moz-box;
        display: -ms-flexbox;
        display: inline-flex;
        display: flex;
        flex-direction: row;
        overflow: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        background-color: #fff;
    }

    .page_member .zone-myvoucher .item-voucher {
        width: 100%;
        max-width: 500px;
        display: flex;
        margin-bottom: 10px;
        border: 1px solid #eee;
        border-radius: 3px;
        position: relative;
        margin-left: auto;
        margin-right: auto;
    }

    .page_member .zone-myvoucher .vou-col1 {
        background-color: #da251c;
        width: 90px;
        color: #fff;
        height: 92px;
        padding: 5px;
        text-align: center;
        display: flex;
        align-items: center;
        text-transform: uppercase;
    }

    .page_member .zone-myvoucher .vou-col2 {
        background-color: #fff;
        width: calc(100% - 170px);
        display: flex;
        align-items: center;
        padding: 5px;
    }

    .page_member .zone-myvoucher .vou-col3 {
        background-color: #fff;
        width: 80px;
        height: 92px;
        padding: 5px 5px 5px 0;
        text-align: right;
        display: inline-grid;
        align-items: center;
    }

    .page_member .zone-myvoucher .vou-limit {
        position: absolute;
        display: flex;
        padding: 0.125rem 0.25rem;
        border-radius: 0.125rem 0.125rem 0.125rem 0;
        color: #fff;
        font-size: 0.625rem;
        line-height: 0.75rem;
        background-color: #fb0;
        top: 4px;
        left: -3px;
    }

        .page_member .zone-myvoucher .vou-limit::after {
            content: "";
            position: absolute;
            width: 0;
            height: 0;
            left: 1px;
            top: calc(100% + 1px);
            border: 0.1875rem solid transparent;
            -webkit-transform: rotate(-45deg) translate(50%, -50%);
            transform: rotate(-45deg) translate(50%, -50%);
            border-left: 0.1875rem solid #dfa400;
        }

    .page_member .zone-myvoucher .title-vou {
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        display: -webkit-box;
        font-size: 14px;
        font-weight: bold;
        margin-bottom: 5px;
    }

    .page_member .zone-myvoucher .rules-vou {
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        display: -webkit-box;
    }

    .page_member .zone-myvoucher .date-vou {
        font-size: 12px;
        color: #a7a7a7;
        margin-top: 5px;
    }

    .page_member .zone-myvoucher .box-vou3 {
        position: relative;
        height: 100%;
    }

    .page_member .zone-myvoucher .use-vou {
        position: absolute;
        top: 3px;
        right: 0;
        width: 100%;
    }

    .page_member .zone-myvoucher .role-vou {
        position: absolute;
        bottom: 3px;
        right: 0;
    }

        .page_member .zone-myvoucher .role-vou a {
            color: #0071c4;
        }

    .page_member .zone-myvoucher .item-voucher .use-vou.save-now {
        width: 40px;
        padding: 3px 0;
        background-color: #da251c;
        text-align: center;
    }

        .page_member .zone-myvoucher .item-voucher .use-vou.save-now a {
            color: #fff;
        }

    .page_member .zone-myvoucher .item-voucher .use-vou.use-now a {
        color: #da251c;
    }

    .page_member .zone-myvoucher .detail-cou-vou {
        max-width: 500px;
        width: 100%;
        margin: auto;
    }

        .page_member .zone-myvoucher .detail-cou-vou .item-voucher {
            margin-top: 10px;
        }

        .page_member .zone-myvoucher .detail-cou-vou .vou-col2 {
            width: calc(100% - 100px);
            border-right: 1px solid #eee;
        }

    .page_member .zone-myvoucher .cont-title-vou {
        font-weight: bold;
    }

    .page_member .zone-myvoucher .content-vou-item {
        margin-bottom: 10px;
        line-height: 20px;
    }

    .page_member .zone-myvoucher .use-vou-now a {
        width: 150px;
        margin: auto;
        background-color: #da251c;
        height: 32px;
        color: #fff;
        cursor: pointer;
        line-height: 34px;
        font-weight: bold;
        text-align: CENTER;
        position: relative;
    }

@media (hover: hover) {
    .page_member .zone-myvoucher .use-vou-now a:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member .zone-myvoucher .use-vou-now a:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .zone-myvoucher .bar-date {
    width: 150px;
    height: 4px;
    text-align: center;
    background: #f90;
    background-image: linear-gradient(to right, rgba(255, 0, 0, 0), red);
    line-height: 16px;
    font-size: 12px;
    color: #fff;
    border-radius: 20px;
    position: relative;
    margin-top: 5px;
}

.page_member .zone-myvoucher .bar-date-no {
    width: 150px;
    background: transparent;
    overflow: hidden;
    z-index: 1;
    height: 4px;
    border-radius: 20px;
}

.page_member .zone-myvoucher .bar-date-color {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #ddd;
}

.page_member .zone-myvoucher .bar-date-els {
    background: #fff;
    float: right;
    position: relative;
    height: 4px;
    width: 100%;
}

.page_member .zone-myvoucher .per0 {
    width: 100%;
}

.page_member .zone-myvoucher .per90 {
    width: 10%;
}

.page_member .zone-myvoucher .per80 {
    width: 20%;
}

.page_member .zone-myvoucher .per70 {
    width: 30%;
}

.page_member .zone-myvoucher .per60 {
    width: 40%;
}

.page_member .zone-myvoucher .per50 {
    width: 50%;
}

.page_member .zone-myvoucher .per40 {
    width: 60%;
}

.page_member .zone-myvoucher .per30 {
    width: 70%;
}

.page_member .zone-myvoucher .per20 {
    width: 80%;
}

.page_member .zone-myvoucher .per10 {
    width: 90%;
}

.page_member .zone-mypayment {
    background-color: #fff;
}

    .page_member .zone-mypayment .bar-title-payment {
        padding: 15px 0;
        font-size: 18px;
        border-bottom: 1px solid #ddd;
    }

    .page_member .zone-mypayment .body-my-payment {
        position: relative;
        width: 100%;
    }

    .page_member .zone-mypayment .payment-link-list {
        display: flex;
        align-items: flex-start;
        margin: 20px 0 10px;
    }

    .page_member .zone-mypayment .payment-link-item-empty {
        width: 100%;
        text-align: center;
        font-size: 16px;
        margin: 50px auto 70px;
        color: #aaa;
    }

    .page_member .zone-mypayment .payment-link-item {
        position: relative;
        padding: 10px;
        width: 100%;
        display: flex;
        border: 1px solid #eee;
        border-radius: 3px;
        align-items: center;
    }

        .page_member .zone-mypayment .payment-link-item:last-child {
            margin-bottom: 20px;
        }

    .page_member .zone-mypayment .payment-link-item-icon {
        width: 60px;
        height: 60px;
    }

    .page_member .zone-mypayment .payment-link-item-id {
        margin-left: 10px;
        font-size: 15px;
        font-weight: bold;
    }

    .page_member .zone-mypayment .payment-link-item-clear {
        right: 0;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        margin: auto;
        font-size: 16px;
        background-color: transparent;
        border-radius: 50%;
        width: 40px;
        height: 40px;
        line-height: 40px;
        text-align: center;
    }

        .page_member .zone-mypayment .payment-link-item-clear:active {
            background-color: #f1f1f1;
        }

.page_member .toggle-show {
    position: absolute;
    top: 15px;
    border: 1px solid #eee;
    width: 36px;
    height: 36px;
    border-radius: 18px;
    background: #fff;
    text-align: center;
    line-height: 42px;
    right: 10px;
    cursor: pointer;
    transform: rotate(0deg);
    transition: all 0.3s cubic-bezier(0.65, 0.05, 0.36, 1);
    transition-delay: 150ms;
}

    .page_member .toggle-show i {
        font-size: 28px;
        transform: rotate(90deg);
        margin-left: 2px;
        margin-top: 5px;
    }

    .page_member .toggle-show.hide {
        transform: rotate(180deg);
    }

.page_member .wrap-tracking {
    padding-top: 10px;
    animation-name: slide_in;
    animation-duration: 0.3s;
    animation-timing-function: ease-in-out;
}

    .page_member .wrap-tracking * {
        box-sizing: unset;
    }

    .page_member .wrap-tracking.not-cod .timeline-status {
        float: inherit;
        width: 100%;
        text-align: left;
    }

    .page_member .wrap-tracking .head-tracking {
        background: #45a546;
        color: #fff;
        padding: 5px;
        border-radius: 3px;
        display: flex;
        width: calc(100% - 10px);
        justify-content: space-between;
    }

        .page_member .wrap-tracking .head-tracking .head-track-from {
            display: inline-block;
            vertical-align: middle;
            max-width: 110px;
            margin-top: 10px;
        }

        .page_member .wrap-tracking .head-tracking .head-track-to {
            vertical-align: middle;
            float: right;
            max-width: 170px;
            text-align: right;
        }

        .page_member .wrap-tracking .head-tracking .from-txt {
            font-weight: bold;
            vertical-align: middle;
        }

        .page_member .wrap-tracking .head-tracking .from-adds {
            vertical-align: middle;
        }

    .page_member .wrap-tracking .timeline-delivered {
        box-sizing: border-box;
        list-style-position: outside;
        list-style-type: none;
        position: relative;
    }

    .page_member .wrap-tracking .timeline-spine {
        background: #45a546;
        height: calc(100% + 15px);
        width: 4px;
        position: absolute;
        z-index: 1;
        box-sizing: border-box;
        left: 50px;
        list-style-position: outside;
        list-style-type: none;
        margin-top: -15px;
    }

    .page_member .wrap-tracking .timeline-date {
        background: #a1a1a1;
        padding: 0 5px;
        border-radius: 3px;
        line-height: 24px;
        color: #fff;
        width: 120px;
        position: relative;
        z-index: 2;
        margin: 15px 0;
    }

    .page_member .wrap-tracking .timeline-event {
        position: relative;
        z-index: 2;
        display: inline-block;
        width: 100%;
    }

        .page_member .wrap-tracking .timeline-event:last-child .timeline-detail {
            border-bottom: none;
        }

    .page_member .wrap-tracking .timeline-time {
        display: inline-block;
        text-align: right;
        width: 40px;
        padding: 0 5px;
        vertical-align: middle;
    }

    .page_member .wrap-tracking .timeline-detail {
        display: inline-block;
        border-bottom: 1px solid #ddd;
        vertical-align: middle;
        width: calc(100% - 65px);
        margin-left: 4px;
        padding: 5px;
    }

.page_member .warranty {
    background-color: #fff;
}

    .page_member .warranty .warranty-title {
        padding: 15px 0;
        font-size: 18px;
        border-bottom: 1px solid #ddd;
    }

    .page_member .warranty .warranty-user-input {
        width: 100%;
        max-width: 600px;
        background: #fafafa;
        padding: 20px;
        margin: 10px auto;
        border-radius: 5px;
        display: flex;
    }

        .page_member .warranty .warranty-user-input .warranty-input {
            width: calc(100% - 100px);
            border: none;
            padding: 10px;
            font-size: 16px;
        }

        .page_member .warranty .warranty-user-input .warranty-submit {
            width: 100px;
            text-align: center;
            height: 40px;
            line-height: 40px;
            background: #da251c;
            font-size: 15px;
            color: #fff;
            border-top-right-radius: 5px;
            border-bottom-right-radius: 5px;
            user-select: none;
            -webkit-user-select: none;
            position: relative;
        }

@media (hover: hover) {
    .page_member .warranty .warranty-user-input .warranty-submit:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member .warranty .warranty-user-input .warranty-submit:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .warranty .warranty-info-wrap {
    display: flex;
    flex-wrap: wrap;
}

    .page_member .warranty .warranty-info-wrap .warranty-info {
        flex: 1 0 100%;
    }

    .page_member .warranty .warranty-info-wrap .warranty-info-title {
        font-size: 16px;
        font-weight: 500;
    }

    .page_member .warranty .warranty-info-wrap .warranty-info-body {
        padding: 10px;
    }

    .page_member
    .warranty
    .warranty-info-wrap
    .warranty-info-row + .warranty-info-row {
        margin-top: 12px;
    }

    .page_member .warranty .warranty-info-wrap .warranty-info-row .info-left {
        font-weight: 500;
    }

    .page_member .warranty .warranty-info-wrap .warranty-info-row .info-right {
        margin-left: 5px;
    }

.page_member .warranty .warranty-empty {
    margin: auto;
    text-align: center;
    padding: 50px 20px;
    color: #888;
    opacity: 0.87;
}

.page_member .warranty-list {
    width: 100%;
    padding: 10px;
    display: flex;
    flex-wrap: wrap;
}

    .page_member .warranty-list .warranty-list-item {
        padding: 10px;
        width: 100%;
        max-width: 500px;
        border: 1px solid #ccc;
        border-radius: 3px;
        margin: 5px auto;
    }

        .page_member .warranty-list .warranty-list-item .warr-left {
            display: flex;
            justify-content: space-between;
        }

@media (hover: hover) {
    .page_member .warranty-list .warranty-list-item .warr-left a:hover {
        color: #da251c;
    }
}

.page_member .warranty-list .warranty-list-item .warr-right {
    margin-top: 5px;
    border-top: 1px solid #eee;
}

    .page_member .warranty-list .warranty-list-item .warr-right .warr-prod {
        margin-top: 5px;
    }

        .page_member .warranty-list .warranty-list-item .warr-right .warr-prod span {
            cursor: pointer;
        }

@media (hover: hover) {
    .page_member
    .warranty-list
    .warranty-list-item
    .warr-right
    .warr-prod
    span:hover {
        color: #da251c;
    }
}

.page_member .warranty-list .warranty-list-item .warr-right .status {
    text-align: right;
}

.page_member .invoice {
    background-color: #fff;
}

    .page_member .invoice .invoice-title {
        padding: 15px 20px;
        font-size: 18px;
        border-bottom: 1px solid #ddd;
    }

    .page_member .invoice .invoice-user-input {
        width: 100%;
        max-width: 600px;
        margin: 10px auto 10px;
        border-radius: 5px;
        padding-bottom: 20px;
    }

        .page_member .invoice .invoice-user-input .input-row {
            display: grid;
            grid-template-columns: repeat(1, 1fr);
            grid-gap: 10px;
        }

        .page_member .invoice .invoice-user-input .check-row {
            margin-top: 10px;
            display: grid;
            grid-template-columns: repeat(1, 1fr);
            grid-gap: 10px;
        }

            .page_member .invoice .invoice-user-input .check-row.btn-row {
                grid-template-columns: repeat(2, 1fr);
            }

        .page_member .invoice .invoice-user-input .check-captcha {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            grid-gap: 10px;
        }

        .page_member .invoice .invoice-user-input .invoice-input {
            padding: 8px 10px;
            font-size: 16px;
            width: 100%;
            background-color: #fff;
            border: 1px solid #d1d1d1;
            border-radius: 4px;
            box-shadow: none;
            box-sizing: border-box;
            outline: 0;
        }

        .page_member .invoice .invoice-user-input .invoice-captcha {
            border-radius: 3px;
            overflow: hidden;
            background: #eee;
            text-align: center;
        }

            .page_member .invoice .invoice-user-input .invoice-captcha img {
                display: block;
                margin: auto;
            }

        .page_member .invoice .invoice-user-input .invoice-captcha-wrap {
            position: relative;
        }

        .page_member .invoice .invoice-user-input .invoice-captcha-refresh {
            font-size: 16px;
            position: absolute;
            top: 0;
            right: 0;
            color: #888;
            padding: 0 5px;
            cursor: pointer;
        }

        .page_member .invoice .invoice-user-input .invoice-submit,
        .page_member .invoice .invoice-user-input .my-invoice {
            direction: rtl;
        }

            .page_member .invoice .invoice-user-input .invoice-submit a,
            .page_member .invoice .invoice-user-input .my-invoice a {
                max-width: 200px;
                width: 100%;
                height: 40px;
                line-height: 40px;
                text-align: center;
                background: #da251c;
                font-size: 16px;
                color: #fff;
                border-radius: 5px;
            }

            .page_member .invoice .invoice-user-input .invoice-submit:not(.disable) a,
            .page_member .invoice .invoice-user-input .my-invoice:not(.disable) a {
                user-select: none;
                -webkit-user-select: none;
                position: relative;
            }

@media (hover: hover) {
    .page_member
    .invoice
    .invoice-user-input
    .invoice-submit:not(.disable)
    a:hover:before,
    .page_member
    .invoice
    .invoice-user-input
    .my-invoice:not(.disable)
    a:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 3px;
    }
}

.page_member
.invoice
.invoice-user-input
.invoice-submit:not(.disable)
a:active:before,
.page_member
.invoice
.invoice-user-input
.my-invoice:not(.disable)
a:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 3px;
}

.page_member .invoice .invoice-user-input .invoice-submit.disable a,
.page_member .invoice .invoice-user-input .my-invoice.disable a {
    opacity: 0.54;
}

.page_member .invoice .invoice-user-input .my-invoice {
    direction: ltr;
}

    .page_member .invoice .invoice-user-input .my-invoice a {
        background-color: #fff;
        border: 1px solid #888;
        color: #555;
    }

.page_member .invoice .invoice-info-wrap {
    display: flex;
    flex-wrap: wrap;
}

    .page_member .invoice .invoice-info-wrap .invoice-info {
        flex: 1 0 100%;
    }

    .page_member .invoice .invoice-info-wrap .invoice-info-title {
        font-size: 16px;
        font-weight: 500;
    }

    .page_member .invoice .invoice-info-wrap .invoice-info-body {
        padding: 10px;
    }

    .page_member .invoice .invoice-info-wrap .invoice-info-row + .invoice-info-row {
        margin-top: 12px;
    }

    .page_member .invoice .invoice-info-wrap .invoice-info-row .info-left {
        font-weight: 500;
    }

    .page_member .invoice .invoice-info-wrap .invoice-info-row .info-right {
        margin-left: 5px;
    }

.page_member .invoice .invoice-empty {
    margin: auto;
    text-align: center;
    padding: 50px 20px;
    color: #888;
    opacity: 0.87;
}

.page_member .invoice .invoice-list {
    background: #eee;
    border-radius: 3px;
    overflow: hidden;
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
}

    .page_member .invoice .invoice-list .invoice-list-title {
        padding: 15px 10px;
        font-size: 18px;
    }

    .page_member .invoice .invoice-list .invoice-list-body {
        background: #fff;
    }

    .page_member .invoice .invoice-list .invoice-table {
        table-layout: fixed;
        border-collapse: collapse;
        width: 100%;
        border: 1px solid #ddd;
    }

    .page_member .invoice .invoice-list .invoice-row:nth-child(2n) {
        background-color: #fafafa;
    }

    .page_member .invoice .invoice-list .invoice-row.head td {
        font-weight: bold;
        text-align: center;
    }

    .page_member .invoice .invoice-list .invoice-row td {
        border: 1px solid #ccc;
        padding: 8px 5px;
    }

        .page_member .invoice .invoice-list .invoice-row td:first-child {
            width: 10%;
            text-align: center;
        }

    .page_member .invoice .invoice-list .invoice-row .link-item {
        display: flex;
        align-items: center;
        column-gap: 3px;
    }

        .page_member .invoice .invoice-list .invoice-row .link-item span {
            margin-right: 3px;
        }

        .page_member .invoice .invoice-list .invoice-row .link-item a {
            color: #2196f3;
        }

@media (hover: hover) {
    .page_member .invoice .invoice-list .invoice-row .link-item a:hover {
        color: #da251c;
    }
}

@media (hover: hover) {
    .page_member .invoice .invoice-list .invoice-row:hover {
        background-color: #eff2ff;
    }
}

.page_member .invoice .invoice-list ~ .list-order-more {
    padding-top: 0;
}

.page_member .loan {
    background: #fff;
}

    .page_member .loan .loan-title {
        padding: 15px 0;
        font-size: 18px;
        border-bottom: 1px solid #ddd;
    }

    .page_member .loan .loan-body {
        width: 100%;
        max-width: 500px;
        padding: 10px;
        border: 1px solid #eee;
        border-radius: 3px;
        margin: 10px auto;
    }

        .page_member .loan .loan-body .acc-edit {
            position: relative;
        }

        .page_member .loan .loan-body .acc-edit-left {
            width: 145px;
        }

        .page_member .loan .loan-body .acc-edit-right {
            width: calc(100% - 145px);
        }

            .page_member .loan .loan-body .acc-edit-right.has-copy {
                width: calc(100% - 165px);
            }

        .page_member .loan .loan-body .card-copy,
        .page_member .loan .loan-body .content-copy {
            right: 0;
            font-size: 16px;
            cursor: pointer;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -moz-transform: translateY(-50%);
            -webkit-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            margin: auto;
        }

        .page_member .loan .loan-body .loan-body-empty {
            text-align: center;
            padding: 50px 0;
        }

    .page_member .loan .loan-footer {
        margin-bottom: 15px;
    }

.page_member .deactive-container {
    width: 100%;
    max-width: 600px;
    margin: auto;
    background: #fff;
}

    .page_member .deactive-container .deactive-panel {
        border: 1px solid #eee;
        border-radius: 5px;
        padding: 10px;
    }

        .page_member .deactive-container .deactive-panel .deactive-title {
            font-size: 17px;
            font-weight: 600;
            margin: 10px 0;
        }

        .page_member .deactive-container .deactive-panel .deactive-subtitle {
            font-size: 15px;
        }

        .page_member .deactive-container .deactive-panel .deactive-options {
            margin: 10px 0;
        }

        .page_member .deactive-container .deactive-panel .deactive-option {
            padding: 10px 10px 10px 35px;
            border: 1px solid #eee;
            border-radius: 5px;
            position: relative;
            cursor: pointer;
        }

            .page_member .deactive-container .deactive-panel .deactive-option:hover {
                background-color: #eee;
            }

            .page_member
            .deactive-container
            .deactive-panel
            .deactive-option
            .option-title {
                font-size: 15px;
                font-weight: 600;
            }

            .page_member .deactive-container .deactive-panel .deactive-option .option-tip {
                color: #888;
            }

            .page_member
            .deactive-container
            .deactive-panel
            .deactive-option + .deactive-option {
                margin-top: 10px;
            }

            .page_member
            .deactive-container
            .deactive-panel
            .deactive-option
            .option-icon::before {
                content: "";
                display: block;
                position: absolute;
                width: 14px;
                height: 14px;
                background: #fff;
                border-radius: 100%;
                top: 11px;
                border: solid 1px #aaa;
                left: 10px;
            }

            .page_member
            .deactive-container
            .deactive-panel
            .deactive-option.selected
            .option-icon::before {
                background: #19abe0;
                top: 12px;
                border: solid 3px #fff;
                box-shadow: 0 0 0 2px #19abe0;
                width: 10px;
                height: 10px;
            }

        .page_member .deactive-container .deactive-panel .deactive-actions {
            display: flex;
            justify-content: flex-end;
            column-gap: 10px;
            padding: 10px 0 0;
        }

            .page_member .deactive-container .deactive-panel .deactive-actions a {
                padding: 8px 16px;
                font-size: 14px;
                cursor: pointer;
                font-weight: bold;
                border-radius: 5px;
                position: relative;
            }

@media (hover: hover) {
    .page_member
    .deactive-container
    .deactive-panel
    .deactive-actions
    a:hover:before {
        content: "";
        background: rgba(255, 255, 255, 0.15);
        position: absolute;
        bottom: 0;
        right: 0;
        top: 0;
        left: 0;
        border-radius: 5px;
    }
}

.page_member
.deactive-container
.deactive-panel
.deactive-actions
a:active:before {
    content: "";
    background: rgba(255, 255, 255, 0.15);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    border-radius: 5px;
}

.page_member .deactive-container .deactive-panel .deactive-actions .deactive {
    color: #555;
    background-color: #eee;
}

.page_member .deactive-container .deactive-panel .deactive-actions .del {
    color: #fff;
    background-color: #1e90ff;
}

.page_member .deactive-container .deactive-panel .deactive-forgot {
    display: inline-block;
}

    .page_member .deactive-container .deactive-panel .deactive-forgot a {
        color: #0071c4;
    }

@media (hover: hover) {
    .page_member .deactive-container .deactive-panel .deactive-forgot a:hover {
        color: #da251c;
    }
}

.page_member .deactive-container .deactive-panel .deactive-pass {
    margin: 10px 0;
    position: relative;
}

    .page_member .deactive-container .deactive-panel .deactive-pass input {
        font-size: 16px;
        border: 1px solid #eee;
        border-radius: 3px;
        padding: 10px;
        width: 100%;
    }

.page_member .deactive-container .deactive-panel .term-detail {
    margin-top: 5px;
}

    .page_member .deactive-container .deactive-panel .term-detail a {
        display: inline-block;
        color: #0071c4;
        margin-left: 5px;
    }

@media (hover: hover) {
    .page_member .deactive-container .deactive-panel .term-detail a:hover {
        color: #da251c;
    }
}

form.deactive {
    padding: 15px;
    max-width: 500px;
    width: 100%;
    margin: 10px auto;
    border: 1px solid #eee;
    border-radius: 3px;
}

    form.deactive .form-subtitle {
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 16px;
        position: relative;
    }

        form.deactive .form-subtitle .go-back {
            position: absolute;
            left: 0;
            top: 0;
            font-size: 18px;
        }

    form.deactive .form-outline {
        position: relative;
        margin-bottom: 24px;
        border-radius: 0.25rem;
    }

        form.deactive .form-outline.forgot,
        form.deactive .form-outline.reg-type {
            margin-bottom: 16px;
            text-align: right;
        }

            form.deactive .form-outline.reg-type .reg-btn {
                text-decoration: underline;
            }

    form.deactive .form-input {
        border-radius: 0.25rem;
        min-height: auto;
        padding: 0.33em 0.75em;
        border: 0;
        background: transparent;
        transition: all 0.2s linear;
        font-size: 16px;
        line-height: 2.15;
        padding-left: 0.75em;
        padding-right: 0.75em;
        display: block;
        width: 100%;
        color: #4f4f4f;
    }

        form.deactive .form-input:focus,
        form.deactive .form-input:-webkit-autofill,
        form.deactive .form-input.actived {
            outline: none;
        }

            form.deactive .form-input:focus ~ .form-label,
            form.deactive .form-input:-webkit-autofill ~ .form-label,
            form.deactive .form-input.actived ~ .form-label {
                transform: translateY(-1.25rem) translateY(0.1rem) scale(0.8);
            }

            form.deactive .form-input:focus ~ .outline-border .outline-border-middle,
            form.deactive
            .form-input:-webkit-autofill ~ .outline-border
            .outline-border-middle,
            form.deactive .form-input.actived ~ .outline-border .outline-border-middle {
                border-top: none;
            }

            form.deactive .form-input:focus ~ .form-label {
                color: #1266f1;
            }

            form.deactive .form-input:focus ~ .outline-border .outline-border-leading {
                border-top: 0.125rem solid #1266f1;
                border-bottom: 0.125rem solid #1266f1;
                border-left: 0.125rem solid #1266f1;
            }

            form.deactive .form-input:focus ~ .outline-border .outline-border-middle {
                border-top: none;
                border-bottom: 0.125rem solid #1266f1;
            }

            form.deactive .form-input:focus ~ .outline-border .outline-border-tailing {
                border-top: 0.125rem solid #1266f1;
                border-bottom: 0.125rem solid #1266f1;
                border-right: 0.125rem solid #1266f1;
            }

        form.deactive .form-input.form-p ~ .outline-border .outline-border-middle {
            width: 60px;
        }

    form.deactive .form-label {
        position: absolute;
        top: 0;
        max-width: 90%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        left: 0.75rem;
        padding-top: 0.75rem;
        pointer-events: none;
        transform-origin: 0 0;
        transition: all 0.2s ease-out;
        color: rgba(0, 0, 0, 0.6);
        margin-bottom: 0;
        font-size: 16px;
        z-index: 2;
    }

    form.deactive .outline-border {
        display: flex;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        max-width: 100%;
        height: 100%;
        text-align: left;
        pointer-events: none;
        z-index: 1;
    }

        form.deactive .outline-border > div {
            border: 1px solid #bdbdbd;
            border-radius: 0.25rem;
            pointer-events: none;
            box-sizing: border-box;
            background: transparent;
            height: 100%;
            transition: all 0.2s linear;
        }

        form.deactive .outline-border .outline-border-leading {
            width: 9px;
            border-right: none;
            border-radius: 0.25rem 0 0 0.25rem;
        }

        form.deactive .outline-border .outline-border-middle {
            border-right: none;
            border-left: none;
            flex: 0 0 auto;
            border-radius: 0;
            width: 180px;
        }

        form.deactive .outline-border .outline-border-tailing {
            flex-grow: 1;
            border-left: none;
            border-radius: 0 0.25rem 0.25rem 0;
        }

        form.deactive .outline-border.phone .outline-border-middle {
            width: 115px;
        }

        form.deactive .outline-border.email .outline-border-middle {
            width: 70px;
        }

    form.deactive .cont-btn {
        display: block;
        width: 100%;
        padding: 0.75rem 1.6875rem 0.6875rem;
        text-transform: uppercase;
        text-align: center;
        border-radius: 0.3rem;
        font-size: 16px;
        color: #aaa;
        background: #f0f0f0;
    }

        form.deactive .cont-btn:not(.disable) {
            color: #fff;
            position: relative;
            background: #da251c;
        }

@media (hover: hover) {
    form.deactive .cont-btn:not(.disable):hover {
        box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2), 0 2px 10px 0 rgba(0, 0, 0, 0.1);
    }

        form.deactive .cont-btn:not(.disable):hover::before {
            content: "";
            background: rgba(0, 0, 0, 0.05);
            position: absolute;
            bottom: 0;
            right: 0;
            top: 0;
            left: 0;
        }
}

form.deactive .member-tip {
    font-size: 15px;
    color: #888;
    margin-bottom: 24px;
}

    form.deactive .member-tip .otp {
        font-weight: bold;
        color: #da251c;
    }

form.deactive .form-outline {
    position: relative;
    margin-bottom: 24px;
    border-radius: 0.25rem;
}

form.deactive .form-warning-msg,
form.deactive .member-warning-msg {
    height: 20px;
    color: #da251c;
    font-size: 14px;
    animation-name: fadein;
    animation-duration: 0.3s;
    animation-timing-function: ease-in-out;
}

form.deactive .form-warning-msg {
    position: absolute;
    bottom: -20px;
    left: 0;
    width: 100%;
}

.page_member .address-type-list {
    display: flex;
    column-gap: 8px;
    flex-wrap: wrap;
}

    .page_member .address-type-list .address-type-item {
        display: block;
        padding: 8px 10px;
        border: 1px solid #eee;
        color: #aaa;
        border-radius: 3px;
        cursor: pointer;
        user-select: none;
        -webkit-user-select: none;
    }

@media (hover: hover) {
    .page_member .address-type-list .address-type-item:hover {
        background-color: #fafafa;
    }
}

.page_member .address-type-list .address-type-item.is-selected {
    border: 1px solid #0071c4;
    color: #555;
    box-shadow: 0 0 3px 1px #eee;
}

@media (min-width: 1200px) {
    .page_member .warranty-list {
        justify-content: space-between;
    }

        .page_member .warranty-list .warranty-list-item {
            padding: 10px;
            margin: 10px;
            width: 47.5%;
        }
}

@media (min-width: 850px) {
    #center-m {
        background: transparent;
    }

        #center-m .wrap {
            background: transparent;
        }

    .page_member {
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-between;
        background: transparent;
    }

        .page_member .deactive-container {
            padding: 15px;
        }

        .page_member .warranty {
            background-color: #fff;
        }

            .page_member .warranty .warranty-title {
                padding: 15px 20px;
            }

            .page_member .warranty .warranty-user-input .warranty-input {
                width: calc(100% - 100px);
                border: none;
                padding: 10px;
                font-size: 16px;
            }

            .page_member .warranty .warranty-user-input .warranty-submit {
                width: 100px;
                text-align: center;
                height: 40px;
                line-height: 40px;
                background: #da251c;
                font-size: 15px;
                color: #fff;
                border-top-right-radius: 5px;
                border-bottom-right-radius: 5px;
            }

            .page_member .warranty .warranty-info-wrap {
                padding: 15px;
                justify-content: space-between;
            }

                .page_member .warranty .warranty-info-wrap .warranty-info {
                    flex: 0 0 calc(50% - 5px);
                }

        .page_member .invoice .invoice-list {
            margin: 10px auto 25px;
        }

        .page_member .ptop-member {
            width: calc(100% - 260px);
            min-height: 390px;
            background: #fff;
        }

        .page_member .pacc-member {
            width: 245px;
            height: 100%;
            background: transparent;
            position: sticky;
            top: 50px;
        }

            .page_member .pacc-member .profiles-member {
                display: block;
                padding: 10px;
                height: auto;
            }

            .page_member .pacc-member .item-acc {
                padding: 16px 10px;
                cursor: pointer;
            }

        .page_member .wrap-list-acc {
            padding: 0;
            background: #fff;
        }

        .page_member .bd-member {
            margin-top: 0;
        }

            .page_member .bd-member .list-prd-repur {
                overflow: unset;
                padding: 6px 0;
                transition: all 500ms ease 0s;
            }

            .page_member .bd-member .img-prd-repur img {
                width: 150px;
                height: 150px;
            }

        .page_member .item-prd-repur {
            flex: 0 0 calc(20% - 10px);
        }

        .page_member .box-bd .main-box-repur {
            overflow: hidden;
        }

        .page_member .box-bd.member-viewed,
        .page_member .box-bd.member-buyed {
            position: relative;
        }

            .page_member .box-bd.member-viewed .arrow,
            .page_member .box-bd.member-buyed .arrow {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                -moz-transform: translateY(-50%);
                -webkit-transform: translateY(-50%);
                -o-transform: translateY(-50%);
                margin: 0;
                border: 1px solid #eee;
                width: 36px;
                height: 36px;
                border-radius: 18px;
                background: #fff;
                text-align: center;
                line-height: 42px;
                cursor: pointer;
            }
}

@media (min-width: 850px) and (hover: hover) {
    .page_member .box-bd.member-viewed .arrow:hover,
    .page_member .box-bd.member-buyed .arrow:hover {
        box-shadow: rgba(0, 0, 0, 0.12) 0 1px 12px 0;
        border: none;
        width: 36px;
    }
}

@media (min-width: 850px) {
    .page_member .box-bd.member-viewed .arrow.left-arrow,
    .page_member .box-bd.member-buyed .arrow.left-arrow {
        left: -8px;
    }
}

@media (min-width: 850px) {
    .page_member .box-bd.member-viewed .arrow.right-arrow,
    .page_member .box-bd.member-buyed .arrow.right-arrow {
        right: -6px;
    }

        .page_member .box-bd.member-viewed .arrow.right-arrow .fa,
        .page_member .box-bd.member-buyed .arrow.right-arrow .fa {
            margin-left: 4px;
        }
}

@media (min-width: 850px) {
    .page_member .box-bd.member-viewed .arrow .fa,
    .page_member .box-bd.member-buyed .arrow .fa {
        font-size: 24px;
    }
}

@media (min-width: 850px) {
    .page_member .zone-account {
        max-width: 600px;
        margin: auto;
        padding-bottom: 30px;
    }
}

@media (min-width: 850px) {
    .page_member .acc-edit-left {
        width: 120px;
        font-size: 15px;
    }
}

@media (min-width: 850px) {
    .page_member .acc-edit-right {
        width: calc(100% - 125px);
        text-align: left;
        font-size: 15px;
    }

        .page_member .acc-edit-right .edit {
            display: inline-block;
        }

        .page_member .acc-edit-right .edit-img {
            display: none;
            margin-left: 0;
            margin-right: 3px;
        }
}

@media (min-width: 850px) {
    .page_member .acc-edit {
        padding: 18px 10px;
    }

        .page_member .acc-edit.avata-edit {
            padding: 30px 10px;
        }
}

@media (min-width: 850px) {
    .page_member .account-edit-wrap .acc-edit {
        padding: 10px 0;
    }

    .page_member .account-edit-wrap input[type="text"],
    .page_member .account-edit-wrap input[type="password"] {
        max-width: unset;
    }

    .page_member .account-edit-wrap .acc-edit-left {
        width: 110px;
    }

    .page_member .account-edit-wrap .acc-edit-right {
        width: calc(100% - 110px);
    }

    .page_member .account-edit-wrap.pwd-change .acc-edit-left {
        width: 120px;
    }

    .page_member .account-edit-wrap.pwd-change .acc-edit-right {
        width: calc(100% - 120px);
    }

    .page_member .account-edit-wrap.pwd-change .pwd-change-tip {
        margin-left: 120px;
        padding-left: 5px;
        width: calc(100% - 120px);
        font-size: 12px;
        font-style: italic;
    }
}

@media (min-width: 850px) {
    .page_member .address-board .board-title {
        font-weight: normal;
        font-size: 18px;
        padding: 20px 10px;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .page_member .address-board .board-content .address-row {
        margin: 0 10px 10px;
    }

    .page_member .address-board .form-input-wrap .edit-row-left {
        display: inline-block;
    }

    .page_member .address-board .form-input-wrap .edit-row-right {
        width: calc(100% - 100px);
    }

    .page_member .address-board .board-btn {
        display: block;
    }
}

@media (min-width: 850px) {
    .page_member .bar-title-rate,
    .page_member .title-prd-viewed {
        font-size: 18px;
        font-weight: normal;
        padding: 20px 10px;
        margin-bottom: 0;
    }
}

@media (min-width: 850px) {
    .page_member .bar-title-rate .rate-filter {
        right: 10px;
        top: 24px;
    }
}

@media (min-width: 850px) {
    .page_member .list-prd-viewed {
        border-bottom: 0;
    }
}

@media (min-width: 850px) {
    .page_member .it-prd-viewed {
        padding: 10px;
        flex: 0 1 25%;
    }

        .page_member .it-prd-viewed:nth-child(2n + 1) {
            border-left: 0;
            border-bottom: 1px solid #eee;
        }

        .page_member .it-prd-viewed:nth-child(n + 5) {
            border-top: 0;
        }

        .page_member .it-prd-viewed:nth-child(2n) {
            border-bottom: 1px solid #eee;
        }
}

@media (min-width: 850px) {
    .page_member .img-sp {
        width: 120px;
        height: 120px;
    }
}

@media (min-width: 850px) {
    .page_member .title-tab-order {
        padding-top: 10px;
    }

        .page_member .title-tab-order > input[type="radio"] + label {
            flex: 1 0 0;
            margin-right: 0;
        }
}

@media (min-width: 850px) {
    .page_member .tab-content.active {
        background: #eee;
    }
}

@media (min-width: 850px) {
    .page_member .zone-order .wrap-list-order {
        background: #eee;
    }

    .page_member .zone-order .history-summary {
        padding: 10px;
    }
}

@media (min-width: 850px) {
    .page_member .popup-buyagain {
        top: 10%;
        left: calc(50% - 300px);
        bottom: unset;
    }
}

@media (min-width: 850px) {
    .page_member .search-order {
        padding: 10px;
    }
}

@media (min-width: 850px) {
    .page_member .input-search-txt {
        width: 100%;
        text-indent: 10px;
        font-size: 14px;
    }
}

@media (min-width: 850px) {
    .page_member .icon-search-order img {
        right: 20px;
    }
}

@media (min-width: 850px) {
    .page_member .myrate-item {
        padding: 10px;
    }
}

@media (min-width: 850px) {
    .page_member .img-prd {
        width: 100px;
    }
}

@media (min-width: 850px) {
    .page_member .l-item-prd {
        width: calc(100% - 100px);
    }
}

@media (min-width: 850px) {
    .page_member .r-r-total {
        font-size: 16px;
    }
}

@media (min-width: 850px) {
    .page_member .gr-info-prd {
        display: inline-block;
        width: calc(100% - 110px);
    }

        .page_member .gr-info-prd .name-prd {
            font-size: 16px;
        }
}

@media (min-width: 850px) {
    .page_member .top-zone-order {
        font-size: 18px;
        padding: 20px 0 10px;
    }
}

@media (min-width: 850px) {
    .page_member .notice-order {
        padding: 5px 10px;
    }
}

@media (min-width: 850px) {
    .page_member .noti-order-ship,
    .page_member .noti-ship {
        padding: 10px;
    }
}

@media (min-width: 850px) {
    .page_member .noti-pro-ship {
        padding: 10px 0;
    }
}

@media (min-width: 850px) {
    .page_member .row-item-prd {
        padding: 10px;
    }
}

@media (min-width: 850px) {
    .page_member .row-list-order {
        padding: 0 10px;
    }
}

@media (min-width: 850px) {
    .page_member .row-total-prd {
        padding: 10px;
    }
}

@media (min-width: 850px) {
    .page_member .zone-myvoucher .bar-title-voucher {
        padding: 20px 10px;
    }

    .page_member .zone-myvoucher .detail-cou-vou {
        padding: 20px 0;
    }

    .page_member .zone-myvoucher .body-voucher section .list-voucher {
        display: flex;
        margin-left: 10px;
        flex-wrap: wrap;
    }

        .page_member
        .zone-myvoucher
        .body-voucher
        section
        .list-voucher
        .item-voucher {
            margin-right: 10px;
            margin-left: 0;
            width: 48%;
            min-width: 350px;
        }

            .page_member
            .zone-myvoucher
            .body-voucher
            section
            .list-voucher
            .item-voucher:nth-child(2n) {
                margin-right: 0;
            }

    .page_member .zone-mypayment .bar-title-payment {
        padding: 20px 10px;
    }

    .page_member .zone-mypayment .body-my-payment {
        padding: 10px;
    }

    .page_member .zone-mypayment .payment-link-list {
        margin: 10px 0;
    }

    .page_member .zone-mypayment .payment-link-item {
        width: calc(50% - 5px);
    }
}

@media (min-width: 850px) {
    .page_member .loan .loan-title {
        padding: 15px 20px;
    }

    .page_member .loan .loan-body .acc-edit {
        padding: 15px 0;
    }

    .page_member .loan .loan-body .acc-edit-left {
        width: 150px;
    }

    .page_member .loan .loan-body .acc-edit-right {
        width: calc(100% - 165px);
    }
}

@media (max-width: 320px) {
    .sum-title {
        display: none;
    }
}
.page_member input[type=text] {
    font-size: 16px;
    border: 1px solid #eee;
    border-radius: 3px;
    padding: 8px 10px;
    width: 100%;
}
.page_member select {
    margin-right: 5px;
    border: 1px solid #ccc;
    border-radius: 3px;
    outline: none;
    font-size: 16px;
}
.page_member .gender-item {
    margin-right: 10px;
    padding: 5px 5px 5px 22px;
    position: relative;
    border-radius: 3px;
}
.page_member .gender-item {
    margin-right: 10px;
    padding: 5px 5px 5px 22px;
    position: relative;
    border-radius: 3px;
}
.page_member .gender-item .chk-icon {
    position: absolute;
    top: -3px;
    left: 5px;
}