.table-scroll {
        position: relative;
    max-width: 100%;
    margin: auto;
    overflow: hidden;
/*    position: relative;
    max-width: 100%;
    margin: auto;
    height: 384px;*/
}
.table-wrap {
    width: 100%;
    overflow: auto;
}
.table-scroll table {
    width: 100%;
    margin: auto;
    border-spacing: 0;
}
.table-scroll th, .table-scroll td {
    padding: 5px 10px;
    border: 1px solid #ddd;
    background: #fff;
    vertical-align: middle;
    text-align: center;
}
@media screen and (max-width: 600px) {
    .table-scroll th, .table-scroll td {
        padding: 10px 10px;
        display: flex;
        justify-content: space-between;
    }
}
.table-scroll thead, .table-scroll tfoot {
    background: #f9f9f9;
}
.clone {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
}
    .clone th, .clone td {
        visibility: hidden
    }
    .clone td, .clone th {
        border-color: transparent
    }
    .clone tbody th {
        visibility: visible;
        color: red;
    }
    .clone .fixed-side {
        border: 1px solid #ddd;
        background: #ececec;
        visibility: visible;
    }
    .clone thead, .clone tfoot {
        background: transparent;
    }