.flex-table {
    display: flex;
    flex-direction: column;
    background: #fff;
    overflow: hidden;
}
.flex-table__head {
    display: none;
}
.flex-table__body .flex-table__row {
    display: flex;
    transition: background .3s ease-in-out, color .2s, border .2s;
}
.flex-table__body .flex-table__row:not(.no-hover):hover {
    background: #EDEDED;
}
.flex-table__body .flex-table__row+.flex-table__row {
    border-top: 2px solid #EDEDED;
}
.flex-table__row {
    flex-wrap: wrap;
}
.flex-table__cell {
    display: flex;
    flex: 1;
    padding: .5em;
}
.flex-table__cell.cell--center {
    justify-content: center;
}
.flex-table__cell.cell--end {
    justify-content: end;
}
.flex-table__cell.cell--stretch {
    flex: 100%;
    padding: .5em .5em 0 .5em;
}

.table__notice, .box-4.table__notice {
    background: #ededed;
    padding: 20px;
}

/* ==========================================================================
   Media Queries
   ========================================================================== */

/* --- TABLET (MD) --- */
@media ( min-width: 768px ) {



}



/* --- DESKTOP (LG) --- */
@media ( min-width: 992px ) {

    .flex-table {
        border: 2px solid #EDEDED;
        border-radius: 10px;
    }
    .flex-table__head {
        font-weight: bold;
        display: block;
        color: var(--hy-grey);
    }
    .flex-table__head .flex-table__row {
        border-bottom: 2px solid #EDEDED;
        display: flex;
    }
    .flex-table__body .flex-table__cell {
        padding: 1em;
    }
    .flex-table__row {
        flex-wrap: nowrap;
    }
    .flex-table__cell {
        display: flex;
        flex: 1;
        padding: 1em;
    }
    .flex-table__cell.cell-1 {
        flex: 1;
    }
    .flex-table__cell.cell-2 {
        flex: 2;
    }
    .flex-table__cell.cell-3 {
        flex: 3;
    }
    .flex-table__cell.cell-4 {
        flex: 4;
    }

}



/* --- DESKTOP (XL) --- */
@media ( min-width: 1200px ) {



}



/* --- DESKTOP (XXL) --- */
@media ( min-width: 1440px ) {



}