/* 手機 */
@media screen and (max-width: 767px) {
    .employee-bonus-container {
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        gap: 20px;
        padding: 20px 0px;
    }
    
    .employee-bonus-container > .content {
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        gap: 20px;
        padding: 0px 20px;
    }
    
    .employee-bonus-container > .content > .table-div-row { max-width: 500px; max-height: 100%; }

    .employee-bonus-container > .content > .table-div-row > .thead { width: 100%; }

    .employee-bonus-container > .content > .table-div-row > .thead > .tr > .td:nth-child(2),
    .employee-bonus-container > .content > .table-div-row > .tbody > .tr > .td:nth-child(2) { flex: 0 0 90px; }
}

/* PC */
@media screen and (min-width: 768px) {
    .employee-bonus-container {
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        gap: 20px;
        padding: 20px 0px;
    }
    
    .employee-bonus-container > .content {
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        gap: 20px;
        padding: 0px 20px;
    }
    
    .employee-bonus-container > .content > .table-div-row { max-width: 500px; max-height: 100%; }
    
    .employee-bonus-container > .content > .table-div-row > .tbody > .tr { width: calc(100% - (100% - 483px)); }
    
    .employee-bonus-container > .content > .table-div-row > .tbody > .tr > .td > img { cursor: pointer; }
}