/*Font declaration*/
@font-face {
    font-family: 'SFProDisplay';
    src: url('../font/SFProDisplay-Regular.ttf');
}

@font-face {
    font-family: 'SFProDisplayMedium';
    src: url('../font/FontsFree-Net-SFProDisplay-Medium.ttf');
}

@font-face {
    font-family: 'SFProDisplayBold';
    src: url('../font/SFProDisplay-Bold.ttf');
}

@font-face {
    font-family: 'SFProDisplay-SemiBold';
    src: url('../font/SFProDisplay-SemiBold.ttf');
}

@font-face {
    font-family: 'SFProDisplayLight';
    src: url('../font/SFProDisplay-Light.ttf');
}

@font-face {
    font-family: 'SFProDisplayThin';
    src: url('../font/SFProDisplay-Thin.ttf');
}

@font-face {
    font-family: 'SFProDisplayHeavy';
    src: url('../font/SFProDisplay-Heavy.ttf');
}
/*Common*/
* {
    font-family: SFProDisplay;
}

.text--black {
    color: black;
}

.text--blue {
    color: #164096;
}

.text--grey {
    color: #707070;
}

.select-hide {
    display: none;
}

.custom-select select {
    display: none;
    /*hide original SELECT element: */
}

.custom-select {
    position: relative;
    text-align: center;
}

.select-selected {
    background-color: transparent;
}

/* style the items (options), including the selected item: */

.select-items div,
.select-selected {
    color: #1b1c1e;
    cursor: pointer;
    text-align: center;
    z-index: 9999;
}


/* Style items (options): */

.select-items {
    position: absolute;
    background-color: #fff;
    left: 0;
    right: 0;
    z-index: 9999 !important;
}

.select-items::before {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    bottom: 100%;
    right: 15.36px;
    border: 7.68px solid transparent;
    border-top: none;
    border-bottom-color: #fff;
    filter: drop-shadow(0 -0.0625rem 0.0625rem rgba(0, 0, 0, .1));
}


/* Hide the items when the select box is closed: */

.select-items div:hover,
.same-as-selected {
    background-color: rgba(0, 0, 0, 0.1);
}

table thead,
table tbody {
    width: 100% !important;
}

table tr:nth-of-type(1) {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

table tr th:nth-of-type(1) {
    border-top-left-radius: 4px;
}

table tr th:last-child {
    border-top-right-radius: 4px;
}


/* table thead tr{
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border: solid 1.6px #e1e4e8;
} */

select option {
    white-space: pre-wrap !important;
    font: -moz-pull-down-menu;
}

.col--xs {
    padding: 0 !important;
    width: 30.72px !important;
}

.col--sm {
    padding: 0 !important;
    width: 61.44px !important;
}

.col--md {
    padding: 0 !important;
    width: 122.88px !important;
}

.col--lg {
    padding: 0 !important;
    width: 184.32px !important;
}

.col--xl {
    padding: 0 !important;
    width: 245.76px !important;
}

.col--xxl {
    padding: 0 !important;
    width: 307.2px !important;
}

.disappear {
    display: none !important;
}

.appear {
    display: block !important;
}

.col,
.container-fluid {
    padding: 0 !important;
    margin: 0 !important;
}

.container-fluid {
    width: initial;
    /* position: relative; */
}

.wrapper {
    display: flex;
    justify-content: center;
}

.config__idle .new__nav,
.config__level .new__nav,
.config__term .new__nav,
.config__topic .new__nav,
.config__type .new__nav,
.config__subject .new__nav {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: row !important;
}

.new__nav {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.new__nav > div {
    display: flex;
}

.new__nav > div form {
    margin-right: 19.2px;
}

.new__nav__title {
    font-family: SFProDisplayBold;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}

.bg--10th {
    background-color: #86C681;
}

.bg--20th {
    background-color: #FFDBDB;
}

.bg--30th {
    background-color: #FFD6EB;
}

.bg--40th {
    background-color: #FFAFD1;
}

.bg--50th {
    background-color: #ffa29e;
}

.text--middle {
    text-align: center;
}

.link--red, .text--red {
    color: #bb2019 !important;
    background-color: transparent !important;
}

.link--red:hover {
    color: #bb2019 !important;
    text-decoration: none;
}
.text--ac {
    color: #159714 !important;
}
.sortBtn {
    border: none;
    color: #5e6c84;
    background: none;
}

.sortBtn:focus {
    outline: none;
}
.nav__profile__menu {
    position: absolute;
    background-color: white;
    z-index: 998;
    border-radius: 4px;
}
.nav__profile__menu ul {
    position: relative;
    list-style-type: none;
    padding: 0 !important;
    font-weight: lighter;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.75;
    letter-spacing: normal;
    text-align: left;
    color: #737679;
    margin: 0 !important;
}

.nav__profile__menu ul li {
    cursor: pointer;
}
.nav__profile__menu ul li a {
    text-decoration: none;
    color: #737679;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: left;
}
.nav__menu .nav__profile__menu ul li a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    padding: 10.75px 15.36px !important;
    text-align: left !important;
}

div[class$="__nav"] a,
.admin__ques__nav__form + a {
    display: block;
    background-color: #bb2019;
    font-stretch: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}
tr[class$="table__head"] {
    background-color: #faeded;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.7;
    letter-spacing: normal;
    color: #5e6c84;
}

table[class$="table"] tr td,
.rank__table tr td {
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.7;
    letter-spacing: normal;
}
.custom__nav__select {
    text-align: right;
    margin-top: 10px;
}
.custom__nav__select .select-items div,
.custom__nav__select .select-selected {
    text-align: left !important;
}

.select__subject,
.select__term,
.select__group {
    text-align: left;
    user-select: none;
    background-color: #F4F5F7;
}
.classlist__action__btn {
    background-size: contain !important;
    background-image: url('../images/Component 67 – 16.png') !important;
    vertical-align: middle;
    border: none;
}

.classlist__action__btn:focus {
    background-size: contain;
    background-image: url('../images/btn.png') !important;
    outline: none;
    color: #fff;
}

.classlist__action__btn img {
    width: 100%;
}

.class__dropdown {
    min-width: 99.19px !important;
    top: 90% !important;
    right: 5% !important;
    box-shadow: 2.4px 2.4px 2.4px 2.4px rgba(96, 14, 96, 0.16);
}

.class__dropdown ul li {
    white-space: nowrap;
    font-size: 12.88px !important;
    padding: 0 !important;
    text-align: center;
    color: #000 !important;
}

.class__dropdown ul li a {
    text-align: center !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    padding: 3.072px 15.36px !important;
}
.dropdown__wrapper {
    position: relative;
}

.dropdown__menber,
.dropdown__question,
.dropdown__work,
.dropdown {
    min-width: 122.88px !important;
    right: 0% !important;
}

.dropdown__wrapper button {
    color: #fff;
    background: none;
    outline: none;
    border: none;
    /* padding: 0 !important; */
    /* width: 10.39px; */
}

.dropdown__wrapper button {
    font-size: 14px;
}

.dropdown__menber ul::before,
.dropdown__question ul::before,
.dropdown__work ul::before,
.dropdown ul::before {
    right: 46.08px !important;
}

.dropdown__menber ul li,
.dropdown__question ul li,
.dropdown__work ul li,
.dropdown ul li {
    text-align: center;
    border-bottom: 1.6px solid #e1e4e8;
}
#editor {
    margin: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 4px;
    min-height: 100px;
}

.editor {
    margin: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.stdlistadd__btn {
    text-align: right;
    margin-top: 25.6px;
}

.stdlistadd__btn button {
    background: none;
    border: none;
    width: 115.2px;
    height: 28.8px;
    border-radius: 4px;
    font-size: 12.88px;
}

.stdlistadd__btn button:focus {
    outline: none;
}

.stdlistadd__btn button:nth-child(1) {
    background-color: #bb2019 !important;
    color: #fff;
}

.stdlistadd__btn button:nth-child(2) {
    color: #505F79;
}

.stdlistadd__btn button:nth-child(2):hover {
    background-color: #FAEEED;
}
.bg__wrapper .setting__main__popup {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.stdlistadd__form__radio label input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
.status__btn {
    outline: none;
    border: none;
    background: none;
}

.status__btn:focus {
    outline: none;
    border: none;
}

.admin__config {
    width: 199.2px;
}

.admin__config__title {
    font-family: SFProDisplayBold;
    font-size: 22.4px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.64;
    letter-spacing: normal;
    text-align: left;
    color: #24292e;
}

.admin__config ul {
    list-style-type: none;
    padding-left: 9.6px !important;
    font-size: 13.6px;
}

.text--grey {
    color: #707070;
}

.admin__config>ul li[class=text--grey] {
    padding-top: 10.8px;
    padding-bottom: 7.2px;
    font-family: SFProDisplayBold;
}

.admin__config>ul li:nth-child(8) {
    padding-bottom: 2.8px;
    border-bottom: 0.4px solid #f6f8fa;
}

.admin__config ul li a {
    display: block;
    color: #bb2019;
    padding: 7.2px 0;
    width: 153.6px;
}

.admin__config ul li a:hover {
    background-color: #f6f8fa;
    text-decoration: none;
}


multi-input {
    width: 294.4px;
    min-height: 250.4px;
    margin-right: 38.4px;
    border-radius: 4px;
    margin-bottom: 12.88px;
    background-color: #fafbfc;
    margin-left: 16px;
}
multi-input input {
    border: none !important;
}

.cmt__action__btn {
    width: 11.19px;
    height: 11.19px;
    padding: 0 !important;
    margin-left: 11.19px;
}

.cmt__action__btn img {
    width: 100%;
    height: 100%;
}

@media only screen and (max-width: 767px) {
    body {
        background-color: white;
        font-size: 14px;
         overflow-x: hidden;
    }
    .m-16 {
        margin-left: 16px !important;
        margin-right: 16px !important;
    }
    .only-web {
        display: none !important;
    }
    .checkmark {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        height: 16px;
        width: 16px;
        background-color: #fff;
        border: solid 2px #bb2019;
        border-radius: 50%;
    }
    multi-input {
        width: 100%;
        min-height: 150px;
        font-size: 14px;
        padding: 10px;
        margin: 0 0 15px;
        border-radius: 5px;
        border: solid 1px #dfe1e6;
    }
    .config__student__list .custom-select {
        width: 100%;
        height: 40px;
        border-radius: 5px;
        border: solid 1px #d8dee2;
        background-color: #fef9f9;
        padding-left: 10px !important;
    }
    .config__student__list .select-selected {
        line-height: 40px;
    }
    .username {
        /*height: 84.8px;*/
        background-color: #fff;
        position: sticky !important;
        top: 0;
        z-index: 99;
    }

    .username p {
        /*margin-left: 199.2px;*/
        font-size: 18px;
        margin-bottom: 0;
        padding: 5px 16px;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.1;
        letter-spacing: normal;
        text-align: left;
        color: #1b1c1e;
    }
    .banner, .noImage__banner {
        display: none;
    }
    div[class$="__nav"] a,
    .admin__ques__nav__form + a {
        width: 100px;
        height: 32px;
        border-radius: 3px;
        line-height: 32px;
    }
    tr[class$="table__head"],
    .admin__studentlist__head {
        height: 48px;
        border-bottom: 1px solid #E1E4E8;
    }
    .new__table__head th:first-child,
    .contest__table__head th:first-child,
    .admin__ques__table__head th:first-child,
    .admin__comm__table th:first-child,
    .ques__table__head th:first-child {
        display: none;
    }
    .new__table tbody tr td:first-child,
    .contest__table tbody tr td:first-child,
    .admin__ques__table tbody tr td:first-child,
    .admin__comm__table tbody tr td:first-child,
    .ques__table tbody tr td:first-child {
        display: none;
    }

    tr[class$="table__head"] th,
    .admin__studentlist__head th{
        font-family: SFProDisplayBold, sans-serif;
        padding: 0 10px;
    }

    div[class$="table__wrapper"],
    .admin__studentlist__wrapper{
        overflow-x: auto;
        overflow-y: visible;
        padding-bottom: 5px;
    }

    table[class$="table"],
    .admin__studentlist {
        width:  max-content;
        min-width: calc(100vw - 32px);
        border: 1px solid #E1E4E8;
        border-radius: 10px;
    }

    table[class$="table"] tbody tr td,
    .admin__studentlist tbody tr td{
        vertical-align: baseline;
        padding: 10px;
        word-break: break-word;
        border-bottom: 1px solid #E1E4E8;
        vertical-align: top;
        font-size: 14px;
    }
    .new__nav__form,
    .admin__ques__nav__form,
    .admin_activity__nav__form,
    .ques__nav__form{
        border-radius: 6px;
        border: none;
        width: calc(100vw - 32px);
        height: 40px;
        padding-left: 10px;
        padding-right: 10px;
        background-color: #FAEDED;
        line-height: 35px;
        margin-right: 0 !important;
    }

    .new__nav__form input[type="text"],
    .admin__ques__nav__form input[type="text"],
    .admin_activity__nav__form input[type="text"],
    .ques__nav__form input[type="text"] {
        background: none;
        border: none;
        color: #1B1C1E;
        width: calc(100% - 34px);
        font-size: 14px;
    }

    .new__nav__form input[type="text"]:focus,
    .admin__ques__nav__form input[type="text"]:focus,
    .admin_activity__nav__form input[type="text"]:focus,
    .ques__nav__form input[type="text"]:focus {
        outline: none;
    }

    .new__nav__form button,
    .admin__ques__nav__form button.btn__search,
    .admin_activity__nav__form button,
    .ques__nav__form button {
        display: inline-block;
        width: fit-content;
        height: 38px;
        background-color: transparent;
        border: none;
        padding: 0;
    }

    .new__nav__form button:focus, .new__nav__form button:focus-visible,
    .admin__ques__nav__form button:focus, .new__nav__form button:focus-visible,
    .admin_activity__nav__form button:focus, .new__nav__form button:focus-visible,
    .ques__nav__form button:focus, .new__nav__form button:focus-visible {
        outline: none;
    }

    .new__nav__form input[type="submit"],
    .admin__ques__nav__form input[type="submit"],
    .admin_activity__nav__form input[type="submit"],
    .ques__nav__form input[type="submit"] {
        display: none;
    }

    .ques__nav__bottom .custom__nav__select .select__subject {
        width: 100%;
    }
    .select-items {
        top: calc(100% + 5px);
        border-radius: 5px;
        border: solid 1px #faeded;
        box-shadow: 0 4px 4px 0 rgba(147, 147, 147, 0.16);
    }

    .select-items div {
        /*min-height: 41px;*/
        color: #707087;
        padding: 0.375rem 1.75rem 0.375rem 0.75rem;
    }
    .select-selected {
        line-height: 35px;
    }

    .select__subject, .select__term {
        border: none !important;
    }
    .rank .custom-select {
        display: inline-block;
        width: 100%;
        height: calc(1.5em + 0.75rem + 2px);
        line-height: calc(1.5em + 0.75rem + 2px);
        border-radius: 0.25rem;
        padding: 0;
    }
    p[class$="table__date"] {
        margin-bottom: 8px !important;
        line-height: 1.1;
    }

    p[class$="table__time"] {
        margin-bottom: 0 !important;
        color: #9E9E9E;
        line-height: 1.1;
    }
    .stdlistadd__btn button{
        width: 95px;
        height: 32px;
        font-size: 14px;
        border-radius: 5px;
    }

    .stdlistadd__btn button:last-child{
        color: #BB2019;
    }
    .block__account__btn,
    .compare__close__btn {
        outline: none;
        border: none;
        display: block;
        width: 123px;
        height: 32px;
        border-radius: 3px;
        background-color: #bb2019;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
        margin-right: 10px;
    }

    .compare__close__btn {
        width: 32px;
        height: 32px;
        background-color: #FAEEED;
        color: #5E6C84;
        margin-right: 0;
    }
    .ace_gutter, .ace_scroller {
        padding-top: 10px;
    }

    .ace_scroller {
        left: 25px !important;
    }

    .ace_gutter > div {
        width: unset !important;
    }

    .ace_hidpi .ace_gutter {
        width: 25px !important;
    }

    .ace_gutter-cell {
        padding: 0 !important;
        text-align: center;
    }

    .ace_fold-widget {
        display: none !important;
    }
    .pagination li{
        display: none;
    }
    .pagination li:first-child,
    .pagination li:nth-child(2),
    .pagination li:nth-child(3),
    .pagination li:nth-child(4),
    .pagination li:nth-last-child(4),
    .pagination li:nth-last-child(3),
    .pagination li:nth-last-child(2),
    .pagination li:last-child,
    .pagination li.active,
    .pagination li.disabled {
        display: block;
    }
}
@media only screen and (min-width: 768px) {
    body {
        background-color: #F6F8FA;
        min-width: fit-content;
    }
    .only-mobile {
        display: none !important;
    }
    .checkmark {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        height: 12.88px;
        width: 12.88px;
        background-color: #fff;
        border: solid 1.6px #bb2019;
        border-radius: 50%;
    }
    .status__btn img {
        height: 10px;
    }
    .rank .select__subject,
    .config__student__list .select__subject {
        width: 276.48px !important;
        z-index: 990 !important;
    }

    .rank .select__subject {
        width: 276.48px !important;
        z-index: 990 !important;
    }
    .username {
        height: 84.8px;
        background-color: #fff;
        position: sticky !important;
        top: 0;
        z-index: 99;
    }

    .username p {
        /*margin-left: 199.2px;*/
        font-size: 40px;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.1;
        letter-spacing: normal;
        text-align: left;
        color: #1b1c1e;
    }
    .new__nav__form input[type="text"]:focus {
        outline: none;
    }

    .new__nav__form input[type="submit"] {
        width: 19.99px;
        height: 19.99px;
        font-size: 9.6px;
        background: none;
        border-radius: 2.4px;
        border: solid 1.6px #bb2019;
        margin: auto 0;
        margin-right: 6.405px;
        color: #bb2019 !important;
    }
    .new__nav__form {
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #FAEDED;
        width: 273.6px;
        height: 28px;
        display: flex;
        justify-content: space-between;
        /* padding: 7.2px 6.4px 0 8.8px; */
        padding-left: 8.8px;
        vertical-align: middle;
    }

    .new__nav__form input[type="text"] {
        background: none;
        border: none;
        font-size: 11.99px;
        width: 80%;
    }
    .ques__nav__bottom .custom__nav__select .select__subject {
        width: 377.85px !important;
    }
    .custom-select {
        margin-left: 19.2px;
        width: 85.6px;
        height: 29.59px;
        border-radius: 4px;
        border: solid 1.6px #1b1c1e;
        padding: 4.39px !important;
        z-index: 900;
    }
    .select__subject,
    .select__term,
    .select__group {
        margin-left: 15.36px !important;
        margin-bottom: 7.68px;
        border: solid 1.6px #e1e4e8 !important;
    }
    .select-items div,
    .select-selected {
        font-size: 13.6px;
    }
    .select-items {
        top: 125%;
        border-radius: 6.405px;
        border: solid 1.6px #faeded;
        box-shadow: 0 2.4px 11.99px 0 rgba(147, 147, 147, 0.16);
    }

    .select-items div {
        border-top: 1.6px solid #faeded;
        padding: 6.405px 12.8px !important;
        z-index: 9999;
    }
    .classlist__action__btn {
        border-radius: 1.6px !important;
        width: 28px;
        height: 24px;
    }

    .classlist__action__btn:focus {
        border-radius: 0.36px !important;
    }
    .bg__wrapper {
        width: 1177.6px;
        margin: 0 auto;
        margin-top: 30.39px;
        padding: 25.6px 39.19px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #ffffff;
        /* min-height: 100vh; */
    }
    .block__account__btn,
    .compare__close__btn {
        outline: none;
        border: none;
        display: block;
        width: 97.59px !important;
        height: 28px;
        color: #fff;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
        margin-right: 12.88px;
    }

    .compare__close__btn {
        width: 28px !important;
        height: 28px;
        background-color: #FAEEED;
        color: #5E6C84;
        margin-right: 0;
    }
}
/*Login*/
/* LOGIN PAGE  ========================================================================*/

.bg-image--left,
.bg-image--right {
    position: absolute;
}

.row {
    margin-right: -4px;
    margin-left: -4px;
}

.bg-image--left {
    left: 0;
    bottom: 0;
    width: 507.2px;
}

.bg-image--right {
    right: 0;
    bottom: 0;
    width: 42.5%;
}

.bg-image--left img,
.bg-image--right img {
    width: 100%;
}

.login__main__invalid p,
.login__main__success p {
    margin-bottom: 0 !important;
    font-size: 11.19px !important;
}

.login__main__success {
    background-color: #d7f3e3;
    text-align: center !important;
    margin-bottom: 12.88px;
}

.login__logo {
    width: 57.6px;
    margin: 19.2px auto 10.79px auto;
}

.login__logo img {
    width: 100%;
}

.login__main__title {
    font-size: 19.2px;
    /* font-weight: bold; */
    font-stretch: normal;
    font-style: normal;
    line-height: 1.21 !important;
    letter-spacing: normal !important;
    text-align: center;
    color: #1b1c1e;
}

.login__main__title p {
    margin-bottom: 0 !important;
}

.login__main__form {
    display: flex;
    flex-direction: column;
    text-align: left;
    margin: 0 12.8px;
    padding: 28.8px 35.2px 28.8px 35.2px;
    border-radius: 4px;
    font-size: 12.88px;
    color: #5f5f5f;
}

.login__main__form > div {
    padding-bottom: 4px;
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
}


.login__main__form label {
    line-height: 1.19;
    margin-bottom: 1px;
}

.login__main__form input {
    margin-bottom: 12.88px;
}

.login__main__form button {
    background-color: #bb2019;
    font-family: SFProDisplay;
    font-size: 12.88px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 2.06;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
    border: none;
    border-radius: 4px;
    padding: 16px auto;
    height: 39.19px;
    margin-bottom: 12.88px;
}

.login__main__form a.button {
    background-color: #0078d4;
    font-family: SFProDisplay;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 2.06;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
    border: none;
    border-radius: 4px;
    height: 39.19px;
    margin-top: 12.88px;
    margin-bottom: 12.88px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login__main__form button:enabled {
    outline: none;
    border: none;
}

.login__main__form input {
    height: 37.6px;
    border-radius: 4px;
    border: solid 1.6px #d8dee2;
    background-color: #fafbfc;
    padding-left: 15.36px;
}

#login__checkbox {
    display: none;
    visibility: hidden;
}

#login__checkbox:focus,
.checkbox__login:focus {
    outline: none;
}

#login__checkbox + label:before {
    border: 1.6px solid #333;
    content: "\00a0";
    display: inline-block;
    font: 12.88px/12.79px sans-serif;
    height: 12.88px;
    margin: 0px 6.4px 0 0;
    padding: 0;
    vertical-align: top;
    width: 12.88px;
    border-radius: 2.4px;
}

#login__checkbox:checked + label:before {
    background: #bb2019;
    color: #fff;
    content: "✔";
    text-align: center;
}

#login__checkbox:checked + label:after {
    font-weight: bold;
}

.cb__label {
    user-select: none;
    font-size: 12.88px;
}

.checkbox__login .cb__label {
    font-size: 12.88px !important;
}
.separate {
    margin: 0 auto;
}

/*.checkbox__login {*/
/*    margin-bottom: 4.8px;*/
/*}*/

.input--active {
    box-sizing: border-box !important;
    border-left: 2px solid #bb2019 !important;
}

.login__main__forgetpass {
    min-width: 76.8px;
    text-align: center;
    color: #5f5f5f;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.14;
    letter-spacing: normal;
    white-space: nowrap;
}

.login__main__forgetpass:hover {
    color: #5f5f5f;
    text-decoration: none;
}

/* LANG SELECT  =============================*/

.lang {
    width: 271.19px;
    height: 58.39px;
    background-color: #fff;
    display: flex;
    justify-content: center;
    border-radius: 29.19px;
    position: absolute;
    bottom: 5%;
    left: 5%;
    -webkit-box-shadow: 10px 10px 52px -9px rgba(112, 112, 112, 0.57);
    -moz-box-shadow: 10px 10px 52px -9px rgba(112, 112, 112, 0.57);
    box-shadow: 10px 10px 52px -9px rgba(112, 112, 112, 0.57);
    padding: 16px 0;
}

.lang a {
    vertical-align: middle;
    width: 28.8px;
    height: 28.8px;
    margin-left: 10.24px;
    display: flex;
}

.lang a img {
    width: 100%;
}

.lang p {
    display: inline-block;
    vertical-align: middle;
    height: 28.8px;
    line-height: 30px;
    font-size: 14.39px;
    margin-bottom: 0;
    color: #5f5f5f;
}

@media only screen and (min-width: 768px) {
    .login {
        display: flex;
        flex-direction: column;
        text-align: center;
        width: 336.79px;
        position: absolute;
        left: 50%;
        top: 50% !important;
        transform: translate(-50%, -50%);
        font-family: SFProDisplay;
    }

    .login .login__main {
        display: flex;
        flex-direction: column;
        border-radius: 11.99px;
        box-shadow: 0 0 8px 0 rgba(44, 44, 44, 0.2);
        background-color: #fff;
        font-size: 16.8px;
    }

    .login__main__invalid,
    .login__main__success {
        width: 266.4px;
        padding: 15.36px 15.36px;
        font-weight: lighter;
        border-radius: 4.6px;
        box-shadow: 0 0 6.144px 0 rgba(44, 44, 44, 0.2);
        background-color: #fff;
        text-align: left !important;
        /* margin: 19.2px 28px 0 28px; */
        margin: 19.2px auto 0;
    }

    .login__main__form input:focus {
        outline: none;
        border-left: 8px solid #bb2019;
    }
}

@media only screen and (max-width: 767px) {

    /* styles for mobile browsers smaller than 480px; (iPhone) */
    .bg-image--left,
    .bg-image--right {
        display: none;
    }

    .lang {
        align-items: center;
        padding-left: 2vw;
        padding-right: 2vw;
        border-radius: 3vh;
        /*bottom: 1.5vh;*/
        /*left: 27.6vw;*/
        height: 10.802vw;
        width: 44.656vw;
        position: inherit;
        margin: 0 auto;
        min-width: fit-content;
    }

    .lang p {
        font-size: 14px;
        margin-right: 2vw;
        height: unset;
    }

    .lang a {
        vertical-align: middle;
        width: 6.875vw;
        height: 5.802vw;
        margin-left: 0.667vw;
    }

    .container-fluid-login {
        right: 0px;
        left: 0px;
        bottom: 0px;
        top: 0px;
        height: 100vh;
        justify-content: center;
        background-color: white;
    }

    .login .login__main {
        display: flex;
        flex-direction: column;
        border-radius: 0.781vw;
        background-color: #fff;
        font-size: 1.094vw;
    }

    .login__main {
        margin-left: 16px;
        margin-right: 16px;
    }

    .login__logo {
        width: 19.75vw;
        margin: 10.25vw auto 5.703vw auto;
    }

    .login__main__title {
        font-size: 5.25vw;
    }

    .login__main__invalid,
    .login__main__success {
        padding: 1vw 1vw;
        font-weight: lighter;
        border-radius: 0.3vw;
        background-color: #fff;
        text-align: left !important;
        margin: 0 auto;
        margin-top: 1.25vh;
    }

    .login__main__invalid,
    .login__main__success {
        width: 90vw;
    }

    .login__main__success {
        margin-bottom: 2.833vw;
    }

    .login__main__invalid p,
    .login__main__success p {
        margin-bottom: 0 !important;
        font-size: 4vw !important;
    }

    .login__main__form {
        font-size: 4vw;
        position: relative;
    }

    .login__main__form > div {
        display: inline-flex;
        justify-content: space-between;
        align-items: center;
    }

    .login__main__form input {
        height: 13.448vw;
        border-radius: 4px;
    }

    .login__main__form label {
        line-height: 2.19;
    }

    .checkbox__login .cb__label {
        font-size: 4vw !important;
    }

    .login__main__form button {
        height: 11.552vw;
        font-size: 4vw;
        border-radius: 4px;
    }

    .login__main__forgetpass {
        font-size: 4vw;
        margin: unset;
    }

    #login__checkbox + label:before {
        border: 1px solid #D3D3D3;
        content: "\00a0";
        display: inline-block;
        font: 14px/14px sans-serif;
        height: 3.833vw;
        margin: 3vw 2.417vw 0 0;
        padding: 0;
        vertical-align: top;
        width: 3.833vw;
        border-radius: 3px;
    }

    .login__main__form input:focus {
        outline: none;
        border-left: 3vw solid #bb2019;
    }
}

/*Recovery Password*/
/* RECOVERY PASS  ========================================================================*/

@media only screen and (min-width: 768px) {
    .re--left {
        width: 508px !important;
        left: -93.6px !important;
    }

    .re--right {
        width: 523.2px !important;
    }

    .recovery {
        display: flex;
        flex-direction: column;
        text-align: center;
        width: 336.79px;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        font-family: SFProDisplay;
    }

    .recovery__logo {
        width: 57.6px;
        margin: 19.2px auto 22.79px auto;
    }

    .recovery__logo img {
        width: 100%;
    }

    .recovery__main__title {
        font-size: 19.2px;
        /* font-weight: bold; */
        font-stretch: normal;
        font-style: normal;
        line-height: 1.21 !important;
        letter-spacing: normal !important;
        text-align: center;
        color: #1b1c1e;
    }

    .recovery__main__title p {
        margin-bottom: 0 !important;
    }

    .login__main__invalid,
    .login__main__success {
        width: 266.4px;
        padding: 15.36px 15.36px;
        font-weight: lighter;
        border-radius: 4.6px;
        box-shadow: 0 0 6.144px 0 rgba(44, 44, 44, 0.2);
        background-color: #fff;
        text-align: left !important;
        /* margin: 19.2px 28px 0 28px; */
        margin: 0 auto;
        margin-top: 19.2px;
    }

    .login__main__invalid p,
    .login__main__success p {
        margin-bottom: 0 !important;
        font-size: 11.19px !important;
    }

    .recovery__main {
        display: flex;
        flex-direction: column;
        border-radius: 11.99px;
        box-shadow: 0 0 8px 0 rgba(44, 44, 44, 0.2);
        background-color: #fff;
        font-size: 16.8px;
    }

    .recovery__main__form {
        display: flex;
        flex-direction: column;
        text-align: left;
        margin: 0 12.8px;
        padding: 22.4px 35.2px 38.4px 35.2px;
        border-radius: 4px;
        font-size: 12.88px;
        color: #5f5f5f;
    }

    .recovery__main__form label {
        line-height: 1.19;
    ;
    }

    .recovery__main__form input {
        margin-bottom: 12.88px;
        padding-left: 15.36px;
    }

    .recovery__main__form input:focus {
        outline: none;
        border-left: 8px solid #bb2019;
    }

    .recovery__main__form button {
        background-color: #bb2019;
        color: #fff;
        font-family: SFProDisplay;
        font-size: 12.88px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.06;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
        border: none;
        border-radius: 4px;
        padding: 16px auto;
        height: 39.19px;
        margin-top: 9.6px;
    }

    .recovery__main__form input {
        height: 37.6px;
        border-radius: 4px;
        border: solid 1.6px #d8dee2;
        background-color: #fafbfc;
    }
}

@media only screen and (max-width: 767px) {
    .re--left {
        width: 33.073vw !important;
        left: -6.094vw !important;
        display: none;
    }

    .re--right {
        width: 34.063vw !important;
        display: none;
    }

    .recovery {
        display: flex;
        flex-direction: column;
        text-align: center;
        /* width: 336.79px; */
        width: -webkit-fill-available;
        justify-content: center;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        font-family: SFProDisplay;
        height: 100vh;
        background-color: white;
    }

    .recovery__logo {
        width: 20.75vw;
        margin: 1.250vw auto 1.484vw auto;
    }

    .recovery__logo img {
        width: 100%;
    }

    .recovery__main__title {
        font-size: 4.25vw;
        /* font-weight: bold; */
        font-stretch: normal;
        font-style: normal;
        line-height: 1.21 !important;
        letter-spacing: normal !important;
        text-align: center;
        color: #1b1c1e;
    }

    .recovery__main__title p {
        margin-bottom: 0 !important;
    }

    .login__main__invalid,
    .login__main__success {
        width: 250px;
        padding: 10px;
        font-weight: lighter;
        border-radius: 4px;
        box-shadow: 0 0 7px 0 rgba(44, 44, 44, 0.2);
        background-color: #fff;
        text-align: left !important;
        /* margin: 19.2px 28px 0 28px; */
        margin: 0 auto;
        margin-top: 5.25vw;
    }

    .login__main__invalid p,
    .login__main__success p {
        margin-bottom: 0 !important;
        font-size: 12px !important;
    }

    .recovery__main {
        display: flex;
        flex-direction: column;
        border-radius: 0.781vw;
        /* box-shadow: 0 0 0.521vw 0 rgba(44, 44, 44, 0.2); */
        background-color: #fff;
        font-size: 4.094vw;
        margin-left: 4vw;
        margin-right: 4vw;
    }

    .recovery__main__form {
        display: flex;
        flex-direction: column;
        text-align: left;
        margin: 0 0.833vw;
        padding: 1.458vw 2.292vw 2.500vw 2.292vw;
        border-radius: 0.260vw;
        font-size: 3.833vw;
        color: #5f5f5f;
    }

    .recovery__main__form label {
        line-height: 1.19;
        margin-top: 2vh;
    }

    .recovery__main__form input {
        margin-bottom: 0.833vw;
        padding-left: 1vw;
    }

    .recovery__main__form input:focus {
        outline: none;
        border-left: 0.521vw solid #bb2019;
    }

    .recovery__main__form button {
        background-color: #bb2019;
        color: #fff;
        font-family: SFProDisplay, serif;
        font-size: 4vw;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.06;
        letter-spacing: normal;
        text-align: center;
        border: none;
        border-radius: 4px;
        padding: 1.042vw auto;
        height: 11.552vw;
        margin-top: 5.625vw;
    }

    .recovery__main__form input {
        height: 11.552vw;
        border-radius: 4px;
        border: solid 0.104vw #d8dee2;
        background-color: #fafbfc;
    }
}

/*Popup*/
.test__popup__main__btn button:nth-child(1) {
    background-color: #bb2019 !important;
    color: #fff;
}
.test__popup__main__btn button:nth-child(2) {
    color: #505F79;
}
ul.popup *{
    background-color: transparent !important;
    color: black !important;
    text-align: center !important;
    margin: 0 !important;
}
@media only screen and (max-width: 767px) {
    .test__popup {
        width: 100%;
        height: 100vh;
        position: fixed;
        top: 10px;
        z-index: 99999;
    }
    .test__popup__main {
        position: fixed;
        z-index: 1000;
        width: calc(100vw - 32px);
        height: calc(100vh - 100px);
        left: 16px;
        border-radius: 3px;
        border: solid 1.6px #dfe1e6;
        background-color: #ffffff;
        padding: 16px;
        margin: 0 auto;
        font-size: 14px;
    }
    .test__popup__main__import {
        display: flex;
        justify-content: space-between;
        margin-bottom: 15px;
    }
    .test__popup__main__import p {
        margin-bottom: 0;
    }
    .test__popup__main__tc {
        object-fit: contain;
        border-radius: 5px;
        border: solid 1px #cccccc;
        background-color: #fafbfc;
        padding: 10px 15px;
        overflow: auto;
        max-height: 40vh;
    }
    .test__popup__main__tc p {
        font-size: 14px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.67;
        letter-spacing: normal;
        text-align: left;
        color: #707070;
        margin-bottom: 0 !important;
    }
    .test__popup__main__tc a {
        font-size: 14px;
    }
    .test__popup__main>p {
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.5;
        letter-spacing: normal;
        text-align: left;
        color: #172b4d;
        margin-bottom: 0 !important;
    }
    .test__popup__main__btn {
        text-align: right;
        margin-top: 0.417vw;
    }
    .test__popup__main__btn button {
        background: none;
        border: none;
        width: 30vw;
        height: 32px;
        border-radius: 4px;
        font-size: 15px;
    }
    .test__popup__main__btn button:nth-child(2) {
        border: 1px solid grey;
    }
    .test__popup .submit__pad__nav__input {
        margin-top: 0
    }
    .test__popup__main .fileInput__browser {
        width: 100px;
        height: 32px;
        font-size: 14px;
        top: 0;
        right: 0;
        background-color: #FAEEED;
        border-radius: 3px;
        text-align: center !important;
    }
    .classlist__confirm__popup,
    .classlist__success__popup {
        width: 100vw;
        padding-right: 16px;
        height: 100vh;
        position: fixed !important;
        top: 0;
        left: 0;
        overflow: scroll;
        background-color: rgba(0, 0, 0, 0.32);
        z-index: 99999;
    }

    .classlist__confirm__popup__main,
    .classlist__success__popup__main {
        background-color: #fff;
        width: 39.010vw;
        height: 12.344vw;
        border-radius: 0.260vw;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        padding: 1.563vw 1.302vw;
    }

    .classlist__success__popup__main,
    .classlist__confirm__popup__main {
        height: unset;
        padding: 15px;
    }

    .classlist__confirm__popup__main {
        width: 70vw;
    }

    .classlist__success__popup__main {
        width: 60vw;
    }

    .classlist__confirm__popup__main p img,
    .classlist__success__popup__main p img {
        width: 15px;
        height: 15px;
        margin-right: 5px;
    }

    .classlist__confirm__popup__main__title,
    .classlist__success__popup__main__title {
        font-size: 14px;
        display: flex;
        align-items: center;
    }

    .classlist__confirm__popup__main__des,
    .classlist__success__popup__main__des {
        font-size: 14px;
        margin-bottom: 15px;
    }

    .classlist__confirm__popup__main__btn,
    .classlist__success__popup__main__btn {
        text-align: right;
        /*padding-right: 24px;*/
    }

    .classlist__confirm__popup__main__btn button,
    .classlist__success__popup__main__btn button {
        background: none;
        border: none;
        width: 75px;
        height: 27px;
        border-radius: 3px;
    }

    .classlist__confirm__popup__main__btn button:focus,
    .classlist__success__popup__main__btn button:focus {
        outline: none;
    }

    .classlist__confirm__popup__main__btn button:nth-child(1),
    .classlist__success__popup__main__btn button:nth-child(1) {
        background-color: #bb2019 !important;
        color: #fff;
    }

    .classlist__confirm__popup__main__btn button:nth-child(2),
    .classlist__success__popup__main__btn button:nth-child(2) {
        color: #505F79;
    }
    .setting__main__popup,
    .setting__main__popup__fail__single {
        width: 80vw;
        padding: 5px;
    }

    .setting__main__popup img,
    .setting__main__popup__fail__single img {
        width: 20px;
        height: 20px;
    }

    .setting__main__popup__fail {
        min-width: 29.271vw;
        max-height: 24vw;
        padding: 1.146vw 2.500vw;
    }

    .setting__main__popup__fail img {
        width: 20px;
        height: 20px;
    }

    .setting__main__popup__fail div p {
        width: 100%;
        font-size: 1.042vw;
        margin-bottom: 0.5vw !important;
        margin: 0 auto;
    }

    .setting__main__popup__fail,
    .setting__main__popup__fail__single {
        background-color: #FFE4E4;
    }

    .setting__main__popup p,
    .setting__main__popup__fail p {
        padding-left: 10px;
    }

    .setting__main__popup__fail p {
        color: #bb2019;
    }
}

@media only screen and (min-width: 768px) {
    .test__popup {
        width: 100%;
        height: 100vh;
        position: fixed;
        top: 0;
        background-color: rgba(0, 0, 0, 0.32);
        z-index: 99999;
    }
    .test__popup__main {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 538.39px;
        border-radius: 4px;
        border: solid 1.6px #dfe1e6;
        background-color: #ffffff;
        padding: 28.8px;
        margin: 0 auto;
        font-size: 12.88px;
        z-index: 999999;
    }
    .test__popup__main__import {
        display: flex;
        justify-content: space-between;
        margin-bottom: 12.88px;
    }
    .test__popup__main__import p {
        margin-bottom: 0;
    }
    .test__popup__main__tc {
        width: 480px;
        object-fit: contain;
        border-radius: 5px;
        border: solid 1px #cccccc;
        background-color: #fafbfc;
        padding: 8px 12.79px;
    }
    .test__popup__main__tc p {
        font-size: 9.6px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.67;
        letter-spacing: normal;
        text-align: left;
        color: #707070;
        margin-bottom: 0 !important;
    }
    .test__popup__main__tc a {
        font-size: 9.6px;
    }
    .test__popup__main>p {
        font-size: 12.88px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.5;
        letter-spacing: normal;
        text-align: left;
        color: #172b4d;
        margin-bottom: 0 !important;
    }
    .test__popup__main__btn {
        text-align: right;
        margin-top: 6.405px;
    }
    .test__popup__main__btn button {
        background: none;
        border: none;
        width: 115.2px;
        height: 28.8px;
        border-radius: 4px;
        font-size: 12.88px;
    }
    .classlist__confirm__popup,
    .classlist__success__popup {
        width: 100%;
        height: 100vh;
        position: fixed;
        top: 0;
        overflow: scroll;
        background-color: rgba(0, 0, 0, 0.32);
        z-index: 99999;
    }

    .classlist__confirm__popup__main,
    .classlist__success__popup__main {
        background-color: #fff;
        width: 599.19px;
        height: 189.6px;
        border-radius: 4px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        padding: 24px 19.99px;
    }

    .classlist__success__popup__main {
        width: 336.79px;
    }

    .classlist__confirm__popup__main p img,
    .classlist__success__popup__main p img {
        width: 24px;
    }

    .classlist__confirm__popup__main__title,
    .classlist__success__popup__main__title {
        font-size: 19.2px;
    }

    .classlist__confirm__popup__main__des,
    .classlist__success__popup__main__des {
        font-size: 16px;
        margin-bottom: 25.6px;
    }

    .classlist__confirm__popup__main__btn,
    .classlist__success__popup__main__btn {
        text-align: right;
        padding-right: 24px;
    }

    .classlist__confirm__popup__main__btn button,
    .classlist__success__popup__main__btn button {
        background: none;
        border: none;
        width: 77.59px;
        height: 32.79px;
        border-radius: 4px;
    }

    .classlist__confirm__popup__main__btn button:focus,
    .classlist__success__popup__main__btn button:focus {
        outline: none;
    }

    .classlist__confirm__popup__main__btn button:nth-child(1),
    .classlist__success__popup__main__btn button:nth-child(1) {
        background-color: #bb2019 !important;
        color: #fff;
    }

    .classlist__confirm__popup__main__btn button:nth-child(2),
    .classlist__success__popup__main__btn button:nth-child(2) {
        color: #505F79;
    }
    .setting__main__popup,
    .setting__main__popup__fail__single {
        min-width: 449.602px;
        min-height: 55.2px;
        padding: 17.6px 38.4px;
    }

    .setting__main__popup img,
    .setting__main__popup__fail__single img {
        width: 24px;
        height: 24px;
        margin-right: 15.36px;
    }

    .setting__main__popup p,
    .setting__main__popup__fail__single p {
        font-size: 16px;
    }

    .setting__main__popup__fail {
        min-width: 449.602px;
        max-height: 368.64px;
        padding: 17.6px 38.4px;
    }

    .setting__main__popup__fail img {
        width: 24px;
        height: 24px;
        margin-bottom: 15.36px;
    }

    .setting__main__popup__fail div p {
        width: 100%;
        font-size: 16px;
        margin-bottom: 7.68px !important;
        margin: 0 auto;
    }

    .setting__main__popup__fail,
    .setting__main__popup__fail__single {
        background-color: #FFE4E4;
    }

    .setting__main__popup__fail p {
        color: #bb2019;
    }
}

/*navigation*/
.nav {
    background-color: #bb2019;
}

.nav .row {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 0 !important;
}

.nav .row .col-6 {
    padding: 0 !important;
    max-height: 54.4px;
}

.nav .nav__menu {
    width: 100%;
    display: flex;
}

#nav__logo {
    padding: 0 !important;
}


.nav .nav__menu__item {
    white-space: nowrap;
    text-align: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.nav .nav__menu__item a {
    font-family: SFProDisplay;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: left;
    vertical-align: middle;
}
.nav .nav__menu__item a:hover {
    text-decoration: none;
}

.nav .nav__menu__item__logo {
    display: block;
    border-radius: 50%;
    background-color: #fff;
    /* margin-left: 18.8px; */
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

.nav .nav__menu__item__logo img {
    margin: 0 auto;
}

.nav .nav__profile {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    color: #fff;
}

.nav .nav__profile div {
    padding-left: 9.6px;
    padding-right: 9.6px;
}

.nav .lang__dropdown__wrapper {
    margin-right: -15.36px !important;
}

.nav .nav__profile__noti {
    position: relative;
    padding-top: 5.376px !important;
    width: 46.08px;
    height: 30.72px;
}

.nav .nav__profile__noti a {
    display: block;
}

.nav .nav__profile__noti a button {
    display: block;
}

.nav .nav__profile__noti a:hover {
    text-decoration: none;
}

.nav .nav__profile__img img {
    width: 24px;
    margin-right: 4.76px;
    height: 24px;
    cursor: pointer;
    border-radius: 50%;
}


/* .nav__profile__noti, .nav__profile__img{
    display: flex;
    flex-direction: column;
    justify-content: center;
} */

.nav .nav__profile__img button {
    display: flex;
}

.nav .nav__profile__img button,
.nav .nav__profile__noti button {
    color: #fff;
    background: none;
    outline: none;
    border: none;
}

.nav .nav__profile__noti button {
    display: block !important;
    width: 16.8px !important;
    /* position: relative; */
    padding-top: 3.072px;
}

.nav .nav__profile__noti button img {
    position: absolute;
    right: 15% !important;
    width: 16.8px !important;
    height: 19.99px !important;
}

.nav .nav__profile__img button {
    padding: 0 !important;
    width: 10.39px;
}

.nav .nav__profile__noti__dot {
    position: absolute;
    display: inline-block;
    padding: 0 !important;
    margin: 0 !important;
    background-color: #0052cc;
    border-radius: 50%;
    width: 7.2px;
    height: 7.2px;
    z-index: 100;
    top: 28%;
    right: 15%;
}

.nav .dropdown__wrapper .nav__profile__noti__dot {
    right: -115%;
}

.nav .nav__profile__img {
    /* padding: 0 !important; */
    position: relative;
    display: flex;
    height: 12.88px;
    padding-top: 5.376px !important;
}

.nav .nav__profile__img a {
    display: block;
    height: 12.88px;
}

.nav .nav__profile__img a img {
    display: block;
    margin: 0 !important;
}

.nav .nav__profile__img a:hover {
    text-decoration: none;
}

.nav .nav__profile__img button {
    display: block !important;
    height: 12.88px !important;
    position: relative;
    padding-top: 5.376px;
}

.nav .nav__profile__img button i {
    font-size: 12.88px;
    display: block;
    margin-top: 5.376px;
    margin-left: 5.376px;
}

.nav .nav__profile__menu {
    z-index: 998;
    background-color: #fff;
    color: #707070;
    border-radius: 4px;
    position: absolute;
}


.profile__dropdown {
    top: 300%;
    right: -10%;
}

.lang__dropdown {
    top: 300%;
    right: -90%;
    min-width: 120px !important;
}

.lang__dropdown ul li {
    padding: 0 !important;
}

.lang__dropdown ul li a {
    display: flex;
    justify-content: space-around;
    font-size: 14.4px !important;
    height: 100%;
    padding: 7.68px 15.36px;
}

.nav .nav__profile__menu ul::before {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    bottom: 100%;
    right: 50%;
    border: 7.68px solid transparent;
    border-top: none;
    border-bottom-color: #fff;
    filter: drop-shadow(0 -0.0625rem 0.0625rem rgba(0, 0, 0, .1));
}

.nav .profile__dropdown ul::before {
    right: 30.72px !important;
}

.nav .nav__profile__menu ul {
    position: relative;
    list-style-type: none;
    padding: 0 !important;
    font-weight: lighter;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.75;
    letter-spacing: normal;
    text-align: left;
    color: #737679;
    margin: 0 !important;
}

.nav .nav__profile__menu ul li {
    cursor: pointer;
}

.nav .nav__profile__menu ul li a {
    text-decoration: none;
    color: #737679;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: left;
}

.nav .nav__menu .nav__profile__menu ul li a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    padding: 10.75px 15.36px !important;
    text-align: left !important;
}

.nav .nav__profile__menu__name,
.nav .nav__profile__menu__code {
    margin: 0 !important;
    line-height: 1.5;
}

.profile__dropdown ul li {
    border: none;
}

.profile__dropdown ul li:first-child {
    border-bottom: 1.6px solid #e1e4e8;
}

.profile__dropdown ul li:last-child {
    border-top: 1.6px solid #e1e4e8;
}

.profile__dropdown ul li a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    text-align: left !important;
}

.switch__dropdown {
    min-width: 138.24px !important;
}

.switch__dropdown .nav__profile__menu__code {
    font-weight: 600;
}

.switch__dropdown ul::before {
    right: 15.36px !important;
}

.switch__dropdown li:nth-of-type(2) {
    background-color: #F8F9F9;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.switch__dropdown ul li:not(:first-child) p {
    padding: 7.68px 15.36px !important;
}

.switch__dropdown ul li span {
    text-align: left !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    padding: 7.68px 15.36px !important;
}

.noti__dropdown {
    z-index: 999;
    top: 30.72px !important;
}

.noti__dropdown ul::before {
    right: 15.36px !important;
}

.noti__dropdown__nav,
.noti__dropdown__all {
    display: flex;
    justify-content: space-between;
    border-bottom: solid 1.6px #E1E4E8;
    height: 28px;
}

.noti__dropdown__nav a,
.noti__dropdown__all a {
    color: #BB2019 !important;
    font-size: 12.88px !important;
    margin-left: 9.6px;
    font-weight: lighter;
    background-color: transparent !important;
    line-height: 2 !important;
}

.noti__dropdown__all {
    justify-content: center !important;
}

.noti__dropdown__all a {
    font-weight: bold !important;
}

.noti__dropdown__list {
    white-space: normal;
    padding: 0 !important;
}

.noti__dropdown__nav__left {
    margin-bottom: 0 !important;
    font-size: 12.88px !important;
    line-height: 2;
    font-weight: bold;
}

.noti__dropdown__new,
.noti__dropdown__old {
    padding: 0 !important;
}

.noti__dropdown__new>p,
.noti__dropdown__old>p {
    margin-left: 8px !important;
    margin-top: 1.6px !important;
    margin-bottom: 1.6px !important;
    font-size: 12.88px !important;
}

.noti__dropdown__list__item {
    display: block;
    position: relative;
    min-width: 421.2px;
    background-color: #fafbfc;
    padding: 11.19px 19.2px;
    margin-bottom: 6.405px;
}

.noti__dropdown__list__item:hover {
    text-decoration: none;
}

.noti__dropdown__list__item__content {
    /* width: 274.4px; */
    display: flex;
    padding: 0 !important;
}

.noti__dropdown__list__item__img {
    width: 48px !important;
    height: 48px !important;
    margin-right: 12.88px;
    border-radius: 50%;
}

.noti__dropdown__list__item__img__right {
    width: 48px !important;
    height: 48px !important;
}

.noti__dropdown__list__item__img img {
    width: 100% !important;
    height: 100% !important;
}

.noti__dropdown__list__item__info {
    width: 335.2px;
    padding: 0 !important;
    display: flex;
    justify-content: center;
}

.noti__dropdown__list__item__info__des {
    font-size: 12.88px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    text-align: left;
    color: #53575b;
}

.noti__dropdown__list__item__info p {
    margin-bottom: 7.68px !important;
}

.noti__dropdown__list__item__info__des span {
    font-weight: 600;
}

.noti__dropdown__list__item__info__time img {
    width: 13.99px !important;
    height: 13.99px !important;
}

.noti__dropdown__list__item__info__time {
    font-size: 12.88px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.13;
    letter-spacing: normal;
    text-align: left;
    color: #989ca4;
}

.noti__dropdown__list__item--read {
    background-color: #fff !important;
}
@media only screen and (max-width: 767px) {
    .nav {
        height: 36px;
        position: relative;
        width: 100vw;
        margin-bottom: 53px;
    }
    .nav .row .col-6 {
        flex: 0 0 100%;
        min-width: 100%;
    }
    .nav .nav__menu {
        width: 100vw;
        margin-top: 36px;
        padding-top: 12px;
        padding-bottom: 12px;
        overflow-x: scroll;
        -ms-overflow-style: none;  /* IE and Edge */
        scrollbar-width: none;  /* Firefox */
    }
    .nav .nav__profile__img img {
        display: none;
    }
    .nav__menu::-webkit-scrollbar {
        display: none;
    }
    #nav__logo {
        position: absolute;
        top: 2px;
        left: calc(50vw  - 16px);
    }
    .nav__menu__item.homepage {
        padding-left: 16px;
    }
    .nav__menu__item {
        height: 29px;
        padding-right: 18px;
    }
    .nav__menu__item a {
        color: black;
        font-size: 12px;
        line-height: 16px;
    }
    .nav__menu__item button {
        color: black;
        font-size: 12px;
        line-height: 16px;
        padding: 0;
    }
    .nav__menu__item button i{
        margin-left: 5px;
    }
    .nav__menu__item > .active {
        color: #BB2019;
    }
    .nav__menu__item__logo {
        width: 32px;
        height: 32px;
    }
    .nav__menu__item__logo img {
        width: 18px;
    }
    .menu__icon {
        position: absolute;
        left: 16px;
        bottom: 5px;
        z-index: 10;
    }
    .menu__icon .fa-bars:before {
        color: white;
        font-size: 19px;
    }
    .nav__profile {
        position: absolute;
        background-color: #F6F8FA;
        left: 0;
        top: -100vh;
        z-index: 1000;
        -webkit-transition: opacity 0.25s ease-in-out;
        -moz-transition: opacity 0.25s ease-in-out;
        -ms-transition: opacity 0.25s ease-in-out;
        -o-transition: opacity 0.25s ease-in-out;
        transition: opacity 0.25s ease-in-out;
        opacity: 0;
        padding: 24px 16px;
    }
    .nav .nav__profile.show {
        opacity: 1;
        right: 0;
        height: calc(100vh - 36px);
        top: -15px;
    }
    .nav__profile.show {
        opacity: 1;
        right: 0;
        height: calc(100vh - 36px);
        top: 10px;
    }
    .nav__lang, .nav__profile__noti, .nav__profile__avatar {
        display: none;
    }
    .nav__profile__user {
        width: 100%;
        height: 100%;
    }
    .profile__dropdown.disappear {
        background-color: #F6F8FA;
        display: block !important;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        box-shadow: none;
    }
    .nav .profile__dropdown ul::before,
    .nav .nav__profile__menu ul::before {
        display: none;
    }
    .nav__profile__menu ul li {
        font-size: 14px !important;
        line-height: 20px;
        padding-bottom: 10px;
        color: black;
    }
    .nav__profile__menu ul li a {
        font-size: 14px;
        line-height: 20px;
        padding-bottom: 10px;
        color: black;
    }
    .nav__profile__menu ul li:nth-child(2) a,
    .nav__profile__menu ul li:last-child a{
        padding-top: 10px;
    }
    .nav__profile__menu__name {
        font-size: 14px;
        line-height: 20px;
        color: black;
        padding-bottom: 10px;
    }
    .nav__profile__menu__code {
        font-size: 14px;
        line-height: 20px;
        padding-bottom: 10px;
    }
    .nav__menu__item .nav__profile__menu {
        background-color: #F6F8FA;
        left: 0;
        top: 85px;
        z-index: 1000;
        -webkit-transition: all 0.25s ease-in-out;
        -moz-transition: all 0.25s ease-in-out;
        -ms-transition: all 0.25s ease-in-out;
        -o-transition: all 0.25s ease-in-out;
        transition: all 0.25s ease-in-out;
        opacity: 0;
        padding: 0 16px;
    }
    .nav__menu__item .nav__profile__menu.appear {
        display: block !important;
        opacity: 1;
        right: 0;
        min-height: calc(100vh - 36px);
        height: fit-content;
    }
    .nav__menu__item.dropdown__wrapper {
        position: initial !important;
    }
    .nav__menu ul li {
        padding: 10px 0;
    }
    .nav__profile__switch {
        width: 45px;
        height: 34px;
        position: absolute;
        z-index: 1000;
        right: 16px;
    }
    .nav__profile__switch svg {
        width: 100%;
        fill: #bb2019;
    }
    .switch__role {
        top: 40px;
        right: 0;
        width: 166px;
        padding: 0 !important;
        border-radius: 5px;
        border: 1px solid #E1E4E8;
    }
    .switch__role .nav__profile__menu__code {
        padding: 10px !important;
        font-weight: normal !important;
        color: #53575B;
        font-family: SFProDisplay-Medium, sans-serif;
    }
    .switch__role a {
        padding: 10px !important;
        font-weight: normal !important;
        color: #53575B;
        font-family: SFProDisplay-Light, sans-serif;
    }

    .switch__dropdown ul li a {
        text-align: left !important;
        color: #000;
        display: block !important;
        width: 100% !important;
        height: 100% !important;
    }
}
@media only screen and (min-width: 768px) {
    .nav {
        height: 54.4px;
        width: 100%;
        padding-left: 38.4px !important;
        padding-right: 38.4px !important;
    }
    .nav__menu__item.homepage {
        display: none;
    }
    .nav .row {
        padding: 10.39px 0 !important;
    }
    .nav .row .menu {
        z-index: 99999;
    }
    .nav__menu__item {
        padding: 0 22.39px;
    }
    .nav__menu__item a,
    .nav__menu__item button {
        color: #ffffff;
        font-size: 14.4px;
        line-height: 1.11;
    }
    .nav__menu__item__logo {
        width: 33.6px;
        height: 33.6px;
    }
    .nav__menu__item__logo img {
        width: 20.79px;
    }
    .menu__icon {
        display: none;
    }
    .nav__profile__menu__name {
        font-weight: bold;
        color: #5e6c84 !important;
    }
    .nav__profile__menu ul li a {
        font-size: 12.88px;
        font-weight: lighter;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.75;
    }
    .nav .nav__profile__menu {
        min-width: 180px;
        border-radius: 4px;
        top: 120%;
        right: -30%;
        box-shadow: 2.4px 2.4px 2.4px 0 rgba(96, 14, 96, 0.16);
        padding: 0 !important;
    }
    .nav__menu .nav__profile__menu ul li {
        padding: 0 !important;
    }
    .nav__profile__switch {
        position: relative;
        width: 36px;
        height: 33.792px;
        padding: 0 !important;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .nav__profile__switch svg {
        width: 27.648px;
        height: 27.648px;
        position: absolute;
        fill: white;
    }

    .switch__dropdown ul li,
    .switch__dropdown ul {
        padding: 0 !important;
    }

    .nav__profile__menu ul li {
        padding: 7.68px 15.36px;
        border-bottom: 1.6px solid #e1e4e8;
    }

    .switch__dropdown ul li a {
        text-align: left !important;
        color: #000;
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        padding: 7.68px 15.36px !important;
    }
    .nav__profile__menu ul {
        font-size: 14.4px;
    }
}

/*Banner*/

.banner,
.noImage__banner {
    width: 100%;
    /* height: 165.59px; */
    overflow: hidden;
    margin-bottom: 8px !important;
}

.banner img,
.noImage__banner img {
    max-width: 100%;
    display: block;
    margin: 0 auto;
}

.cbanner {
    width: 100%;
    /* height: 165.59px; */
    overflow: hidden;
}

.cbanner img {
    max-width: 100%;
    display: block;
    margin: 0 auto;
}

.noImage__banner {
    position: relative;
}

.banner__link {
    position: absolute;
    left: 50%;
    top: 10%;
    width: 601.6px;
}

.banner__link a {
    display: block;
    text-decoration: none;
}

.banner__link a:nth-of-type(1) {
    font-size: 25.6px;
    text-transform: uppercase;
    font-family: SFProDisplayBold;
    line-height: 1.2;
    color: #bb2019;
}

.banner__link a:nth-of-type(2) {
    margin-top: 12.88px;
    width: 116.39px;
    height: 33.6px;
    font-size: 16px;
    background-color: #bb2019;
    color: #fff;
    border-radius: 4px;
    text-align: center;
    line-height: 33.6px;
}

/*Profile*/
.profile {
    background-color: #ffffff;
    bottom: 0;
}

.profile__item:not(:first-child) {
    display: flex;
}

.profile__wrapper {
    list-style-type: none;
    padding: 0 !important;
}

.profile__item__img {
    text-align: center;
    vertical-align: middle;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.profile__item__info__title {
    font-family: SFProDisplayMedium;
}

.profile__item__img img {
    width: 100% !important;
    margin: 0 auto;
}

.profile__item__info span {
    /* margin-left: 8px; */
    color: #737679;
}

.profile__greeting {
    opacity: 0.8;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.59;
    letter-spacing: normal;
    text-align: left;
    margin-bottom: 0 !important;
}

.profile__quote {
    opacity: 0.64;
    font-family: SFProDisplay;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.72;
    letter-spacing: normal;
    text-align: left;
}

.profile__item__list {
    list-style-type: none;
}

.profile__item__list__item a {
    color: #bb2019;
}

.profile__item__list__item:hover a {
    text-decoration: none;
}

@media only screen and (max-width: 767px) {

    .profile__greeting {
        color: black;
        font-family: SFProDisplay-SemiBold, sans-serif;
    }

    .profile__quote {
        color: #24292e;
    }

    .profile__wrapper {
        border-bottom: .75px solid #D3D3D3;
    }

    .profile__item__img {
        width: 24px;
        height: 24px;
        border-radius: 3px;
        margin-right: 10px;
    }

    .profile__item__info {
        margin-bottom: 1rem;
    }

    .profile__item__info__title {
        font-family: SFProDisplay-Medium, sans-serif;
        line-height: 24px;
        margin-bottom: 0 !important;
    }

    .profile__item__list {
        margin-top: 0.5rem;
    }

}

@media only screen and (min-width: 768px) {

    .profile {
        width: 349.59px;
        padding: 19.2px 15.2px 0 37.6px;
        font-size: 16px;
        background-color: white;
    }

    .profile__wrapper {
        width: 296.8px;
    }

    .profile__greeting {
        height: 20.79px;
        font-size: 17.6px;
        color: #24292e;
    }

    .profile__quote {
        font-size: 13.51px;
        color: #24292e;
    }

    .profile__item__img {
        width: 22.4px;
        height: 22.4px;
        border-radius: 2.4px;
        margin-right: 8px;
    }

    .profile__item__info {
        width: 259.2px;
    }

    .profile__item__list {
        padding-left: 15.2px !important;
        padding-bottom: 26.4px;
    }

    .profile__item__list__item {
        margin-bottom: 9.6px;
        height: 19.2px;
    }

    .profile__note {
        font-size: 14.4px;
    }

}

/*Ranking*/
.rank__nav__title {
    font-family: SFProDisplay;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}
.rank__top {
    display: flex;
    justify-content: center;
}

.rank__nav {
    width: 100%;
    display: flex;
    justify-content: space-between !important;
    margin-bottom: 12.88px;
}

.rank__nav a {
    display: block;
    width: 85.6px;
    height: 28px;
    color: #fff;
    border-radius: 2.4px;
    background-color: #bb2019;
    font-size: 11.99px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 2.5;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}

.rank__nav__label {
    font-family: SFProDisplay;
    font-size: 16,896px;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
    margin: 7.68px 15.36px !important;
}

.rank__nav__bottom {
    text-align: right;
    margin-bottom: 35.2px;
}

.rank__top__side p,
.rank__top__mid p {
    margin-bottom: 0 !important;
}

.rank__top__side {
    text-align: center;
}

.rank__top__number {
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.64;
    letter-spacing: normal;
    text-align: center;
    color: #f03800;
}

.rank__top__info__name {
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.44;
    letter-spacing: normal;
    text-align: center;
    color: #1b1c1e;
}

.rank__top__info__class {
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.47;
    letter-spacing: normal;
    text-align: center;
    color: #888f9d;
}

.rank__top__info__sub {
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.43;
    letter-spacing: normal;
    text-align: center;
    color: #1b1c1e;
}

.rank__top__result {
    margin: 0 auto;
}

.rank__top__avt {
    position: relative;
    margin: 0 auto;
    overflow: hidden;
}

.rank__top__avt img {
    border-radius: 50%;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    left: 0;
}

.rank__top__result__number {
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    text-align: center;
}

.rank__top__result__des {
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.44;
    letter-spacing: normal;
    text-align: center;
    color: #1b1c1e;
}

.rank .ques__nav__form input {
    background: none !important;
    border: none;
    width: 80%;
}

.rank .ques__nav__form input::-webkit-calendar-picker-indicator {
    display: none;
}


/* RANK 1ST  ======================================*/

.rank__top__mid {
    text-align: center;
    position: relative;
}

.rank__top__mid .rank__top__number img {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    z-index: 99;
}

.rank__top__mid .rank__top__avt {
    border-radius: 50%;
    margin: 0 auto;
    overflow: hidden;
}


/* RANK TABLE ======================================*/

.rank__table {
    border-radius: 4px;
    padding: 0 !important;
}

.rank__table__sub {
    margin-bottom: 0 !important;
}

.rank__table__group {
    margin-bottom: 0 !important;
    color: #888f9d;
}


@media only screen and (max-width: 767px) {
    .rank .rank__nav a {
        display: none;
    }
    .rank .ques__nav__bottom {
        display: initial;
    }

    .rank .custom-select {
        width: 100%;
        height: 40px;
        border-radius: 5px;
        border: solid 1px #d8dee2;
        background-color: #fef9f9;
        padding-left: 10px !important;
        margin-left: 0;
        margin-top: -15px;
    }
    .rank .select-selected {
        line-height: 40px;
    }

    .rank__top {
        column-gap: 15px;
        margin-bottom: 20px;
    }
    .rank__nav__title {
        font-family: SFProDisplay-SemiBold, sans-serif;
        margin-bottom: 10px;
    }

    .rank__top__side,
    .rank__top__mid {
        border-radius: 5px;
        padding: 7px;
        box-shadow: 0 0 15px -3px #939393;
        height: fit-content;
    }

    .rank__top__mid {
        /*border: .75px solid #1B1C1E;*/
        border-top: 2px solid #bb2019;
    }
    .rank__top__side {
        text-align: center;
    }

    .rank__top__number {
        font-size: 8px;
        font-family: SFProDisplay-SemiBold, sans-serif;
    }

    .rank__top__result__des {
        font-size: 6px;
    }
    .rank__top__info__name {
        font-size: 10px;
    }

    .rank__top__info__class {
        font-size: 8px;
        padding-bottom: 0.833vw !important;
    }

    .rank__top__info__sub {
        font-size: 8px;
        font-family: SFProDisplayLight, sans-serif;
    }

    .rank__top__info {
        margin-bottom: 0.729vw;
    }
    .rank__top__side .rank__top__avt {
        width: 24px;
        height: 24px;
        margin-bottom: 0.885vw;
    }
    .rank__top__mid .rank__top__number img {
        width: 12px;
        top: 0.521vw;
        margin-bottom: -1vw;
    }
    .rank__top__mid .rank__top__avt {
        width: 30px;
        height: 30px;
        border: solid 0.156vw #bb2019;
        margin-bottom: 7px;
    }
    .rank__top__mid .rank__top__info {
        margin-bottom: 10px;
    }
    .rank__top__side {
        margin-top: 20px;
    }

}

@media only screen and (min-width: 768px) {


    .rank__top {
        margin-bottom: 35.2px;
    }
    .rank__nav__title {
        font-size: 19.2px;
    }
    .rank__top__side,
    .rank__top__mid {
        border-radius: 4px;
        box-shadow: 0 2.4px 11.99px 0 rgba(147, 147, 147, 0.16);
    }
    .rank__top__mid .rank__top__result__number {
        font-size: 28.8px;
    }

    .rank__top__mid .rank__top__result__des {
        font-size: 12.61px;
    }
    .rank__top__mid .rank__top__info__name {
        font-size: 17.6px;
    }

    .rank__top__mid .rank__top__info__class {
        font-size: 12.88px;
        padding-bottom: 12.88px !important;
    }

    .rank__top__mid.rank__top__info__sub {
        font-size: 12.88px;
    }

    .rank__top__mid .rank__top__info {
        margin-bottom: 11.19px;
    }

    .rank__top__mid {
        width: 214.39px;
        height: 275.2px;
        margin: 0 39.99px;
        border-radius: 4px;
        padding-top: 21.59px;
        padding-bottom: 38.4px;
        border-top: 4.8px solid #bb2019;
    }
    .rank__top__side {
        width: 187.2px;
        height: 246.4px;
        padding-top: 9.6px;
        padding-bottom: 38.4px;
        text-align: center;
        margin-top: 28.8px;
    }
    .rank__top__number {
        font-size: 12.88px;
        margin-bottom: 2.4px;
    }
    .rank__top__mid .rank__top__number img {
        width: 24.23px;
        top: 8px;
        margin-bottom: -15.36px;
    }

    .rank__top__mid .rank__top__avt {
        width: 60.79px;
        height: 60.79px;
        margin-bottom: 13.6px;
        /*border: solid 2.4px #bb2019;*/
    }
    .rank__top__avt {
        width: 52.8px;
        height: 52.8px;
        margin-bottom: 13.6px;
    }

    .rank__top__result__number {
        font-size: 25.6px;
        line-height: 1.1;
    }

    .rank__top__result__des {
        font-size: 11.81px;
        color: #1b1c1e;
    }

    .rank__top__result--left {
        padding-right: 21.59px;
        border-right: 1.6px solid #000;
    }

    .rank__top__result--right {
        padding-left: 21.59px;
    }

    .rank .ques__nav__form input {
        font-size: 12.88px;
    }


    .rank__top__info__name {
        font-size: 14.4px;
    }

    .rank__top__info__class {
        font-size: 11.99px;
        padding-bottom: 12.88px !important;
    }

    .rank__top__info__sub {
        font-size: 11.19px;
    }

    .rank__top__info {
        margin-bottom: 11.19px;
    }

    .rank__table {
        width: 1055.2px !important;
        margin-left: 21.84px;
        margin-bottom: 21.84px;
    }

    .rank__table__head {
        font-size: 16px;
    }

    .rank__table tr td {
        height: 44.55px;
        font-size: 16px;
    }

    .rank__table tr[class^="bg--"] {
        border-bottom: 1px solid grey;
    }

    .rank__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .rank__table tr th:nth-child(1),
    .rank__table tr td:nth-child(1) {
        width: 89.28px;
    }

    .rank__table tr th:nth-child(3),
    .rank__table tr td:nth-child(3) {
        width: 138.24px;
    }

    .rank__table tr th:nth-child(4),
    .rank__table tr td:nth-child(4) {
        width: 92.16px;
    }

    .rank__table tr th:nth-child(6),
    .rank__table tr td:nth-child(6) {
        width: 122.88px;
    }
}

/*Home*/
.new__table__icon {
    display: block;
    background-color: #bb2019;
    color: #fff;
    margin: 0 auto;
}

.link--red {
    color: #bb2019;
    transition: 0.5s ease-in-out;
    border-bottom: 0.768px solid transparent;
}

.link--red:hover {
    color: #bb2019;
    border-bottom: 0.798px solid #bb2019;
}
.admin__studentlist__head {
    background-color: #faeded;
    color: #5e6c84;
}

@media only screen and (max-width: 767px) {
    .wrapper {
        flex-direction: column;
        padding: 0 16px 16px;
    }

    .new {
        position: relative;
        padding-bottom: 16px;
        margin-bottom: 16px;
        border-bottom: .75px solid #D3D3D3;
    }

    .new__nav__title {
        color: #24292E;
        font-family: SFProDisplay-SemiBold, sans-serif;
        opacity: .84;
        line-height: 32px;
    }

    .new__nav {
        margin-bottom: 16px;
    }
    .admin .new__nav {
        margin-top: 56px;
    }
    .new__nav__form {
        display: none;
    }
    .new__nav__right {
        position: absolute;
        right: 0;
        left: 0;
        top: -56px;
        flex-direction: column;
        align-items: flex-end;
        row-gap: 16px;
    }

    .new__nav__right .new__nav__form {
        display: block;
    }
    .new__table tbody tr td:nth-child(3) {
        text-align: left;
        max-width: 100px;
    }
    .new__table tbody tr td:nth-child(4) {
        max-width: 250px;
    }
    .new__table tbody tr td:nth-child(4) a {
        color: black;
    }
    .new__table tbody tr td:nth-child(5) {
        max-width: 200px;
    }
    .new__table tbody tr td:nth-child(6) {
        max-width: 150px;
    }
    .new__table__group {
        margin: 0;
        color: #888F9D;
        line-height: 16px
    }
    .admin__studentlist__btn--active,
    .admin__studentlist__btn--disable {
        display: block;
        margin: 0 auto;
        padding: 0 5px;
        border-radius: 3px;
        border: solid 1px #159714;
        background-color: #ffffff;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.8;
        letter-spacing: normal;
        text-align: center;
        color: #159714;
    }

    .admin__studentlist__btn--disable {
        border: solid 1px #bb2019;
        color: #bb2019;
    }

}

@media only screen and (min-width: 768px) {

    .main {
        width: 1137.6px;
        margin: 0 31.19px 0 17.6px;
        padding: 28px 42.39px 48.79px 19.2px;
        background-color: #FFFFFF;
    }

    .new {
        margin-bottom: 35.2px;
    }

    .new__nav__title {
        font-size: 19.2px;
    }

    .new__nav {
        margin-bottom: 35.2px;
    }

    .new__nav a {
        display: block;
        width: 85.6px;
        height: 28px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.5;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
        margin-left: 12.88px;
    }

    .new__nav__form {
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #FAEDED;
        width: 273.6px;
        height: 28px;
        display: flex;
        justify-content: space-between;
        /* padding: 7.2px 6.4px 0 8.8px; */
        padding-left: 8.8px;
        vertical-align: middle;
    }

    .new__nav__form input[type="text"] {
        background: none;
        border: none;
        font-size: 11.99px;
        width: 80%;
    }

    .new__nav__form input[type="text"]:focus {
        outline: none;
    }

    .new__nav__form input[type="submit"] {
        width: 19.99px;
        height: 19.99px;
        font-size: 9.6px;
        background: none;
        border-radius: 2.4px;
        border: solid 1.6px #bb2019;
        margin: auto 6.4px auto 0;
        color: #bb2019 !important;
    }


    .new__table {
        width: 1055.2px !important;
        border-radius: 4px;
        padding: 0 !important;
        margin-left: 21.84px;
    }

    .new__table__head {
        font-size: 16px;
    }

    .new__table__head th {
        height: 54.4px !important;
    }

    .new__table tr td {
        height: 44.55px;
        font-size: 16px;
        border-bottom: solid 1.6px #e1e4e8;
    }

    .new__table tr th:nth-child(3),
    .new__table tr td:nth-child(3) {
        width: 166.08px;
    }

    .new__table tr th:nth-child(4),
    .new__table tr td:nth-child(4) {
        padding-left: 30.72px;
    }
    .new__table__icon {
        width: 24px;
        height: 24px;
        border-radius: 2.4px;
        font-size: 11.99px;
        line-height: 24px;
    }
    .new__table__group {
        display: none;
    }
    .admin__studentlist {
        width: 1055.2px !important;
        border-radius: 4px;
        padding: 0 !important;
        margin-left: 21.84px;
        margin-bottom: 21.84px;
    }

    .admin__studentlist__head {
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        height: 54.4px !important;
    }

    .admin__studentlist tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .admin__studentlist tr th:nth-child(1),
    .admin__studentlist tr td:nth-child(1) {
        width: 92.16px;
    }

    .admin__studentlist tr th:nth-child(2),
    .admin__studentlist tr td:nth-child(2) {
        width: 122.88px;
    }

    .admin__studentlist tr th:nth-child(3),
    .admin__studentlist tr td:nth-child(3) {
        width: 138.24px;
    }

    .admin__studentlist tr th:nth-child(4),
    .admin__studentlist tr td:nth-child(4) {
        width: 76.8px;
    }

    .admin__studentlist tr th:nth-child(5),
    .admin__studentlist tr td:nth-child(5) {
        width: 230.4px;
    }

    .admin__studentlist tr th:nth-child(6),
    .admin__studentlist tr td:nth-child(6) {
        width: 122.88px;
    }

    .admin__studentlist tr th:nth-child(7),
    .admin__studentlist tr td:nth-child(7) {
        width: 107.52px;
    }

    .admin__studentlist tr th:nth-child(8),
    .admin__studentlist tr td:nth-child(8) {
        width: 122.88px;
    }

    .admin__studentlist tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        vertical-align: top;
        padding-top: 7.68px;
    }

    .admin__studentlist__btn--active,
    .admin__studentlist__btn--disable {
        display: block;
        margin: 0 auto;
        width: 107.99px;
        height: 25.6px;
        border-radius: 4px;
        border: solid 1.6px #159714;
        background-color: #ffffff;
        font-size: 12.88px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.8;
        letter-spacing: normal;
        text-align: center;
        color: #159714;
    }

    .admin__studentlist__btn--active:hover,
    .admin__studentlist__btn--disable:hover {
        text-decoration: none;
    }

    .admin__studentlist__btn--active:hover {
        color: #159714;
    }

    .admin__studentlist__btn--disable:hover {
        color: #bb2019;
    }

    .admin__studentlist__btn--disable {
        border: solid 1.6px #bb2019;
        color: #bb2019;
    }
}

/*05Best*/
.bestsol {
    background-color: #ffffff;
}

.bestsol__nav p {
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}

.admin__status__nav__title {
    font-family: SFProDisplayBold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}

@media only screen and (max-width: 768px){
    .bestsol {
        padding: 0;
    }

    .status__nav p {
        margin-bottom: 15px !important;
    }

    .admin__status__nav__top {
        display: inline-flex;
        flex-direction: column;
        margin-bottom: 15px !important;
    }
}

@media only screen and (min-width: 768px){

    .admin__status__nav__title {
        font-family: SFProDisplay;
        font-size: 19.2px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: left;
        color: #1b1c1e;
    }

    .bestsol {
        width: 1177.6px;
        margin: 30.39px auto 0;
        padding: 25.6px 39.19px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
    }

    .bestsol__nav p {
        font-size: 19.2px;
        margin-bottom: 24px !important;
    }

    .bestsol__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .bestsol__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .bestsol__table {
        width: 97%;
        margin: 0 auto;
        border-radius: 4px;
        margin-bottom: 21.84px;
    }

    .bestsol__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .bestsol__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .bestsol__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .bestsol__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .bestsol__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .bestsol__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }

    .bestsol__table tr th:nth-child(1),
    .bestsol__table tr td:nth-child(1) {
        padding-right: 7.68px;
    }

    .bestsol__table tr th:nth-child(2),
    .bestsol__table tr td:nth-child(2) {
        width: 120px;
    }

    .bestsol__table tr th:nth-child(3),
    .bestsol__table tr td:nth-child(3) {
        width: 238.72px;
    }

    .bestsol__table tr th:nth-child(4),
    .bestsol__table tr td:nth-child(4) {
        width: 152.64px;
    }

    .bestsol__table tr th:nth-child(5),
    .bestsol__table tr td:nth-child(5) {
        width: 112px;
    }

    .bestsol__table tr th:nth-child(6),
    .main__user__history__table tr td:nth-child(6) {
        width: 144px;
    }
}

/*05DeBai*/

.admin__ques__nav__top>div {
    display: flex;
}
@media only screen and (min-width: 767px) {
    .main--fluid {
        width: 100%;
    }

    .ques {
        width: 1137.6px;
        margin: 30.39px auto 35.2px;
        padding: 25.6px 19.2px 49.92px 19.2px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #fff;
    }

    .ques__nav {
        width: 100%;
        margin-bottom: 19.84px;
    }

    .ques__nav__top {
        display: flex;
        justify-content: space-between;
    }

    .ques__nav__bottom {
        text-align: right;
        margin-top: 12.88px;
    }

    .ques__nav__title {
        font-family: SFProDisplay;
        font-size: 19.2px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: left;
        color: #1b1c1e;
    }

    .ques__nav__form {
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #FAEDED;
        width: 273.6px;
        height: 28px;
        display: flex;
        justify-content: space-between;
        /* padding: 7.2px 6.4px 0 8.8px; */
        padding-left: 8.8px;
        vertical-align: middle;
    }

    .ques__nav__form input[type="text"] {
        background: none;
        border: none;
        font-size: 11.99px;
        width: 80%;
    }

    .ques__nav__form input[type="text"]:focus {
        outline: none;
    }

    .ques__nav__form input[type="submit"] {
        width: 19.99px;
        height: 19.99px;
        font-size: 9.6px;
        background: none;
        border-radius: 2.4px;
        border: solid 1.6px #bb2019;
        margin: auto 0;
        margin-right: 6.405px;
        color: #bb2019 !important;
    }

    .ques__nav__form button {
        display: none;
    }

    .ques__table {
        width: 97% !important;
        border-radius: 4px;
        padding: 0 !important;
        /* margin-left: 21.84px; */
        margin-bottom: 21.84px;
    }

    .ques__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
    }

    .ques__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .ques__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .ques__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .ques__table tr th:nth-child(3),
    .ques__table tr td:nth-child(3) {
        width: 166.08px;
    }

    .ques__table tr th:nth-child(4),
    .ques__table tr td:nth-child(4) {
        padding-left: 30.72px;
    }

    .ques__table tr th:nth-child(6),
    .ques__table tr td:nth-child(6) {
        width: 153.6px;
    }

    .ques__table tr th:nth-child(7),
    .ques__table tr td:nth-child(7) {
        width: 153.6px;
    }

    .ques__table tr th:nth-child(8),
    .ques__table tr td:nth-child(8) {
        width: 92.16px;
    }

    .ques__table tr {
        margin: 0 18px !important;
    }

    .ques__table__icon {
        display: block;
        width: 24px;
        height: 24px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        color: #fff;
        line-height: 24px;
        margin: 0 auto;
    }

    .select__subject {
        width: 85.6px !important;
    }

    .select__group {
        width: 92.16px !important;
    }

    .select__term {
        width: 153.6px !important;
    }

    .admin__ques {
        width: 1137.6px;
        padding: 25.6px 19.2px 49.92px 19.2px;
        margin: 30.39px auto 35.2px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #fff;
    }

    .admin__ques__nav {
        width: 100%;
        margin-bottom: 19.84px;
    }

    .admin__ques__nav__top>div button {
        margin-left: 12.88px;
    }

    .admin__ques__nav__top>div form {
        margin-right: 19.2px;
    }

    .admin__ques__nav__title {
        font-family: SFProDisplayBold;
        font-size: 19.2px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: left;
        color: #1b1c1e;
    }

    .admin__ques__nav button {
        outline: none;
        border: none;
        display: block;
        width: 85.6px;
        height: 28px;
        color: #fff;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        /* line-height: 2.5; */
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }

    .admin__ques__nav a {
        display: block;
        width: 85.6px;
        height: 28px;
        color: #fff;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.5;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }

    .admin__ques__nav a:hover {
        text-decoration: none;
    }

    .admin__ques__nav__top {
        display: flex;
        justify-content: space-between;
    }

    .admin__ques__nav__bottom {
        text-align: right;
        margin-top: 12.88px;
    }

    .admin__ques__nav__title {
        font-family: SFProDisplay;
        font-size: 19.2px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: left;
        color: #1b1c1e;
    }

    .admin__ques__nav__form {
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #FAEDED;
        width: 273.6px;
        height: 28px;
        display: flex;
        justify-content: space-between;
        /* padding: 7.2px 6.4px 0 8.8px; */
        padding-left: 8.8px;
        vertical-align: middle;
    }

    .admin__ques__nav__form button {
        display: none;
    }

    .admin__ques__nav__form input[type="text"] {
        background: none;
        border: none;
        font-size: 11.99px;
        width: 80%;
    }

    .admin__ques__nav__form input[type="text"]:focus {
        outline: none;
    }

    .admin__ques__nav__form input[type="submit"] {
        width: 19.99px;
        height: 19.99px;
        font-size: 9.6px;
        background: none;
        border-radius: 2.4px;
        border: solid 1.6px #bb2019;
        margin: auto 0;
        margin-right: 6.405px;
        color: #bb2019;
    }

    .admin__ques__table {
        width: 97% !important;
        border-radius: 4px;
        padding: 0 !important;
        /* margin-left: 21.84px; */
        margin-bottom: 21.84px;
    }

    .admin__ques__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .admin__ques__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .admin__ques__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .admin__ques__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
    }

    .admin__ques__table tr th:nth-child(1),
    .admin__ques__table tr td:nth-child(1) {
        width: 76.8px;
    }

    .admin__ques__table tr th:nth-child(2),
    .admin__ques__table tr td:nth-child(2) {
        width: 138.24px;
    }

    .admin__ques__table tr th:nth-child(3),
    .admin__ques__table tr td:nth-child(3) {
        width: 184.32px;
    }

    .admin__ques__table tr th:nth-child(4),
    .admin__ques__table tr td:nth-child(4) {
        width: 122.88px;
    }

    .admin__ques__table tr th:nth-child(5),
    .admin__ques__table tr td:nth-child(5) {
        width: 153.6px;
    }

    .admin__ques__table tr th:nth-child(6),
    .admin__ques__table tr td:nth-child(6) {
        width: 153.6px;
    }

    .admin__ques__table tr th:nth-child(7),
    .admin__ques__table tr td:nth-child(7) {
        width: 122.88px;
    }

    .admin__ques__table tr {
        margin: 0 18px !important;
    }

    .admin__ques__table__icon {
        display: block;
        width: 24px;
        height: 24px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        color: #fff;
        line-height: 24px;
        margin: 0 auto;
    }

    .admin__ques__dropdown ul::before {
        right: 5%;
    }

    .admin__ques__dropdown {
        right: 40%;
        min-width: 122.88px !important;
        top: 100% !important;
        box-shadow: 2.4px 2.4px 2.4px 2.4px rgba(96, 14, 96, 0.16);
    }

    .admin__ques__dropdown ul li {
        white-space: nowrap;
        font-size: 12.88px !important;
        padding: 4.8px 26.4px !important;
        text-align: center;
        color: #000 !important;
    }

    .admin__ques__dropdown ul li a {
        color: #000 !important;
    }

    .admin__ques__table .nav__profile__menu ul li,
    .admin__ques__table .nav__profile__menu ul {
        padding: 0 !important;
    }

    .admin__ques__table .nav__profile__menu ul li span {
        text-align: center !important;
        color: #000;
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        padding: 3.072px 15.36px !important;
    }

    .admin__ques__table .nav__profile__menu ul li a {
        text-align: center !important;
        color: #000;
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        padding: 3.072px 15.36px !important;
    }
}


@media only screen and (max-width: 767px) {

    .ques,
    .admin__ques {
        background-color: #fff;
    }

    .ques__nav,
    .admin__ques__nav {
        width: 100%;
        margin-bottom: 16px;
    }

    .ques__nav__top {
        justify-content: space-between;
    }

    .ques .ques__nav__top {
        margin-bottom: 16px;
    }

    .custom__nav__select {
        display: grid;
    }

    .ques__nav__title,
    .admin__ques__nav__title {
        display: none;
    }

    .ques__table tr td {
        height: 44.55px;
        font-size: 15px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
    }

    .ques__table tr th:nth-child(3),
    .ques__table tr td:nth-child(3) {
        /* width: 166.08px; */
    }

    .ques__table tr th:nth-child(4),
    .ques__table tr td:nth-child(4) {
        padding-left: 30.72px;
    }

    .ques__table tr th:nth-child(6),
    .ques__table tr td:nth-child(6) {
        /* width: 153.6px; */
    }

    .ques__table tr th:nth-child(7),
    .ques__table tr td:nth-child(7) {
        /* width: 153.6px; */
    }

    .ques__table tr th:nth-child(8),
    .ques__table tr td:nth-child(8) {
        width: 92.16px;
    }

    .ques__table tr {
        margin: 0 18px !important;
    }

    .ques__table__icon {
        display: block;
        width: 46.08px;
        height: 46.08px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 30.72px;
        color: #fff;
        margin: 0 auto;
    }

    .admin__ques__nav__top {
        margin-bottom: 16px;
    }

    .admin__ques__nav__top > div {
        row-gap: 16px;
        flex-direction: column;
        align-items: flex-end;
    }

    .admin__ques .ques__nav__bottom,
    .contestlist .ques__nav__bottom,
    .ques .ques__nav__bottom {
        display: initial;
    }

    .ques .custom-select,
    .contestlist .custom-select,
    .admin__ques .custom-select {
        width: 100%;
        height: 40px;
        border-radius: 5px;
        border: solid 1px #d8dee2;
        background-color: #fef9f9;
        padding-left: 10px !important;
        margin: 0;
    }

    .ques .custom-select:first-child,
    .contestlist .custom-select:first-child,
    .admin__ques .custom-select:first-child {
        z-index: 1000;
    }

    .ques .custom__nav__select,
    .contestlist .custom__nav__select,
    .admin__ques .custom__nav__select {
        margin-top: 0;
        gap: 10px;
    }
    .ques .select-selected,
    .contestlist .select-selected,
    .admin__ques .select-selected {
        line-height: 40px;
    }

    .admin__ques__table .nav__profile__menu {
        min-width: 100px;
        border-radius: 3px;
        top: -35px;
        right: 100%;
        box-shadow: 2px 2px 2px 0 rgba(96, 14, 96, 0.16);
        padding: 0 !important;
    }
    .admin__ques__table .nav__profile__menu ul li {
        padding: 2px 10px;
        border-bottom: 1px solid #e1e4e8;
        text-align: center;
        color: black;
    }

}

/*05Submit*/
/* SUBMIT WORK ============================================================ */
.submit__pad__nav__input input {
    display: none !important;
}
.contest__submit,
.student__submit,
.teacher__submit {
    background-color: #FEF9F9 !important;
}
.submit__des__val {
    color: #bb2019;
    font-weight: 600;
}

.submit__des__val--ac {
    color: #bb2019;
    font-weight: normal !important;
}
@media only screen and (min-width: 767px) {
    .submit {
        margin: 30.39px auto;
        width: 984px;
        border-radius: 4px;
        background-color: #FEF9F9;
        padding: 25.6px 43.2px 104.8px 43.2px;
    }
    .submit__pad__nav div {
        padding: 0 !important;
    }


    .submit__nav {
        display: flex;
        justify-content: space-between;
    }

    .submit__nav__left {
        display: flex;
        vertical-align: middle;
    }

    .submit__nav__left a {
        margin-right: 19.2px;
    }

    .submit__nav p {
        font-size: 19.2px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.96;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
        margin-bottom: 0 !important;
    }

    .submit__nav a {
        height: 19.2px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: center;
        color: #bb2019;
    }

    .submit__req {
        font-size: 14.4px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.56;
        letter-spacing: normal;
        text-align: left;
        color: #5e6c84;
        margin-bottom: 31.99px;
    }

    .submit__req p {
        margin-bottom: 0 !important;
    }

    .submit__pad__nav {
        display: flex;
        justify-content: space-between;
        vertical-align: middle;
    }

    .submit__pad__nav>div {
        width: 50%;
        display: flex;
    }

    .submit__pad__nav__input {
        position: relative;
    }

    .submit__pad__nav__input input {
        position: absolute !important;
        right: 0;
        top: 20%;
    }
    .submit__des {
        width: 897.6px;
        font-family: SFProDisplayMedium;
        margin: 0 auto 11.19px;
        background-color: #fff;
        padding: 21.59px 25.6px;
        font-size: 16px;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.85;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
    }

    .submit__des p {
        margin-bottom: 1.536px !important;
    }

    .submit__des table {
        margin-left: 0 !important;
    }

    .submit__des__title {
        width: 92.16px;
        margin-right: 3.19px;
    }

    .submit__pad__main {
        position: relative;
        width: 897.6px;
        height: 253.59px;
        margin: 22.4px 0 22.31px 0;
    }

    .submit__pad__nav p {
        margin-bottom: 0 !important;
        font-size: 19.2px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.96;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
    }

    .submit__pad__nav .custom-select {
        width: 152px !important;
        height: 39.19px !important;
        border-radius: 4px;
        border: solid 1.6px #d8dee2;
        background-color: #fef9f9;
    }

    .submit__pad__nav .select-items div,
    .submit__pad__nav .select-selected {
        font-size: 14.4px;
    }

    .submit__pad__nav .select-selected {
        margin-top: 3.072px;
    }

    .ace_editor,
    .ace_editor * {
        font-family: "Monaco", "Menlo", "Ubuntu Mono", "Droid Sans Mono", "Consolas", monospace !important;
        font-size: 12.88px !important;
        font-weight: 400 !important;
        letter-spacing: 0 !important;
    }

    .submit__pad__error {
        padding: 16px 6.4px;
        border-radius: 4px;
        background-color: #F3D6D5;
        margin-bottom: 24px;
    }

    .submit__pad__error p {
        font-size: 16px;
        margin-bottom: 0 !important;
    }

    .submit__pad__btn {
        width: 154.32px;
        height: 37.35px;
        background-color: #bb2019;
        font-size: 16px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.4;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
        border: none;
        border-radius: 4px;
        margin-left: calc(100% - 154.32px);
        margin-top: 22.24px;
    }
    .fileInput__label {
        /* display: block !important; */
        width: 100% !important;
        display: flex !important;
        justify-content: space-between !important;
    }

    .fileInput__value {
        display: block;
        width: 357.59px;
        height: 29.59px;
        border-radius: 4px;
        border: solid 1.6px #dfe1e6;
        background-color: #ffffff;
        font-size: 11.19px !important;
        padding: 5.729px 6.4px !important;
        font-weight: normal !important;
        font-stretch: normal !important;
        font-style: normal !important;
        line-height: 1.5 !important;
        letter-spacing: normal !important;
        text-align: left !important;
        color: #707070 !important;
        margin-right: 12.88px !important;
    }

    .fileInput__browser {
        font-size: 14px !important;
        font-weight: normal !important;
        font-stretch: normal !important;
        font-style: normal !important;
        line-height: 29.6px !important;
        letter-spacing: normal !important;
        text-align: right !important;
        color: #bb2019 !important;
        border-radius: 0.26vw;
        background-color: #FAEEED;
        padding: 0 15px;
        margin: 0 !important;
        height: 29.6px;
    }

    .submit__comm {
        margin-top: 31.51px;
    }

    .submit__comm__nav__title {
        font-size: 19.2px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.96;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
        margin-bottom: 0 !important;
    }

    .submit__comm__nav__des {
        font-size: 14.4px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
    }

    #submit__comm__textarea {
        width: 897.6px;
        height: 167.19px;
        resize: none;
        padding: 14.4px;
        transition: 0.2s ease-in;
    }

    #submit__comm__textarea::placeholder {
        font-size: 15.97px;
    }

    #submit__comm__textarea:focus {
        outline: none;
        height: 215.4px !important;
    }

    .submit__comm__list {
        /* width: 897.6px; */
        border-radius: 4px;
        background-color: #ffffff;
        padding: 48px 51.99px;
        margin-top: 32.39px;
        position: relative;
    }

    .submit__comm__stick {
        position: absolute;
        width: 1.6px;
        background-color: #e1e4e8;
        top: 79.36px;
        bottom: 140.8px;
        left: 78.39px;
    }

    .submit__comm__list__item {
        display: flex;
        justify-content: space-between;
        padding-top: 7.68px;
        padding-bottom: 7.68px;
    }

    .submit__comm__list__item__avt {
        width: 52.8px !important;
        height: 52.8px !important;
        border-radius: 50%;
        z-index: 99;
    }

    .submit__comm__list__item__avt img {
        width: 100%;
    }

    .submit__comm__list__item__content__nav {
        display: flex;
        justify-content: space-between;
    }

    .submit__comm__list__item__content {
        width: 703.99px;
        border-bottom: 1.6px solid #e1e4e8;
        font-size: 16px;
    }

    .submit__comm__list__item:last-of-type .submit__comm__list__item__content {
        border: none;
    }

    .submit__comm__list__item__vote {
        text-align: center;
        width: 46.08px;
        padding-top: 8px;
    }

    .submit__comm__list__item__vote button {
        background: none;
        outline: none;
        border: none;
        width: 14.4px;
        height: 14.4px;
        display: block;
        margin: 0 auto;
        margin-bottom: 6.405px;
        padding: 0;
    }

    .submit__comm__list__item__vote button img {
        width: 100%;
    }

    .submit__comm__list__item__content__nav__vote__info {
        margin-left: 12.88px;
    }

    .submit__comm__list__item__content__nav__vote__info img {
        margin-right: 40px;
    }

    .submit__comm__list__item__content__nav__name {
        font-size: 16px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.2;
        letter-spacing: normal;
        text-align: left;
        color: #bb2019;
        display: flex;
    }

    .submit__comm__list__item__content__nav__name p {
        margin-right: 12.88px;
    }

    .submit__comm__list__item__content__nav__time__wrapper {
        display: flex;
    }

    .submit__comm__list__item__content__nav__time {
        font-size: 14.4px;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 2;
        letter-spacing: normal;
        text-align: center;
        color: #bb2019;
    }
}

@media only screen and (max-width: 767px) {
    .submit__pad__nav div {
        padding: auto !important;
    }

    .submit {
        margin: 0;
        width: calc(100vw - 32px);
        border-radius: 8px;
        /* background-color: #FEF9F9; */
        /* padding: 1.667vw 2.813vw 6.823vw 2.813vw; */
        background-color: #FEF9F9;
    }

    .submit__des__title {
        width: 6vw;
        margin-right: 0.208vw;
    }

    .submit__nav {
        display: flex;
        justify-content: space-between;
        background-color: transparent;
        padding: 10px 0;
    }

    .submit__nav a {
        width: unset !important;
    }

    .submit__nav__left {
        display: flex;
        vertical-align: middle;
    }

    .submit__nav__left div {
        /*display: none;*/
    }

    .submit__nav__left a {
        margin-right: 1.25vw;
    }

    .submit__nav p {
        font-size: 4vw;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.96;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
        margin-bottom: 0 !important;
    }

    .submit__nav a {
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 29px;
        letter-spacing: normal;
        text-align: center;
        color: #bb2019;
    }

    .submit__des {
        font-family: SFProDisplayMedium;
        background-color: #fff;
        padding: 12px 15px;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.85;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
        border-radius: 5px;
        border: 1px solid #d8dee2;
        margin: 0 0 10px;
    }

    .submit__des p {
        margin-bottom: 0.1vw !important;
    }

    .submit__des table {
        margin-left: 0 !important;
        width: 100% !important;
    }

    .submit__req {
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.56;
        letter-spacing: normal;
        text-align: left;
        color: #5e6c84;
        padding: 0 15px 15px;
        border-bottom: 0.75px solid #D3D3D3;
        margin-bottom: 15px;
    }

    .submit__req p {
        margin-bottom: 0 !important;
    }

    .submit__pad {
        padding: 15px 0;
        border-bottom: solid 0.75px #D3D3D3;
    }

    .submit__pad__nav {
        /* display: flex; */
        /* display: grid; */
        justify-content: space-between;
        vertical-align: middle;
        margin-left: 0;
        margin-right: 0;
    }

    .submit__pad__nav>div {
        /* width: 98vw; */
        display: flex;
        justify-content: space-between;
        padding-left: 0px;
        padding-right: 0px;
    }

    .submit__pad__nav__input {
        position: relative;
        margin: 15px 0;
    }

    .submit__pad__nav__input input {
        position: absolute !important;
        right: 0;
        top: 20%;
    }

    .fileInput__label {
        /* display: block !important; */
        width: 100% !important;
        height: 8vw;
        display: flex !important;
        justify-content: space-between !important;
    }

    .fileInput__value {
        display: block;
        width: 100%;
        height: 38px;
        border-radius: 5px;
        border: solid 1px #dfe1e6;
        background-color: #ffffff;
        padding: 0.373vw 1.5vw !important;
        font-weight: normal !important;
        font-stretch: normal !important;
        font-style: normal !important;
        line-height: 32px !important;
        letter-spacing: normal !important;
        text-align: left !important;
        color: #707070 !important;
    }

    .fileInput__browser {
        font-weight: normal !important;
        font-stretch: normal !important;
        font-style: normal !important;
        line-height: 32px !important;
        letter-spacing: normal !important;
        text-align: right !important;
        color: #bb2019 !important;
        position: absolute;
        top: 3px;
        right: 10px;
    }

    .submit__pad__nav__input input {
        display: none !important;
    }

    .submit__pad__nav p {
        margin-bottom: 0 !important;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 40px;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
    }

    .submit__pad__nav .custom-select {
        width: 150px;
        height: 40px;
        border-radius: 5px;
        border: solid 1px #d8dee2;
        background-color: #fef9f9;
    }

    .submit__pad__nav .select-selected {
        /* margin-top: 0; */
    }

    .custom-select {
        display: flex;
    }

    .submit__pad__main {
        position: relative;
        /* width: 93vw; */
        height: 60vw;
        margin: 1.458vw 0 1.453vw 0;
    }

    .ace_editor,
    .ace_editor * {
        font-family: "Monaco", "Menlo", "Ubuntu Mono", "Droid Sans Mono", "Consolas", monospace !important;
        font-size: 3vw !important;
        font-weight: 400 !important;
        letter-spacing: 0 !important;
    }

    .submit__pad__error {
        padding: 1.042vw 0.417vw;
        border-radius: 0.260vw;
        background-color: #F3D6D5;
        margin-bottom: 1.563vw;
    }

    .submit__pad__error p {
        margin-bottom: 0 !important;
    }

    .submit__pad__btn {
        width: 145px;
        height: 40px;
        font-family: SFProDisplayMedium;
        background-color: #bb2019;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.4;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
        border: none;
        border-radius: 4px;
        margin: 15px calc(50% - 72.5px);
    }

    .submit__comm {
        margin-top: 2.052vw;
        margin-left: 3vw;
        margin-right: 3vw;
    }

    .submit__comm__nav__title {
        font-size: 4vw;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.96;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
        margin-bottom: 0 !important;
    }

    .submit__comm__nav__des {
        font-size: 4vw;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: left;
        color: #9E9E9E;
    }

    #submit__comm__textarea {
        width: 100%;
        height: 30vw;
        resize: none;
        padding: 5px 10px;
        transition: 0.2s ease-in;
        border-radius: 5px;
        border: 1px solid #D8DEE2;
    }

    #submit__comm__textarea::placeholder {
        font-size: 4vw;
    }

    #submit__comm__textarea:focus {
        outline: none;
        height: 30vw !important;
    }

    .submit__comm__list {
        /* width: 58.438vw; */
        border-radius: 0.260vw;
        /* background-color: #ffffff; */
        /*padding: 3.125vw 3.385vw;*/
        margin-top: 2.109vw;
        position: relative;
    }

    .submit__comm__stick {
        position: absolute;
        width: 0.104vw;
        background-color: #e1e4e8;
        top: 5.167vw;
        bottom: 9.167vw;
        left: 13px;
    }

    .submit__comm__list__item {
        display: flex;
        justify-content: space-between;
        padding-top: 0.5vw;
        padding-bottom: 0.5vw;
    }

    .submit__comm__list__item__avt {
        width: 6.438vw !important;
        height: 3.438vw !important;
        border-radius: 50%;
        z-index: 99;
    }

    .submit__comm__list__item__avt img {
        width: 100%;
    }

    .submit__comm__list__item__content__nav {
        display: flex;
        justify-content: space-between;
        margin-top: 2vw;
    }

    .submit__comm__list__item__content {
        width: 75vw;
        font-size: 3.042vw;
    }

    .submit__comm__list__item:last-of-type .submit__comm__list__item__content {
        border: none;
    }

    .submit__comm__list__item__vote {
        text-align: center;
        width: 3vw;
        padding-top: 0.521vw;
        display: none;
    }

    .submit__comm__list__item__vote button {
        background: none;
        outline: none;
        border: none;
        width: 0.938vw;
        height: 0.938vw;
        display: block;
        margin: 0 auto;
        margin-bottom: 0.417vw;
        padding: 0;
    }

    .submit__comm__list__item__vote button img {
        width: 100%;
    }

    .submit__comm__list__item__content__nav__vote__info {
        margin-left: 0.833vw;
        display: none;
    }

    .submit__comm__list__item__content__nav__vote__info img {
        margin-right: 2.604vw;
    }

    .submit__comm__list__item__content__nav__name {
        font-size: 3.042vw;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.2;
        letter-spacing: normal;
        text-align: left;
        color: #bb2019;
        display: flex;
    }

    .submit__comm__list__item__content__nav__name p {
        margin-right: 0.833vw;
    }

    .submit__comm__list__item__content__nav__time__wrapper {
        display: flex;
    }

    .submit__comm__list__item__content__nav__time {
        font-size: 2.938vw;
        font-weight: 300;
        font-stretch: normal;
        font-style: normal;
        /* line-height: 2; */
        letter-spacing: normal;
        text-align: center;
        color: #bb2019;
    }

    .classlist__action__btn {
        background-repeat: no-repeat !important;
        background-size: contain !important;
        background-image: url('../images/Component 67 – 16.png') !important;
        vertical-align: middle;
        border: none;
        border-radius: 0.104vw !important;
        width: 30px;
        height: 35px;
    }

    .admin__submit__dropdown {
        position: absolute;
        width: 160px;
        top: 40px;
        right: 0;
        background-color: white;
        box-shadow: 2px 2px 2px 2px rgba(96, 14, 96, 0.16);
    }

    .admin__submit__dropdown>ul{
        list-style: none;
    }

    .admin__submit__dropdown ul li {
        border: none !important;
        font-size: 14px;
        text-align: center;
        color: #000;
        border-bottom: solid 1px #dfe1e6 !important;
    }

    .admin__submit__dropdown ul li:first-child {
        padding-top: 10px;
    }
    .submit {
        background-color: transparent;
    }
    .submit__des__title {
        width: 20vw !important;
        margin-right: 0.208vw;
    }

    .submit__nav {
        padding-bottom: 0;
    }

    .submit__nav p{
        font-family: SFProDisplay-SemiBold, sans-serif !important;
    }

    .submit__pad {
        padding-top: 0;
        border: none;
    }

    .submit__pad form{
        position: relative;
    }

    .submit__pad__nav p {
        font-family: SFProDisplay-SemiBold, sans-serif;
        line-height: 30px;
    }

    .contest__submit .submit__des,
    .student__submit .submit__des,
    .teacher__submit .submit__des {
        display: block;
    }

    .contest__submit {
        margin-left: 16px;
    }

    .contest__submit .submit__req,
    .student__submit .submit__req,
    .teacher__submit .submit__req {
        margin-bottom: 16px;
    }

    .contest__submit .submit__pad__nav p,
    .student__submit .submit__pad__nav p,
    .teacher__submit .submit__pad__nav p {
        font-size: 16px;
        padding-left: 15px;
        font-family: SFProDisplay, sans-serif;
    }

    .contest__submit .submit__pad__main,
    .teacher__submit .submit__pad__main,
    .student__submit .submit__pad__main,
    .teacher__anticopy .submit__pad__main {
        position: relative;
        top: unset;
    }
    .teacher__anticopy .submit__des {
        position: relative;
        display: block;
        margin: 0;
        border: 1px solid #D8DEE2;
    }
    .teacher__anticopy .compare__nav {
        display: flex;
        justify-content: space-between;
    }
    .teacher__anticopy .ques__nav__title {
        display: initial;
        font-family: SFProDisplay-SemiBold, sans-serif;
    }
    .teacher__submit .submit__nav,
    .student__submit .submit__nav {
        padding-left: 15px;
        padding-right: 15px;
    }
    .teacher__submit.submit a.link--red {
        line-height: 30px;
    }
    .teacher__submit .submit__pad__btn,
    .student__submit .submit__pad__btn {
        margin-left: 33.333%;
    }

    .teacher__submit .submit__pad form,
    .student__submit .submit__pad form {
        padding-left: 15px;
        padding-right: 15px;
    }

    .submit__pad__main {
        /*position: absolute;*/
        /*left: 0;*/
        /*right: 0;*/
        /*top: 60px;*/
        height: calc(100vh - 255px);
    }

    .submit__pad__btn {
        margin-left: 0;
        margin-top: 10px;
    }
}

/*Profile*/
.main__user {
    background-color: #fff;
    bottom: 0 !important;
    position: relative;
}
.main__user>ul {
    display: flex;
    list-style-type: none;
    padding-left: 15.6px !important;
    border-bottom: solid 1.6px #e1e4e8;
}

.main__user>ul li {
    width: 107.19px;
    text-align: center;
    padding-bottom: 13.19px;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    text-align: center;
    color: #1f1f1f;
}

.main__user__content__blank {
    width: 353.67px;
    margin: 0 auto;
}

.main__user__content__blank img {
    width: 100%;
}

.main__user__nav {}

.main__user__nav ul {
    padding-left: 0 !important;
    margin-bottom: 0 !important;
}

.main__user__nav ul li a {
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    text-align: center;
    color: #1f1f1f;
}

.main__user__nav ul li a img {
    width: 12.88px;
    height: 12.88px;
}

.main__user__nav ul li:hover a {
    text-decoration: none;
}

.main__user__nav--active {
    border-bottom: 2.4px solid #f9826c;
}

.main__user__content {
    padding-top: 24.96px;
    padding-bottom: 45.6px !important;
    border-bottom: solid 1.6px #e1e4e8;
}

.main__user__content__blank__des {
    margin-top: 16.72px;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.75;
    letter-spacing: normal;
    text-align: center;
    color: #666666;
}

.main__user__welcome {
    width: 1041.6px;
    height: 178.4px;
    margin-bottom: 24.8px;
    border-radius: 8px;
    background-color: #f7e5e9;
    padding: 40px 0 29.52px 51.19px;
    position: relative;
}

.main__user__welcome__text {
    font-size: 22.4px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.29;
    letter-spacing: normal;
    text-align: left;
    color: #a42919;
}

.main__user__welcome__des {
    opacity: 0.64;
    font-size: 22.4px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.07;
    letter-spacing: normal;
    text-align: left;
    color: #0c0c0c;
}

.main__user__welcome img {
    width: 213.12px;
    height: 204.71px;
    position: absolute;
    right: 86.3232px;
    bottom: 0;
}

.main__user__welcome__btn {
    width: 95.2px;
    height: 30.39px;
    border-radius: 4px;
    border: none;
    box-shadow: 4.8px 4.8px 4.8px 0 rgba(96, 14, 96, 0.16);
    background-color: #ffffff;
    font-size: 14.4px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.06;
    letter-spacing: normal;
    text-align: center;
    color: #1f1f1f;
}

.main__user__content__class {
    width: 100%;
    margin: 0 auto;
    text-align: left;
}

.main__user__content__grade__wrapper {
    /* display: flex; */
}

.main__user__content__grade__chart {
    width: 579.19px;
    margin-right: 25.6px;
    padding: 34.4px 37.03px !important;
    border-radius: 4px;
    border: solid 1.19px #e1e4e8;
}

.main__user__content__grade__chart__nav span {
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.35;
    letter-spacing: normal;
    text-align: left;
    color: #1f1f1f;
}

.main__user__content__grade__chart__nav .custom-select {
    width: 112px !important;
}

.main__user__content__grade__chart__nav div {
    font-size: 11.19px !important;
    font-weight: 500 !important;
    line-height: 1.7 !important;
    letter-spacing: normal;
    text-align: left;
    color: #1f1f1f;
}

.main__user__content__grade__chart img {
    width: 100%;
}

.main__user__content__grade__pie {
    width: 332.8px;
    padding: 34.4px 37.03px !important;
    border-radius: 4px;
    border: solid 1.19px #e1e4e8;
}

.main__user__content__grade__pie__nav span {
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.35;
    letter-spacing: normal;
    text-align: left;
    color: #1f1f1f;
}

.main__user__content__grade__pie__item {
    display: flex;
    margin-top: 31.99px;
    vertical-align: middle;
}

.main__user__content__grade__pie__item p {
    /* line-height: 63.2px; */
    margin-top: 21.59px !important;
    margin-left: 17.6px;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: left;
    color: #1f1f1f;
    white-space: nowrap;
}

.main__user__content__grade__pie__item .pie {
    width: 63.2px !important;
    height: 63.2px !important;
}

.main__user__content__grade__pie img {
    width: 100%;
}
.nav-tabs {
    background: none !important;
    padding: 0 !important;
}

.nav-tabs a {
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    text-align: center;
    color: #1f1f1f;
    padding-bottom: 15.36px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.nav-tabs a img {
    width: 12.88px;
    height: 12.88px;
}
.nav-tabs a svg {
    width: 15.36px;
    margin-right: 8px;
}

.nav-tabs a.active:not(:nth-child(2)) svg {
    stroke: black;
    fill: none;
}

.nav-tabs a:not(:nth-child(2)) svg {
    stroke: #959da5;
    fill: none;
}

.nav-tabs a.active:nth-child(2) svg {
    fill: black;
}

.nav-tabs a:nth-child(2) svg {
    fill: #959da5;
}
@media only screen and (min-width: 768px) {
    .main__user {
        width: 1137.6px;
        margin: 30.39px 31.19px 0 17.6px;
        background-color: #fff;
        padding: 25.6px 151.2px 0 50.79px !important;
        bottom: 0 !important;
        min-height: 100vh;
        position: relative;
    }
    .main__user__wrapper {
        width: 100%;
    }

    .main__user__history__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .main__user__history__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .main__user__history__table {
        width: 992.48px;
        border-radius: 4px;
    }

    .main__user__history__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .main__user__history__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .main__user__history__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .main__user__history__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .main__user__history__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .main__user__history__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }

    .main__user__history__table tr th:nth-child(1),
    .main__user__history__table tr td:nth-child(1) {
        padding-right: 7.68px;
    }

    .main__user__history__table tr th:nth-child(3),
    .main__user__history__table tr td:nth-child(3) {
        width: 152.64px;
    }

    .main__user__history__table tr th:nth-child(4),
    .main__user__history__table tr td:nth-child(4) {
        width: 112px;
    }

    .main__user__history__table tr th:nth-child(5),
    .main__user__history__table tr td:nth-child(5) {
        width: 144px;
    }


    /* USER RESULT  ============================================*/

    .main__user__result__table {
        width: 983.71px;
    }

    .main__user__wrapper__des {
        font-size: 16px;
        margin-bottom: 4px !important;
        font-weight: 500;
    }

    .main__user__wrapper__rs {
        font-weight: 100;
        margin-bottom: 16px !important;
    }

    .main__user__result__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .main__user__result__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .main__user__result__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .main__user__result__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .main__user__result__table tr th:nth-child(1),
    .main__user__result__table tr td:nth-child(1) {
        padding-right: 7.68px;
    }

    .main__user__result__table tr th:nth-child(2),
    .main__user__result__table tr td:nth-child(2) {
        width: 236.8px;
    }

    .main__user__result__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .main__user__result__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .main__user__result__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .main__user__content__grade {
        padding-top: 24.8px;
        position: relative;
    }

    .main__user__content__class__nav p,
    .main__user__content__grade__nav p {
        font-size: 16px;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.75;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
    }

    .main__user__content__class__blank,
    .main__user__content__grade__blank {
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.75;
        letter-spacing: normal;
        text-align: center;
        color: #666666;
    }

    .main__user__content__class .enrollclass__table {
        width: 100% !important;
        margin-left: 0 !important;
    }

    .main__user__content__class .enrollclass__table tr:nth-of-type(1) {
        background-color: #fff;
        border-bottom: solid 1.6px #e1e4e8;
    }

    .main__user__content__class .enrollclass__table tr th {
        color: #888f9d;
    }

    .main__user__content__class .enrollclass__table tr td,
    .main__user__content__class .enrollclass__table tr th {
        font-size: 14.4px !important;
    }

    .main__user__content__class .enrollclass__table tr th:nth-of-type(1),
    .main__user__content__class .enrollclass__table tr td:nth-of-type(1) {
        width: 30.72px !important;
    }

    .main__user__content__class .enrollclass__table tr th:nth-of-type(3),
    .main__user__content__class .enrollclass__table tr td:nth-of-type(3) {
        width: 30.72px !important;
    }

    .main__user__content__class .enrollclass__table tr th:nth-of-type(2),
    .main__user__content__class .enrollclass__table tr td:nth-of-type(2) {
        width: 138.24px !important;
    }

    .main__user__content__class .enrollclass__table tr th:nth-of-type(4),
    .main__user__content__class .enrollclass__table tr td:nth-of-type(4) {
        width: 153.6px !important;
    }

    .main__user__content__class .enrollclass__table tr th:nth-of-type(5),
    .main__user__content__class .enrollclass__table tr td:nth-of-type(5) {
        width: 61.44px !important;
    }
}
@media only screen and (max-width: 767px) {
    .wrapper {
        flex-direction: column;
        padding: 0 16px 16px;
    }

    .main__user {
        width: 100%;
        margin: 0;
        padding: 0 !important;
        min-height: unset;
    }

    .main__user__welcome {
        display: none;
    }

    .main__user nav .nav{
        width: calc(100vw - 32px);
    }

    .main__user nav a{
        font-size: 14px;
        width: 33.333%;
        padding: 0;
    }

    .nav-tabs a svg {
        width: unset;
        height: 14px;
        margin-right: 8px;
    }

    .nav-link.active {
        border: none;
        border-bottom: 2px solid #f9826c !important;
    }

    .tab-content {
        position: absolute;
        left: 0;
        right: 0;
        top: 42px;
    }

    .main__user__content__class {
        border-bottom: .75px solid #D3D3D3;
    }

    .main__user__content__grade {
        padding-top: 16px;
    }

    .main__user__content__grade__nav p,
    .main__user__content__class__nav p {
        font-size: 14px;
        font-weight: normal;
        font-family: SFProDisplayMedium, sans-serif;
    }

    .main__user__content__class__blank,
    .main__user__content__grade__blank {
        font-size: 14px;
    }
    .main__user__content__blank {
        width: 100%;
        margin-top: 10px;
        text-align: center;
    }
    .main__user__content__blank img{
        width: 60%;
    }
    .main__user__content__blank__des {
        font-size: 14px;
    }
    .custom-select.csw {
        width: 130px;
        height: 20px;
        border: 1px solid #E1E4E8;
        border-radius: 5px;
    }

    .wrap__chart {
        display: block;
        /*margin-right: -25px !important;*/
        /*margin-left: -15px !important;*/
    }

    .main__user__content__grade__chart {
        width: 100%;
        margin-right: 1.667vw;
        padding: 2.240vw 2.411vw !important;
        border-radius: 10px !important;
        border: solid 0.7vw #e1e4e8 !important;
    }

    .main__user__content__grade__chart__nav {
        margin-bottom: 3vw;
        margin-top: 2vw;
    }

    .main__user__content__grade__chart__nav .custom-select {
        width: 30vw !important;
    }

    .main__user__content__grade__chart__nav span {
        font-size: 4vw !important;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.35;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
    }

    .main__user__content__grade__chart__nav div {
        font-size: 2.729vw !important;
        font-weight: 500 !important;
        line-height: 1.7 !important;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
    }

    .custom-select {
        margin-left: 1.250vw;
        height: 5vw;
        border-radius: 0.260vw;
        border: solid 0.104vw #1b1c1e;
        position: relative;
        padding-left: 1vw !important;
        padding-top: 0 !important;
        text-align: center;
        z-index: 900;
    }


    .main__user__content__grade__pie {
        width: 100%;
        padding: 8vw 8vw!important;
        border-radius: 10px !important;
        margin-top: 6vw !important;
        border: solid 0.7vw #e1e4e8 !important;
    }

    .main__user__content__grade__pie__nav span {
        font-size: 4vw !important;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.35;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
    }

    .main__user__content__grade__pie__item {
        display: flex;
        margin-top: 5vw !important;
        vertical-align: middle;
        align-items: center !important;
    }

    .main__user__content__grade__pie__item .pie {
        width: 15vw !important;
        height: 15vw !important;
    }

    .main__user__content__grade__pie__item p {
        margin-top: 4vw !important;
        margin-left: 3vw !important;
        font-size: 4vw !important;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
        white-space: nowrap;
    }

    .enrollclass__table__wrapper {
        margin-bottom: 10px;
    }
}

/*12EnrollClass*/
@media only screen and (min-width: 767px) {
    .enrollclass__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    /* ENROLL CLASS ====================================== */
    .enrollclass {
        width: 1177.6px;
        margin: 0 auto;
        margin-top: 30.39px;
        padding: 25.6px 39.19px;
        border-radius: 4px;
        /* border: solid 1.6px #e1e4e8; */
        background-color: #ffffff;
    }

    .enrollclass__nav p {
        font-size: 19.2px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: left;
        color: #1b1c1e;
        margin-bottom: 24px !important;
    }

    .enrollclass__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .enrollclass__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .enrollclass__table {
        width: 1054.4px;
        margin: 0 auto;
        border-radius: 4px;
    }

    .enrollclass__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .enrollclass__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .enrollclass__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .enrollclass__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .enrollclass__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .enrollclass__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }

    .enrollclass__table tr th:nth-child(1),
    .enrollclass__table tr td:nth-child(1) {
        width: 84.6px;
    }

    .enrollclass__table tr th:nth-child(2),
    .enrollclass__table tr td:nth-child(2) {
        width: 73.92px;
    }

    .enrollclass__table tr th:nth-child(3),
    .enrollclass__table tr td:nth-child(3) {
        width: 161.92px;
    }

    .enrollclass__table tr th:nth-child(4),
    .enrollclass__table tr td:nth-child(4) {
        width: 183.36px;
    }

    .enrollclass__table tr th:nth-child(5),
    .enrollclass__table tr td:nth-child(5) {
        width: 112px;
    }

    .enrollclass__table tr th:nth-child(6),
    .enrollclass__table tr td:nth-child(6) {
        width: 82.56px;
    }
}

@media only screen and (max-width: 767px) {
    .enrollclass {
        padding: 0 0 16px 0;
    }
    .teacher__classlist {
        padding: 0 16px;
    }
}

/*UserProfileMenu*/
.profile__wrapper {
    list-style-type: none;
    padding: 0 !important;
}
.profile__item:not(:first-child) {
    display: flex;
}

.profile__wrapper {
    list-style-type: none;
    padding: 0 !important;
}
.user .profile__item {
    margin-bottom: 0.417vw !important;
}
.profile__item__img {
    text-align: center;
    vertical-align: middle;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.profile__item__info__title {
    font-family: SFProDisplayMedium;
}

.profile__item__img img {
    width: 100% !important;
    margin: 0 auto;
}

.profile__item__info span {
    /* margin-left: 0.521vw; */
    color: #737679;
}

.profile__avt {
    width: 8.906vw;
    height: 8.906vw;
    border-radius: 50%;
    margin: 0.938vw auto 0;
    overflow: hidden;
}

.profile__avt img {
    width: 100%;
}

.profile__name {
    font-size: 19.2px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.92;
    letter-spacing: normal;
    text-align: center;
    color: #505458;
    margin-top: 15.2px;
    margin-bottom: 9.6px !important;
}

.profile__edit {
    display: block;
    margin: 0 auto;
    width: 236.8px;
    height: 32.79px;
    border-radius: 2.4px;
    border: solid 1.6px #dfe1e6;
    background-color: #fafbfc;
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    text-align: center;
    color: #24292e;
    margin-bottom: 22.4px;
    padding: 6.8px 0;
}

.profile__edit:hover {
    text-decoration: none;
    color: #24292e;
}

.profile__login {
    display: block;
    margin: 0 auto;
    width: 236.8px;
    height: 32.79px;
    border-radius: 2.4px;
    border: solid 1.6px #dfe1e6;
    background-color: #fafbfc;
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    text-align: center;
    color: #24292e;
    margin-bottom: 12.88px;
    padding: 6.8px 0;
}

.profile__login:hover {
    text-decoration: none;
    color: #24292e;
}
@media only screen and (max-width: 767px) {
    .wrap__profile__avt {
        display: inline-flex;
        width: 100%;
        flex-wrap: wrap;
        row-gap: 20px;
    }

    .profile__avt {
        width: 50px;
        height: 50px;
        margin: 0;
    }

    .profile__name {
        font-size: 18px;
        font-weight: normal;
        font-family: SFProDisplay-SemiBold, sans-serif;
        margin: 0 !important;
        line-height: 50px;
        padding-left: 20px;
    }

    .profile__edit, .profile__login {
        width: 100%;
        height: 40px;
        font-size: 14px;
        font-family: SFProDisplayMedium, sans-serif;
        line-height: 34px;
        margin-bottom: 20px;
        border: solid 1px #dfe1e6;
    }

    .profile__item__img {
        width: 24px;
        height: 24px;
        border-radius: 3px;
        margin-right: 10px;
    }

    .profile__item__info {
        margin-bottom: 1rem;
    }

    .profile__item__info__title {
        font-family: SFProDisplay-Medium, sans-serif;
        line-height: 24px;
        margin-bottom: 0 !important;
    }

}
@media only screen and (min-width: 768px) {
    .profile {
        width: 349.59px;
        padding: 19.2px 15.2px 0 37.6px;
        font-size: 16px;
    }

    .profile__wrapper {
        width: 296.8px;
    }

    .profile__item__img {
        width: 22.4px;
        height: 22.4px;
        border-radius: 2.4px;
        margin-right: 8px;
    }

}

/*06SettingGeneral*/

.setting__menu {
    width: 199.2px;
}

.setting__menu__title {
    font-family: SFProDisplayBold;
    font-size: 22.4px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.64;
    letter-spacing: normal;
    text-align: left;
    color: #24292e;
}

.setting__menu ul {
    list-style-type: none;
    padding-left: 9.6px !important;
    font-size: 13.6px;
}

.setting__menu ul li[class=text--grey] {
    padding-top: 10.8px;
    padding-bottom: 7.2px;
    font-family: SFProDisplayBold;
}

.setting__menu ul li:nth-child(3) {
    padding-bottom: 2.8px;
    border-bottom: 0.4px solid #f6f8fa;
}

.setting__menu ul li:nth-child(5) {
    padding-bottom: 2.8px;
    border-bottom: 0.4px solid #f6f8fa;
}

.setting__menu ul li a {
    display: block;
    color: #bb2019;
    padding: 7.2px 0;
    width: 153.6px;
}

.setting__menu ul li a:hover {
    background-color: #f6f8fa;
    text-decoration: none;
}

.setting__main__acc__title,
.setting__main__info__title {
    font-size: 17.6px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.27;
    letter-spacing: normal;
    text-align: left;
    color: #5e100d;
}

.setting__main__info {
    margin-top: 29.59px;
}
.setting__main {
    font-size: 16px;
    position: relative;
}

.setting__main input,
.setting__main textarea {
    width: 236.8px;
    border-radius: 2.4px;
    border: solid 1.6px #dfe1e6;
    margin-bottom: 6.405px;
    padding-left: 4.6px;
}

.setting__main textarea {
    margin-bottom: 1.536px;
}

.setting__main input:focus,
.setting__main textarea:focus {
    outline: none;
    box-sizing: border-box !important;
    border-left: 4px solid #0D5BCE !important;
}

.setting__main textarea {
    height: 92px;
    margin-bottom: 4.6px !important;
    resize: none;
}

.setting__main__des {
    opacity: 0.8;
}

.setting__main input:hover,
.setting__main textarea:hover {
    background-color: #f6f8fa;
}

.setting__main__label {
    vertical-align: top;
    padding-right: 24px;
    width: 152px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.4;
    letter-spacing: normal;
    text-align: right;
    color: #707070;
    margin-bottom: 29.59px !important;
}

#loadFileImg {
    border-radius: 50%;
    width: 98.39px;
    height: 98.39px;
}

.setting__main__acc .setting__main__label {
    vertical-align: top;
}

.setting__main__name {
    margin-bottom: 11.19px !important;
}

.setting__main__sub {
    font-size: 12.88px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.75;
    letter-spacing: normal;
    text-align: left;
    color: #b8b8b8;
    margin-bottom: 0 !important;
}

.setting__invalid {
    width: 423.04px !important;
    padding: 16px 15.36px;
    font-weight: lighter;
    text-align: center;
    box-shadow: 0px 3px 6px #00000024;
    border: 1px solid #E6E8EC;
    border-radius: 5px;
    opacity: 1;
    margin-bottom: 19.2px;
    background-color: #FAEDED;
}

.setting__invalid p,
.setting__success p {
    margin-bottom: 0 !important;
    font-size: 12.74px !important;
}

.setting__success {
    width: 423.04px !important;
    padding: 16px 15.36px;
    font-weight: lighter;
    text-align: center;
    box-shadow: 0px 3px 6px #00000024;
    border: 1px solid #E6E8EC;
    border-radius: 5px;
    opacity: 1;
    margin-bottom: 19.2px;
    background-color: #D4E2F7;
}

#avt__label {
    display: block;
    width: 98.39px;
    height: 98.39px;
    border-radius: 50%;
    position: relative;
}

#avt__label span {
    display: block;
    opacity: 0;
    transition: 0.2s ease-in-out;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    white-space: nowrap;
    text-transform: uppercase;
    font-size: 10.39px;
}

#avt__label:hover span {
    opacity: 1;
}

#avt__label img {
    width: 100%;
}

#upload__avt {
    display: none;
}

.setting__main__update__btn {
    width: 194.64px;
    height: 37.35px;
    background-color: #bb2019;
    border-radius: 4px;
    font-size: 16px;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.4;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
    outline: none;
    border: none;
}

.setting__main__update__btn:hover {
    background-color: #bb2019;
}

.setting__input--active {
    box-sizing: border-box !important;
    border-left: 4px solid #0D5BCE !important;
}

.setting__main__popup,
.setting__main__popup__fail__single {
    position: absolute;
    background-color: #D4E2F7;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    justify-content: start;
    cursor: pointer;
    z-index: 9999;
}
.setting__main__popup p,
.setting__main__popup__fail__single p {
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.27;
    letter-spacing: normal;
    text-align: left;
    margin-bottom: 0 !important;
    color: #24292e;
}

.setting__main__popup__fail {
    position: absolute;
    overflow: scroll;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: #D4E2F7;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    justify-content: start;
    cursor: pointer;
    z-index: 9999;
}

.setting__main__popup__fail div {
    text-align: center;
    margin: 0 auto;
}

.setting__main__popup__fail div p {
    width: 100%;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.27;
    letter-spacing: normal;
    text-align: center !important;
    color: #24292e;
    margin-bottom: 7.68px !important;
    margin: 0 auto;
}

.setting__main__popup__fail,
.setting__main__popup__fail__single {
    background-color: #FFE4E4;
}

.setting__main__popup__fail p {
    color: #bb2019;
}

.setting--active {
    color: #660a06;
}

.setting__main__noti {
    margin-bottom: 14.4px;
}

.setting__main__noti p {
    margin-bottom: 9.6px !important;
}

.setting__main__noti__title {
    font-size: 17.6px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.27;
    letter-spacing: normal;
    text-align: left;
    color: #5e100d;
}

.setting__main__noti .setting__main__label {
    vertical-align: top;
    width: 175.99px;
}

.checkbox--red {
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    /* display: none; */
    /* visibility: hidden; */
    opacity: 0;
}

.checkbox--red+label:before {
    border: 1.6px solid #333;
    content: "\00a0";
    display: inline-block;
    font: 17.6px/17.6px sans-serif;
    height: 17.6px;
    margin: 1.536px 6.4px 0 0;
    padding: 0;
    vertical-align: top;
    width: 17.6px;
    border-radius: 2.4px;
}

.checkbox--red:checked+label:before {
    background: #bb2019;
    color: #fff;
    content: "✔";
    text-align: center;
}

.checkbox--red:checked+label:after {
    font-weight: bold;
}

.checkbox--block .cb__label {
    user-select: none;
    font-size: 16.8px;
    margin-bottom: 0 !important;
    line-height: 1.2;
}

.checkbox--block:nth-child(4) {
    margin-bottom: 21.59px;
}

.setting__main__noti a {
    font-size: 16px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.4;
    letter-spacing: normal;
    text-align: left;
    color: #bb2019;
    margin-left: 26.4px;
}

.setting__main__noti a:hover {
    text-decoration: none;
}

@media only screen and (min-width: 767px) {
    .setting__main__info table tr td select {
        width: 100%;
        height: 25px;
        border-radius: 3px;
        border: solid 1.6px #dfe1e6;
        margin-bottom: 9.08px;
        padding-left: 4.6px;
        background-color: #fafbfc;
        margin-left: 0;
    }

    .profile_user_mobile {
        display: none;
    }

    .setting_account__mobile {
        display: none;
    }

    .divider {
        display: none;
    }
    .setting__button__update__pass__mobile {
        display: none;
    }

    .setting__title__change__pass__mobile {
        display: none;
    }
    .setting__main__guide__title {
        font-size: 17.6px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.27;
        letter-spacing: normal;
        text-align: left;
        color: #5e100d;
    }

    .guide__img {
        position: absolute;
        top: 0;
        right: 0;
        width: 247.75px;
        height: 275.43px;
    }

    .setting__main__guide__content,
    .setting__main__guide__content2 {
        padding-left: 22.4px;
    }

    .setting__main__guide__content>p {
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.4;
        letter-spacing: normal;
        text-align: left;
        color: #707070;
    }

    .setting__main__guide__content__img {
        text-align: center !important;
        margin-bottom: 26.4px;
    }

    .setting__main__guide__content .setting__main__guide__content__img:nth-of-type(1) {
        width: 778.39px;
        margin-top: 20.79px;
    }

    .setting__main__guide__content .setting__main__guide__content__img:nth-of-type(2) {
        width: 846.39px;
        margin-top: 31.99px;
    }

    .setting__main__guide__content .setting__main__guide__content__img:nth-of-type(3) {
        width: 826.39px;
        margin-top: 12.88px;
    }

    .setting__main__guide__content .setting__main__guide__content__img:nth-of-type(4) {
        width: 826.39px;
        margin-top: 12.88px;
    }

    .setting__main__guide__content__img img {
        width: 100%;
    }

    .setting__main__guide__content__img__note {
        font-size: 11.19px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2;
        letter-spacing: normal;
        color: #707070;
        margin-top: 9.6px;
    }

    .setting__main__guide__content2 {
        margin-bottom: 120px;
    }
}

@media only screen and (max-width: 767px) {
    .setting__main__info table tr td select {
        width: 100%;
        height: 36px;
        border-radius: 3px;
        border: solid 0.104vw #dfe1e6;
        margin-bottom: 3vw;
        padding-left: 0.3vw;
        background-color: #fafbfc;
        margin-left: 0;
        font-size: 14px;
    }

    .divider {
        height: 1px;
        background-color: #E1E4E8;
        margin-bottom: 3vw;
        margin-top: 3vw;
    }

    .main__user {
        padding: 0 16px 40px !important;
        background-color: #fff;
        bottom: 0 !important;
        height: fit-content;
        min-height: unset;
        position: relative;
        margin: 0 !important;
    }

    .setting__main {
        margin-left: -16px;
    }

    .setting__main__acc {
        margin-bottom: 3vw !important;
    }

    .setting__main__acc__title,
    .setting__main__pw__title,
    .setting__main__info__title {
        font-size: 18px !important;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.27;
        letter-spacing: normal;
        text-align: left;
        color: #000000;
    }

    .setting__main__sub {
        display: none;
    }

    .setting__label__hide {
        display: none;
    }

    .setting__main__acc table tbody {
        display: flex;
    }

    .setting__main__name {
        font-size: 18px !important;
        font-family: SFProDisplay-SemiBold, sans-serif !important;
        line-height: 50px!important;
    }

    #avt__label {
        display: block;
        width: 14vw !important;
        height: 14vw !important;
        border-radius: 50%;
        position: relative;
    }

    #loadFileImg {
        border-radius: 50%;
        width: 50px !important;
        height: 50px !important;
    }

    .setting__menu__title {
        display: none;
    }

    .setting__main__acc__title {
        display: none;
    }

    .setting__menu {
        width: auto !important;
    }

    .setting__menu ul {
        list-style-type: none;
        padding-left: 0 !important;
        font-size: 14px !important;
    }

    .setting__menu ul li a {
        display: block;
        color: #000000;
        padding: 0.469vw 0;
        width: auto !important;
        font-size: 14px;
    }

    .setting__menu ul li[class=text--grey] {
        padding-top: 0.703vw;
        padding-bottom: 0.469vw;
        font-family: SFProDisplay-SemiBold, sans-serif !important;
        font-size: 14px !important;
    }

    .setting__menu ul li:nth-child(3) {
        padding-bottom: 0.182vw;
        border-bottom: 0.026vw solid #f6f8fa;
        /* display: none !important; */
    }

    .setting__menu__title__mobile,
    .setting__main__noti__title {
        font-size: 18px;
        font-family: SFProDisplay-Medium, sans-serif !important;
        height: 4vw;
    }

    .setting__main__name__wrap {
        font-size: 14px;
        display: flex;
        height: 6vw;
    }

    .setting__main__name__title__mobile {
        font-size: 3.5vw;
        color: #707070;
        font-family: 'SFProDisplay' !important;
    }

    .setting__main__name__mobile {
        font-size: 3.5vw;
        color: #000000;
        font-family: 'SFProDisplay' !important;
        margin-left: 3vw;
    }

    .setting__main__sub__mobile {
        font-size: 14px;
        color: #B8B8B8;
        font-family: 'SFProDisplay' !important;
    }

    .setting--active {
        color: #BB2019 !important;
    }

    .setting__menu ul li:nth-child(5) {
        padding-bottom: 0.182vw;
        border-bottom: 0 solid #f6f8fa !important;
    }

    .setting__main input,
    .setting__main textarea,
    .setting__main input,
    .setting__main textarea {
        width: 70vw !important;
        border-radius: 3px;
        border: solid 1px #dfe1e6;
        margin-bottom: 2.417vw !important;
        padding-left: 10px;
        height: 36px !important;
        font-size: 14px;
        line-height: 28px;
    }

    .setting__main__label {
        vertical-align: top !important;
        padding-right: 1.563vw;
        width: 23vw !important;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 27px;
        letter-spacing: normal;
        text-align: left !important;
        color: #707070;
        margin-bottom: 1.927vw !important;
        font-size: 14px !important;
        padding-top: 1vw !important;
    }

    .setting__main__des {
        opacity: 0.8;
        font-size: 3vw !important;
    }

    .setting__main__update__btn {
        width: 100% !important;
        height: 9vw !important;
        background-color: #bb2019;
        border-radius: 4px !important;
        font-size: 4vw !important;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.4;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
        outline: none;
        border: none;
    }

    .setting__main__popup,
    .setting__main__popup__fail__single {
        position: absolute;
        min-width: 65vw !important;
        min-height: 8vw !important;
        background-color: #D4E2F7;
        top: 40% !important;
        left: 50% !important;
        transform: translate(-50%, -50%);
        display: flex;
        justify-content: start;
        padding: 2.146vw 2.500vw !important;
        cursor: pointer;
        z-index: 9999;
    }

    .setting__main__popup img,
    .setting__main__popup__fail__single img {
        width: 4vw !important;
        height: 4vw !important;
        margin-right: 1vw;
    }

    .setting__main__popup p,
    .setting__main__popup__fail__single p {
        font-size: 3vw !important;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.27;
        letter-spacing: normal;
        text-align: left;
        margin-bottom: 0 !important;
        color: #24292e;
    }
    .wrapper {
        flex-direction: column;
    }
    .setting__main__label {
        line-height: 21px;
        padding-top: 10px !important;
    }

    .setting__main__noti {
        margin-bottom: 15px;
    }

    .setting__main__noti table tbody tr td p,
    .setting__main__noti table tbody tr td a {
        font-size: 14px;
        padding-top: 10px;
        margin-bottom: 10px !important;
    }

    .setting__main__noti__email td:nth-child(2){
        padding-top: 14px;
    }

    .setting__main__noti input[type='checkbox'] {
        display: none;
    }

    .setting__main__noti .cb__label {
        font-size: 14px;
    }

    .setting__main__noti .checkbox--block {
        margin-bottom: 5px;
    }

    .setting__main__noti .cb__label:before {
        font-size: 14px;
        width: 15px;
        height: 15px;
        line-height: 14px;
        margin-right: 7px;
    }
    .setting__button__update__pass__web {
        display: none;
    }

    .setting__title__change__pass__web {
        display: none;
    }

    .setting__main__pw {
        margin-bottom: 5vw !important;
    }

    .setting__main__pw>p {
        margin-bottom: 3vw !important;
    }

    .setting__invalid,
    .setting__success {
        width: 100% !important;
        padding: 10px;
        font-weight: lighter;
        text-align: center;
        box-shadow: 0px 3px 6px #00000024;
        border: 1px solid #E6E8EC;
        border-radius: 5px;
        opacity: 1;
        margin-bottom: 1.25vw;
    }

    .setting__invalid {
        background-color: #FAEDED;
    }

    .setting__success {
        background-color: #D4E2F7;
    }

    .setting__invalid p,
    .setting__success p {
        font-size: 14px !important;
    }

    tbody tr:last-child .setting__main__label {
        line-height: 1.25;
    }
    .guide__img {
        display: none;
    }
    .setting__main__guide__title {
        font-size: 4vw !important;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.27;
        letter-spacing: normal;
        text-align: left;
        color: #5e100d;
    }

    .setting__main__guide__content > p {
        font-size: 4vw !important;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.4;
        letter-spacing: normal;
        text-align: left;
        color: #707070;
    }

    .setting__main__guide__content,
    .setting__main__guide__content2 {
        padding-left: 0 !important;
    }

    .setting__main__guide__content
    .setting__main__guide__content__img:nth-of-type(1) {
        width: auto !important;
        margin-top: 1.354vw;
    }

    .setting__main__guide__content
    .setting__main__guide__content__img:nth-of-type(2) {
        width: auto !important;
        margin-top: 2.083vw;
    }

    .setting__main__guide__content
    .setting__main__guide__content__img:nth-of-type(3) {
        width: auto !important;
        margin-top: 0.833vw;
    }

    .setting__main__guide__content
    .setting__main__guide__content__img:nth-of-type(4) {
        width: auto !important;
        margin-top: 0.833vw;
    }

    .setting__main__guide__content__img__note {
        font-size: 3vw !important;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2;
        letter-spacing: normal;
        color: #707070;
        margin-top: 0.625vw;
    }

    .setting__main__guide__content2 p {
        font-size: 4vw !important;
    }
    .setting__main__guide__title {
        font-size: 14px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.27;
        letter-spacing: normal;
        text-align: left;
        color: #5e100d;
    }

    .guide__img {
        position: absolute;
        top: -10px;
        right: 16px;
        width: 16.130vw;
        height: 17.932vw;
    }

    .setting__main__guide__content,
    .setting__main__guide__content2 {
        padding-left: 0;
        font-size: 14px;
    }

    .setting__main__guide__content>p {
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.4;
        letter-spacing: normal;
        text-align: left;
        color: #707070;
    }

    .setting__main__guide__content__img {
        text-align: center !important;
    }

    .setting__main__guide__content .setting__main__guide__content__img:nth-of-type(1) {
        width: 100%;
    }

    .setting__main__guide__content .setting__main__guide__content__img:nth-of-type(2) {
        width: 100%;
    }

    .setting__main__guide__content .setting__main__guide__content__img:nth-of-type(3) {
        width: 100%;
    }

    .setting__main__guide__content .setting__main__guide__content__img:nth-of-type(4) {
        width: 100%;
    }

    .setting__main__guide__content__img img {
        width: 100%;
    }

    .setting__main__guide__content__img__note {
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2;
        letter-spacing: normal;
        color: #707070;
        margin-top: 0.625vw;
    }

    .setting__main__guide__content2 {
        margin-bottom: 7.813vw;
    }
}

/*07Ranking*/
.filter {
    position: relative;
    display: inline;
}
.filter>button {
    color: #5e6c84;
    background: none;
    outline: none;
    border: none;
}
@media only screen and (max-width: 767px) {
    .ranking__wrapper {
        margin: 0;
        padding: 0;
        border: none;
    }

    .filter__dropdown {
        top: 130%;
        right: 2%;
        z-index: 998;
        min-width: 150px;
        background-color: #fff;
        color: #707070;
        border-radius: 6px;
        position: absolute;
        padding: 0 !important;
        box-shadow: 6px 6px 6px 0 rgba(96, 14, 96, 0.16);
    }

    .filter__dropdown ul:nth-of-type(2) {
        overflow: scroll;
        overflow-x: hidden;
        max-height: 200px;
    }

    .filter>button {
        font-size: 15px;
    }

    .filter__dropdown__btn__wrapper {
        text-align: center;
    }

    .filter__dropdown__btn {
        background-color: #bb2019 !important;
        color: #fff;
        width: 70px;
        border: none;
        outline: none;
        border-radius: 3px;
        font-size: 13px;
    }

    .filter__dropdown ul {
        position: relative;
        list-style-type: none;
        padding: 0 !important;
        font-size: 0.938vw;
        font-weight: lighter;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.75;
        letter-spacing: normal;
        text-align: left;
        color: #737679;
        margin: 0 !important;
    }

    .filter__dropdown ul li {
        white-space: nowrap;
        padding: 5px 10px;
        border-bottom: 0.104vw solid #e1e4e8;
    }

    .filter__dropdown::before {
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        bottom: 100%;
        right: 2%;
        border: 0.5vw solid transparent;
        border-top: none;
        border-bottom-color: #fff;
        filter: drop-shadow(0 -0.0625rem 0.0625rem rgba(0, 0, 0, .1));
    }
    .checkbox--block .cb__label {
        font-size: 14px;
    }
    .checkbox--red+label:before {
        border: 0.104vw solid #333;
        content: "\00a0";
        display: inline-block;
        font: 1.146vw/1.146vw sans-serif;
        height: 14px;
        margin: 0.1vw 5px 0 0;
        padding: 0;
        vertical-align: top;
        width: 14px;
        border-radius: 0.156vw;
    }
}
@media only screen and (min-width: 768px) {

    .ranking__wrapper {
        width: 1177.6px;
        margin: 30.39px auto 0;
        padding: 25.6px 39.19px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #ffffff;
    }

    .ranking__wrapper .rank__top__mid {
        border-top: 4.8px solid #ffc34d !important;
    }

    .ranking__wrapper .rank__top__mid .rank__top__avt img {
        border: solid 2px #ffc34d !important;
        border-radius: 50%;
    }

    .ranking__wrapper .ques__nav__top {
        display: flex;
        width: 100%;
        justify-content: right;
        text-align: right;
        padding-left: 844.8px;
        margin-bottom: 30.72px;
    }

    .ques__nav__form {
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #FAEDED;
        width: 273.6px;
        height: 28px;
        display: flex;
        justify-content: space-between;
        /* padding: 7.2px 6.4px 0 8.8px; */
        padding-left: 8.8px;
        vertical-align: middle;
    }

    .ques__nav__form input[type="text"] {
        background: none;
        border: none;
        font-size: 11.99px;
        width: 80%;
    }

    .ques__nav__form input[type="text"]:focus {
        outline: none;
    }

    .ques__nav__form input[type="submit"] {
        width: 19.99px;
        height: 19.99px;
        font-size: 9.6px;
        background: none;
        border-radius: 2.4px;
        border: solid 1.6px #bb2019;
        margin: auto 0;
        margin-right: 6.405px;
        color: #bb2019 !important;
    }
    .filter__dropdown {
        top: 130%;
        right: 2%;
        z-index: 998;
        min-width: 180px;
        background-color: #fff;
        color: #707070;
        border-radius: 4px;
        position: absolute;
        padding: 0 !important;
        box-shadow: 2.4px 2.4px 2.4px 0 rgba(96, 14, 96, 0.16);
    }

    .filter__dropdown ul:nth-of-type(2) {
        overflow: scroll;
        overflow-x: hidden;
        max-height: 153.6px;
    }

    .filter>button {
        font-size: 14.4px;
    }

    .filter__dropdown__btn__wrapper {
        text-align: center;
    }

    .filter__dropdown__btn {
        background-color: #bb2019 !important;
        color: #fff;
        width: 61.44px;
        border: none;
        outline: none;
        border-radius: 3.072px;
    }

    .filter__dropdown ul {
        position: relative;
        list-style-type: none;
        padding: 0 !important;
        font-size: 14.4px;
        font-weight: lighter;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.75;
        letter-spacing: normal;
        text-align: left;
        color: #737679;
        margin: 0 !important;
    }

    .filter__dropdown ul li {
        white-space: nowrap;
        padding: 7.68px 15.36px;
        border-bottom: 1.6px solid #e1e4e8;
    }

    .filter__dropdown::before {
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        bottom: 100%;
        right: 2%;
        border: 7.68px solid transparent;
        border-top: none;
        border-bottom-color: #fff;
        filter: drop-shadow(0 -0.0625rem 0.0625rem rgba(0, 0, 0, .1));
    }

}

/*AdminRanking*/
@media only screen and (max-width: 767px) {

    .rank .admin__status__nav__top {
        display: inline-flex;
        width: 100%;
        flex-direction: row;
        margin-bottom: 15px !important;
        align-items: center;
        justify-content: space-between;
    }
}
@media only screen and (min-width: 768px) {
    .rank .admin__status__nav__top {
        margin-bottom: 10px;
    }
    .ques__nav__bottom {
        text-align: right;
    }
    /* ADMIN RANKING =============================== */

    .admin__rank__table {
        width: 1055.2px !important;
        border-radius: 4px;
        padding: 0 !important;
        margin-left: 21.84px;
        margin-bottom: 21.84px;
    }

    .admin__rank__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .ques__nav__bottom span {
        font-family: SFProDisplay;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        text-align: left;
        color: #0c0c0c;
    }

    .admin__rank__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .admin__rank__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .admin__rank__table tr th:nth-child(1),
    .admin__rank__table tr td:nth-child(1) {
        width: 89.28px;
    }

    .admin__rank__table tr th:nth-child(2),
    .admin__rank__table tr td:nth-child(2) {
        width: 153.6px;
    }

    .admin__rank__table tr th:nth-child(3),
    .admin__rank__table tr td:nth-child(3) {
        width: 153.6px;
    }

    .admin__rank__table tr th:nth-child(4),
    .admin__rank__table tr td:nth-child(4) {
        width: 92.16px;
    }

    .admin__rank__table tr th:nth-child(5),
    .admin__rank__table tr td:nth-child(5) {
        width: 184.32px;
    }

    .admin__rank__table tr th:nth-child(6),
    .admin__rank__table tr td:nth-child(6) {
        width: 153.6px;
    }

    .admin__rank__table tr th:nth-child(7),
    .admin__rank__table tr td:nth-child(7) {
        width: 89.28px;
    }

    .admin__rank__table tr th:nth-child(8),
    .admin__rank__table tr td:nth-child(8) {
        width: 89.28px;
    }

    .admin__rank__table tr th:nth-child(9),
    .admin__rank__table tr td:nth-child(9) {
        width: 122.88px;
    }

    .admin__rank__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        vertical-align: top;
        padding-top: 7.68px;
    }

    .admin__rank__table__sub {
        margin-bottom: 0 !important;
    }

    .admin__rank__table__group {
        margin-bottom: 0 !important;
        color: #888f9d;
    }
}

/*AdminStatus*/
.admin__status {
    background-color: #fff;
}

.admin__status__nav__title {
    font-family: SFProDisplayBold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}

@media only screen and (max-width: 767px){
    .admin__status {
        padding: 0 0 16px 0;
    }

    .admin__status__nav__top {
        display: inline-flex;
        flex-direction: column;
        margin-bottom: 15px !important;
    }

    .admin__status__nav__form {
        display: none;
    }

    .custom-select {
        margin-bottom: 15px;
        border-radius: 5px;
        font-size: 14px;
    }

    .custom__nav__select {
        display: inline-flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        width: 100%;
    }

    .admin__status__table tr th:nth-child(2),
    .admin__status__table tr td:nth-child(2) {
        max-width: 100px;
    }

    .admin__status__table tr th:nth-child(3),
    .admin__status__table tr td:nth-child(3) {
        max-width: 150px;
    }

    .admin__status__table tr th:nth-child(4),
    .admin__status__table tr td:nth-child(4) {
        max-width: 200px;
    }

}
@media only screen and (min-width: 768px){
    /* ADMIN STATUS =========================================== */

    .admin__status {
        width: 1137.6px;
        margin: 30.39px auto 35.2px;
        padding: 25.6px 19.2px 49.92px 19.2px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #fff;
    }

    .admin__status__nav {
        width: 100%;
        margin-bottom: 19.84px;
    }

    .admin__status__nav__top>div {
        display: flex;
    }

    .admin__status__nav__top>div form {
        margin-right: 19.2px;
    }

    .admin__status__nav__top button {
        outline: none;
        border: none;
        display: block;
        width: 97.59px !important;
        height: 28px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }

    .admin__status__nav a {
        display: block;
        width: 85.6px;
        height: 28px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.5;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }

    .admin__status__nav a:hover {
        text-decoration: none;
    }

    .admin__status__nav__top {
        display: flex;
        justify-content: space-between;
    }

    .admin__status__nav__bottom, .ques__nav__bottom {
        text-align: right;
        margin-top: 12.88px;
    }


    .admin__status__nav__form {
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #FAEDED;
        width: 273.6px;
        height: 28px;
        display: flex;
        justify-content: space-between;
        /* padding: 7.2px 6.4px 0 8.8px; */
        padding-left: 8.8px;
        vertical-align: middle;
    }

    .admin__status__nav__form input[type="text"] {
        background: none;
        border: none;
        font-size: 11.99px;
        width: 80%;
    }

    .admin__status__nav__form input[type="text"]:focus {
        outline: none;
    }

    .admin__status__nav__form input[type="submit"] {
        width: 19.99px;
        height: 19.99px;
        font-size: 9.6px;
        background: none;
        border-radius: 2.4px;
        border: solid 1.6px #bb2019;
        margin: auto 6.4px auto 0;
        color: #bb2019 !important;
    }

    .admin__status__table {
        width: 97% !important;
        border-radius: 4px;
        padding: 0 !important;
        margin: 0 auto;
        /* margin-left: 21.84px; */
        margin-bottom: 21.84px;
    }

    .admin__status__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .admin__status__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .admin__status__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .admin__status__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 10.75px 0;
    }

    .admin__status__table tr th:nth-child(1),
    .admin__status__table tr td:nth-child(1) {
        width: 92.16px;
    }

    .admin__status__table tr th:nth-child(2),
    .admin__status__table tr td:nth-child(2) {
        width: 168.96px;
    }

    .admin__status__table tr th:nth-child(3),
    .admin__status__table tr td:nth-child(3) {
        width: 230.4px;
    }

    .admin__status__table tr th:nth-child(4),
    .admin__status__table tr td:nth-child(4) {
        width: 215.4px;
    }

    .admin__status__table tr th:nth-child(5),
    .admin__status__table tr td:nth-child(5) {
        width: 230.4px;
    }

    .admin__status__table tr th:nth-child(6),
    .admin__status__table tr td:nth-child(6) {
        width: 153.6px;
    }

    .admin__status__table tr th:nth-child(7),
    .admin__status__table tr td:nth-child(7) {
        width: 153.6px;
    }

    .admin__status__table tr th:nth-child(8),
    .admin__status__table tr td:nth-child(8) {
        width: 122.88px;
    }

    .admin__status__table tr {
        margin: 0 18px !important;
    }

    .admin__status__table__icon {
        display: block;
        width: 24px;
        height: 24px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        color: #fff;
        line-height: 24px;
        margin: 0 auto;
    }

    .admin__status__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .admin__status__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }
}

/*08History*/
.issue-guide {
    width: 1054.4px;
    background-color: #FAEDED;
    margin: 0 auto;
    border: solid 1.6px #E1E4E8;
    padding: 21.19px 61.59px;
}

.issue-guide__title {
    font-size: 17.6px;
}

.issue-guide__content {
    display: flex;
    justify-content: space-between;
    padding: 0 11.99px;
    font-size: 16px !important;
}
@media only screen and (min-width: 768px) {
    /* HISTORY WORK =============================================================== */

    .historywork {
        width: 1177.6px;
        margin: 30.39px auto 0;
        padding: 25.6px 39.19px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #ffffff;
    }

    .historywork__nav p {
        font-size: 19.2px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: left;
        color: #1b1c1e;
        margin-bottom: 24px !important;
    }

    .historywork__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .historywork__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .historywork__table {
        width: 1054.4px;
        border-radius: 4px;
        margin: 0 auto 24px;
    }

    .historywork__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .historywork__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .historywork__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .historywork__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .historywork__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .historywork__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }

    .historywork__table tr th:nth-child(1),
    .historywork__table tr td:nth-child(1) {
        width: 79.99px;
        padding-right: 7.68px;
    }

    .historywork__table tr th:nth-child(2),
    .historywork__table tr td:nth-child(2) {
        width: 135.36px;
    }

    .historywork__table tr th:nth-child(3),
    .historywork__table tr td:nth-child(3) {
        width: 238.72px;
    }

    .historywork__table tr th:nth-child(4),
    .historywork__table tr td:nth-child(4) {
        width: 152.64px;
    }

    .historywork__table tr th:nth-child(5),
    .historywork__table tr td:nth-child(5) {
        width: 112px;
    }

    .historywork__table tr th:nth-child(6),
    .main__user__history__table tr td:nth-child(6) {
        width: 144px;
    }

}

@media only screen and (max-width: 767px) {

    .historywork__nav p {
        font-family: SFProDisplay-SemiBold, sans-serif;
    }
    .historywork__table__wrapper {
        margin-bottom: 16px;
    }

    .issue-guide {
        width: 100%;
        font-size: 14px;
        border-radius: 8px;
        border: none;
    }
    .issue-guide p {
        font-size: 14px;
    }

    .issue-guide__content {
        padding: 0;
        flex-direction: column;
    }
}


/*Admin_History*/

.admin__his {
    width: 1137.6px;
    margin: 0 auto;
    margin-top: 30.39px;
    margin-bottom: 35.2px;
    padding: 25.6px 19.2px 49.92px 19.2px;
    border-radius: 4px;
    border: solid 1.6px #e1e4e8;
    background-color: #fff;
}

.admin__his__nav {
    width: 100%;
    margin-bottom: 19.84px;
}

.admin__his__nav__top>div {
    display: flex;
}

.admin__his__nav__top>div form {
    margin-right: 19.2px;
}

.admin__his__nav__title {
    font-family: SFProDisplayBold;
    font-size: 19.2px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}

.admin__his__nav a {
    display: block;
    width: 85.6px;
    height: 28px;
    color: #fff;
    border-radius: 2.4px;
    background-color: #bb2019;
    font-size: 11.99px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 2.5;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}

.admin__his__nav a:hover {
    text-decoration: none;
}

.admin__his__nav__top {
    display: flex;
    justify-content: space-between;
}

.admin__his__nav__bottom {
    text-align: right;
    margin-top: 12.88px;
}

.admin__his__nav__title {
    font-family: SFProDisplay;
    font-size: 19.2px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}

.admin__his__nav__form {
    border-radius: 4px;
    border: solid 1.6px #e1e4e8;
    background-color: #FAEDED;
    width: 273.6px;
    height: 28px;
    display: flex;
    justify-content: space-between;
    /* padding: 7.2px 6.4px 0 8.8px; */
    padding-left: 8.8px;
    vertical-align: middle;
}

.admin__his__nav__form input[type="text"] {
    background: none;
    border: none;
    font-size: 11.99px;
    width: 80%;
}

.admin__his__nav__form input[type="text"]:focus {
    outline: none;
}

.admin__his__nav__form input[type="submit"] {
    width: 19.99px;
    height: 19.99px;
    font-size: 9.6px;
    background: none;
    border-radius: 2.4px;
    border: solid 1.6px #bb2019;
    margin: auto 0;
    margin-right: 6.405px;
    color: #bb2019 !important;
}

@media only screen and (min-width: 768px) {
    .custom__nav__select {
        text-align: right;
        margin-top: 10px;
    }

    .admin__his__table {
        width: 100% !important;
        border-radius: 4px;
        padding: 0 !important;
        /* margin-left: 21.84px; */
        margin-bottom: 21.84px;
    }

    .admin__his__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .admin__his__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .admin__his__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .admin__his__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 10.75px 0;
    }

    .admin__his__table tr th:nth-child(1),
    .admin__his__table tr td:nth-child(1) {
        width: 92.16px;
    }

    .admin__his__table tr th:nth-child(2),
    .admin__his__table tr td:nth-child(2) {
        width: 168.96px;
    }

    .admin__his__table tr th:nth-child(3),
    .admin__his__table tr td:nth-child(3) {
        width: 215.4px;
    }

    .admin__his__table tr th:nth-child(4),
    .admin__his__table tr td:nth-child(4) {
        width: 230.4px;
    }

    .admin__his__table tr th:nth-child(5),
    .admin__his__table tr td:nth-child(5) {
        width: 153.6px;
    }

    .admin__his__table tr th:nth-child(6),
    .admin__his__table tr td:nth-child(6) {
        width: 153.6px;
    }

    .admin__his__table tr th:nth-child(7),
    .admin__his__table tr td:nth-child(7) {
        width: 122.88px;
    }

    .admin__his__table tr {
        margin: 0 18px !important;
    }

    .admin__his__table__icon {
        display: block;
        width: 24px;
        height: 24px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        color: #fff;
        line-height: 24px;
        margin: 0 auto;
    }

    .admin__his__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .admin__his__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }
}

@media only screen and (max-width: 767px) {
    .admin__his {
        width: calc(100vw - 32px);
        margin: 0;
        padding: 0 0 40px 0;
        border: none;
    }
    .admin__his__nav__title {
        font-family: SFProDisplay-SemiBold, sans-serif;
        font-size: 14px;
        margin-bottom: 10px;
    }
    .admin__his__nav__form, .ques__nav__bottom {
        display: none;
    }
}

/*08Status*/
/* STATUS =============================================================== */

.status {
    background-color: #ffffff;
}

.status__nav p {
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}

@media only screen and (max-width: 767px){
    .status {
        padding: 0 0 16px 0;
    }

    .status__nav p {
        margin-bottom: 15px !important;
    }

    .admin__status .ques__nav__bottom,
    .status .ques__nav__bottom {
        display: initial;
    }

    .status .custom-select,
    .admin__status .custom-select {
        width: 100%;
        height: 40px;
        border-radius: 5px;
        border: solid 1px #d8dee2;
        background-color: #fef9f9;
        padding-left: 10px !important;
        margin-left: 0;
        margin-top: 0;
    }
    .status .select-selected,
    .admin__status .select-selected {
        line-height: 40px;
    }
}

@media only screen and (min-width: 768px){
    .status {
        width: 1177.6px;
        margin: 30.39px auto 0;
        padding: 25.6px 39.19px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
    }

    .status__nav p {
        font-size: 19.2px;
        margin-bottom: 24px !important;
    }


    .status__table {
        margin-bottom: 21.84px !important;
    }

    .status__table tr td a {
        display: inline-block;
        margin-bottom: 0 !important;
        line-height: 1.1 !important;
    }

    .status__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .status__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .status__table tr th:nth-child(1),
    .status__table tr td:nth-child(1) {
        padding-right: 7.68px;
    }

    .status__table tr th:nth-child(2),
    .status__table tr td:nth-child(2) {
        width: 120px;
    }

    .status__table tr th:nth-child(3),
    .status__table tr td:nth-child(3) {
        width: 238.72px;
    }

    .status__table tr th:nth-child(4),
    .status__table tr td:nth-child(4) {
        width: 152.64px;
    }

    .status__table tr th:nth-child(5),
    .status__table tr td:nth-child(5) {
        width: 112px;
    }

    .status__table tr th:nth-child(6),
    .main__user__history__table tr td:nth-child(6) {
        width: 144px;
    }

    .status__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .status__table {
        width: 1054.4px;
        margin: 0 auto;
        border-radius: 4px;
    }

    .status__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .status__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .status__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .status__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .status__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .status__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }
}


/*Admin_Status*/
.admin__status {
    background-color: #fff;
}

.admin__status__nav__title {
    font-family: SFProDisplayBold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}

@media only screen and (max-width: 767px){
    .admin__status {
        padding: 0 0 16px 0;
    }

    .admin__status__nav__top {
        display: inline-flex;
        flex-direction: column;
        margin-bottom: 15px !important;
    }

    .admin__status__nav__form {
        display: none;
    }

    .custom__nav__select {
        display: inline-flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        width: 100%;
    }

    .admin__status__table tr th:nth-child(2),
    .admin__status__table tr td:nth-child(2) {
        max-width: 100px;
    }

    .admin__status__table tr th:nth-child(3),
    .admin__status__table tr td:nth-child(3) {
        max-width: 150px;
    }

    .admin__status__table tr th:nth-child(4),
    .admin__status__table tr td:nth-child(4) {
        max-width: 200px;
    }

}
@media only screen and (min-width: 768px){
    /* ADMIN STATUS =========================================== */

    .admin__status {
        width: 1137.6px;
        margin: 30.39px auto 35.2px;
        padding: 25.6px 19.2px 49.92px 19.2px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #fff;
    }

    .admin__status__nav {
        width: 100%;
        margin-bottom: 19.84px;
    }

    .admin__status__nav__top>div {
        display: flex;
    }

    .admin__status__nav__top>div form {
        margin-right: 19.2px;
    }

    .admin__status__nav__top button {
        outline: none;
        border: none;
        display: block;
        width: 97.59px !important;
        height: 28px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }

    .admin__status__nav a {
        display: block;
        width: 85.6px;
        height: 28px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.5;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }

    .admin__status__nav a:hover {
        text-decoration: none;
    }

    .admin__status__nav__top {
        display: flex;
        justify-content: space-between;
    }

    .admin__status__nav__bottom, .ques__nav__bottom {
        text-align: right;
        margin-top: 12.88px;
    }


    .admin__status__nav__form {
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #FAEDED;
        width: 273.6px;
        height: 28px;
        display: flex;
        justify-content: space-between;
        /* padding: 7.2px 6.4px 0 8.8px; */
        padding-left: 8.8px;
        vertical-align: middle;
    }

    .admin__status__nav__form input[type="text"] {
        background: none;
        border: none;
        font-size: 11.99px;
        width: 80%;
    }

    .admin__status__nav__form input[type="text"]:focus {
        outline: none;
    }

    .admin__status__nav__form input[type="submit"] {
        width: 19.99px;
        height: 19.99px;
        font-size: 9.6px;
        background: none;
        border-radius: 2.4px;
        border: solid 1.6px #bb2019;
        margin: auto 6.4px auto 0;
        color: #bb2019 !important;
    }

    .admin__status__table {
        width: 97% !important;
        border-radius: 4px;
        padding: 0 !important;
        margin: 0 auto;
        /* margin-left: 21.84px; */
        margin-bottom: 21.84px;
    }

    .admin__status__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .admin__status__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .admin__status__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .admin__status__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 10.75px 0;
    }

    .admin__status__table tr th:nth-child(1),
    .admin__status__table tr td:nth-child(1) {
        width: 92.16px;
    }

    .admin__status__table tr th:nth-child(2),
    .admin__status__table tr td:nth-child(2) {
        width: 168.96px;
    }

    .admin__status__table tr th:nth-child(3),
    .admin__status__table tr td:nth-child(3) {
        width: 230.4px;
    }

    .admin__status__table tr th:nth-child(4),
    .admin__status__table tr td:nth-child(4) {
        width: 215.4px;
    }

    .admin__status__table tr th:nth-child(5),
    .admin__status__table tr td:nth-child(5) {
        width: 230.4px;
    }

    .admin__status__table tr th:nth-child(6),
    .admin__status__table tr td:nth-child(6) {
        width: 153.6px;
    }

    .admin__status__table tr th:nth-child(7),
    .admin__status__table tr td:nth-child(7) {
        width: 153.6px;
    }

    .admin__status__table tr th:nth-child(8),
    .admin__status__table tr td:nth-child(8) {
        width: 122.88px;
    }

    .admin__status__table tr {
        margin: 0 18px !important;
    }

    .admin__status__table__icon {
        display: block;
        width: 24px;
        height: 24px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        color: #fff;
        line-height: 24px;
        margin: 0 auto;
    }

    .admin__status__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .admin__status__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }
}


/*12ClassResult*/
/* CLASS RESULT ======================================= */

.classrs {
    background-color: #ffffff;
}

.classrs__result {
    margin: 0 auto;
    color: #bb2019;
}

.classrs__nav {
    display: flex;
    justify-content: space-between;
}

.classrs__nav p {
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}

@media only screen and (max-width: 767px) {
    .classrs {
        padding: 0 0 16px 0;
        margin: 0;
        border: none;
    }

    .classrs__nav {
        flex-direction: column;
    }

    .classrs__nav p,
    .classrs__nav p span {
        font-size: 14px;
        font-family: SFProDisplay-SemiBold, sans-serif;
    }

    .classrs__result {
        width: unset;
        margin: 0;
        font-size: 14px;
    }
}
@media only screen and (min-width: 768px) {

    .classrs {
        width: 1177.6px;
        margin: 0 auto;
        margin-top: 30.39px;
        padding: 25.6px 39.19px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
    }

    .classrs__result {
        width: 1054.4px;
        margin: 0 auto;
        font-size: 16px;
    }

    .classrs__nav p {
        font-size: 19.2px;
        margin-bottom: 24px !important;
    }

    .classrs__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .classrs__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .classrs__table {
        width: 1054.4px;
        margin: 0 auto;
        border-radius: 4px;
    }

    .classrs__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .classrs__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .classrs__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .classrs__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .classrs__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .classrs__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }

    .classrs__table tr th:nth-child(1),
    .classrs__table tr td:nth-child(1) {
        width: 53.88px;
    }

    .classrs__table tr th:nth-child(2),
    .classrs__table tr td:nth-child(2) {
        width: 135.36px;
    }

    .classrs__table tr th:nth-child(3),
    .classrs__table tr td:nth-child(3) {
        width: 161.92px;
    }

    .classrs__table tr th:nth-child(4),
    .classrs__table tr td:nth-child(4) {
        width: 91.2px;
    }

    .classrs__table tr th:nth-child(5),
    .classrs__table tr td:nth-child(5) {
        width: 112px;
    }

}


/*13Noti*/

.noti__wrapper {
    width: 1177.6px;
    margin: 0 auto;
    margin-top: 30.39px;
    padding: 25.6px 41.59px 25.6px 19.2px;
    border-radius: 4px;
    border: solid 1.6px #e1e4e8;
    background-color: #ffffff;
}

.noti__nav {
    display: flex;
    justify-content: space-between;
    margin-bottom: 22.4px !important;
}

.noti__nav p {
    font-size: 19.2px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
    margin-bottom: 0 !important;
}

.noti__nav a {
    font-size: 19.2px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: right;
    color: #bb2019;
}

.noti__list {}

.noti__list__item {
    display: block;
    position: relative;
    width: 1076.79px;
    height: 57.6px;
    background-color: #fafbfc;
    padding: 11.19px 19.2px;
}

.noti__list__item:hover {
    text-decoration: none;
}

.noti__list__item__content {
    width: 1047.99px;
    display: flex;
    border-bottom: solid 1.6px #e1e4e8;
;
}

.noti__list__item__img {
    width: 36px;
    height: 36px;
    margin-right: 19.2px;
    border-radius: 50%;
}

.noti__list__item__info__des {
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 0.9;
    letter-spacing: normal;
    text-align: left;
    color: #53575b;
}

.noti__list__item__info p {
    margin-bottom: 7.68px !important;
}

.noti__list__item__info__des span {
    font-weight: 600;
}

.noti__list__item__info__time img {
    width: 13.99px;
    height: 13.99px;
}

.noti__list__item__info__time {
    font-size: 12.88px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.13;
    letter-spacing: normal;
    text-align: left;
    color: #989ca4;
}

@media only screen and (max-width: 767px) {
    .noti__wrapper {
        width: calc(100vw - 32px);
        padding: 0 0 16px 0;
        margin: 0;
        border: none;
    }

    .noti__nav p,
    .noti__nav a {
        font-size: 14px;
        line-height: 32px;
        width: unset !important;
    }

    .noti__list__item {
        width: 100%;
        height: fit-content;
        padding: 0;
    }

    .noti__list__item__content {
        width: 100%;
        align-items: center;
        padding: 5px 0;
    }

    .noti__list__item__img {
        width: 50px;
        height: 50px;
    }

    .noti__list__item__info__des,
    .noti__list__item__info__time {
        font-size: 14px;
        line-height: 1.5;
        margin-bottom: 5px !important;
    }
}

/*Admin_ActivityHistory*/




@media only screen and (max-width: 767px) {
    .admin_activity {
        padding: 0 0 16px 0;
        margin: 0;
        border: none;
    }
    .admin_activity__nav__top {
        display: flex;
        flex-direction: column-reverse;
    }
    .admin_activity__nav__top div a {
        display: none;
    }
    .admin_activity__nav__title {
        font-size: 14px;
        font-family: SFProDisplay-SemiBold, sans-serif;
        padding: 10px 0;
    }

    .admin_activity__table tr th:nth-child(2),
    .admin_activity__table tr td:nth-child(2) {
        max-width: 400px;
    }

    .admin_activity__table tr th:nth-child(3),
    .admin_activity__table tr td:nth-child(3) {
        max-width: 100px;
    }

    .admin_activity__table tr th:nth-child(4),
    .admin_activity__table tr td:nth-child(4) {
        max-width: 150px;
    }

    .admin_activity__table tr th:nth-child(5),
    .admin_activity__table tr td:nth-child(5) {
        max-width: 200px;
    }

    .admin_activity__table tr th:nth-child(6) {
        max-width: 150px;
    }
}

@media only screen and (min-width: 768px) {
    .admin_activity__nav__form input[type="text"] {
        background: none;
        border: none;
        font-size: 11.99px;
        width: 80%;
    }

    .admin_activity__nav__form input[type="text"]:focus {
        outline: none;
    }

    .admin_activity__nav__form input[type="submit"] {
        width: 19.99px;
        height: 19.99px;
        font-size: 9.6px;
        background: none;
        border-radius: 2.4px;
        border: solid 1.6px #bb2019;
        margin: auto 0;
        margin-right: 6.405px;
        color: #bb2019;
    }

    .admin_activity {
        width: 1137.6px;
        margin: 0 auto;
        margin-top: 30.39px;
        margin-bottom: 35.2px;
        padding: 25.6px 19.2px 49.92px 19.2px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #fff;
    }

    .admin_activity__nav {
        width: 100%;
        margin-bottom: 19.84px;
    }

    .admin_activity__nav__top>div {
        display: flex;
    }

    .admin_activity__nav__top>div button {
        margin-left: 12.88px;
    }

    .admin_activity__nav__top>div form {
        margin-right: 19.2px;
    }

    .admin_activity__nav__title {
        font-family: SFProDisplayBold;
        font-size: 19.2px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: left;
        color: #1b1c1e;
    }

    .admin_activity__nav button {
        outline: none;
        border: none;
        display: block;
        width: 85.6px;
        height: 28px;
        color: #fff;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        /* line-height: 2.5; */
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }

    .admin_activity__nav a {
        display: block;
        width: 85.6px;
        height: 28px;
        color: #fff;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.5;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }

    .admin_activity__nav a:hover {
        text-decoration: none;
    }

    .admin_activity__nav__top {
        display: flex;
        justify-content: space-between;
    }

    .admin_activity__nav__bottom {
        text-align: right;
        margin-top: 12.88px;
    }

    .admin_activity__nav__title {
        font-family: SFProDisplay;
        font-size: 19.2px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: left;
        color: #1b1c1e;
    }

    .admin_activity__nav__form {
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #FAEDED;
        width: 273.6px;
        height: 28px;
        display: flex;
        justify-content: space-between;
        /* padding: 7.2px 6.4px 0 8.8px; */
        padding-left: 8.8px;
        vertical-align: middle;
    }
    .admin_activity__nav__form button {
        display: none;
    }
    .admin_activity__table {
        width: 97% !important;
        border-radius: 4px;
        padding: 0 !important;
        margin-left: 21.84px;
        margin-bottom: 21.84px;
    }

    .admin_activity__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .admin_activity__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .admin_activity__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .admin_activity__table tr td {
        max-width: 230.4px;
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        vertical-align: top;
        hyphens: auto;
        padding: 7.68px 0;
        overflow-wrap: break-word;
    }

    .admin_activity__table tr td span {
        word-wrap: break-word;
        display: inline-block;
    }

    .admin_activity__table tr td p {
        margin-bottom: 0 !important;
    }

    .admin_activity__table tr th:nth-child(1),
    .admin_activity__table tr td:nth-child(1) {
        max-width: 50px !important;
    }

    .admin_activity__table tr th:nth-child(2),
    .admin_activity__table tr td:nth-child(2) {
        max-width: 400px !important;
    }

    .admin_activity__table tr th:nth-child(3),
    .admin_activity__table tr td:nth-child(3) {
        max-width: 100px !important;
    }

    .admin_activity__table tr th:nth-child(4),
    .admin_activity__table tr td:nth-child(4) {
        max-width: 80px !important;
    }

    .admin_activity__table tr th:nth-child(5),
    .admin_activity__table tr td:nth-child(5) {
        max-width: 130px !important;
    }

    .admin_activity__table tr th:nth-child(6) {
        max-width: 100px !important;
    }

    .admin_activity__table tr {
        margin: 0 18px !important;
    }

    .admin_activity__table__icon {
        display: block;
        width: 24px;
        height: 24px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        color: #fff;
        line-height: 24px;
        margin: 0 auto;
    }
}


/*Admin_AntiCopy*/
.anticopy__nav {
    display: flex;
    justify-content: space-between;
}

.anticopy__nav>div {
    display: flex;
}

.anticopy__nav p {
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}

.anticopy__nav div a {
    display: block;
    background-color: #bb2019;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    /*line-height: 2.5;*/
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}

.anticopy__nav div a:hover {
    text-decoration: none;
}

.compare__main {
    display: flex;
    justify-content: space-between;
    column-gap: 30.72px;
}

.compare__main__left,
.compare__main__right {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}
@media only screen and (min-width: 768px) {
    /* ANTI COPY ============================== */

    .anticopy {
        width: 1177.6px;
        margin: 0 auto;
        margin-top: 30.39px;
        padding: 25.6px 39.19px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #ffffff;
    }

    .anticopy__nav>div a:nth-of-type(1) {
        margin-right: 19.2px;
    }

    .anticopy__nav p {
        font-size: 19.2px;
        line-height: 1.5;
        margin-bottom: 24px !important;
    }

    .anticopy__nav div a {
        width: 85.6px;
        height: 28px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        line-height: 2.5;
    }

    .anticopy__nav__bottom {
        width: 100%;
        display: flex;
        justify-content: space-between;
        color: #979797;
        margin-bottom: 12.88px;
        font-size: 16px;
    }

    .anticopy__nav__bottom div {
        width: 33%;
    }

    .anticopy__nav__bottom div p {
        margin-bottom: 1.536px;
    }

    .anticopy__nav__bottom div table {
        width: 80%;
        margin: 0 auto;
    }

    .anticopy__nav__bottom div table tr td:nth-of-type(1) {
        width: 30%;
        vertical-align: top;
    }

    .anticopy__nav__bottom div table tr td:nth-of-type(2) {
        width: 70%;
    }

    .anticopy__nav__bottom div:nth-of-type(3) table {
        margin-right: 0 !important;
    }

    .anticopy__table,
    .anticopy__compare__table {
        width: 1054.4px;
        margin: 0 auto;
        border-radius: 4px;
    }

    .anticopy__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .anticopy__compare__table p {
        cursor: pointer;
    }

    .anticopy__table__head,
    .anticopy__compare__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .anticopy__table__head th,
    .anticopy__compare__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
        border-bottom: solid 1.6px #e1e4e8;
    }

    .anticopy__table tr td,
    .anticopy__compare__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .anticopy__table tr th:nth-child(1),
    .anticopy__table tr td:nth-child(1) {
        width: 84.6px;
    }

    .anticopy__table tr th:nth-child(2),
    .anticopy__table tr td:nth-child(2) {
        width: 322.56px;
    }

    .anticopy__table tr th:nth-child(3),
    .anticopy__table tr td:nth-child(3) {
        width: 107.52px;
    }

    .anticopy__table tr th:nth-child(4),
    .anticopy__table tr td:nth-child(4) {
        width: 153.6px;
    }

    .anticopy__table tr th:nth-child(5),
    .anticopy__table tr td:nth-child(5) {
        width: 230.4px;
    }

    .anticopy__table tr th:nth-child(6),
    .anticopy__table tr td:nth-child(6) {
        width: 107.52px;
    }

    .anticopy__compare__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .anticopy__compare__table tbody tr td {
        vertical-align: top;
    }

    .anticopy__compare__table tr td p {
        margin-bottom: 0 !important;
    }

    .anticopy__compare__table tr th:nth-child(1),
    .anticopy__compare__table tr td:nth-child(1) {
        width: 84.6px;
    }

    .anticopy__compare__table tr th:nth-child(2),
    .anticopy__compare__table tr td:nth-child(2) {
        width: 276.48px;
    }

    .anticopy__compare__table tr th:nth-child(3),
    .anticopy__compare__table tr td:nth-child(3) {
        width: 322.56px;
    }

    .compare {
        width: 1177.6px;
        margin: 0 auto;
        margin-top: 30.39px;
        padding: 25.6px 39.19px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #FEF9F9;
    }

    .compare__nav {
        display: flex;
        justify-content: space-between;
        font-size: 19.2px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.96;
        letter-spacing: normal;
        text-align: left;
    }

    .compare__nav>div {
        display: flex;
    }

    .compare__nav p {
        margin-right: 31.99px;
    }

    .compare__main>div {
        width: 50%;
    }

    .compare__main .submit__des {
        width: 100%;
        border-radius: 4px;
        border: solid 1.6px #d8dee2;
        background-color: #ffffff;
        margin-bottom: 38.4px;
        margin: 0 !important;
        position: relative;
    }

    .compare__main .submit__des>table {
        margin-bottom: 92.16px;
    }

    .compare__main .submit__des>div {
        position: absolute;
        bottom: 4% !important;
    }

    .compare__main .submit__pad {
        width: 100%;
        height: 364.64px !important;
    }

    .compare__main .submit__pad__main {
        width: 100%;
        height: 364.64px !important;
    }

    .compare__main .editor {
        width: 100% !important;
        height: 349.28px !important;
    }

    /*.compare__main__left .submit__des,*/
    /*.compare__main__right .submit__pad,*/
    /*.compare__main__left .submit__des,*/
    /*.compare__main__right .submit__pad {*/
    /*    width: 45%;*/
    /*}*/

    .text--bold {
        font-family: SFProDisplayBold;
    }


    /* ADMIN ANTI COPY ================================= */

    .admin__addanticopy {
        position: relative;
        width: 538.39px;
        border-radius: 4px;
        border: solid 1.6px #dfe1e6;
        background-color: #ffffff;
        padding: 28.8px;
        margin: 0 auto;
        font-size: 12.88px;
    }

    .admin__addanticopy__nav {
        border-bottom: solid 1.6px #dfe1e6;
        margin-bottom: 17.6px;
        display: flex;
        justify-content: space-between;
        padding-bottom: 11.19px !important;
    }

    .admin__addanticopy__nav>a:hover {
        text-decoration: none;
        color: #bb2019;
    }

    .admin__addanticopy__nav>p {
        font-size: 19.2px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.1;
        letter-spacing: normal;
        text-align: left;
        color: #0c0c0c;
    }

    .admin__addanticopy table {
        margin: 0 auto;
        font-size: 12.88px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.3;
        letter-spacing: normal;
        color: #0c0c0c;
        margin-right: 108.79px;
    }

    .admin__addanticopy__label {
        font-family: SFProDisplayMedium;
        text-align: right;
        vertical-align: top;
        font-size: 12.88px !important;
        vertical-align: middle;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.75;
        letter-spacing: normal;
        text-align: right;
        color: #0c0c0c;
    }

    .admin__addanticopy__multi {
        min-height: 61.44px !important;
    }

    .admin__addanticopy .select__subject,
    .admin__addanticopy .select__term {
        width: 223.99px !important;
        background-color: #fafbfc;
    }

    .admin__addanticopy input {
        height: 29.59px;
    }

    .admin__addanticopy table tr td:nth-of-type(1) {
        min-width: 153.6px !important;
    }

    .admin__addanticopy input,
    .admin__addanticopy textarea {
        width: 223.99px;
        border-radius: 2.4px;
        border: solid 1.6px #dfe1e6;
        margin-bottom: 6.405px;
        padding-left: 4.6px;
        background-color: #fafbfc;
        margin-left: 16px;
    }

    .admin__addanticopy textarea {
        height: 92px;
        resize: none;
    }

    .admin__addanticopy textarea:focus {
        outline: none;
    }


    /* .admin__addanticopy .checkbox--block{
        margin-bottom: 8.8px;
    } */

    .admin__addanticopy .checkbox--block label {
        margin-left: 16px;
        font-size: 12.88px !important;
    }

    .admin__addanticopy .checkbox--block label::before {
        width: 12.88px;
        height: 12.88px;
        font: 12.88px/12.79px sans-serif;
    }

    .admin__addanticopy .select-items div,
    .admin__addanticopy .select-selected {
        text-align: left !important;
    }

    .admin__addanticopy__btn {
        text-align: right;
    }

    .admin__addanticopy__btn button {
        background: none;
        border: none;
        width: 115.2px;
        height: 28.8px;
        border-radius: 4px;
        font-size: 12.88px;
    }

    .admin__addanticopy__btn button:focus {
        outline: none;
    }

    .admin__addanticopy__btn button:nth-child(1) {
        background-color: #bb2019 !important;
        color: #fff;
    }

    .admin__addanticopy__btn button:nth-child(2) {
        color: #505F79;
    }

    .admin__addanticopy__btn button:nth-child(2):hover {
        background-color: #FAEEED;
    }

    .admin__addanticopy form tr td p {
        margin-top: 6.405px;
        margin-bottom: 19.2px;
        margin-left: 10.39px;
    }

    .admin__addanticopy select {
        width: 223.99px;
        height: 29.59px;
        border-radius: 2.4px;
        border: solid 1.6px #dfe1e6;
        margin-bottom: 6.405px;
        padding-left: 4.6px;
        background-color: #fafbfc;
        margin-left: 16px;
    }

    .admin__addanticopy__form__radio {
        /* margin-bottom: 6.405px; */
        vertical-align: middle;
        margin-left: 16px;
        font-size: 12.88px !important;
        display: flex;
        justify-content: space-between;
    }

    .admin__addanticopy__form__radio label {
        font-size: 12.88px !important;
        font-family: SFProDisplayMedium;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        text-align: left;
        color: #171717;
    }

    .admin__addanticopy__form__radio input:checked {
        background-color: #bb2019 !important;
        color: #bb2019 !important;
    }


    /* Customize the label (the container) */

    .admin__addanticopy__form__radio label {
        display: block;
        position: relative;
        padding-left: 19.96px;
        cursor: pointer;
        font-size: 22px;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }


    /* Hide the browser's default radio button */

    .admin__addanticopy__form__radio label input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }


    /* Create a custom radio button */


    /* On mouse-over, add a grey background color */

    .admin__addanticopy__form__radio label:hover input~.checkmark {
        background-color: #ccc;
    }


    /* When the radio button is checked, add a blue background */

    .admin__addanticopy__form__radio label input:checked~.checkmark {
        background-color: #bb2019;
    }


    /* Create the indicator (the dot/circle - hidden when not checked) */

    .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }


    /* Show the indicator (dot/circle) when checked */

    .admin__addanticopy__form__radio label input:checked~.checkmark:after {
        display: block;
    }


    /* Style the indicator (dot/circle) */

    .admin__addanticopy__form__radio label .checkmark:after {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 4.86px;
        height: 4.86px;
        border-radius: 50%;
        background: white;
    }

    .compare__nav .link--red {
        line-height: 1.96;
    }

}

@media only screen and (max-width: 767px) {

    .teacher__anticopy {
        padding-left: 16px;
        padding-right: 16px;
    }
    .anticopy__nav p {
        line-height: 32px;
        font-family: SFProDisplay-SemiBold, sans-serif;
    }

    .anticopy__nav {
        display: flex;
        justify-content: space-between;
    }

    .admin__addanticopy {
        width: calc(100vw - 32px);
        margin: 16px;
        padding: 15px;
        border-radius: 4px;
        border: solid 1px #dfe1e6;
    }

    .admin__addanticopy__nav {
        border-bottom: solid 1px #dfe1e6;
        margin-bottom: 16px;
        display: flex;
        justify-content: space-between;
    }

    .admin__addanticopy__nav>a:hover {
        text-decoration: none;
        color: #bb2019;
    }

    .admin__addanticopy__nav>p {
        font-family: SFProDisplay-SemiBold, sans-serif;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.1;
        letter-spacing: normal;
        text-align: left;
        color: #0c0c0c;
    }

    .admin__addanticopy__label {
        text-align: right;
        vertical-align: top;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.75;
        letter-spacing: normal;
        text-align: right;
        color: #0c0c0c;
    }

    .admin__addanticopy__form__radio {
        /* margin-bottom: 0.417vw; */
        vertical-align: middle;
        display: flex;
        column-gap: 40px;
    }

    .admin__addanticopy__form__radio label {
        font-family: SFProDisplayMedium;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        text-align: left;
        color: #171717;
    }

    .admin__addanticopy__form__radio input:checked {
        background-color: #bb2019 !important;
        color: #bb2019 !important;
    }


    /* Customize the label (the container) */

    .admin__addanticopy__form__radio label {
        display: block;
        position: relative;
        padding-left: 21px;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }


    /* Hide the browser's default radio button */

    .admin__addanticopy__form__radio label input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }
    /* On mouse-over, add a grey background color */

    .admin__addanticopy__form__radio label:hover input~.checkmark {
        background-color: #ccc;
    }


    /* When the radio button is checked, add a blue background */

    .admin__addanticopy__form__radio label input:checked~.checkmark {
        background-color: #bb2019;
    }


    /* Create the indicator (the dot/circle - hidden when not checked) */

    .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }


    /* Show the indicator (dot/circle) when checked */

    .admin__addanticopy__form__radio label input:checked~.checkmark:after {
        display: block;
    }


    /* Style the indicator (dot/circle) */

    .admin__addanticopy__form__radio label .checkmark:after {
        top: 50%;
        left: 50%;
        width: 16px;
        height: 16px;
        border-radius: 50%;
        border: solid 5px #bb2019;
        transform: translate(-50%, -50%);
        background: white;
    }

    .admin__addanticopy form tr td {
        padding-bottom: 8px;
    }

    .admin__addanticopy form tr td:last-child {
        padding-left: 16px;
    }

    .admin__addanticopy select {
        width: 100%;
        min-height: 32px;
        border-radius: 5px;
        border: solid 1px #dfe1e6;
        background-color: #fafbfc;
        padding: 5px;
    }

    .admin__addanticopy input,
    .admin__addanticopy textarea {
        width: 100%;
        border-radius: 4px;
        border: solid 1px #dfe1e6;
        background-color: #fafbfc;
        min-height: 32px;
        resize: none;
    }

    .stdlistadd__btn {
        position: relative;
        text-align: center;
    }

    .stdlistadd__btn button:last-child {
        position: absolute;
        right: 0;
    }

    .admin__addanticopy textarea:focus {
        outline: none;
    }

    .anticopy__nav__bottom {
        display: none;
    }

    .anticopy .anticopy__nav div {
        display: inline-flex;
        row-gap: 10px;
        flex-direction: column;
        margin-bottom: 16px;
    }

    .anticopy__compare__table tbody tr td p{
        margin-bottom: 0;
    }

    .anticopy__compare__table tbody tr td:nth-child(2){
        width: 120px;
    }

    .anticopy__compare__table tbody tr td:nth-child(3){
        width: 220px;
    }

    .classlist__confirm__popup,
    .classlist__success__popup {
        position: absolute;
    }

    .classlist__success__popup .submit,
    .classlist__success__popup .compare{
        margin-top: 0;
        background-color: white;
    }

    .classlist__success__popup.success__message{
        top: 10vh;
        width: 60vw;
        background-color: white;
        height: 100px;
        border: 1px solid red;
    }

    .success__message .classlist__success__popup__main{
        width: 100%;
        top: 50px;
        height: 100px;
        font-size: 14px !important;
        padding: 10px;
    }

    .success__message .classlist__success__popup__main p{
        font-size: 14px !important;
        margin-bottom: 2px;
    }

    .success__message .classlist__success__popup__main img{
        width: 15px;
    }

    .classlist__confirm__popup__main__btn,
    .classlist__success__popup__main__btn {
        padding-right: 0;
    }

    .classlist__confirm__popup__main__btn button,
    .classlist__success__popup__main__btn button {
        font-size: 12px;
        width: 60px;
        height: 20px;
        margin-top: 10px;
        border-radius: 2px;
    }

    .submit a.link--red,
    .compare a.link--red {
        padding-right: 5px;
        width: unset;
        text-align: left;
        line-height: 32px;
    }

    .wrapper {
        position: relative;
    }

    .compare__nav > div:first-child {
        display: flex;
        justify-content: space-between;
    }

    .compare__nav > div:last-child {
        display: flex;
        justify-content: right;
    }

    .compare__nav p {
        margin-bottom: 0;
    }

    .compare__nav p,
    .compare__nav p a,
    .compare__nav p span{
        line-height: 1.25;
        font-family: SFProDisplay-SemiBold, sans-serif;
    }

    .compare__main {
        margin-top: 16px;
        flex-direction: column;
        row-gap: 16px;
    }

    .compare__main > div {
        width: 100%;
        row-gap: 16px;
    }

    .classlist__success__popup  .submit__des {
        width: 100%;
        border-radius: 5px;
        border: solid 1px #d8dee2;
        background-color: #ffffff;
        position: relative;
        padding: 15px;
        display: block;
        margin: 0;
    }

    .anticopy__table tr th:nth-child(2),
    .anticopy__table tr td:nth-child(2) {
        max-width: 250px;
    }

    .anticopy__table tr th:nth-child(3),
    .anticopy__table tr td:nth-child(3) {
        max-width: 250px;
    }

    .anticopy__table tr th:nth-child(4),
    .anticopy__table tr td:nth-child(4) {
        max-width: 250px;
    }

    .anticopy__table tr th:nth-child(5),
    .anticopy__table tr td:nth-child(5) {
        max-width: 250px
    }

    div[class$="add__btn"] {
        position: relative;
        text-align: center;
    }

    div[class$="add__btn"] button:last-child {
        position: absolute;
        right: 0;
    }

    div[class$="add__btn"] button {
        background: none;
        border: none;
        width: 26vw;
        height: 8vw;
        border-radius: 4px;
        font-size: 4vw;
    }
    .classlist__success__popup .submit__pad__main {
        position: relative;
        height: calc(100vh - 350px);
        top: unset;
    }
}


/*Admin_Comment*/

.admin__comm {
    width: 1137.6px;
    margin: 30.39px auto 35.2px;
    padding: 25.6px 19.2px 49.92px 19.2px;
    border-radius: 4px;
    border: solid 1.6px #e1e4e8;
    background-color: #fff;
}

.admin__comm__nav {
    width: 100%;
    margin-bottom: 19.84px;
}

.admin__comm__nav__top>div {
    display: flex;
}

.admin__comm__nav__top>div form {
    margin-right: 19.2px;
}

.admin__comm__nav__title {
    font-family: SFProDisplayBold;
    font-size: 19.2px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}

.admin__comm__nav a {
    display: block;
    width: 85.6px;
    height: 28px;
    border-radius: 2.4px;
    background-color: #bb2019;
    font-size: 11.99px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 2.5;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}

.admin__comm__nav a:hover {
    text-decoration: none;
}

.admin__comm__nav__top {
    display: flex;
    justify-content: space-between;
}

.admin__comm__nav__bottom {
    text-align: right;
    margin-top: 12.88px;
}

.admin__comm__nav__title {
    font-family: SFProDisplay;
    font-size: 19.2px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
}

.admin__comm__nav__form {
    border-radius: 4px;
    border: solid 1.6px #e1e4e8;
    background-color: #FAEDED;
    width: 273.6px;
    height: 28px;
    display: flex;
    justify-content: space-between;
    /* padding: 7.2px 6.4px 0 8.8px; */
    padding-left: 8.8px;
    vertical-align: middle;
}

.admin__comm__nav__form input[type="text"] {
    background: none;
    border: none;
    font-size: 11.99px;
    width: 80%;
}

.admin__comm__nav__form input[type="text"]:focus {
    outline: none;
}

.admin__comm__nav__form input[type="submit"] {
    width: 19.99px;
    height: 19.99px;
    font-size: 9.6px;
    background: none;
    border-radius: 2.4px;
    border: solid 1.6px #bb2019;
    margin: auto 6.4px auto 0;
    color: #bb2019 !important;
}

.admin__comm__dropdown ul::before {
    right: 5%;
}

.admin__comm__dropdown {
    right: 40%;
    min-width: 122.88px !important;
    top: 100% !important;
    box-shadow: 2.4px 2.4px 2.4px 2.4px rgba(96, 14, 96, 0.16);
}

.admin__comm__dropdown ul li {
    border: none !important;
    font-size: 12.88px !important;
    padding: 4.8px 26.4px !important;
    text-align: center;
    color: #000 !important;
}

.admin__comm__dropdown ul li a {
    color: #000 !important;
}

@media only screen and (min-width: 768px){
    .admin__comm__table {
        width: 97% !important;
        border-radius: 4px;
        padding: 0 !important;
        margin-left: 21.84px;
        margin-bottom: 21.84px;
    }

    .admin__comm__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .admin__comm__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .admin__comm__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .admin__comm__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
    }

    .admin__comm__table tr th:nth-child(1),
    .admin__comm__table tr td:nth-child(1) {
        width: 61.44px;
    }

    .admin__comm__table tr th:nth-child(2),
    .admin__comm__table tr td:nth-child(2) {
        width: 61.44px;
        padding-right: 30.72px;
    }

    .admin__comm__table tr th:nth-child(3),
    .admin__comm__table tr td:nth-child(3) {
        width: 168.96px;
    }

    .admin__comm__table tr th:nth-child(4),
    .admin__comm__table tr td:nth-child(4) {
        width: 122.88px;
    }

    .admin__comm__table tr th:nth-child(5),
    .admin__comm__table tr td:nth-child(5) {
        width: 184.32px;
    }

    .admin__comm__table tr th:nth-child(6),
    .admin__comm__table tr td:nth-child(6) {
        width: 107.52px;
        padding-right: 46.08px;
    }

    .admin__comm__table tr th:nth-child(7),
    .admin__comm__table tr td:nth-child(7) {
        width: 184.32px;
    }

    .admin__comm__table tr {
        margin: 0 18px !important;
    }

    .admin__comm__table__icon {
        display: block;
        width: 24px;
        height: 24px;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        color: #fff;
        line-height: 24px;
        margin: 0 auto;
    }
}

@media only screen and (max-width: 767px){
    .ques__nav__bottom, .admin__comm__nav__form {
        display: none;
    }
    .admin__comm {
        width: calc(100vw - 32px);
        padding: 0 0 16px 0;
        margin: 0;
        border: none;
    }
    .admin__comm__nav__title {
        font-size: 14px;
        font-family: SFProDisplay-SemiBold, sans-serif;
    }

    .admin__comm__table tr th:nth-child(2),
    .admin__comm__table tr td:nth-child(2) {
        max-width: 200px;
    }

    .admin__comm__table tr th:nth-child(3),
    .admin__comm__table tr td:nth-child(3) {
        max-width: 200px;
    }

    .admin__comm__table tr th:nth-child(4),
    .admin__comm__table tr td:nth-child(4) {
        max-width: 250px;
    }

    .admin__comm__table tr th:nth-child(6),
    .admin__comm__table tr td:nth-child(6) {
        max-width: 200px;
    }
}


/*Admin_ConfigClass*/

.main__config {
    width: 1137.6px;
    margin: 30.39px 31.19px 0 17.6px;
    background-color: #fff;
    padding: 25.6px !important;
    bottom: 0 !important;
    min-height: 100vh;
    position: relative;
}

.main__config .nav__profile__menu ul li,
.main__config .nav__profile__menu ul {
    padding: 0 !important;
}

.main__config .nav__profile__menu ul li span {
    text-align: center !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    padding: 3.072px 15.36px !important;
}

.main__config .nav__profile__menu ul li a {
    text-align: center !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    padding: 3.072px 15.36px !important;
}

.admin__config__main {
    width: 100%;
}

.admin__config__main>.new__nav {
    margin-bottom: 19.2px;
}

.admin__config__main tbody tr {
    /* border: solid 1.6px #e1e4e8; */
}

.admin__config__main tr th:nth-child(1),
.admin__config__main tr td:nth-child(1) {
    padding-left: 30.72px;
    width: 153.6px;
}

.admin__config__main tr th:nth-child(2),
.admin__config__main tr td:nth-child(2) {
    width: 153.6px;
}

.admin__config__main tr th:nth-child(3),
.admin__config__main tr td:nth-child(3) {
    width: 138.24px;
}

.admin__config__main tr th:nth-child(4),
.admin__config__main tr td:nth-child(4) {
    width: 122.88px;
}

.admin__config__main tr th:nth-child(5),
.admin__config__main tr td:nth-child(5) {
    width: 122.88px;
}

.admin__config__main tr td {
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.4;
    letter-spacing: normal;
    vertical-align: top;
}

.config__class tr th:nth-child(1),
.config__class tr td:nth-child(1) {
    padding-left: 0px;
    width: 92.16px;
}

.config__class tr th:nth-child(2),
.config__class tr td:nth-child(2) {
    width: 92.16px;
}

.config__class tr th:nth-child(3),
.config__class tr td:nth-child(3) {
    width:261.12px;
}

.config__class tr th:nth-child(4),
.config__class tr td:nth-child(4) {
    width:261.12px;
}

.config__class tr th:nth-child(5),
.config__class tr td:nth-child(5) {
    width: 122.88px;
}

.config__class tr th:nth-child(6),
.config__class tr td:nth-child(6) {
    width: 122.88px;
}

.config__class tr th:nth-child(7),
.config__class tr td:nth-child(7) {
    width: 122.88px;
}

@media only screen and (min-width: 768px) {
    .main__config .select__subject {
        width: 276.48px !important;
        z-index: 990 !important;
    }
    .main__config .custom__nav__select {
        margin-top: 0;
    }
    .admin__config__main tr td {
        height: 44.55px;
        font-size: 16px;
        border-bottom: solid 1.6px #e1e4e8;
        padding-top: 7.68px;
    }
}
@media only screen and (max-width: 767px) {

    .main__config {
        width: calc(100vw - 32px);
        margin: 0;
        padding: 0 0 40px 0 !important;
        position: relative;
    }
    .main__config .custom-select {
        height: 40px;
        padding-left: 10px !important;
        padding-bottom: 0 !important;
        margin: 0 0 15px;
        z-index: 2;
    }
    .main__config .custom-select:last-child {
        z-index: 1;
    }
    .main__config .select-selected {
        line-height: 40px;
    }
    .admin__config__title {
        display: none !important;
    }
    .admin__config {
        width: auto !important;
    }
    .admin__config>ul li[class=text--grey] {
        padding-top: 0.703vw;
        padding-bottom: 0.469vw;
        font-family: 'SFProDisplayMedium' !important;
    }
    .admin__config ul li a {
        display: block;
        color: #000000;
        padding: 1.4vw 0 !important;
        width: auto !important;
    }
    .setting--active {
        color: #BB2019 !important;
    }
    .admin__config ul {
        list-style-type: none;
        padding-left: 0.625vw !important;
        font-size: 14px !important;
    }
    li.text--grey {
        font-size: 18px !important;
    }
    .admin__config__main>.new__nav {
        margin-bottom: 4vw !important;
        /* display: flex !important; */
        justify-content: space-between !important;
        align-items: stretch;
        flex-direction: column;
    }
    .new__nav__title {
        font-size: 14px;
        font-family: SFProDisplayMedium, sans-serif;
        text-transform: uppercase;
    }
    .new__nav__wrap__title {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .select__group {
        display: none;
    }
    .select__term {
        width: 100%;
        margin-top: 4vw;
    }
    .select__subject {
        margin-top: 4vw;
    }

    .admin__config>ul  {
        padding-bottom: 10px;
        border-bottom: 1px solid #E1E4E8;
    }
    .admin__config>ul li:nth-child(8) {
        padding-bottom: 10px;
        border-bottom: 1px solid #E1E4E8;
    }
    .admin__config>ul li:nth-child(9) {
        padding-top: 10px;
    }

    .admin__config__title {
        font-family: SFProDisplay-SemiBold, sans-serif;
        font-size: 18px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.64;
        letter-spacing: normal;
        text-align: left;
        color: #707070;
        margin-bottom: 0vw;
    }

    .main__config {
        width: 100%;
        margin: 0;
        background-color: #fff;
        padding: 0 0 20px !important;
        bottom: 0 !important;
        min-height: unset;
        position: relative;
    }

    .admin__config__addType .admin__addanticopy {
        margin-top: 0;
    }
    .admin__addanticopy {
        position: relative;
        width: 100%;
        border-radius: 4px;
        border: solid 1px #dfe1e6;
        background-color: #ffffff;
        padding: 4vw;
        margin: 0 auto;
        font-size: 14px;
    }
    .admin__addanticopy__nav {
        border-bottom: solid 0.104vw #dfe1e6;
        margin-bottom: 4vw;
        display: flex;
        justify-content: space-between;
        padding-bottom: 0.729vw !important;
    }
    .admin__addanticopy__nav p {
        margin-bottom: 5px !important;
    }

    .admin__addanticopy table {
        font-size: 14px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.3;
        letter-spacing: normal;
        color: #0c0c0c;
        width: 100%;
    }

    .admin__addanticopy table tbody tr td:first-child {
        width: 67px;
    }
    .admin__addanticopy input {
        height: 8vw;
    }
    .admin__addanticopy textarea {
        height: 29vw;
        resize: none;
    }
    .accountadd__label {
        font-family: SFProDisplay, sans-serif;
        font-size: 14px !important;
        vertical-align: top;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.75;
        letter-spacing: normal;
        text-align: right;
        color: #0c0c0c;
    }
    .admin__addanticopy .checkbox--block label {
        margin-left: 1.042vw;
        font-size: 14px !important;
    }
    .admin__addanticopy .checkbox--block label::before {
        width: 5vw;
        height: 5vw;
        font: 4vw/4vw sans-serif;
        margin-right: 3vw;
    }
    .admin__addanticopy form tr td p {
        margin-bottom: 1.25vw;
        margin-left: 0.677vw;
        color: #828282;
    }

    .setting__main__popup,
    .setting__main__popup__fail__single {
        position: absolute;
        min-width: 83vw;
        min-height: 8vw;
        background-color: #d4e2f7;
        top: 50vw;
        left: 50%;
        transform: translate(-50%, -50%);
        display: flex;
        justify-content: start;
        padding: 1.146vw 2.5vw;
        cursor: pointer;
        z-index: 9999;
    }
    .setting__main__popup img,
    .setting__main__popup__fail__single img {
        width: 5vw;
        height: 5vw;
        margin-right: 1vw;
    }
    .setting__main__popup p,
    .setting__main__popup__fail__single p {
        font-size: 14px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.27;
        letter-spacing: normal;
        text-align: left;
        margin-bottom: 0 !important;
        color: #24292e;
    }

    .accountadd__label {
        vertical-align: middle;
        line-height:  1.25;
    }

    .checkbox--block {
        display:  flex;
        align-items: center;
    }

}


/*Admin_Table*/
@media only screen and (min-width: 768px) {
    table[class$="__table"] {
        width: 97% !important;
        border-radius: 4px;
        padding: 0 !important;
        margin-bottom: 21.84px;
    }

    tr[class$="__table__head"] {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    tr[class$="__table__head"] th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

}
@media only screen and (max-width: 767px) {

    table[class$="__table"] tbody tr th:nth-child(1),
    table[class$="__table"] tbody tr td:nth-child(1) {
        width: unset;
        max-width: 150px;
    }

    table[class$="__table"] tr th:nth-child(2),
    table[class$="__table"] tr td:nth-child(2) {
        width: unset;
        max-width: 150px;
    }

    table[class$="__table"] tr th:nth-child(3),
    table[class$="__table"] tr td:nth-child(3) {
        width: unset;
        max-width: 250px;
    }

    table[class$="__table"] tr th:nth-child(4),
    table[class$="__table"] tr td:nth-child(4) {
        width: unset;
        max-width: 250px;
    }

    table[class$="__table"] tr th:nth-child(5),
    table[class$="__table"] tr td:nth-child(5) {
        width: unset;
        max-width: 100px;
    }

    table[class$="__table"] tr th:nth-child(6),
    table[class$="__table"] tr td:nth-child(6) {
        width: unset;
        max-width: 100px;
    }

    table[class$="__table"] tr th:nth-child(7),
    table[class$="__table"] tr td:nth-child(7) {
        width: unset;
        max-width: 100px;
    }
    table[class$="__table"] .nav__profile__menu ul li {
        padding: 2px 10px;
        border-bottom: 1px solid #e1e4e8;
        text-align: center;
        color: black;
    }
    .topic__stt {
        width: 15px;
        height: unset;
    }

}


/*Admin_ConfigComp*/
@media only screen and (min-width: 767px) {

}

@media only screen and (max-width: 767px) {
    .config__comp .new__nav {
        flex-direction: row !important;
    }
}


/*Admin_ConfigContest*/
@media only screen and (min-width: 767px) {

    .contestlist__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .contestlist__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .contestlist__table {
        width: 100%;
        margin: 0 auto;
        border-radius: 4px;
    }

    .contestlist__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .contestlist__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.1;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .contestlist__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .contestlist__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.4;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .contestlist__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .contestlist__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }

    .contestlist__table tr th:nth-child(1),
    .contestlist__table tr td:nth-child(1) {
        width: 46.08px;
    }

    .contestlist__table tr th:nth-child(2),
    .contestlist__table tr td:nth-child(2) {
        width: 46.08px;
        padding-right: 30.72px;
    }

    .contestlist__table tr th:nth-child(3),
    .contestlist__table tr td:nth-child(3) {
        width: 184.32px;
    }

    .contestlist__table tr th:nth-child(4),
    .contestlist__table tr td:nth-child(4) {
        width: 184.32px;
    }

    .contestlist__table tr th:nth-child(5),
    .contestlist__table tr td:nth-child(5) {
        width: 122.88px;
    }

    .contestlist__table tr th:nth-child(6),
    .contestlist__table tr td:nth-child(6) {
        width: 107.52px;
    }

    .contestlist__table tr th:nth-child(7),
    .contestlist__table tr td:nth-child(7) {
        width: 107.52px;
    }

    .contestlist__table tr th:nth-child(8),
    .contestlist__table tr td:nth-child(8) {
        width: 107.52px;
    }

    .contestlist__table tr th:nth-child(9),
    .contestlist__table tr td:nth-child(9) {
        width: 92.16px;
    }

    .contestlist__table tr th:nth-child(10),
    .contestlist__table tr td:nth-child(10) {
        width: 107.52px;
    }

    .contestlist__table .nav__profile__menu ul li,
    .contestlist__table .nav__profile__menu ul {
        padding: 0 !important;
    }

    .contestlist__table .nav__profile__menu ul li span {
        text-align: center !important;
        color: #000;
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        padding: 3.072px 15.36px !important;
    }

    .contestlist__table .nav__profile__menu ul li a {
        text-align: center !important;
        color: #000;
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        padding: 3.072px 15.36px !important;
    }
    .contestlist__table .class__dropdown ul::before {
        right: 40%;
    }

    .contestlist__table .class__dropdown {
        top: 86% !important;
    }
}

@media only screen and (max-width: 767px) {
    .admin__config__addType {
        padding: 0 0 16px;
    }

    .admin__config > ul li[class="text--grey"] {
        padding-top: 0.703vw;
        padding-bottom: 0.469vw;
        font-family: "SFProDisplayMedium" !important;
    }
    .admin__config ul li a {
        display: block;
        color: #000000;
        padding: 1.4vw 0 !important;
        width: auto !important;
    }
    .setting--active {
        color: #bb2019 !important;
    }
    .admin__config ul {
        list-style-type: none;
        padding-left: 0.625vw !important;
        font-size: 4vw !important;
    }
    .admin__config__main > .new__nav {
        margin-bottom: 4vw !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
    }
    .new__nav__title {
        font-size: 14px !important;
    }

    .config__contest .new__nav {
        flex-direction: row;
    }

    .config__contest .new__nav div {
        display: flex;
    }
    .btn-export {
        margin-right: 3vw;
    }
    .config__contest .select__subject {
        margin-bottom: 4vw;
    }
    .config__contest .select__group {
        display: none;
    }
    .config__contest .select__term {
        display: none;
    }
}


/*Admin_ConfigContestAdd*/
.contestadd__btn button:focus {
    outline: none;
}

.contestadd__btn button:nth-child(1) {
    background-color: #bb2019 !important;
    color: #fff;
}

.contestadd__btn button:nth-child(2) {
    color: #505F79;
}

.contestadd__btn button:nth-child(2):hover {
    background-color: #FAEEED;
}
.stdlistadd__form__radio label {
    display: block;
    position: relative;
    cursor: pointer;
    user-select: none;
}

.stdlistadd__form__radio label .checkmark:after {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: white;
}
.stdlistadd__form__radio {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.stdlistadd__form__radio label {
    font-size: 16px !important;
    font-family: SFProDisplayMedium;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.7;
    letter-spacing: normal;
    text-align: left;
    color: #171717;
}

.stdlistadd__form__radio input:checked {
    background-color: #bb2019 !important;
    color: #bb2019 !important;
}


/* Customize the label (the container) */

.stdlistadd__form__radio label {
    display: block;
    position: relative;
    padding-left: 19.96px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-bottom: 0;
}
.stdlistadd__form__radio label input:checked~.checkmark:after {
    display: block;
}

.stdlistadd__form__radio label input:checked~.checkmark {
    background-color: #bb2019;
}
@media only screen and (min-width: 767px) {

    .contestadd__btn {
        text-align: right;
    }

    .contestadd__btn button {
        background: none;
        border: none;
        width: 115.2px;
        height: 28.8px;
        border-radius: 4px;
        font-size: 12.88px;
    }
    .stdlistadd__form__radio label {
        padding-left: 15px;
    }

    .stdlistadd__form__radio label .checkmark:after {
        width: 3px;
        height: 3px;
    }


}

@media only screen and (max-width: 767px) {

    .admin__config__addType .stdlistadd__form__radio label {
        font-size: 4vw !important;
        margin-bottom: 5px !important;
    }
    .stdlistadd__form__radio label {
        padding-left: 8vw;
    }

    .stdlistadd__form__radio label .checkmark:after {
        width: 5px;
        height: 5px;
    }

    .checkbox--block {
        display:  flex;
        align-items: flex-start;
        margin-bottom: 0;
    }
}

/*Admin_ConfigQuesListEdit*/

.classedit {
    position: relative;
    width: 538.39px;
    border-radius: 4px;
    border: solid 1.6px #dfe1e6;
    background-color: #ffffff;
    padding: 28.8px;
    margin: 0 auto;
}

.classedit__nav {
    border-bottom: solid 1.6px #dfe1e6;
    margin-bottom: 17.6px;
    display: flex;
    justify-content: space-between;
}

.classedit__nav>a:hover {
    text-decoration: none;
    color: #bb2019;
}

.classedit__nav>p {
    font-size: 19.2px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    text-align: left;
    color: #0c0c0c;
    margin-bottom: 11.19px !important;
}

.classedit table {
    margin: 0 auto;
    font-size: 12.88px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    color: #0c0c0c;
}

.classedit__label {
    text-align: right;
    vertical-align: top;
}

.classedit .select__subject,
.classedit .select__term {
    width: 223.99px !important;
    background-color: #fafbfc;
}

input:focus,
select:focus {
    outline: none !important;
}

input::placeholder {
    color: #707087 !important;
}

select option[value=""] {
    color: #707087 !important;
}

.classedit input {
    height: 29.59px;
}

.classedit input,
.classedit textarea {
    width: 223.99px;
    border-radius: 2.4px;
    border: solid 1.6px #dfe1e6;
    margin-bottom: 6.405px;
    padding-left: 4.6px;
    background-color: #fafbfc;
    margin-left: 16px;
}

.classedit textarea {
    height: 92px;
    resize: none;
    margin-bottom: 23.04px;
}

.classedit textarea:focus {
    outline: none;
}

.classedit .checkbox--block {
    margin-bottom: 8.8px;
}

.classedit .checkbox--block:last-of-type {
    margin-bottom: 14.4px;
}

.classedit .checkbox--block label {
    margin-left: 16px;
    font-size: 12.88px !important;
}

.classedit .checkbox--block label::before {
    width: 12.88px;
    height: 12.88px;
    font: 12.88px/12.79px sans-serif;
}

.classedit .select-items div,
.classedit .select-selected {
    text-align: left !important;
}

.classedit__btn {
    text-align: right;
}

.classedit__btn button {
    background: none;
    border: none;
    width: 115.2px;
    height: 28.8px;
    border-radius: 4px;
    font-size: 12.88px;
}

.classedit__btn button:focus {
    outline: none;
}

.classedit__btn button:nth-child(1) {
    background-color: #bb2019 !important;
    color: #fff;
}

.classedit__btn button:nth-child(2) {
    color: #505F79;
}

.classedit__btn button:nth-child(2):hover {
    background-color: #FAEEED;
}

.classedit form tr td p {
    margin-top: 6.405px;
    margin-bottom: 19.2px;
    margin-left: 10.39px;
}

.label--middle {
    vertical-align: middle !important;
}

.classedit select {
    width: 223.99px;
    height: 29.59px;
    border-radius: 2.4px;
    border: solid 1.6px #dfe1e6;
    margin-bottom: 6.405px;
    padding-left: 4.6px;
    background-color: #fafbfc;
    margin-left: 16px;
}
@media only screen and (max-width: 767px) {

    .classedit {
        width: unset;
        border-radius: 5px;
        padding: 16px;
    }
    .classedit form table {
        width: 100%;
    }
    .classedit form table tr td:last-child{
        padding-left: 10px;
    }
    .classedit__nav {
        margin-bottom: 15px;
    }
    .classedit__nav p {
        font-size: 14px;
        font-family: SFProDisplay-SemiBold, sans-serif;
        padding-bottom: 10px;
    }
    .classedit__label {
        font-size: 14px;
        width: 115px;
    }
    #contestlist {
        width: 100%;
        min-height: 150px;
        font-size: 14px;
        padding: 10px;
        margin: 0 0 15px;
        border-radius: 5px;
        border: solid 1px #dfe1e6;
    }
    div[class$="edit__btn"] {
        position: relative;
        text-align: center;
    }

    div[class$="edit__btn"] button:last-child {
        position: absolute;
        right: 0;
    }

    div[class$="edit__btn"] button {
        background: none;
        border: none;
        width: 26vw;
        height: 8vw;
        border-radius: 4px;
        font-size: 4vw;
    }
}

/*Admin_ConfigStudentList*/

.studentlist .nav__profile__menu ul li,
.studentlist .nav__profile__menu ul {
    padding: 0 !important;
}

.studentlist .nav__profile__menu ul li span {
    text-align: center !important;
    color: #000;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    padding: 3.072px 15.36px !important;
}

.studentlist .nav__profile__menu ul li a {
    text-align: center !important;
    color: #000;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    padding: 3.072px 15.36px !important;
}

.studentlist {
    width: 1177.6px;
    margin: 0 auto;
    margin-top: 30.39px;
    padding: 25.6px 39.19px;
    border-radius: 4px;
    border: solid 1.6px #e1e4e8;
    background-color: #ffffff;
}

.studentlist__nav {
    display: flex;
    justify-content: space-between;
}

.studentlist .custom__nav__select {
    margin-bottom: 11.52px;
}

.studentlist .class__dropdown ul::before {
    right: 5%;
}

.studentlist .class__dropdown {
    min-width: 122.88px !important;
    right: 40% !important;
}

.studentlist__nav p {
    font-size: 19.2px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #1b1c1e;
    margin-bottom: 24px !important;
}

.studentlist__nav>div {
    display: flex;
}

.studentlist__nav__btn {
    display: block;
    width: 85.6px;
    height: 28px;
    background-color: #BB2019;
    font-size: 11.99px;
    text-align: center;
    color: #fff;
    line-height: 2.5;
    border-radius: 4px;
    margin-left: 12.88px;
}

.studentlist__nav__btn:hover {
    text-decoration: none;
    color: #fff;
}

.studentlist__nav__wrapper {
    display: flex;
}

.studentlist__nav__wrapper>a {
    margin-left: 12.88px;
}
@media only screen and (min-width: 768px) {
    .studentlist__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .studentlist__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .studentlist__table {
        width: 100%;
        margin: 0 auto;
        border-radius: 4px;
    }

    .studentlist__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .studentlist__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .studentlist__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .studentlist__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .full__screen__classlist__success__popup,
    .classlist__confirm__popup,
    .classlist__success__popup {
        width: 100%;
        height: 100vh;
        position: fixed;
        top: 0;
        overflow: scroll;
        background-color: rgba(0, 0, 0, 0.32);
        z-index: 99999;
    }

    .classlist__confirm__popup__main,
    .classlist__success__popup__main {
        background-color: #fff;
        width: 599.19px;
        height: 189.6px;
        border-radius: 4px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        padding: 24px 19.99px;
    }

    .classlist__success__popup__main {
        width: 336.79px;
    }

    .classlist__confirm__popup__main p img,
    .classlist__success__popup__main p img {
        width: 24px;
    }

    .classlist__confirm__popup__main__title,
    .classlist__success__popup__main__title {
        font-size: 19.2px;
    }

    .classlist__confirm__popup__main__des,
    .classlist__success__popup__main__des {
        font-size: 16px;
        margin-bottom: 25.6px;
    }

    .classlist__confirm__popup__main__btn,
    .classlist__success__popup__main__btn {
        text-align: right;
        padding-right: 24px;
    }

    .classlist__confirm__popup__main__btn button,
    .classlist__success__popup__main__btn button {
        background: none;
        border: none;
        width: 77.59px;
        height: 32.79px;
        border-radius: 4px;
    }

    .classlist__confirm__popup__main__btn button:focus,
    .classlist__success__popup__main__btn button:focus {
        outline: none;
    }

    .classlist__confirm__popup__main__btn button:nth-child(1),
    .classlist__success__popup__main__btn button:nth-child(1) {
        background-color: #bb2019 !important;
        color: #fff;
    }

    .classlist__confirm__popup__main__btn button:nth-child(2),
    .classlist__success__popup__main__btn button:nth-child(2) {
        color: #505F79;
    }
}
@media only screen and (max-width: 767px) {

    .studentlist {
        width: calc(100vw - 32px);
        margin: 0;
        padding: 0 0 40px 0;
        border: none;
    }
    .studentlist__nav {
        margin-bottom: 15px;
    }
    .studentlist__nav p {
        font-size: 14px;
        font-family: SFProDisplay-SemiBold, sans-serif;
    }
    .studentlist__nav > div {
        column-gap: 5px;
        margin-left: 5px;
    }
    .studentlist__nav__btn {
        font-size: 14px;
    }
    .studentlist .nav__profile__menu {
        min-width: 100px !important;
        border-radius: 3px;
        bottom: 5px !important;
        left: -90px !important;
        top: unset !important;
        right: unset !important;
        box-shadow: 2px 2px 2px 0 rgba(96, 14, 96, 0.16);
        padding: 0 !important;
    }

}

/*Admin_ConfigStudentListInput*/
@media only screen and (min-width: 767px) {
}

@media only screen and (max-width: 767px) {

    .classedit table {
        margin: 0 auto;
        font-size: 4vw;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.3;
        letter-spacing: normal;
        color: #0c0c0c;
    }

    .classedit input,
    .classedit textarea {
        width: 66vw !important;
        border-radius: 3px;
        border: solid 0.104vw #dfe1e6;
        margin-bottom: 0.417vw;
        padding-left: 0.3vw;
        background-color: #fafbfc;
    }
    .classedit input {
        height: 8vw;
    }
    .classedit__nav p {
        font-size: 14px;
        font-family: SFProDisplay-SemiBold, sans-serif;
        padding-bottom: 0;
        line-height: 33px;
    }


    .classedit form tr td p {
        margin-top: 3vw;
        margin-bottom: 1.25vw;
        margin-left: 0.677vw;
    }
}

/*Admin_CreateAccount*/

.accountadd {
    position: relative;
    width: 538.39px;
    border-radius: 4px;
    border: solid 1.6px #dfe1e6;
    background-color: #ffffff;
    padding: 28.8px;
    margin: 0 auto;
    font-size: 12.88px;
}

.accountadd__nav {
    border-bottom: solid 1.6px #dfe1e6;
    margin-bottom: 17.6px;
    display: flex;
    justify-content: space-between;
}

.accountadd__nav>a:hover {
    text-decoration: none;
    color: #bb2019;
}

.accountadd__nav>p {
    font-size: 19.2px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    text-align: left;
    color: #0c0c0c;
    margin-bottom: 11.19px !important;
}

.accountadd table {
    margin: 0 auto;
    font-size: 12.88px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    color: #0c0c0c;
    margin-right: 108.79px;
}

.accountadd__label {
    font-family: SFProDisplayMedium;
    text-align: right;
    vertical-align: top;
    font-size: 12.88px !important;
    vertical-align: middle;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.75;
    letter-spacing: normal;
    text-align: right;
    color: #0c0c0c;
}

.accountadd .select__subject,
.accountadd .select__term {
    width: 223.99px !important;
    background-color: #fafbfc;
}

.accountadd input {
    height: 29.59px;
}

.accountadd input,
.accountadd textarea {
    width: 223.99px;
    border-radius: 2.4px;
    border: solid 1.6px #dfe1e6;
    margin-bottom: 6.405px;
    padding-left: 4.6px;
    background-color: #fafbfc;
    margin-left: 16px;
}

.accountadd textarea {
    height: 92px;
    resize: none;
}

.accountadd textarea:focus {
    outline: none;
}


/* .accountadd .checkbox--block{
    margin-bottom: 8.8px;
} */

.accountadd .checkbox--block label {
    margin-left: 16px;
    font-size: 12.88px !important;
}

.accountadd .checkbox--block label::before {
    width: 12.88px;
    height: 12.88px;
    font: 12.88px/12.79px sans-serif;
}

.accountadd .select-items div,
.accountadd .select-selected {
    text-align: left !important;
}

.accountadd__btn {
    text-align: right;
}

.accountadd__btn button {
    background: none;
    border: none;
    width: 115.2px;
    height: 28.8px;
    border-radius: 4px;
    font-size: 12.88px;
}

.accountadd__btn button:focus {
    outline: none;
}

.accountadd__btn button:nth-child(1) {
    background-color: #bb2019 !important;
    color: #fff;
}

.accountadd__btn button:nth-child(2) {
    color: #505F79;
}

.accountadd__btn button:nth-child(2):hover {
    background-color: #FAEEED;
}

.accountadd form tr td p {
    margin-top: 6.405px;
    margin-bottom: 19.2px;
    margin-left: 10.39px;
}

.accountadd select {
    width: 223.99px;
    height: 29.59px;
    border-radius: 2.4px;
    border: solid 1.6px #dfe1e6;
    margin-bottom: 6.405px;
    padding-left: 4.6px;
    background-color: #fafbfc;
    margin-left: 16px;
}

.accountadd__import {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12.88px;
}

.accountadd__import div p {
    margin-bottom: 0 !important;
}

.accountadd__import>a {
    display: block;
    width: 60.79px;
    height: 23.19px;
    color: #fff;
    border-radius: 2.4px;
    background-color: #bb2019;
    font-size: 12.88px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.9;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
}

.accountadd__import>a:hover {
    text-decoration: none;
}
@media only screen and (min-width: 767px) {

}

@media only screen and (max-width: 767px) {
    .bg__wrapper {
        width: auto;
        padding: 0 16px 40px;
        border-radius:40px;
        border: solid 0 #e1e4e8;
        background-color: #ffffff;
    }
    .accountadd__nav {
        border-bottom: solid 0.104vw #dfe1e6;
        margin-bottom: 2vw;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .accountadd__nav > p {
        margin-top: 2vw;
        font-size: 4vw;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.1;
        letter-spacing: normal;
        text-align: left;
        color: #0c0c0c;
        margin-bottom: calc(2vw + 10px) !important;
    }
    .accountadd {
        position: relative;
        width: auto;
        border-radius: 4px;
        border: solid 0.104vw #dfe1e6;
        background-color: #ffffff;
        margin: 0;
        font-size: 4vw;
        padding: 10px;
    }
    .accountadd__import {
        display: flex;
        justify-content: space-between;
        margin-bottom: 3vw;
    }
    .accountadd__import > a {
        display: block;
        width: 26vw;
        height: 8vw;
        border-radius: 4px;
        background-color: #bb2019;
        font-size: 4vw;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.9;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
        padding: 0 3vw;
        position: absolute;
        top: 11px;
        right: 10px;
    }
    .accountadd table {
        width: 100%;
        margin: 0;
        font-size: 4vw;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.3;
        letter-spacing: normal;
        color: #0c0c0c;
    }
    .accountadd__label {
        /* text-align: right; */
        /* vertical-align: top; */
        font-size: 4vw !important;
        vertical-align: top;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.75;
        letter-spacing: normal;
        text-align: right;
        color: #0c0c0c;
        width: 130px;
    }
    .accountadd input {
        height: 32px;
    }
    .accountadd input,
    .accountadd textarea {
        width: calc(100% - 10px);
        border-radius: 5px;
        border: solid 1px #dfe1e6;
        margin-bottom: 3vw;
        padding-left: 10px;
        background-color: #fafbfc;
        margin-left: 10px;
    }
    .accountadd textarea {
        height: 30vw;
        resize: none;
    }
    .accountadd select {
        width: 48vw;
        height: 8vw;
        border-radius: 3px;
        border: solid 0.104vw #dfe1e6;
        margin-bottom: 3vw;
        padding-left: 0.3vw;
        background-color: #fafbfc;
        margin-left: 1.042vw;
    }

    .accountadd .checkbox--block label {
        margin-left: 1.042vw;
        font-size: 4vw !important;
    }

    .accountadd .checkbox--block label::before {
        width: 5vw;
        height: 5vw;
        font: 4vw/4vw sans-serif;
        margin-right: 3vw;
    }
    .checkbox--block {
        margin-bottom: 2vw;
    }
    .accountadd__btn {
        text-align: right;
        margin-bottom: 8vw;
        margin-top: 3vw;
    }
    .accountadd__btn button {
        background: none;
        border: none;
        width: 26vw;
        height: 8vw;
        border-radius: 3px;
        font-size: 4vw;
    }
    .accountadd__btn button:nth-child(2) {
        color: #bb2019;
    }

    .setting__main__popup {
        width: 68%;
    }
    .setting__main__popup p,
    .setting__main__popup__fail__single p {
        font-size: 4vw;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.27;
        letter-spacing: normal;
        text-align: left;
        margin-bottom: 0 !important;
        color: #24292e;
    }
    .setting__main__popup img,
    .setting__main__popup__fail__single img {
        width: 5vw;
        height: 5vw;
        margin-right: 1vw;
    }
}

/*Admin_CreateQues*/

/* QUESTION ADDING ============================ */

@media only screen and (min-width: 767px) {
    .quesadd {
        position: relative;
        width: 963.99px;
        border-radius: 4px;
        border: solid 1.6px #dfe1e6;
        background-color: #ffffff;
        padding: 28.8px;
        margin: 0 auto;
        font-size: 12.88px;
    }

    .quesadd__nav {
        border-bottom: solid 1.6px #dfe1e6;
        margin-bottom: 17.6px;
        display: flex;
        justify-content: space-between;
    }

    .quesadd__nav>a:hover {
        text-decoration: none;
        color: #bb2019;
    }

    .quesadd__nav>p {
        font-size: 19.2px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.1;
        letter-spacing: normal;
        text-align: left;
        color: #0c0c0c;
        margin-bottom: 11.19px !important;
    }

    .quesadd table {
        margin: 0 auto;
        font-size: 12.88px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.3;
        letter-spacing: normal;
        color: #0c0c0c;
    }

    .quesadd table tr td {}

    .quesadd__label {
        font-family: SFProDisplayMedium;
        text-align: right;
        vertical-align: top;
        font-size: 12.88px !important;
        vertical-align: top;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.75;
        letter-spacing: normal;
        text-align: left;
        color: #0c0c0c;
        min-width: 96px;
    }

    .quesadd .select__subject,
    .quesadd .select__term {
        width: 223.99px !important;
        background-color: #fafbfc;
    }

    .input__note__wrapper {
        margin-bottom: 12.88px;
    }

    .input__note {
        font-size: 11.19px;
        color: #707070;
        margin-bottom: 0 !important;
        padding-left: 12.88px;
    }

    .quesadd input {
        height: 29.59px;
    }

    .quesadd input,
    .quesadd textarea {
        width: 223.99px;
        border-radius: 2.4px;
        border: solid 1.6px #dfe1e6;
        margin-bottom: 6.405px;
        padding-left: 4.6px;
        background-color: #fafbfc;
        margin-left: 16px;
    }

    .quesadd textarea {
        width: 742.39px;
        min-height: 92px;
        resize: none;
    }

    .quesadd textarea:focus {
        outline: none;
    }

    .quesadd .checkbox--block {
        margin-bottom: 5.6px;
        margin-top: 5px;
    }

    .quesadd .checkbox--block label {
        margin-left: 16px;
        font-size: 12.88px !important;
    }

    .quesadd .checkbox--block label::before {
        width: 12.88px;
        height: 12.88px;
        font: 12.88px/12.79px sans-serif;
    }

    .quesadd .select-items div,
    .quesadd .select-selected {
        text-align: left !important;
    }

    .quesadd__btn {
        text-align: right;
        margin-top: 19.2px;
        margin-right: 300.79px;
    }

    .quesadd__btn button {
        background: none;
        border: none;
        width: 115.2px;
        height: 28.8px;
        border-radius: 4px;
        font-size: 12.88px;
    }

    .quesadd__btn button:focus {
        outline: none;
    }

    .quesadd__btn button:nth-child(1) {
        background-color: #bb2019 !important;
        color: #fff;
    }

    .quesadd__btn button:nth-child(2) {
        color: #505F79;
    }

    .quesadd__btn button:nth-child(2):hover {
        background-color: #FAEEED;
    }

    .bg__wrapper .setting__main__popup {
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%);
    }

    .quesadd form tr td p {
        margin-top: 6.405px;
        margin-bottom: 19.2px;
        margin-left: 10.39px;
    }

    .quesadd select {
        width: 223.99px;
        height: 29.59px;
        border-radius: 2.4px;
        border: solid 1.6px #dfe1e6;
        margin-bottom: 6.405px;
        padding-left: 4.6px;
        background-color: #fafbfc;
        margin-left: 16px;
    }

    .quesadd__selector {
        display: flex;
    }

    .quesadd__selector__wrapper {
        display: flex;
        margin-top: 12.88px;
        margin-bottom: 12.88px;
    }

    .quesadd__selector__wrapper p {
        font-size: 9.6px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2;
        letter-spacing: normal;
        text-align: right;
        color: #0c0c0c;
        vertical-align: middle;
        margin: 0 !important;
        margin-left: 19.2px !important;
    }

    .quesadd__selector__wrapper select {
        width: 108.79px;
        height: 19.2px;
        border-radius: 4px;
        background-color: #f4f5f7;
        font-size: 9.6px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.83;
        letter-spacing: normal;
        text-align: left;
        color: #707087;
        margin-left: 3.19px;
        margin-right: 79.99px;
    }

    .ckeditor__wrapper {
        margin: 0 15.36px 15.36px 15.36px;
    }
    .ck-editor__editable {min-height: 200px;}

    .admin__submit__dropdown ul::before {
        right: 2.5%;
    }

    .admin__submit__dropdown {
        right: 15%;
        min-width: 122.88px !important;
        top: 100% !important;
        box-shadow: 2.4px 2.4px 2.4px 2.4px rgba(96, 14, 96, 0.16);
    }

    .admin__submit__dropdown ul li {
        border: none !important;
        font-size: 12.88px !important;
        text-align: center;
        color: #000;
        border-bottom: solid 1.6px #dfe1e6 !important;
    }
}

@media only screen and (max-width: 767px) {
    .bg__wrapper {
        width: auto;
        padding: 0 0 40px;
        border-radius:40px;
        border: solid 0 #e1e4e8;
        background-color: #ffffff;
    }
    .quesadd {
        position: relative;
        width: auto;
        border-radius: 4px;
        border: solid 0.104vw #dfe1e6;
        background-color: #ffffff;
        margin: 0;
        font-size: 4vw;
        padding: 10px;
    }

    .quesadd__nav {
        border-bottom: solid 0.104vw #dfe1e6;
        margin-bottom: 2vw;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .quesadd__nav>p {
        margin-top: 2vw;
        font-size: 4vw;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.1;
        letter-spacing: normal;
        text-align: left;
        color: #0c0c0c;
        margin-bottom: calc(2vw + 10px) !important;
    }

    .quesadd table {
        width: 100%;
        margin: 0;
        font-size: 4vw;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.3;
        letter-spacing: normal;
        color: #0c0c0c;
    }

    .quesadd__label {
        /* text-align: right; */
        /* vertical-align: top; */
        font-size: 4vw !important;
        vertical-align: top;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.75;
        letter-spacing: normal;
        text-align: right;
        color: #0c0c0c;
        min-width: 95px;
    }

    .quesadd .select__subject,
    .quesadd .select__term {
        width: 14.583vw !important;
        background-color: #fafbfc;
    }

    .input__note__wrapper {
        margin-bottom: 0.833vw;
    }

    .input__note {
        font-size: 0.729vw;
        color: #707070;
        margin-bottom: 0 !important;
        padding-left: 0.833vw;
    }

    .quesadd input {
        height: 32px;
    }

    .quesadd input,
    .quesadd textarea {
        width: calc(100% - 10px);
        border-radius: 5px;
        border: solid 1px #dfe1e6;
        margin-bottom: 3vw;
        padding-left: 10px;
        background-color: #fafbfc;
        margin-left: 10px;
    }

    .quesadd textarea {
        height: 30vw;
        resize: none;
    }

    .quesadd textarea:focus {
        outline: none;
    }

    .quesadd .checkbox--block label {
        margin-left: 1.042vw;
        font-size: 4vw !important;
    }

    .quesadd .checkbox--block label::before {
        width: 5vw;
        height: 5vw;
        font: 4vw/4vw sans-serif;
        margin-right: 3vw;
    }
    .quesadd .checkbox--block {
        margin-bottom: 2vw;
    }

    .quesadd .select-items div,
    .quesadd .select-selected {
        text-align: left !important;
    }

    .bg__wrapper .setting__main__popup {
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%);
    }

    div[class$="add__btn"] {
        position: relative;
        text-align: center;
    }

    div[class$="add__btn"] button:last-child {
        position: absolute;
        right: 0;
    }

    div[class$="add__btn"] button {
        background: none;
        border: none;
        width: 26vw;
        height: 8vw;
        border-radius: 4px;
        font-size: 4vw;
    }


    .quesadd__btn {
        text-align: right;
        margin-top: 1.25vw;
        margin-right: 8.583vw;
    }

    .quesadd__btn button {
        background: none;
        border: none;
        width: 20vw;
        height: 6vw;
        border-radius: 6px;
        font-size: 3vw;
    }

    .quesadd__btn button:focus {
        outline: none;
    }

    .quesadd__btn button:nth-child(1) {
        background-color: #bb2019 !important;
        color: #fff;
    }

    .quesadd__btn button:nth-child(2) {
        color: #505F79;
    }

    .quesadd__btn button:nth-child(2):hover {
        background-color: #FAEEED;
    }



    .quesadd form tr td p {
        margin-top: 0.417vw;
        margin-bottom: 1.25vw;
        margin-left: 0.677vw;
    }

    .quesadd select {
        width: 100%;
        height: 32px;
        border-radius: 0.156vw;
        border: solid 0.104vw #dfe1e6;
        margin-bottom: 0.417vw;
        padding-left: 0.3vw;
        background-color: #fafbfc;
        margin-left: 0;
        font-size: 14px;
    }

    .quesadd__selector {
        display: grid !important;
    }

    .quesadd__selector__wrapper {
        display: flex;
        margin-top: 0.833vw;
        margin-bottom: 0.833vw;
        flex-direction: column;
        align-items: flex-start;
    }

    .quesadd__selector__wrapper p {
        font-size: 14px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2;
        letter-spacing: normal;
        text-align: right;
        color: #0c0c0c;
        vertical-align: middle;
        margin: 0 !important;
        margin-left: 1.25vw !important;
    }

    .quesadd__selector__wrapper select {
        width: 100%;
        height: 32px;
        border-radius: 0.260vw;
        background-color: #f4f5f7;
        font-size: 14px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.83;
        letter-spacing: normal;
        text-align: left;
        color: #707087;
        margin-left: 0;
        /* margin-right: 5.208vw; */
    }

    .ckeditor__wrapper {
        margin: 0 1vw 1vw 1vw;
    }

    .input__note {
        font-size: 3vw !important;
        color: #707070;
        margin-bottom: 0 !important;
        padding-left: 0.833vw;
    }

    .setting__main__popup img,
    .setting__main__popup__fail__single img {
        width: 3.563vw !important;
        height: 3.563vw !important;
        margin-right: 1vw;
    }

    .setting__main__popup p,
    .setting__main__popup__fail__single p {
        font-size: 3.042vw !important;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.27;
        letter-spacing: normal;
        text-align: left;
        margin-bottom: 0 !important;
        color: #24292e;
    }
}

/*Admin_Retest*/

.retest {
    position: relative;
    width: 538.39px;
    border-radius: 4px;
    border: solid 1.6px #dfe1e6;
    background-color: #ffffff;
    padding: 28.8px;
    margin: 0 auto;
    font-size: 12.88px;
}

.retest__table {
    margin: 0 auto;
}

.retest__table tr {
    border: none;
}

.retest__table tr td input {
    width: 153.6px;
}

.retest__nav {
    border-bottom: solid 1.6px #dfe1e6;
    margin-bottom: 17.6px;
    display: flex;
    justify-content: space-between;
}

.retest__nav>p {
    font-size: 19.2px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    text-align: left;
    color: #0c0c0c;
    margin-bottom: 11.19px !important;
}

.retest__label {
    font-family: SFProDisplay;
    font-size: 16px;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.7;
    letter-spacing: normal;
    text-align: left;
    color: #171717;
    margin-bottom: 6.405px !important;
    margin-top: 12.88px;
}

.retest__btn {
    text-align: right;
    margin-top: 25.6px;
}

.retest__btn button {
    background: none;
    border: none;
    width: 115.2px;
    height: 28.8px;
    border-radius: 4px;
    font-size: 12.88px;
}

.retest__btn button:focus {
    outline: none;
}

.retest__btn button:nth-child(1) {
    background-color: #bb2019 !important;
    color: #fff;
}

.retest__btn button:nth-child(2) {
    color: #505F79;
}

.retest__btn button:nth-child(2):hover {
    background-color: #FAEEED;
}

.retest__time {
    display: flex;
}

.retest__table input {
    height: 29.59px;
    border-radius: 2.4px;
    border: solid 1.6px #dfe1e6;
    margin-bottom: 6.405px;
    padding-left: 4.6px;
    background-color: #fafbfc;
    margin-left: 16px;
}


@media only screen and (max-width: 767px) {
    .retest {
        width: calc(100vw - 32px);
        padding: 10px
    }
    .retest__nav > p {
        font-size: 14px;
        font-family: SFProDisplay-SemiBold, sans-serif;
        margin-bottom: 10px !important;
    }
    .retest__table {
        min-width: unset !important;
        width: 300px !important;
        margin-top: 10px;
        border: none !important;
    }

    .retest__table input {
        width: 100% !important;
        height: 32px;
        border-radius: 3px;
        border: 1px solid #dfe1e6;
        padding-left: 10px;
    }

    .retest__table tbody tr td {
        border: none !important;
    }

    .retest__btn {
        position: relative;
        text-align: center;
    }

    .retest__btn button:last-child {
        position: absolute;
        right: 0;
    }

    .retest__btn button {
        background: none;
        border: none;
        width: 26vw;
        height: 8vw;
        border-radius: 4px;
        font-size: 4vw;
    }
}

/*Admin_StudentProfile*/
@media only screen and (min-width: 768px){

    .main__user__contest__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .main__user__contest__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .main__user__contest__table {
        width: 100%;
        margin: 0 auto;
        border-radius: 4px;
    }

    .main__user__contest__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .main__user__contest__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.1;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .main__user__contest__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .main__user__contest__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.4;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .main__user__contest__table__sub {
        margin-bottom: 0 !important;
    }

    .main__user__contest__table__group {
        margin-bottom: 0 !important;
        color: #888f9d;
    }

    .main__user__contest__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .main__user__contest__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }

    .main__user__contest__table tr th:nth-child(1),
    .main__user__contest__table tr td:nth-child(1) {
        width: 84.6px;
    }

    .main__user__contest__table tr th:nth-child(2),
    .main__user__contest__table tr td:nth-child(2) {
        width: 153.6px;
    }

    .main__user__contest__table tr th:nth-child(3),
    .main__user__contest__table tr td:nth-child(3) {
        width: 184.32px;
    }

    .main__user__contest__table tr th:nth-child(4),
    .main__user__contest__table tr td:nth-child(4) {
        width: 276.48px;
    }

    .main__user__contest__table tr th:nth-child(5),
    .main__user__contest__table tr td:nth-child(5) {
        width: 92.16px;
    }

    .main__user__contest__table tr th:nth-child(6),
    .main__user__contest__table tr td:nth-child(6) {
        width: 92.16px;
    }

    .contest__dropdown ul li {
        border-bottom: solid 1.6px #d8dee2 !important;
    }

    .main__user__contest__table .nav__profile__menu ul li,
    .main__user__contest__table .nav__profile__menu ul {
        padding: 0 !important;
    }

    .main__user__contest__table .nav__profile__menu ul li span {
        text-align: center !important;
        color: #000;
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        padding: 3.072px 15.36px !important;
    }

    .main__user__contest__table .nav__profile__menu ul li a {
        text-align: center !important;
        color: #000;
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        padding: 3.072px 15.36px !important;
    }
}
@media only screen and (max-width: 767px){
    .main__user nav a {
        width: 25%;
        padding-left: 0;
        padd-right: 0;
    }
    table[class$="__table"] .nav__profile__menu {
        min-width: 100px !important;
        border-radius: 3px;
        bottom: 5px !important;
        left: -90px !important;
        top: unset !important;
        right: unset !important;
        padding: 0 !important;
        box-shadow: 2px 2px 2px 0 rgb(96 14 96 / 16%);
    }
    table[class$="__table"] .nav__profile__menu ul {
        background-color: white;
        box-shadow: 2px 2px 2px 0 rgba(96, 14, 96, 0.16);
    }
    table[class$="__table"] .nav__profile__menu ul li {
        border-bottom: 1px solid #e1e4e8;
    }
    table[class$="__table"] .nav__profile__menu ul span {
        font-size: 14px;
        padding: 2px 10px;
        border-bottom: none;
        text-align: center;
        color: black;
    }
}

/*Admin_UploadStudentList*/

.stdlistadd {
    position: relative;
    width: 538.39px;
    border-radius: 4px;
    border: solid 1.6px #dfe1e6;
    background-color: #ffffff;
    padding: 28.8px;
    margin: 0 auto;
    font-size: 12.88px;
}

.stdlistadd__nav {
    border-bottom: solid 1.6px #dfe1e6;
    margin-bottom: 17.6px;
    display: flex;
    justify-content: space-between;
}

.stdlistadd__nav>p {
    font-size: 19.2px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    text-align: left;
    color: #0c0c0c;
    margin-bottom: 11.19px !important;
}

.stdlistadd__label {
    font-family: SFProDisplayMedium;
    font-size: 16px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.7;
    letter-spacing: normal;
    text-align: left;
    color: #171717;
    margin-bottom: 6.405px !important;
    margin-top: 12.88px;
}


.stdlistadd form tr td p {
    margin-top: 6.405px;
    margin-bottom: 19.2px;
    margin-left: 10.39px;
}

.stdlistadd__import {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12.88px;
}

.stdlistadd__import p {
    margin-bottom: 0 !important;
}

.stdlistadd .fileInput__browser {
    width: 82.4px;
    height: 29.59px;
    border-radius: 4px;
    background-color: #FAEEED;
    font-size: 11.19px !important;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 2.43 !important;
    letter-spacing: normal;
    text-align: center !important;
    color: #bb2019;
    cursor: pointer;
}




/* Hide the browser's default radio button */

/* Create a custom radio button */


/* On mouse-over, add a grey background color */

.stdlistadd__form__radio label:hover input~.checkmark {
    background-color: #ccc;
}

.stdlistadd__label--disabled:hover {
    cursor: not-allowed;
}

.stdlistadd__form__radio label input:disabled~.checkmark {
    background-color: #ccc !important;
}

.stdlistadd__form__radio label:hover input:disabled~.checkmark {
    background-color: #ccc !important;
}

.stdlistadd__form__radio label input:disabled~.checkmark::after {
    background: none !important;
}





/* Style the indicator (dot/circle) */

.stdlistadd__form__radio label .checkmark:after {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 4.86px;
    height: 4.86px;
    border-radius: 50%;
    background: white;
}


@media only screen and (max-width: 767px) {
    .stdlistadd {
        width: calc(100vw - 32px);
        border-radius: 4px;
        border: 1px solid #dfe1e6;
        padding: 10px;
        font-size: 14px;
    }
    .stdlistadd__nav p {
        font-size: 14px;
        font-family: SFProDisplay-SemiBold, sans-serif;
        margin-bottom: 10px;
        padding-bottom: 10px;
    }
    .fileInput__label {
        /* display: block !important; */
        width: 100% !important;
        display: flex !important;
        justify-content: space-between !important;
    }

    .fileInput__value {
        display: block;
        width: calc(100% - 110px);
        height: 32px;
        border-radius: 4px;
        border: solid 1px #dfe1e6;
        background-color: #ffffff;
        font-size: 14px !important;
        padding: 2px 10px;
        font-weight: normal !important;
        font-stretch: normal !important;
        font-style: normal !important;
        line-height: 1.5 !important;
        letter-spacing: normal !important;
        text-align: left !important;
        color: #707070 !important;
    }

    .stdlistadd
    .fileInput__browser {
        width: 90px !important;
        height: 32px !important;
        font-size: 14px !important;
        font-weight: normal !important;
        font-stretch: normal !important;
        font-style: normal !important;
        line-height: 2.25 !important;
        letter-spacing: normal !important;
        text-align: center !important;
        color: #bb2019 !important;
    }

    .submit__pad__nav p {
        margin-bottom: 0 !important;
        font-size: 14px;
        font-weight: 500;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.96;
        letter-spacing: normal;
        text-align: left;
        color: #1f1f1f;
    }
    .stdlistadd__label {
        font-size: 14px;
    }
    .stdlistadd__form__radio label {
        font-size: 14px !important;
        padding-left: 20px;
    }
    .stdlistadd__form__radio label .checkmark:after {
        width: 5px;
        height: 5px;
    }
    .setting__main__popup__fail {
        min-width: 90vw;
        max-height: unset;
        padding: 12px;
    }
    .setting__main__popup__fail p {
        font-size: 14px !important;
        margin-bottom: 8px !important;
    }
    .setting__main__popup__fail img {
        width: 50px !important;
        height: unset !important;
        margin-bottom: 10px;
    }
    div[class$="add__btn"] {
        position: relative;
        text-align: center;
    }

    div[class$="add__btn"] button:last-child {
        position: absolute;
        right: 0;
    }

    div[class$="add__btn"] button {
        background: none;
        border: none;
        width: 26vw;
        height: 8vw;
        border-radius: 4px;
        font-size: 4vw;
    }
}

/*Blank*/
.blank{
    width: 624.64px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    text-align: center;
}
.blank img{
    width: 100%;
    margin-top: 15px;
}
.blank p{
    text-transform: uppercase;
    font-size: 27.2px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.26;
    letter-spacing: normal;
    text-align: center;
    color: #cf4327;
    margin-top: 15.36px;
    margin-bottom: 0 !important;
}
.blank__wrapper{
    width: 100%;
    height: 100vh;
    padding: 0 !important;
}
.blank__wrapper .return__link{
    font-size: 16px;
    display: block;
    width: 0;
    min-width: fit-content;
    min-height: fit-content;
    background-color: #bb2019;
    padding: 7px 15.36px;
    border-radius: 3.133px;
    color: #fff;
    text-decoration: none;
    margin: 0 auto;
    text-align: center;
    margin-top: 12.8px;
}

@media only screen and (max-width: 767px) {
    .blank__wrapper .return__link {
        font-size: 3vw;
        display: block;
        max-width: 36vw;
        min-width: fit-content;
        min-height: fit-content;
        background-color: #bb2019;
        border-radius: 4px;
        color: #fff;
        text-decoration: none;
        margin: 0 auto;
        text-align: center;
        margin-top: 0.833vw;
    }
    .blank p {
        text-transform: uppercase;
        font-size: 2.771vw;
        font-weight: 600;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.26;
        letter-spacing: normal;
        text-align: center;
        color: #cf4327;
    }
    .wrapper{
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .blank {
        width: 70vw;
    }
}

/*Contest*/
@media only screen and (min-width: 768px) {
    /* CONTEST =============================================================== */

    .contest {
        width: 1137.6px;
        margin: 30.39px auto 0;
        padding: 25.6px 39.19px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #ffffff;
    }

    .contest__nav p {
        font-size: 19.2px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: left;
        color: #1b1c1e;
        margin-bottom: 24px !important;
    }

    .contest__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .contest__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .contest__table {
        width: 1054.4px;
        margin: 0 auto;
        border-radius: 4px;
        margin-bottom: 24px;
    }

    .contest__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .contest__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .contest__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .contest__table tr td {
        height: 44.55px;
        font-size: 16.8px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .contest__table tr td p {
        margin-bottom: 0 !important;
    }

    .contest__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .contest__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }

    .contest__table tr th:nth-child(1),
    .contest__table tr td:nth-child(1) {
        width: 79.99px;
    }

    .contest__table tr th:nth-child(2),
    .contest__table tr td:nth-child(2) {
        width: 58.56px;
        padding-right: 38.4px;
    }

    .contest__table tr th:nth-child(3),
    .contest__table tr td:nth-child(3) {
        width: 284.8px;
    }

    .contest__table tr th:nth-child(4),
    .contest__table tr td:nth-child(4) {
        width: 168px;
    }

    .contest__table tr th:nth-child(5),
    .contest__table tr td:nth-child(5) {
        width: 168px;
    }

    .contest__table tr th:nth-child(6),
    .main__user__history__table tr td:nth-child(6) {
        width: 113.28px;
    }

    .contest__table tr th:nth-child(7),
    .main__user__history__table tr td:nth-child(7) {
        width: 113.28px;
    }

    .contest__table__btn {
        margin: 0 auto;
        display: block;
        width: 68.79px;
        height: 27.2px;
        border-radius: 5px;
        background-color: #bb2019;
        font-size: 12.88px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.13;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }

    .contest__table__btn--waiting {
        margin: 0 auto;
        display: block;
        width: 68.79px;
        height: 27.2px;
        border-radius: 5px;
        background-color: #0053CD;
        font-size: 12.88px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.13;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
        user-select: none;
        cursor: no-drop;
    }

    .contest__table__btn:hover {
        color: #fff;
        text-decoration: none;
    }

    .contest__guide {
        width: 1265.6px;
        margin: 15.36px auto;
        background-color: #fff;
        padding: 25.6px 151.2px 120px 50.79px !important;
        bottom: 0 !important;
        min-height: 100vh;
        position: relative;
    }

    .contest__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .contest__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .contest__prob__table {
        width: 1054.4px;
        margin: 0 auto;
        border-radius: 4px;
        margin-bottom: 24px;
    }

    .contest__prob__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .contest__prob__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .contest__prob__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .contest__prob__table tr td {
        height: 44.55px;
        font-size: 16.8px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .contest__prob__table tr td p {
        margin-bottom: 0 !important;
    }

    .contest__prob__table__date {
        margin-bottom: 0 !important;
        line-height: 1.1;
    }

    .contest__prob__table__time {
        margin-bottom: 0 !important;
        color: #888f9d;
        line-height: 1.1;
    }

    .contest__prob__table tr th:nth-child(1),
    .contest__prob__table tr td:nth-child(1) {
        width: 33.91px;
    }

    .contest__prob__table tr th:nth-child(2),
    .contest__prob__table tr td:nth-child(2) {
        width: 58.56px;
        padding-right: 46.08px;
    }

    .contest__prob__table tr th:nth-child(3),
    .contest__prob__table tr td:nth-child(3) {
        width: 80%;
    }
}
@media only screen and (max-width: 767px) {
    .contest, .contest__guide {
        width: 100vw;
        padding: 16px;
    }

    .contest__guide {
        position: relative;
    }

    .contest__guide .setting__main {
        margin-left: 0;
    }

}

/*chat*/
@media only screen and (max-width: 767px) {
    .chat__icon__wrapper {
        font-size: 45px;
        position: fixed;
        bottom: 2.5vw;
        right: 2.5vw;
        height: 57px;
        width: 40px;
        color: #bb2019;
        text-align: center;
        cursor: pointer;
        -moz-transform: scale(-1, 1);
        -webkit-transform: scale(-1, 1);
        -o-transform: scale(-1, 1);
        -ms-transform: scale(-1, 1);
        transform: scale(-1, 1);
        /* transition: 0.5s ease-in-out; */
    }

    .chat__icon__noti {
        /* background-color: #0052cc; */
        /* color: #fff; */
        /*font-size: 1.3vw;*/
        font-weight: bold;
        position: absolute;
        border-radius: 50%;
        top: 58%;
        left: 50%;
        /* transform: translate(-50%, -50%); */
        -moz-transform: scale(-1, 1);
        -webkit-transform: scale(-1, 1);
        -o-transform: scale(-1, 1);
        -ms-transform: scale(-1, 1);
        transform: scale(-1, 1);
        z-index: -5;
    }

    #chat__icon__noti__number {
        position: absolute;
        font-size: 14px;
        margin: 0;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }

    .chat__panel {
        position: fixed;
        height: 100vh;
        width: 100vw;
        top: 0;
        right: -30vw;
        z-index: 9999;
        background-color: #fff;
        transition: 0.5s ease-in-out;
        /* opacity: 0; */
        display: block;
    }

    .chat__message__inf {
        display: flex;
        justify-content: space-between;
    }


    /* .chat__panel__box {
        height: 75vw;
    } */

    .chat__panel__box__head {
        text-align: center;
        height: 25px;
        line-height: 5vh !important;
        border-bottom: solid 0.104vw #e1e4e8;
        position: relative;
    }

    .chat__panel__box__head .closeBtn {
        position: absolute;
        right: 0.5vw;
        top: 0vw;
        background: none;
        border: none;
        outline: none;
        height: 25px;
        display: inline-flex;
        align-items: center;
    }

    .chat__panel__box__head .closeBtn {
        font-size: 14px;
    }

    .chat__panel__box__head .closeBtn:focus {
        outline: none;
    }

    .chat__panel__box__head p {
        line-height: 25px;
        font-size: 14px;
    }

    .chat__panel__box__body {
        overflow: scroll;
        padding: 16px;
        height: calc(100vh - 170px);
        overflow-x: hidden;
        /* Hide horizontal scrollbar */
    }

    .chat__panel__box__body p {
        margin-bottom: 5px;
    }

    .chat__message {
        margin-bottom: 15px;
    }

    .chat__message__inf__name,
    .chat__message__inf__time {
        color: #5e6c84;
    }

    .chat__message__inf__actor {
        color: blue;
    }

    .chat__message__inf__actor:hover {
        color: blue;
    }

    .chat__message__cont {
        background-color: #faeded;
        padding: 10px 10px 5px;
        border-radius: 4px;
        width: fit-content;
    }

    .chat__panel__input {
        padding: 16px;
        border-top: solid 1px #e1e4e8;
    }

    .chat__panel__input textarea {
        display: block;
        width: 100%;
        margin-bottom: 0.2vw;
        resize: none;
        border: none;
        outline: none;
    }

    .chat__panel__input textarea:focus {
        outline: none;
    }

    .chat__panel__input input[type=submit] {
        border: none;
        width: 5.052vw;
        height: 2.135vw;
        border-radius: 0.260vw;
        background: #bb2019 none;
        color: #fff;
        display: block;
        margin: 0 auto;
    }

    .chat__panel__input .fileInput__label {
        /* display: block !important; */
        width: 100% !important;
        display: flex !important;
        justify-content: space-between !important;
    }

    .chat__panel__input .submit__pad__nav__input {
        width: 50%;
    }

    .chat__panel__input .fileInput__value {
        display: block;
        width: 100%;
        height: 20px;
        border-radius: 2px;
        border: solid 1px #000;
        background-color: #ffffff;
        padding: 1px 5px 1px 5px;
        font-weight: normal !important;
        font-stretch: normal !important;
        font-style: normal !important;
        letter-spacing: normal !important;
        text-align: left !important;
        color: #707070 !important;
        margin-right: 0.833vw !important;
        line-height: 16px;
    }

    .chat__panel__input .fileInput__browser {
        font-weight: normal !important;
        font-stretch: normal !important;
        font-style: normal !important;
        line-height: 1.5 !important;
        letter-spacing: normal !important;
        text-align: right !important;
        color: #000 !important;
    }

    .chat__panel__input__head {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }

    .chat__panel__input__head__info {
        width: 50%;
        white-space: nowrap;
    }

}
@media only screen and (min-width: 768px) {

    .chat__icon__wrapper {
        position: fixed;
        bottom: 38.4px;
        right: 38.4px;
        height: 76.8px;
        width: 76.8px;
        color: #bb2019;
        text-align: center;
        font-size: 61.44px;
        cursor: pointer;
        -moz-transform: scale(-1, 1);
        -webkit-transform: scale(-1, 1);
        -o-transform: scale(-1, 1);
        -ms-transform: scale(-1, 1);
        transform: scale(-1, 1);
        /* transition: 0.5s ease-in-out; */
    }

    .chat__icon__noti {
        /* background-color: #0052cc; */
        /* color: #fff; */
        font-size: 19.96px;
        font-weight: bold;
        position: absolute;
        border-radius: 50%;
        top: 58%;
        left: 50%;
        /* transform: translate(-50%, -50%); */
        -moz-transform: scale(-1, 1);
        -webkit-transform: scale(-1, 1);
        -o-transform: scale(-1, 1);
        -ms-transform: scale(-1, 1);
        transform: scale(-1, 1);
        z-index: -5;
    }

    #chat__icon__noti__number {
        position: absolute;
        margin: 0;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }

    .chat__panel {
        position: fixed;
        height: 100vh;
        width: 460.8px;
        top: 0;
        right: 460.8px;
        z-index: 9999;
        background-color: #fff;
        transition: 0.5s ease-in-out;
        /* opacity: 0; */
        display: block;
        font-size: 15.36px !important;
    }

    .chat__message__inf {
        display: flex;
        justify-content: space-between;
    }


    /* .chat__panel__box {
        height: 1152px;
    } */

    .chat__panel__box__head {
        text-align: center;
        height: 5vh;
        line-height: 5vh !important;
        border-bottom: solid 1.6px #e1e4e8;
        position: relative;
    }

    .chat__panel__box__head .closeBtn {
        position: absolute;
        right: 7.68px;
        top: 0px;
        background: none;
        border: none;
        outline: none;
    }

    .chat__panel__box__head .closeBtn:focus {
        outline: none;
    }

    .chat__panel__box__head p {
        line-height: 5vh;
        font-size: 19.2px;
    }

    .chat__panel__box__body {
        overflow: scroll;
        padding: 15.36px 23.04px;
        height: 75vh;
        font-size: 15.36px !important;
        overflow-x: hidden;
        /* Hide horizontal scrollbar */
    }

    .chat__panel__box__body p {
        margin-bottom: 3.072px;
    }

    .chat__message {
        margin-bottom: 12.88px;
    }

    .chat__message__inf__name,
    .chat__message__inf__time {
        color: #5e6c84;
    }

    .chat__message__inf__actor {
        color: blue;
    }

    .chat__message__inf__actor:hover {
        color: blue;
    }

    .chat__message__cont {
        background-color: #faeded;
        padding: 3.072px 7.68px;
        border-radius: 7.68px;
        width: fit-content;
    }

    .chat__panel__input {
        padding: 15.36px 23.04px;
        border-top: solid 1.6px #e1e4e8;
    }

    .chat__panel__input textarea {
        display: block;
        width: 100%;
        margin-bottom: 3.072px;
        resize: none;
        border: none;
        outline: none;
    }

    .chat__panel__input textarea:focus {
        outline: none;
    }

    .chat__panel__input input[type=submit] {
        background: none;
        border: none;
        width: 77.59px;
        height: 32.79px;
        border-radius: 4px;
        background-color: #bb2019;
        color: #fff;
        display: block;
        margin: 0 auto;
    }

    .chat__panel__input .fileInput__label {
        /* display: block !important; */
        width: 100% !important;
        display: flex !important;
        justify-content: space-between !important;
    }

    .chat__panel__input .submit__pad__nav__input {
        width: 50%;
    }

    .chat__panel__input .fileInput__value {
        display: block;
        width: 388.31px;
        height: 19.96px;
        border-radius: 4px;
        border: solid 1.6px #000;
        background-color: #ffffff;
        font-size: 11.19px !important;
        padding: 5.729px 6.4px !important;
        font-weight: normal !important;
        font-stretch: normal !important;
        font-style: normal !important;
        line-height: 0.7 !important;
        letter-spacing: normal !important;
        text-align: left !important;
        color: #707070 !important;
        margin-right: 12.88px !important;
    }

    .chat__panel__input .fileInput__browser {
        font-size: 12.88px !important;
        font-weight: normal !important;
        font-stretch: normal !important;
        font-style: normal !important;
        line-height: 1.5 !important;
        letter-spacing: normal !important;
        text-align: right !important;
        color: #000 !important;
    }

    .chat__panel__input__head {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }

    .chat__panel__input__head__info {
        width: 50%;
        white-space: nowrap;
    }
}
/*Teacher_ContestAdd*/

.contestadd {
    position: relative;
    width: 538.39px;
    border-radius: 4px;
    border: solid 1.6px #dfe1e6;
    background-color: #ffffff;
    padding: 28.8px;
    margin: 0 auto;
}

.contestadd__nav {
    border-bottom: solid 1.6px #dfe1e6;
    margin-bottom: 17.6px;
    display: flex;
    justify-content: space-between;
}

.contestadd__nav>a:hover {
    text-decoration: none;
    color: #bb2019;
}

.contestadd__nav>p {
    font-size: 19.2px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.1;
    letter-spacing: normal;
    text-align: left;
    color: #0c0c0c;
    margin-bottom: 11.19px !important;
}

.contestadd table {
    margin: 0 auto;
    font-size: 12.88px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.3;
    letter-spacing: normal;
    color: #0c0c0c;
}

.contestadd__label {
    text-align: right;
    vertical-align: top;
}

.contestadd .select__subject,
.contestadd .select__term {
    width: 223.99px !important;
    background-color: #fafbfc;
}

.contestadd__cover {
    position: relative;
    padding-left: 4.6px;
}

.contestadd__cover input {
    position: absolute !important;
    right: 0;
    top: 20%;
}

.contestadd__cover .fileInput__label {
    /* display: block !important; */
    height: 32.256px;
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    column-gap: 10px;
}

.contestadd__cover .fileInput__value {
    width: 226.35px;
    height: 29.59px;
    margin: 0 !important;
    margin-left: 10.39px !important;
}

.contestadd__cover .fileInput__browser {
    font-size: 11.19px !important;
}

.contestadd__cover input {
    display: none !important;
}

.contestadd input {
    height: 29.59px;
}

.contestadd input,
.contestadd textarea {
    width: 300.79px;
    border-radius: 2.4px;
    border: solid 1.6px #dfe1e6;
    margin-bottom: 6.405px;
    padding-left: 4.6px;
    background-color: #fafbfc;
    margin-left: 16px;
}

#loadCoverFile {
    width: 300.79px;
    margin-left: 12.28px !important;
    margin-bottom: 7.68px;
}

.contestadd textarea {
    height: 92px;
    resize: none;
    margin-bottom: 39.19px;
}

.contestadd textarea:focus {
    outline: none;
}

.contestadd .checkbox--block {
    margin-bottom: 8.8px;
}

.contestadd .checkbox--block:last-of-type {
    margin-bottom: 14.4px;
}

.contestadd .checkbox--block label {
    margin-left: 16px;
    font-size: 12.88px !important;
}

.contestadd .checkbox--block label::before {
    width: 12.88px;
    height: 12.88px;
    font: 12.88px/12.79px sans-serif;
}

.contestadd .select-items div,
.contestadd .select-selected {
    text-align: left !important;
}

.contestadd form tr td p {
    margin-top: 6.405px;
    margin-bottom: 19.2px;
    margin-left: 10.39px;
}

.contestadd select {
    width: 300.79px;
    height: 29.59px;
    border-radius: 2.4px;
    border: solid 1.6px #dfe1e6;
    margin-bottom: 6.405px;
    padding-left: 4.6px;
    background-color: #fafbfc;
    margin-left: 16px;
}

#contestlist {
    width: 294.4px;
    height: 250.4px;
    margin-right: 38.4px;
}
@media only screen and (max-width: 767px) {

    .admin__config__addType .contestadd {
        margin-top: 0;
    }
    .contestadd {
        position: relative;
        border-radius: 6px;
        border: solid 1px #dfe1e6;
        background-color: #ffffff;
        padding: 4vw;
        font-size: 0.833vw;
        margin: 0 0 16px 0;
        width: auto;
    }
    .contestadd__nav {
        border-bottom: solid 0.104vw #dfe1e6;
        margin-bottom: 4vw;
        display: flex;
        justify-content: space-between;
        padding-bottom: 0.729vw !important;
    }
    .admin__config__addType p {
        /* margin-bottom: 0 !important; */
    }
    .contestadd__nav > p {
        font-size: 4vw;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.1;
        letter-spacing: normal;
        text-align: left;
        color: #0c0c0c;
        margin-bottom: 3vw !important;
    }
    .contestadd table {
        margin: 1vw 0 1vw auto;
        font-size: 4vw;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.3;
        letter-spacing: normal;
        color: #0c0c0c;
    }
    .contestadd__label {
        font-size: 4vw !important;
        vertical-align: top;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.25;
        letter-spacing: normal;
        text-align: right;
        color: #0c0c0c;
    }
    .contestadd input,
    .contestadd textarea {
        width: 58vw;
        border-radius: 5px;
        border: solid 0.104vw #dfe1e6;
        padding-left: 0.3vw;
        background-color: #fafbfc;
        margin-left: 1.042vw;
        margin-bottom: 3vw;
    }
    .contestadd input {
        height: 8vw;
    }
    .contestadd textarea {
        height: 29vw;
        resize: none;
    }
    .accountadd__label {
        font-family: SFProDisplayMedium;
        font-size: 4vw !important;
        vertical-align: top;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.75;
        letter-spacing: normal;
        text-align: right;
        color: #0c0c0c;
    }
    .contestadd .checkbox--block label {
        margin-left: 1.042vw;
        font-size: 4vw !important;
    }
    .contestadd .checkbox--block label::before {
        width: 5vw;
        height: 5vw;
        font: 4vw/4vw sans-serif;
        margin-right: 3vw;
    }
    .stdlistadd__btn {
        text-align: right;
        margin-top: 4vw;
    }
    .stdlistadd__btn button {
        background: none;
        border: none;
        width: 26vw;
        height: 8vw;
        border-radius: 4px;
        font-size: 4vw;
    }
    .stdlistadd__btn button:nth-child(2) {
        color: #bb2019;
    }

    .contestadd select {
        width: 58vw;
        height: 8vw;
        border-radius: 4px;
        border: solid 0.104vw #dfe1e6;
        margin-bottom: 3vw;
        padding-left: 0.3vw;
        background-color: #fafbfc;
        margin-left: 1.042vw;
    }

    .setting__main__popup,
    .setting__main__popup__fail__single {
        position: absolute;
        min-width: 83vw;
        min-height: 8vw;
        background-color: #d4e2f7;
        top: 50vw;
        left: 50%;
        transform: translate(-50%, -50%);
        display: flex;
        justify-content: start;
        padding: 1.146vw 2.5vw;
        cursor: pointer;
        z-index: 9999;
    }
    .setting__main__popup img,
    .setting__main__popup__fail__single img {
        width: 5vw;
        height: 5vw;
        margin-right: 1vw;
    }
    .setting__main__popup p,
    .setting__main__popup__fail__single p {
        font-size: 4vw;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.27;
        letter-spacing: normal;
        text-align: left;
        margin-bottom: 0 !important;
        color: #24292e;
    }
    .checkbox--block {
        margin-bottom: 3vw;
    }

    .admin__config__addType .stdlistadd__form__radio label {
        font-size: 4vw !important;
        margin-bottom: 0 !important;
    }
    .stdlistadd__form__radio label {
        display: block;
        position: relative;
        padding-left: 8vw;
        cursor: pointer;
        user-select: none;
    }
    .stdlistadd__form__radio label .checkmark:after {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 2.317vw;
        height: 2.317vw;
        border-radius: 50%;
        background: white;
    }

    .checkbox--block {
        display:  flex;
        align-items: flex-start;
        margin-bottom: 0;
    }
    .contestadd__cover
    .fileInput__value {
        height: 32px;
        width: calc(100% - 65px);
        border: solid 1px #dfe1e6;
        padding-left: 10px;
        line-height: 32px;
    }
    .contestadd__cover
    .fileInput__browser {
        font-size: 14px !important;
        height: 32px;
        width: 55px;
        color: #bb2019 !important;
        text-align: right;
        line-height: 32px;
        margin: 0 !important;
        position: initial !important;
        background-color: #FAEEED;
        padding: 0 5px;
        border-radius: 4px;
    }
    .contestadd__cover .fileInput__label {
        height: 35px;
    }
    div[class$="add__btn"] {
        position: relative;
        text-align: center;
    }

    div[class$="add__btn"] button:last-child {
        position: absolute;
        right: 0;
    }

    div[class$="add__btn"] button {
        background: none;
        border: none;
        width: 26vw;
        height: 8vw;
        border-radius: 4px;
        font-size: 4vw;
    }
}

/*Teacher_ContestList*/
@media only screen and (min-width: 768px) {
    .ques__nav__bottom {
        text-align: right;
        margin-top: 10px;
    }
}
@media only screen and (max-width: 767px) {

    .admin__ques__nav__top {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .admin__ques__nav__top div {
        display: inline-flex;
        column-gap: 15px;
    }
    .contestlist .admin__ques__nav__top div {
        width: 100%;
        justify-content: space-between;
        flex-direction: row;
        column-gap: 15px;
    }
    .admin__ques__nav__top a {
        font-size: 14px;
    }
    .admin__ques__nav__top button {
        width: 83px;
        height: 32px;
        border-radius: 3px;
        line-height: 32px;
        display: block;
        background-color: #bb2019;
        font-stretch: normal;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
        border: none;
    }
}

/*Teacher_StudentListEdit*/
@media only screen and (max-width: 767px) {


    .teacher__student__list.classedit .cb__label {
        font-size: 15px !important;
    }
    .teacher__student__list.classedit .checkbox--block label::before {
        width: 16px;
        height: 16px;
        margin: 0 7px 10px 0;
    }
    .teacher__student__list input[type="checkbox"] {
        display: none;
    }
    .teacher__student__list .classedit__label {
        width: 80px;
    }
    .teacher__student__list.classedit select {
        width: 100%;
        height: 32px;
        font-size: 14px;
        margin: 0 0 10px;
    }

    .teacher__student__list.classedit input,
    .teacher__student__list.classedit textarea {
        width: 100% !important;
        margin: 0 0 10px;
        height: 32px;
    }

}

/*Teacher_ContestTeacherList*/
.teacherlist__nav {
    display: flex;
    justify-content: space-between;
}
.teacherlist__nav p {
    font-family: SFProDisplay-SemiBold, sans-serif;
}

@media only screen and (min-width: 768px) {


    /* TEACHER LIST =============================== */

    .teacherlist {
        width: 1177.6px;
        margin: 0 auto;
        margin-top: 30.39px;
        padding: 25.6px 39.19px;
        border-radius: 4px;
        border: solid 1.6px #e1e4e8;
        background-color: #ffffff;
    }

    .teacherlist__nav p {
        font-size: 19.2px;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.5;
        letter-spacing: normal;
        text-align: left;
        color: #1b1c1e;
        margin-bottom: 24px !important;
    }

    .teacherlist__nav a {
        display: block;
        width: 85.6px;
        height: 28px;
        color: #fff;
        border-radius: 2.4px;
        background-color: #bb2019;
        font-size: 11.99px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 2.5;
        letter-spacing: normal;
        text-align: center;
        color: #ffffff;
    }

    .teacherlist__nav a:hover {
        text-decoration: none;
    }

    .teacherlist__table tr:first-child th:first-child {
        border-top-left-radius: 4px !important;
    }

    .teacherlist__table tr:first-child th:last-child {
        border-top-right-radius: 4px !important;
    }

    .teacherlist__table {
        width: 1054.4px;
        margin: 0 auto;
        border-radius: 4px;
    }

    .teacherlist__table tbody tr {
        /* border: solid 1.6px #e1e4e8; */
    }

    .teacherlist__table__head {
        background-color: #faeded;
        font-size: 16px;
        font-weight: bold;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        color: #5e6c84;
    }

    .teacherlist__table__head th {
        height: 54.4px !important;
        /* padding: 17.6px 0; */
    }

    .teacherlist__table tr td {
        height: 44.55px;
        font-size: 16px;
        font-weight: normal;
        font-stretch: normal;
        font-style: normal;
        line-height: 1.7;
        letter-spacing: normal;
        border-bottom: solid 1.6px #e1e4e8;
        padding: 11.19px 0;
    }

    .teacherlist__table tr th:nth-child(1),
    .teacherlist__table tr td:nth-child(1) {
        width: 84.6px;
    }

    .teacherlist__table tr th:nth-child(2),
    .teacherlist__table tr td:nth-child(2) {
        width: 153.6px;
    }

    .teacherlist__table tr th:nth-child(3),
    .teacherlist__table tr td:nth-child(3) {
        width: 184.32px;
    }

    .teacherlist__table tr th:nth-child(4),
    .teacherlist__table tr td:nth-child(4) {
        width: 184.32px;
    }

    .teacherlist__table tr th:nth-child(5),
    .teacherlist__table tr td:nth-child(5) {
        width: 153.6px;
    }

}
@media only screen and (max-width: 767px) {

    .teacherlist {
        width: 100vw;
        margin: 0;
        padding: 0 16px 40px;
        border: none;
    }
    .teacherlist__nav {
        align-items: center;
        width: 100%;
        margin-bottom: 15px;
    }

    .teacherlist__nav p {
        font-size: 14px;
        margin-bottom: 0 !important;
    }

    .teacherlist__nav a {
        font-size: 14px;
    }
}

.mc-footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    background-color: white;
    color: white;
    text-align: center;
}
.mc-footer > ul {
    padding-top: 10px;
}
.mc-footer > ul li {
    display:inline;
}
.mc-footer ul  li a.question
{
    cursor: pointer;
    background-color:#E0EAF1;
    border-bottom:1px solid #3E6D8E;
    border-right:1px solid #7F9FB6;
    color:#3E6D8E;
    font-size:90%;
    margin:2px 2px 2px 0;
    padding:3px 4px;
    text-decoration:none;
    white-space:nowrap;
}

.mc-footer ul  li a.answer
{
    cursor: pointer;
    background-color:#38c172;
    border-bottom:1px solid #bb2019;
    border-right:1px solid #7F9FB6;
    color:#ffffff;
    font-size:90%;
    margin:2px 2px 2px 0;
    padding:3px 4px;
    text-decoration:none;
    white-space:nowrap;
}

.mc-footer ul  li a.waiting
{
    cursor: pointer;
    background-color: #FFA500;
    border-bottom:1px solid #bb2019;
    border-right:1px solid #7F9FB6;
    color:#ffffff;
    font-size:90%;
    margin:2px 2px 2px 0;
    padding:3px 4px;
    text-decoration:none;
    white-space:nowrap;
}

.mc-footer ul  li a.review
{
    cursor: pointer;
    border-radius: 50%;
    background-color:#38c172;
    color:#ffffff;
    font-size:90%;
    margin:2px 2px 2px 0;
    padding:3px 4px;
    text-decoration:none;
    white-space:nowrap;
}


.option_remove__btn {
    text-align: right;
    margin-top: 19.2px;
}

.option_remove__btn button {
    background-color: #bb2019 !important;
    color: #fff;
    background: none;
    border: none;
    height: 28.8px;
    border-radius: 4px;
    font-size: 12.88px;
}