.main-report-div {
    padding: 10px;
    .title-div {
        display: flex;
        align-items: center;
        div {
            width: 33%;
        }
        .back-btn {
            button {
                background: none;
                color: #968bdb;
                border: none;
                font-size: 16px;
                cursor: pointer;
                span {
                    vertical-align: bottom;
                    font-size: 20px;
                }
            }
        }
        .master-class {
            justify-content: center;
            display: flex;
            h2 {
                font-size: 16px;
                margin: 0;
                color: #968bdb;
                font-weight: 100;
                padding-right: 20px;
                margin-right: 20px;
                border-right: 1px solid;
                span {
                    color: #d7779b;
                }
            }
            span {
                cursor: pointer;
            }
        }
        .headerlogo {
            padding: 0 7px;
            height: 100%;
            text-align: end;
            img {
                width: 80px;
            }
        }
    }
    .cohort-table {
        /*[ Scroll bar ]*/
        height: 89vh;
        overflow: auto;
        * {
            box-sizing: border-box;
        }
        .js-pscroll {
            position: relative;
            overflow: auto;
        }
        .table100 .ps__rail-x {
            z-index: 1010;
            height: 6px;
            background-color: transparent;
            opacity: 1 !important;
            bottom: 10px;
        }
        .table100 .ps__rail-x::before {
            content: "";
            display: block;
            position: absolute;
            background-color: #e6e6e6;
            height: 100%;
            width: calc(100% - 30px);
            left: 15px;
            top: 0px;
        }
        .table100 .ps__rail-x .ps__thumb-x {
            height: 100%;
            bottom: 0;
            background-color: transparent;
            opacity: 1 !important;
        }
        .table100 .ps__rail-x .ps__thumb-x::before {
            content: "";
            display: block;
            position: absolute;
            background-color: #b3b3b3;
            height: 100%;
            width: calc(100% - 30px);
            top: 0;
            left: 15px;
        }
        .bg-color {
            background: #151946;
            height: 40px;
            span {
                color: #d7779b;
            }
        }
        /*[ Table ]*/
        .wrap-table100 {
            width: 100%;
        }
        /*[ Table ]*/
        .table100 {
            height: 89vh;
        }
        table {
            width: 100%;
            border-color: #97979724;
        }
        th,
        td {
            font-weight: unset;
            padding-right: 10px;
        }
        .column1 {
            width: 100%;
        }
        .column2,
        .column3,
        .column4,
        .column5,
        .column6,
        .column7,
        .column8,
        .column9,
        .column10,
        .column11,
        .column12,
        .column13,
        .column14,
        .column15,
        .column16,
        .column17,
        .column18,
        .column19,
        .column20,
        .column21,
        .column22,
        .column23,
        .column24,
        .column25,
        .column26,
        .column27 {
            width: 55px;
            padding: 0 5px;
            color: #a69edf;
            height: 60px;
            font-weight: 500;
            div {
                text-align: start;
                writing-mode: vertical-rl;
                transform: rotate(180deg);
                height: 225px;
                padding: 10px;
                margin: auto;
            }
            span {
                svg {
                    width: 19px;
                    height: 19px;
                    vertical-align: middle;
                }
            }
            .user-name {
                display: flex;
                align-items: center;
                transform: rotate(0deg);
                writing-mode: inherit;
                height: 40px;
                padding: 0;
                p {
                    margin-bottom: 0;
                }
            }
        }
        .table100 td {
            padding-top: 16px;
            padding-bottom: 16px;
        }
        .row100 {
            text-align: center;
        }
        .table100-firstcol {
            table {
                border: 1px solid #97979724;
                width: 300px;
                thead {
                    .head {
                        height: 227px;
                        background: #181e41;
                        padding: 10px;
                        vertical-align: bottom;
                        .column1 {
                            color: #7473a9;
                            font-weight: 500;
                            text-align: left;
                            padding-left: 20px;
                        }
                    }
                }
                tbody {
                    background: #141735;
                    .body {
                        height: 50px;
                        td {
                            text-align: start;
                            padding: 0 10px;
                            white-space: nowrap;
                            overflow: hidden;
                            text-overflow: ellipsis;
                            max-width: 220px;
                            vertical-align: middle;
                            img {
                                vertical-align: inherit;
                                margin-right: 10px;
                                width: 38px;
                                height: 38px;
                                border-radius: 50%;
                            }
                        }
                    }
                }
            }
        }
        .wrap-table100-nextcols {
            background: #1b1f48;
            table {
                display: block;
                overflow: auto;
                width: 100%;
                border-color: #97979724;
                &::-webkit-scrollbar {
                    width: 5px;
                    height: 5px;
                }
                /* Track */
                &::-webkit-scrollbar-track {
                    border-radius: 10px;
                }
                /* Handle */
                &::-webkit-scrollbar-thumb {
                    background: #979797;
                    border-radius: 10px;
                }
                thead {
                    .head {
                        height: 150px;
                        background: #25305f57;
                    }
                }
                tbody {
                    .body {
                        height: 60px;
                        .height46 {
                            background: #1b1f48;
                        }
                    }
                }
            }
        }
        .color {
            color: #d7779b;
        }
        .table100 {
            width: 100%;
            position: relative;
        }
        .table100-firstcol {
            position: absolute;
            z-index: 1000;
            width: 225px;
            top: 0;
            left: 0;
        }
        .table100-firstcol table {
            border-spacing: 0;
        }
        .wrap-table100-nextcols {
            width: 100%;
            overflow: auto;
            padding-left: 300px;
        }
        .table100-nextcols table {
            table-layout: fixed;
            border-spacing: 0;
        }
    }
    .vertical-th {
        transform: rotate(-90deg);
    }
}
