/* Minification failed. Returning unminified contents.
(2,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
 */
.contract-list__wrapper {
    --itemHoverColor: #ffdead;
    --itemActiveColor: #fff3d0;
    font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
    cursor: default;
    margin-top: 30px;
}
.contract-list__wrapper .not-allow {
    cursor: not-allowed;
}

.contract-list__header-title {
    font-weight: 700;
    font-size: 28px;
}
.contract-list__tabs {
    display: flex;
    align-items: center;
    margin-top: 20px;
}
.contract-list__tab {
    color: #666666;
    border-right: 1px solid #d9d9d9;
    padding: 0px 15px;
    font-size: 16px;
    line-height: 16px;
    white-space: nowrap;
}
.contract-list__tab:first-child {
    padding-left: 0px;
}
    .contract-list__tab:last-child {
        border-right: 0px;
    }
.contract-list__tab--active {
    color: #282828;
    font-weight: 700;
}

.contract-list__body {
    margin-top: 20px;
}

.contract-list__table-container {    
    position: relative;
    width: 100%;
}
.contract-list__table {
    width: 100%;
    table-layout: fixed;
    min-width: 600px;
}
.contract-list__table-head th {
    font-weight: 400;
    font-size: 14px;
    padding: 10px 0px;
    text-align: center;
    border-bottom: 1px solid #d9d9d9;
    color: #282828;
}
.contract-list__table-head th:first-child {
    width: 50px;
}

.contract-list__table-body tr:hover td {
    background-color: #ffdead;
}
.contract-list__table-body td {
    padding: 10px 0px;
    text-align: center;
    border-bottom: 1px solid #d9d9d9;
    white-space: nowrap;
}
    .contract-list__table-body td:first-child {
        width: 50px;
    }
    .contract-list__table-body td a {
        color: #333 !important;
    }
        .contract-list__table-body td a:hover {
            text-decoration: none;
            color: #0d6efd !important;
        }

.contract-list__table .colu-code {
    width: 110px !important;
}
.contract-list__table .colu-name {
    text-align: left !important;
    width: 270px !important;
}
.contract-list__table .colu-price {
    width: 80px !important;
}
.contract-list__table .colu-change {
    text-align: right !important;
    width: 100px;
}

.contract-list__button-container {
    margin-top: 20px;
    text-align: center;
}
.contract-list__button-see-more {
    padding: 6px 25px;
    color: #282828;
    border: 1px solid #d9d9d9;
    border-radius: 20px;
    cursor: default;
}
    .contract-list__button-see-more:hover {
        background-color: #E1F5FE;
        border: none;
    }

@media screen and (max-width: 480px) {
    .contract-list__table-container {
        overflow-x: auto;
    }
    .contract-list__table-head th, .contract-list__table-body td {
        width: 90px;
    }
        .contract-list__table-head th:first-child, .contract-list__table-body td:first-child {
            width: 45px;
        }
    .contract-list__table .colu-code {
        width: 90px !important;
        text-align: left;
        left: 45px !important;
    }
    .contract-list__table .colu-name {        
        width: 220px !important;
    }
}

@media screen and (min-width: 481px) and (max-width: 768px) {
    /*.contract-list__table-container {
        overflow-x: auto;
    }
    .contract-list__table-head th, .contract-list__table-body td {
        width: 90px;
    }         
    .contract-list__table .colu-name {
        width: 250px !important;
    }*/
}

@media screen and (max-width: 912px) {
    .contract-list__table-container {
        overflow-x: auto;
    }

    .contract-list__table-head th, .contract-list__table-body td {
        width: 90px;
    }
    .contract-list__table th:first-child, .contract-list__table td:first-child {
        position: sticky;
        left: 0px;
        background-color: #fff;
        z-index: 3;
    }
    .contract-list__table .colu-code {
        position: sticky;
        left: 50px;
        background-color: #fff;
        z-index: 3;
    }
}

@media screen and (max-width: 1200px) {
    .contract-list__table .colu-name {
        width: 250px !important;
    }
}
