@charset "UTF-8";

#page-registeredHistory {
    background: var(--color-gray-100);
    min-height: 100vh
}

    #page-registeredHistory .navbar_back, #page-registeredHistory .navbar_title {
        display: none
    }

@media (max-width:1200px) {
    #page-registeredHistory .navbar_back, #page-registeredHistory .navbar_title {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

#page-registeredHistory .registeredHistory_body {
    min-height: calc(100vh - 68px);
    margin-top: 60px;
    position: relative
}

    #page-registeredHistory .registeredHistory_body .body_bg {
        position: absolute;
        z-index: 0
    }

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_body .body_bg {
        display: none
    }
}

#page-registeredHistory .registeredHistory_body .body_bg.bg-1 {
    top: 0;
    right: 0;
    max-width: 620px
}

#page-registeredHistory .registeredHistory_body .body_bg.bg-2 {
    bottom: 0;
    left: 0;
    right: 0
}

#page-registeredHistory .registeredHistory_body .body_container {
    max-width: 1200px;
    width: 100%;
    margin: auto;
    padding: 40px 0 120px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 32px
}

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_body .body_container {
        padding: 0 0 20px;
        gap: 0
    }
}

#page-registeredHistory .registeredHistory_body .body_container .container_topbar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 32px
}

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_body .body_container .container_topbar {
        padding: 16px;
        gap: 8px
    }
}

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_back {
        display: none
    }
}

#page-registeredHistory .registeredHistory_info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px
}

    #page-registeredHistory .registeredHistory_info .info_title {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 12px
    }

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_info .info_title .ctbc-button {
        display: none
    }
}

#page-registeredHistory .registeredHistory_info .info_title .ctbc-button {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    color: var(--color-gray-500)
}

#page-registeredHistory .registeredHistory_info .info_title .button_icon {
    width: 32px;
    height: 32px
}

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_info .ctbc-breakcrumb {
        display: none
    }
}

#page-registeredHistory .registeredHistory_info .info_address {
    color: var(--color-gray-500)
}

#page-registeredHistory .registeredHistory_search {
    border: 1px solid var(--color-bluegreen-300);
    background: var(--color-bluegreen-100);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 8px 16px;
    border-radius: 12px;
    color: var(--color-gray-600);
    gap: 20px
}

    #page-registeredHistory .registeredHistory_search .search_conditions {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1
    }

        #page-registeredHistory .registeredHistory_search .search_conditions.ctbc-button {
            -webkit-box-pack: start;
            -ms-flex-pack: start;
            justify-content: flex-start
        }

    #page-registeredHistory .registeredHistory_search .ctbc-button {
        -ms-flex-negative: 0;
        flex-shrink: 0
    }

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_search .ctbc-button {
        padding: 8px;
        -ms-flex-negative: 0;
        flex-shrink: 0
    }

        #page-registeredHistory .registeredHistory_search .ctbc-button.search_conditions {
            padding: 0
        }

        #page-registeredHistory .registeredHistory_search .ctbc-button .button_text {
            display: none
        }

        #page-registeredHistory .registeredHistory_search .ctbc-button .button_icon {
            width: 16px;
            height: 16px
        }
}

#page-registeredHistory .registeredHistory_search #historyAdvancedButton {
    position: relative
}

    #page-registeredHistory .registeredHistory_search #historyAdvancedButton.button-changed::after {
        content: '';
        width: 10px;
        height: 10px;
        background: var(--color-red-400);
        top: -3px;
        right: -3px;
        position: absolute;
        border-radius: 50%
    }

#page-registeredHistory .registeredHistory_pagination {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

#page-registeredHistory #registeredHistoryConsult {
    position: fixed;
    right: 20px;
    bottom: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media (max-width:1200px) {
    #page-registeredHistory #registeredHistoryConsult {
        display: none
    }
}

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_result {
        padding: 0 16px
    }
}

#page-registeredHistory .registeredHistory_result .result_head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_result .result_head {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        padding: 16px 0;
        gap: 24px
    }
}

#page-registeredHistory .registeredHistory_result .result_head .head_info {
    width: 100%;
    color: var(--color-gray-500);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 12px
}

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_result .result_head .head_info {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 8px
    }
}

#page-registeredHistory .registeredHistory_result .result_head .head_info .info_detail {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 12px
}

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_result .result_head .head_info .info_detail {
        width: 100%;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

#page-registeredHistory .registeredHistory_result .result_head .head_info .info_detail .detail_emphasis {
    color: var(--color-gray-600);
    font-weight: 700
}

#page-registeredHistory .registeredHistory_result .result_head .head_info .info_notice {
    text-align: right
}

#page-registeredHistory .registeredHistory_result .result_head .head_switch {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 24px;
    padding: 12px 16px;
    border: 1px solid var(--color-gray-300);
    border-radius: 12px;
    color: var(--color-bluegreen-600);
    -ms-flex-negative: 0;
    flex-shrink: 0
}

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_result .result_head .head_switch {
        width: 100%;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

#page-registeredHistory .registeredHistory_result .result_table {
    margin-top: 16px
}

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_result .result_table {
        display: none
    }
}

#page-registeredHistory .registeredHistory_result .result_table .table_td.td-date > h6 {
    margin-top: 10px;
    color: #5f5f5f
}

#page-registeredHistory .registeredHistory_result .result_table .table_td.td-date .table_emphasis {
    color: var(--color-gray-900)
}

#page-registeredHistory .registeredHistory_result .result_table .table_td.td-unitPrice {
    color: var(--color-red-400)
}

    #page-registeredHistory .registeredHistory_result .result_table .table_td.td-unitPrice .table_unit {
        margin-left: 2px
    }

#page-registeredHistory .registeredHistory_result .result_table .table_td.td-action .ctbc-button {
    gap: 4px
}

#page-registeredHistory .registeredHistory_result .result_list {
    display: none;
    width: 100vw;
    margin: 0 -16px;
    background: var(--color-gray-200)
}

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_result .result_list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 8px
    }
}

#page-registeredHistory .registeredHistory_result .result_list .list_card {
    background: var(--color-gray-100);
    padding: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 8px
}

    #page-registeredHistory .registeredHistory_result .result_list .list_card .card_head {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    #page-registeredHistory .registeredHistory_result .result_list .list_card .card_body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 10px
    }

        #page-registeredHistory .registeredHistory_result .result_list .list_card .card_body .body_attributes {
            display: -webkit-box;
            display: -ms-flexbox;
            /* display: flex; */
            color: var(--color-gray-500);
            flex-wrap: wrap;
        }

            #page-registeredHistory .registeredHistory_result .result_list .list_card .card_body .body_attributes .attributes_item + .attributes_item::before {
                content: '｜';
                margin: 0 4px
            }

        #page-registeredHistory .registeredHistory_result .result_list .list_card .card_body .body_price {
            width: 100%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            gap: 8px
        }

            #page-registeredHistory .registeredHistory_result .result_list .list_card .card_body .body_price .price_block {
                width: 100%;
                min-height: 86px;
                -webkit-box-flex: 1;
                -ms-flex-positive: 1;
                flex-grow: 1;
                -ms-flex: flex;
                flex: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -ms-flex-direction: column;
                flex-direction: column;
                background: var(--color-gray-200);
                border-radius: 6px;
                padding: 10px 16px
            }

                #page-registeredHistory .registeredHistory_result .result_list .list_card .card_body .body_price .price_block .block_part {
                    overflow: hidden
                }

                #page-registeredHistory .registeredHistory_result .result_list .list_card .card_body .body_price .price_block .block_tilte {
                    color: var(--color-gray-600)
                }

                #page-registeredHistory .registeredHistory_result .result_list .list_card .card_body .body_price .price_block .block_note {
                    color: var(--color-gray-500);
                    white-space: nowrap;
                    overflow: hidden;
                    text-overflow: ellipsis
                }

                #page-registeredHistory .registeredHistory_result .result_list .list_card .card_body .body_price .price_block.block-unitPrice {
                    color: var(--color-red-400);
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: vertical;
                    -webkit-box-direction: normal;
                    -ms-flex-direction: column;
                    flex-direction: column;
                    -webkit-box-pack: justify;
                    -ms-flex-pack: justify;
                    justify-content: space-between
                }

                #page-registeredHistory .registeredHistory_result .result_list .list_card .card_body .body_price .price_block.block-total {
                    min-width: 200px;
                    color: var(--color-gray-600);
                    -webkit-box-flex: 1;
                    -ms-flex-positive: 1;
                    flex-grow: 1;
                    display: grid;
                    grid-template-columns: repeat(2,1fr);
                    gap: 8px
                }

    #page-registeredHistory .registeredHistory_result .result_list .list_card .card_head > h6 {
        color: #5f5f5f
    }

    #page-registeredHistory .registeredHistory_result .result_list .list_card .card_emphasis {
        color: var(--color-gray-900)
    }

    #page-registeredHistory .registeredHistory_result .result_list .list_card .card_foot > .ctbc-button {
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        margin-left: auto;
        gap: 4px
    }

#page-registeredHistory #registeredHistoryConsult .button_icon {
    position: absolute;
    height: 60px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    bottom: calc(100% - 8px);
    z-index: -1
}

#page-registeredHistory #registeredHistoryConsult .ctbc-button {
    background: var(--color-gradient)
}

#page-registeredHistory .registeredHistory_side {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media (max-width:1200px) {
    #page-registeredHistory .registeredHistory_side {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

#page-registeredHistory .registeredHistory_side .side_button {
    position: absolute;
    right: 0;
    border: 0;
    padding: 27px 0 6px 0;
    border-radius: 8px;
    color: var(--color-gray-100);
    background: -webkit-gradient(linear,left top, left bottom,color-stop(0, #21b2b5),to(#18c672));
    background: linear-gradient(180deg,#21b2b5 0,#18c672 100%);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 0;
    width: 24px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

    #page-registeredHistory .registeredHistory_side .side_button .button_icon {
        position: absolute;
        top: 0;
        left: 0;
        width: 24px;
        height: 24px;
        border: 1px solid var(--color-gray-100);
        border-radius: 8px;
        overflow: hidden
    }