@import url("SpoqaHanSansNeo.css");
* {
    font-family: 'Spoqa Han Sans Neo', 'sans-serif';
}

body {
    word-break: keep-all;
}

a, a:hover {
    color: #454f5d;
    text-decoration: none;
    outline: none;
}

.page-link {
    color: #454f5d;
    text-decoration: none;
    border-radius: 0px !important;
}

.navbar-expand-md .navbar-nav .nav-link {
    color: #29303b;
}

.navbar-expand-md.navbar.shadow {
    box-shadow: 0 0 1px 1px rgba(20, 23, 28, 0.1), 0 3px 1px 0 rgba(20, 23, 28, 0.1);
}

.navbar-expand-md.navbar .btn {
    white-space: nowrap;
}

.navbar-toggler:focus {
    outline: none;
}

.carousel-caption.centered {
    top: 50%;
    transform: translateY(-50%);
    bottom: initial;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.bg {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.main_carousel.carousel .carousel-item {
    height: 650px;
}

.main_carousel .carousel-item .display-4 {
    font-size: 3rem;
}

.main_carousel .carousel-item .description {
    word-break: keep-all;
}

.footer {
    font-size: 0.875rem;
}

.footer .fnav {
    display: flex;
}

.footer .fnav li {
    margin-right: 15px;
}

.bg-gray {
    background-color: #f9f9f9;
}

.pt-10 {
    padding-top: 6rem !important;
}

.py-6 {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
}

.py-7 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
}

.py-8 {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
}

.py-10 {
    padding-top: 6rem !important;
    padding-bottom: 6rem !important;
}

.py-15 {
    padding-top: 9rem !important;
    padding-bottom: 9rem !important;
}

.py-18 {
    padding-top: 10rem !important;
    padding-bottom: 10rem !important;
}

.py-20 {
    padding-top: 12rem !important;
    padding-bottom: 12rem !important;
}

.w-40 {
    width: 40% !important;
}

.text-underline {
    text-decoration: underline;
}

.history {
    margin-top: 60px;
    position: relative;
}

.history:after {
    content: '';
    width: 0;
    height: 100%;
    position: absolute;
    border-right: 2px solid #1a4da8;
    top: 10px;
    left: 99px;
}

.history li .date {
    display: inline-block;
    width: 50px;
}

.vertical-middle {
    vertical-align: middle !important;
}

.history ul, .history li {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 0.875rem;
}

.history ul > li {
    color: #1a4da8;
    vertical-align: top;
    margin-bottom: 45px;
    display: flex;
}

.history ul > li > ul > li {
    color: #212529;
    margin-bottom: 5px;
    position: relative;
    padding-left: 100px;
}

.history ul > li > ul > li:after {
    position: absolute;
    top: 2px;
    left: 45px;
    content: "●";
    color: #1a4da8;
    font-size: .6rem;
}

.career_wrap {
    height: 800px;
}

.news_item {
    border-bottom: 1px solid #ebebeb;
    padding: 50px 0;
}


.news_item .title {
    display: block;
}

.news_item .author {
    color: #1a4da8;
    font-weight: bold;
}

.news_item .author:after {
    content: "";
    border-right: 1px solid #ebebeb;
    font-weight: normal;
    margin: 0 15px;
    vertical-align: top;
}

.news_item .date {
    color: #d0d0d0;
    font-size: 0.875rem;
}

.board_list {
    border-top: 1px solid #4d4d4d;
}

.board_list .item {
    border-bottom: 1px solid #e6e6e6;
    padding: 25px 0;
}

.board_list .item:last-child {
    border-bottom: 1px solid #4d4d4d;
}


.board_list .item .title {
    display: block;
}


.subnav {
    font-size: .875rem;
    padding: 12px 10px;
}

.subnav .services ul {
    display: flex;
}

.subnav .services ul * {
    vertical-align: middle;
}

.subnav .services li {
    list-style: none;
    position: relative;
    margin-right: 10px;
}

.subnav .services li:first-child {
    margin-left: auto;
}

.subnav .services li:before {
    content: "";
    border-left: 1px solid #d7d7d7;
    margin-right: 10px;
}

.breadcrumb {
    margin: 0;
    padding: 0;
    border-bottom: 0;
    background-color: transparent;
}


.subnav .breadcrumb-item {
    color: #ffffff;
}

.subnav .breadcrumb-item + .breadcrumb-item::before {
    content: "/";
    color: #ffffff;
}

.subnav .breadcrumb-item.active {
    color: #ffffff;
}


.subnav .services li:first-child:before {

    border: 0 none;
}

.tags .badge {
    background-color: #f6f6f6;
    color: #666666;
    font-weight: normal;
    padding: 10px;
    margin-bottom: 10px;
}

.mb-6 {
    margin-bottom: 3.5rem !important;
}

.mb-7 {
    margin-bottom: 4rem !important;
}

.mb-8 {
    margin-bottom: 4.5rem !important;
}

.mb-9 {
    margin-bottom: 5.5rem !important;
}

.mb-10 {
    margin-bottom: 6rem !important;
}


.form-control::placeholder {
    color: #999999;
    font-size: 14px;
}

.request_wrap label {
    font-weight: bold;
    font-size: .875rem;
    color: #333333;
}

.checkbox-group label {
    font-weight: normal;
    vertical-align: middle;
}

.checkbox-group input {
    vertical-align: middle;
    margin-right: 2px;
}

.blog_list .item {
    font-size: 14px;
}

.blog_list .item .title {
    font-weight: bold;
    white-space: nowrap;
    font-size: 1rem;
    letter-spacing: -1px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.blog_list .item .description {
    color: #666666;
    letter-spacing: -1px;
}

.blog_list .item img {
    filter: brightness(80%);
}

.blog_list .item img:hover {
    filter: brightness(100%);
}

.board_view .description {
    font-size: .875rem;
    color: #333333;
    min-height: 150px;
}

.board_view .description p {
    margin-bottom: 0;
}

.board_view .description video, .board_view .description img, .board_view .description iframe {
    max-width: 100%;
}

.privacy .description pre {
    font-size: .75rem;
    color: #666666;
    white-space: pre-wrap;
}

.hero h2 {
    line-height: 150%;
}

i {
    vertical-align: middle;
}


.popup p {
    margin-bottom: 0;
}

.popup .close {
    position: absolute;
    right: 0px;
    top: 3px;
}

header .dropdown-menu {
    padding: 0;
}

header .dropdown-item {
    font-size: .875rem;
    padding: .7rem 1.5rem;
}

.content_wrap img, .content_wrap iframe, .content_wrap video {
    max-width: 100%;
}

.note-editable {
    font-size: 1rem;
}

.note-editable p, .content_wrap p {
    margin-bottom: 0;
}

.text-category {
    color: #1a4da8;
    font-weight: bold;
}

.flex-break {
    flex-basis: 100%;
    height: 0;
}

h5, .h5 {
    font-size: 1.125rem;
}

h6, .h6 {
    font-size: 1rem;
}

h7, .h7 {
    font-size: 0.875rem;
}

h8, .h8 {
    font-size: 0.75rem;
}

.features {
    letter-spacing: -1px;
}

.features .item p {
    color: #666666;
    line-height: 26px;
}

.features .item h6 {
    margin-bottom: 30px;
}

.features h5 {
    line-height: 30px;
}

.features .carousel-control-next, .features .carousel-control-prev {
    width: 40px;
    height: 40px;
    top: 50%;
    margin-top: -20px;
    background-color: #000;
    opacity: unset;
}

.features .carousel .carousel-inner {
    /*background-color: #007cfa;*/
}

.course_box .card-title {
    letter-spacing: -1px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    font-weight: bold;
    height: 45px;
    min-height: 22px;
    margin-bottom: 5px;
    line-height: 22px;
}

.course_box .description {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #686f7a;
    white-space: normal;
    letter-spacing: -1px;
    min-height: 17px;
    height: 17px;
}

.course_box .price {
    font-size: 1.125rem;
    letter-spacing: -1px;
}

.course_box .price .small {
    font-size: 0.8125rem
}

.course_box .like {
    position: absolute;
    z-index: 10;
    right: 15px;
    top: 15px;
}

.course_box .like i {
    color: #ff3131;
    font-size: 1.5rem;
}

.rating i {
    color: #dedfe0;
    font-size: 0.6875rem;
}

.rating i.fill {
    color: #ffc107;
}

h1.title, h2.title, h3.title, h4.title, h5.title, h6.title {
    font-weight: bold;
    margin-bottom: 20px;
}

.course-curriculum-box .course-curriculum-title .title {
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 10px;
}

.course-curriculum-box .course-curriculum-title .total-time {
    width: 130px;
    display: inline-block;
    text-align: right;
}

.course-curriculum-accordion .lecture-group-title .total-time {
    width: 130px;
    display: inline-block;
    text-align: right;
}

.course-curriculum-accordion .lecture-group-title .title {
    max-width: 60%;
    font-weight: 600;
}

.course-curriculum-accordion .lecture-group-title {
    position: relative;
    padding: 10px 30px 10px 45px;
    background: #f9f9f9;
    border: 1px solid #e8e9eb;
    cursor: pointer;
    height: auto;
    margin-top: 3px;
    color: #505763;
}

.course-curriculum-box .course-curriculum-title {
    padding-right: 31px;
}

.course-curriculum-accordion .lecture-group-title:before {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    font-family: Font Awesome\ 5 Free;
    font-weight: 900;
    position: absolute;
    left: 22px;
    font-size: 10px;
    top: 16px;
    color: #007791;
}

.course-curriculum-accordion .lecture-group-title[aria-expanded="false"]:before {
    content: "\f067";
}

.course-curriculum-accordion .lecture-group-title[aria-expanded="true"]:before {
    content: "\f068";
}

.course-curriculum-accordion .lecture-group-title[aria-expanded="true"] .total-lectures {
    display: none;
}

.course-curriculum-accordion .lecture-list ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.course-curriculum-accordion .lecture-list .lecture {
    padding: 12px 30px 12px 73px;
    position: relative;
    border-bottom: 1px solid #e8e9eb;
    border-left: 1px solid #e8e9eb;
    border-right: 1px solid #e8e9eb;
    color: #686f7a;
}

.course-curriculum-accordion .lecture-list .lecture .lecture-title {
    width: 50%;
    display: inline-block;
    transition: 0.3s;
    -webkit-transition: 0.3s;
    -ms-webkit-transition: 0.3s;
}

.course-curriculum-accordion .lecture-list .lecture .lecture-time {
    width: 100px;
    text-align: right;
}

.course-curriculum-accordion .lecture-list .lecture:before {
    font-family: Font Awesome\ 5 Free;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    content: "\f144";
    position: absolute;
    left: 45px;
    opacity: 0.3;
    font-weight: 900;
    font-size: 13px;
    top: 17px;
}

.course-curriculum-accordion .lecture-list .lecture.has-preview {
    color: #007791;
}

.course-curriculum-accordion .lecture-list .lecture.has-preview .lecture-title,
.course-curriculum-accordion .lecture-list .lecture.has-preview .lecture-preview {
    cursor: pointer;
}

.course-curriculum-accordion .lecture-list .lecture.has-preview .lecture-title:hover {
    color: #003845;
}

.student-feedback-box {
    margin: 50px 0;
}

.student-feedback-box .student-feedback-title {
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 15px;
}

.student-feedback-box .average-rating {
    text-align: center;
    margin-top: 10px;
}

.student-feedback-box .average-rating .num {
    font-size: 72px;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 10px;
}

.student-feedback-box .average-rating .rating i {
    font-size: 20px;
    color: #f4c150;
    margin-bottom: 5px;
}

.student-feedback-box .individual-rating ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.student-feedback-box .individual-rating ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 10px;
}

.student-feedback-box .individual-rating ul li .progress {
    width: 60%;
    height: 20px;
    border-radius: 3px;
    background-color: #f2f3f5
}

.student-feedback-box .individual-rating ul li .progress-bar {
    border-radius: 3px;
    background-color: #a1a7b3;
}

.student-feedback-box .individual-rating .rating i {
    font-size: 14px;
    color: #dedfe0;
}

.student-feedback-box .individual-rating .rating i.filled {
    color: #f4c150;
}

.student-feedback-box .individual-rating li > div:not(.progress) {
    padding-left: 15px;
}

.student-feedback-box .individual-rating li > div:not(.progress) span:not(.rating) {
    text-align: center;
    padding-left: 10px;
    color: #007791;
}

.student-feedback-box .reviews .reviews-title {
    font-size: 18px;
    font-weight: 600;
    padding: 0 0 20px;
}

.student-feedback-box .reviews ul {
    list-style: none;
    padding: 0;
    margin: 0;
    padding-bottom: 30px;
}

.student-feedback-box .reviews .reviewer-details img {
    height: 46px;
    width: 46px;
    border-radius: 50%;
    margin-right: 20px;
}

.student-feedback-box .reviews .reviewer-details .review-time .time {
    color: #686f7a;
}

.student-feedback-box .reviews ul li {
    padding: 30px 0;
    border-top: 1px solid #dedfe0;
}

.student-feedback-box .reviews ul li:last-child {
    border-bottom: 1px solid #dedfe0;
}

.student-feedback-box .reviews .review-details .rating i {
    color: #dedfe0;
    margin-bottom: 15px;
}

.student-feedback-box .reviews .review-details .rating i.filled {
    color: #f4c150;
}

.student-feedback-box .reviews .review-details .review-text {
    color: #505763;
    margin-bottom: 10px;
    font-size: 16px;
}

.student-feedback-box .reviews {
    margin-top: 30px;
}

.reviews .more-reviews-btn {
    text-align: center;
}

.reviews .more-reviews-btn button {
    border-radius: 2px;
    border: 2px solid #007791;
    color: #007791;
    background: #fff;
    padding: 11px 12px;
    font-size: 15px;
    font-weight: 600;
}

.reviews .more-reviews-btn button:hover,
.reviews .more-reviews-btn button:focus {
    background-color: #e6f2f5;
}

/*
course sidebar
*/
.course-sidebar {
    background-color: #fff;
    box-shadow: 0 0 1px 1px rgba(20, 23, 28, .1), 0 3px 1px 0 rgba(20, 23, 28, .1);
    border-radius: 4px;
    color: #505763;
    padding: 3px;
    position: relative;
    margin-top: -250px;
    z-index: 10;
}

@media only screen and (max-width: 991px) {
    .course-sidebar {
        margin-top: -50px;
        margin-bottom: 20px;
    }
}

.course-sidebar.fixed {
    position: fixed;
    margin-top: 0;
    top: 50px;
    width: 350px;
}

.course-sidebar.fixed .preview-video-box,
.course-sidebar.bottom .preview-video-box {
    display: none;
}

.course-sidebar.bottom {
    margin-top: 0;
}


.preview-video-box a {
    display: block;
    color: #fff;
    overflow: hidden;
    position: relative;
}

.preview-video-box .preview-text {
    position: absolute;
    width: 100%;
    bottom: 10px;
    left: 0;
    text-align: center;
    height: auto;
    font-size: 15px;
    font-weight: 700;
}

.preview-video-box .play-btn {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    background: url('../assets/icons/icon-play.svg') no-repeat 50%;
    background-size: auto 50%;
    visibility: visible;
    -webkit-transition: -webkit-transform .15s ease-in-out;
    -moz-transition: -moz-transform .15s ease-in-out;
    -o-transition: -o-transform .15s ease-in-out;
    transition: transform .15s ease-in-out;
}

.preview-video-box a:hover > .play-btn {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
}

.course-sidebar-text-box {
    padding: 15px 30px;
}

.course-sidebar-text-box .price .current-price {
    color: #505763;
    font-size: 36px;
    font-weight: 700;
    line-height: 40px;
    margin-right: 10px;
}

.course-sidebar-text-box .price span {
    vertical-align: middle;
    color: #a1a7b3;
    margin-right: 10px;
}

.course-sidebar-text-box .price .original-price {
    text-decoration: line-through;
}

.course-sidebar-text-box .offer-time {
    color: #208058;
    font-size: 14px;
    margin-bottom: 10px;
}

.course-sidebar-text-box .offer-time i {
    margin-right: 7px;
}

.course-sidebar-text-box .buy-btns .btn {
    display: block;
    width: 100%;
    margin: 0;
    border-radius: 2px;
    margin-top: 13px;
    padding: 15px 12px;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 10px;
}

.course-sidebar-text-box .buy-btns .btn-add-wishlist {
    color: #fff;
    background-color: #7E57C2;
    border-color: #673AB7;
}

.course-sidebar-text-box .buy-btns .btn-add-wishlist:hover, .course-sidebar-text-box .buy-btns .btn-add-wishlist:focus {
    background-color: #673AB7;
    border-color: #992337;
}

.course-sidebar-text-box .buy-btns .btn-buy-now {
    color: #fff;
    background-color: #ec5252;
    border-color: #ec5252;
}

.course-sidebar-text-box .buy-btns .btn-buy-now:hover, .course-sidebar-text-box .buy-btns .btn-buy-now:focus {
    background-color: #992337;
    border-color: #992337;
}

.course-sidebar-text-box .buy-btns .btn-add-cart {
    background: transparent;
    border-color: #505763;
    color: #686f7a;
}

.course-sidebar-text-box .buy-btns .btn-add-cart:hover, .course-sidebar-text-box .buy-btns .btn-add-cart:focus {
    background-color: #f2f3f5;
}

.course-sidebar-text-box .money-back {
    display: block;
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 12px;
    margin-top: 10px;
}

.course-sidebar-text-box .includes {
    margin-bottom: 15px;
}

.course-sidebar-text-box .includes ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.course-sidebar-text-box .includes ul li {
    font-size: 13px;
    padding: 3px;
}

.course-sidebar-text-box .includes ul li i {
    width: 19px;
    font-size: 12px;
}


.display-5 {
    font-size: 2.5rem;
}


.avatar img {
    width: 100%;
    height: 100%;
    border-radius: .375rem;
}

.avatar {
    font-size: 1rem;
    display: inline-flex;
    width: 48px;
    height: 48px;
    color: #fff;
    border-radius: .375rem;
    background-color: #adb5bd;
    align-items: center;
    justify-content: center;
}

.avatar-xs {
    font-size: .75rem;
    width: 24px;
    height: 24px;
}

.avatar-sm {
    font-size: .875rem;
    width: 36px;
    height: 36px;
}

.avatar-lg {
    font-size: .875rem;
    width: 58px;
    height: 58px;
}

.avatar-xl {
    width: 74px;
    height: 74px;
}

.avatar-xxl {
    width: 118px;
    height: 118px;
}

.avatar.rounded-circle img, .rounded-circle {
    border-radius: 50% !important;
}

.avatar-group .avatar {
    position: relative;
    z-index: 2;
    border: 2px solid #fff;
}


.start_rating .rating {
    display: flex;
    width: 100%;
    justify-content: center;
    overflow: hidden;
    flex-direction: row-reverse;
    height: 150px;
    position: relative;
}

.start_rating .rating-0 {
    filter: grayscale(100%);
}

.start_rating .rating > input {
    display: none;
}

.start_rating .rating > label {
    cursor: pointer;
    width: 40px;
    height: 40px;
    margin-top: auto;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='126.729' height='126.73'%3e%3cpath fill='%23e3e3e3' d='M121.215 44.212l-34.899-3.3c-2.2-.2-4.101-1.6-5-3.7l-12.5-30.3c-2-5-9.101-5-11.101 0l-12.4 30.3c-.8 2.1-2.8 3.5-5 3.7l-34.9 3.3c-5.2.5-7.3 7-3.4 10.5l26.3 23.1c1.7 1.5 2.4 3.7 1.9 5.9l-7.9 32.399c-1.2 5.101 4.3 9.3 8.9 6.601l29.1-17.101c1.9-1.1 4.2-1.1 6.1 0l29.101 17.101c4.6 2.699 10.1-1.4 8.899-6.601l-7.8-32.399c-.5-2.2.2-4.4 1.9-5.9l26.3-23.1c3.8-3.5 1.6-10-3.6-10.5z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 76%;
    transition: .3s;
}

.start_rating .rating > input:checked ~ label,
.start_rating .rating > input:checked ~ label ~ label {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='126.729' height='126.73'%3e%3cpath fill='%23fcd93a' d='M121.215 44.212l-34.899-3.3c-2.2-.2-4.101-1.6-5-3.7l-12.5-30.3c-2-5-9.101-5-11.101 0l-12.4 30.3c-.8 2.1-2.8 3.5-5 3.7l-34.9 3.3c-5.2.5-7.3 7-3.4 10.5l26.3 23.1c1.7 1.5 2.4 3.7 1.9 5.9l-7.9 32.399c-1.2 5.101 4.3 9.3 8.9 6.601l29.1-17.101c1.9-1.1 4.2-1.1 6.1 0l29.101 17.101c4.6 2.699 10.1-1.4 8.899-6.601l-7.8-32.399c-.5-2.2.2-4.4 1.9-5.9l26.3-23.1c3.8-3.5 1.6-10-3.6-10.5z'/%3e%3c/svg%3e");
}


.start_rating .rating > input:not(:checked) ~ label:hover,
.start_rating .rating > input:not(:checked) ~ label:hover ~ label {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='126.729' height='126.73'%3e%3cpath fill='%23d8b11e' d='M121.215 44.212l-34.899-3.3c-2.2-.2-4.101-1.6-5-3.7l-12.5-30.3c-2-5-9.101-5-11.101 0l-12.4 30.3c-.8 2.1-2.8 3.5-5 3.7l-34.9 3.3c-5.2.5-7.3 7-3.4 10.5l26.3 23.1c1.7 1.5 2.4 3.7 1.9 5.9l-7.9 32.399c-1.2 5.101 4.3 9.3 8.9 6.601l29.1-17.101c1.9-1.1 4.2-1.1 6.1 0l29.101 17.101c4.6 2.699 10.1-1.4 8.899-6.601l-7.8-32.399c-.5-2.2.2-4.4 1.9-5.9l26.3-23.1c3.8-3.5 1.6-10-3.6-10.5z'/%3e%3c/svg%3e");
}

.start_rating .emoji-wrapper {
    width: 100%;
    text-align: center;
    height: 100px;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
}

.start_rating .emoji-wrapper:before,
.start_rating .emoji-wrapper:after {
    content: "";
    height: 15px;
    width: 100%;
    position: absolute;
    left: 0;
    z-index: 1;
}

.start_rating .emoji-wrapper:before {
    top: 0;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 35%, rgba(255, 255, 255, 0) 100%);
}

.start_rating .emoji-wrapper:after {
    bottom: 0;
    background: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 35%, rgba(255, 255, 255, 0) 100%);
}

.start_rating .emoji {
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: .3s;
}

.start_rating .emoji > svg {
    margin: 15px 0;
    width: 70px;
    height: 70px;
    flex-shrink: 0;
}

.start_rating #rating-1:checked ~ .emoji-wrapper > .emoji {
    transform: translateY(-100px);
}

.start_rating #rating-2:checked ~ .emoji-wrapper > .emoji {
    transform: translateY(-200px);
}

.start_rating #rating-3:checked ~ .emoji-wrapper > .emoji {
    transform: translateY(-300px);
}

.start_rating #rating-4:checked ~ .emoji-wrapper > .emoji {
    transform: translateY(-400px);
}

.start_rating #rating-5:checked ~ .emoji-wrapper > .emoji {
    transform: translateY(-500px);
}

.start_rating .feedback {
    /*max-width: 653px;*/
    border: 1px solid #dddddd;
    background-color: #fff;
    width: 100%;
    padding: 30px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    box-shadow: 0 4px 30px rgba(0, 0, 0, .05);
}

.my_page ul {
    margin: 0;
    padding: 0;
    list-style: none;
    margin-top: 20px;
}

.my_page ul li {
    display: inline-block;
    margin-right: 30px;
}

.my_page ul li.active a, .my_page ul li a:hover {
    border-bottom-color: hsla(0, 0%, 100%, .8);
}

.my_page ul li a {
    padding: 0 0 5px;
    border-bottom: 6px solid hsla(0, 0%, 100%, 0);
    color: #fff;
    display: block;
}

.category_item {
    color: #4f4f4f;
    font-size: 15px;
    line-height: 33px;
    margin: 0 0 10px;
    outline: none;
    padding-left: 7px;
    padding-right: 15px;
    width: 100%;
}

a.category_item:hover {
    color: white;
    background: #192675;
    transition: 0.5s;

}

.lesson_view .details .nav-item {
    font-weight: bold;
}

.custom-control-label::before {
    top: .25rem;
}

.custom-control-label::after {
    top: .25rem !important;
}

.lesson_list .custom-control-label {
    padding: 0;
    margin: 0;
    line-height: unset;
    width: unset;
}

.cs_row_three .course_content .details .cc_tab .panel-body .cs_list li.active {
    background-color: #c0e4ff !important;
    font-weight: bold;
}

.text-black {
    color: #000000 !important;
}

.switchToggle input[type=checkbox] {
    height: 0;
    width: 0;
    visibility: hidden;
    position: absolute;
}

.switchToggle label {
    cursor: pointer;
    text-indent: -9999px;
    width: 70px;
    max-width: 70px;
    height: 30px;
    background: #d1d1d1;
    display: block;
    border-radius: 100px;
    position: relative;
}

.switchToggle label:after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 26px;
    height: 26px;
    background: #fff;
    border-radius: 90px;
    transition: 0.3s;
}

.switchToggle input:checked + label, .switchToggle input:checked + input + label {
    background: #3e98d3;
}

.switchToggle input + label:before, .switchToggle input + input + label:before {
    content: 'No';
    position: absolute;
    top: 5px;
    left: 35px;
    width: 26px;
    height: 26px;
    border-radius: 90px;
    transition: 0.3s;
    text-indent: 0;
    color: #fff;
}

.switchToggle input:checked + label:before, .switchToggle input:checked + input + label:before {
    content: 'Yes';
    position: absolute;
    top: 5px;
    left: 10px;
    width: 26px;
    height: 26px;
    border-radius: 90px;
    transition: 0.3s;
    text-indent: 0;
    color: #fff;
}

.switchToggle input:checked + label:after, .switchToggle input:checked + input + label:after {
    left: calc(100% - 2px);
    transform: translateX(-100%);
}

.switchToggle label:active:after {
    width: 60px;
}

.cs_row_three .course_content .details .cc_tab .panel-body .cs_list li {
    padding: 20px 20px;
}

.vertical-wrapper .content-vertical .mega-vertical-menu > li .dropdown-menu.vertical-megamenu {
    padding: 0;
}

.vertical-wrapper .content-vertical .mega-vertical-menu > li .dropdown-menu li {
    padding: 13px 30px;
}

.vertical-wrapper .content-vertical .mega-vertical-menu > li .dropdown-menu li > a {
    line-height: inherit;
}

.dropdown-menu-inner ul {
    background-color: #191919;
}

.owl-carousel {
    touch-action: manipulation;
}

.course_tag {
    color: #c8c8c8;
    border: 1px solid #c8c8c8;
    padding: 4px 8px;
    font-size: 12px;
    margin: 0px 4px 4px 0px;
}

.popup_btn {
    font-size: 14px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: 0em;
    border-radius: 8px;
}

.popup_btn.never-view {
    background: #EFF0F4;
    color: black;
    padding: 8px 36px;

}

.popup_btn.ez_close {
    background: #000000;
    color: white;
    padding: 8px 26px;
}
.ez_popup_img{
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    margin-bottom: 24px;
}

.popup_full {
    background: rgba(0,0,0,0.8);
    z-index: 9999;
}

.popup_full .btn_close {
    position: absolute;
    top: -30px;
    right: -10px;
    font-size: 18px;
    transition: 1s ease;
    cursor: pointer;
}




/*관리자 통계 및 문제관련 css*/
.stats-summary{position: relative; text-align: center; max-width: 150px; height: 90px; line-height: 90px; margin: 0 auto; font-weight: 700; margin-bottom: 0;}
.stats-summary span{position: absolute; top: 0; left: 0; z-index: 1; display: inline-block; font-size: 14px; color: #6C7379; margin-right: 1rem;}
.stats-summary .text-value-lg{position: absolute; top: 0; right: 0; font-size: 1.8rem;}

.card-sub-title{font-weight: 700; font-style: 18px; color: #000;}
.pie-chart{width: 200px; height: 100px; position: absolute; right: -30px;}

.grade-topten{max-width: 500px; margin: 0 auto;}
.grade-topten tbody tr td{font-size: 14px; color: #6C757D;padding: 5px 0; vertical-align: middle; text-align: center;}
.grade-topten tbody tr td.user-name-area{text-align: left;}
.grade-topten .user-ranking{font-weight: 700; color: #000; font-size: 16px;}
.grade-topten .user-thumb{display: block; background:#CED4DA; background-size: cover; width: 40px; height: 40px; border-radius: 40px; margin-right: 10px; overflow: hidden;}
.grade-topten .user-thumb img{width: 100%;}
.grade-topten .user-name{font-weight: 700; color: #000;}
.grade-topten .user-id{ padding-left: 5px;}
.grade-topten .user-school{display:block; border-left: 1px solid #6C757D; line-height: 100%; text-align: center;}
.grade-topten .user-class{display:block; border-left: 1px solid #6C757D; line-height: 100%; text-align: center;}
.grade-topten .user-score{display:block; border-left: 1px solid #6C757D; line-height: 100%; text-align: center; font-weight: 700; color: #5CAEDF;}
.grade-topten .user-correct-stat{ text-align: center; font-weight: 700; color: #5CAEDF;}
.grade-topten .user-correct-stat.correct{color: #5CAEDF;}
.grade-topten .user-correct-stat.wrong{color: #F27474;}
.grade-topten .user-correct-stat.keepout{color: #F8AF5C;}

.evaluation-list-warp{padding-top: 10px;}

.form-check-area{padding: 15px 0 0 0; text-align: right;}

.evaluation-user-box{border: 1px solid #FFE25A; background:#FFFCEE; margin-top: 54px;}
.evaluation-user-box .list-top-stat{border-bottom: 1px solid #CED4DA; clear: both; overflow: hidden; padding-bottom: 10px; margin-bottom: 10px;}
.evaluation-user-box .list-top-stat .text{padding: 10px 0 0 0; float: left;}
.evaluation-user-box .list-top-stat span{background: #FFE25A; color: #000; display: inline-block; float: right; font-weight: 700; letter-spacing: -1.0px; padding: 5px 15px 3px 15px; border-radius: 20px;}
.evaluation-user-box .grade-topten tbody tr td {padding: 10px 0;}


.pie-chart-question{width: 250px; height: 200px; position: absolute; top:0px; right: -15px;}


.question-multiple-choice ol{margin: 0; padding: 10px 0 0 20px;}
.question-multiple-choice ol li{list-style: none; line-height: 200%;}

.multiple-choice-type02 li{width: 49%; display: inline-block;}
.multiple-choice-type03 li{width: 24%; display: inline-block;}

.multiple-choice-ex-img{height: 150px;}
.multiple-choice-ex-textbox{ background: #F7F7F7; border: 1px solid #ced4da; padding: 15px 20px 14px 20px; line-height: 200%;}
.multiple-choice-ex-textbox .question-blank-area{display: inline-block; text-decoration: underline;}


.btn-volume{/*cursor: pointer;*/ color: #fff; background: #fff; border: 1px solid #17a2b8; color: #17a2b8; padding: 3px 5px; border-radius: 10px; line-height: 100%; font-size: 24px;}

.evaluation-paper-style .multiple-choice-ex-left{display: flex;}
.evaluation-paper-style .multiple-choice-ex-img-area{position: relative; display: inline-block; width: 250px; margin: 0 auto; overflow: hidden;}
.evaluation-paper-style .multiple-choice-ex-img-area .multiple-choice-ex-img{width: 100%; height: auto;}
.evaluation-paper-style .multiple-choice-ex-img-area .btn-volume{position: absolute; right: 0px; top:0px;}
.evaluation-paper-style .question-multiple-choice ul{padding: 0px 0px 0px 0px;}
.evaluation-paper-style .question-multiple-choice ul li{padding-left: 20px;}

.col-form-label .btn-volume{display: inline-block; /*font-size: 17px;*/ margin-left: 10px; line-height: 100%; padding: 1px 5px 1px 6px; position: relative;}
.col-form-label .btn-volume::after{font-size: 11px; position: absolute; top: 2px; width: 50px;}


.multiple-choice-ex-box{border: 1px solid #ced4da; padding: 15px 20px 14px 20px; line-height: 200%;}
.multiple-choice-ex-box.text{ background: #F7F7F7;}
.multiple-choice-ex-box.img{text-align: center;}

.multiple-choice-ex-box .text{margin-top: 10px;}


.evaluation-paper-style .multiple-choice-ex-box{margin-bottom: 10px; position: relative;}
.evaluation-paper-style .multiple-choice-ex-box .btn-volume{position: absolute; right: 15px; top:15px;}

.multiple-choice-options ul{margin: 0; padding: 0; font-weight: 600; font-size: 16px;}
.multiple-choice-options ul li{position: relative; list-style: none;}

.multiple-choice-options ul li a:visited,
.multiple-choice-options ul li a.choice{border: 2px dashed #27AE60; background: #effff6;}
.multiple-choice-options ul li label {color: #435971; margin-right: 10px; vertical-align: middle; padding: 12px 10px; }
.multiple-choice-options ul li input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.multiple-choice-options ul li input[type="radio"]+label {
  display: inline-block;
  position: relative;
  padding: 0 0 0 32px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  font-size: 14px;
  display: block;
}

.multiple-choice-options ul li input[type="radio"]+label:before {
  content: '';
  position: absolute;
  top: 0px;
  left: 4px;
  width: 20px;
  height: 20px;
  text-align: center;
  background: #fff;
  border: 1px solid #435971;
  border-radius: 100%;
  box-shadow: none;
  font-size: 12px;
}
.multiple-choice-options ul li:nth-child(1) input[type="radio"]+label:before {content: '1';}
.multiple-choice-options ul li:nth-child(2) input[type="radio"]+label:before {content: '2';}
.multiple-choice-options ul li:nth-child(3) input[type="radio"]+label:before {content: '3';}
.multiple-choice-options ul li:nth-child(4) input[type="radio"]+label:before {content: '4';}
.multiple-choice-options ul li:nth-child(5) input[type="radio"]+label:before {content: '5';}

.multiple-choice-options ul li input[type="radio"]:checked+label:before { background: #1690; border-color: #ffe25a; color: #000;}
.multiple-choice-options ul li input[type="radio"]:checked+label:after {
  content: '✔';
  position: absolute;
  top: 0px;
  left: 2px;
  width: 24px;
  height: 24px;
  line-height: 23px;
  text-align: center;
  background: #ffe25a;
  border-radius: 100%;
  box-shadow: none;
  color: #000;
  font-weight: 700;
}

.evaluation-paper-style .question-multiple-choice ul.circle-list {
    counter-reset: circle 0;
  }

.evaluation-paper-style .question-multiple-choice ul.circle-list .circle-item {
    position: relative;
    list-style: none;
    font-size: 14px;
    line-height: 18px;
    padding: 5px 0 5px 25px;
    /* color: #222; */
  }

.evaluation-paper-style .question-multiple-choice ul.circle-list .circle-item .btn-volume{position: absolute; right: 0px; top:0px; padding: 3px 5px;}
.evaluation-paper-style .question-multiple-choice ul.circle-list .circle-item::before {
    position: absolute;
    top: 50%;
    left: 5px;
    transform: translateY(-50%);
    counter-increment: circle 1;
    content: counter(circle);
    font-size: 12px;
  }
.evaluation-paper-style .question-multiple-choice ul.circle-list .circle-item::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 0px;
    transform: translateY(-50%);
    display: inline-block;
    border: 1px solid #222;
    border-radius: 50%;
    text-align: center;
    font-size: 12px;
    width: 18px;
    height: 18px;
  }


  .evaluation-paper-style .question-multiple-choice ul.circle-list.horizontal li{display: block;}
  .evaluation-paper-style .question-multiple-choice ul.circle-list.horizontal.style-type-img li{display: inline-block; width: 24%;}
  .evaluation-paper-style .question-multiple-choice ul.circle-list.horizontal.style-type-img li img{width: 90%;}

  .evaluation-paper-style .question-multiple-choice ul.circle-list.horizontal.style-type-text-left{clear: both; overflow: hidden;}
  .evaluation-paper-style .question-multiple-choice ul.circle-list.horizontal.style-type-text-left li{display: block; float: left; margin-right: 20px;}


  .evaluation-paper-style .multiple-choice-ex-textbox{line-height: 140%;}

  .btn-volume-choice{cursor: pointer; display: block; font-size: 50px; width: 90%; padding: 20px; text-align: center;}
  .btn-volume-choice i{ color: #17a2b8;}
  .btn-volume-choice2 {display: block; font-size: 50px; width: 90%; padding: 20px; text-align: center;}


/*종합평가*/
.total-evaluation-class-data{margin-bottom: 50px;}
.total-evaluation-class-data .class-thumb{max-width: 300px; margin: 20px auto 30px auto;}
.total-evaluation-class-data .class-thumb img{width: 100%;}
.total-evaluation-class-data .class-title{font-size: 36px; font-weight: 700; color: #454f5d; text-align: center; line-height: 140%;}
.total-evaluation-class-data .class-title p{max-width: 400px; margin: 10px auto 0 auto; line-height: 160%;}

.total-evaluation-stepbox{ max-width: 700px; margin: 30px auto;}
.total-evaluation-stepbox .stepbox-step{font-size: 24px; font-weight: 700; color: #454f5d; display: inline-block; border-top:3px solid #1a4da8;}
.total-evaluation-stepbox .stepbox-step span{display: inline-block; padding-right: 7px; color: #1a4da8;}

.total-evaluation-stepbox .stepbox-exbox{background-color: #f5f5f5; border: 1px solid #dee2e6; padding: 2rem; word-break: keep-all;}
.total-evaluation-stepbox .stepbox-exbox ul li{padding: 5px 0;}

.total-evaluation-stepbox .stepbox-btn-area{text-align: center;}
.total-evaluation-stepbox .stepbox-btn-area label{cursor: pointer;}

.total-evaluation-test-title{padding: 10px 0 10px 30px; margin: 30px 0 40px 0; font-size: 30px; font-weight: 700; color: #fff; background:url(../images/total_evaluation_test_bar.png) no-repeat 0 0; }
.total-evaluation-test-title .col-md-8{line-height: 140%;}
.total-evaluation-test-title .right-cont{font-size: 18px; font-weight: 400; text-align: right; vertical-align: middle;}
.total-evaluation-test-title .right-cont #timer{margin-right: 10px; position: relative; top: 3px;}
.total-evaluation-test-title .right-cont #timer #countdown{font-weight: 700; font-size: 22px; color: #f2ff00;}

.submit-quiz-btn-area{text-align: center;}

.btn-stepbox{ color: #fff; width: 250px; background: #1a4da8; border-color: #1a4da8; font-size: 18px; font-weight: 700; padding: 10px 30px 8px 30px;}
.btn-submit-quiz{ background: #f2ff00; border-color: #f2ff00; font-size: 20px; line-height: 100%; padding: 10px 30px 10px 30px; border-radius: 50px; font-weight: 700; color: #1a4da8; display: inline-block;}

.btn-stepbox:hover{color: #fff;}
.btn-submit-quiz:hover{color: #1a4da8;}


.table-marking-status-warp{ border: 1px solid #ccc; height: 620px; overflow-y: scroll; overflow-x: hidden; background: #f8f8f8;}

.table-marking-status{width: 100%; border-bottom:none; margin-bottom: 50px;}
.table-marking-status tr{border-bottom: 1px solid #ccc;}
.table-marking-status thead tr th{background:#f8f8f8;}
.table-marking-status tr th,
.table-marking-status tr td{text-align: center; padding: 5px; border-right: 1px solid #ccc;}
.table-marking-status tr th:last-child,
.table-marking-status tr td:last-child{border-right:none;}


.quiz-warp{padding: 0 30px; color: #202224; position: relative;}
.quiz-warp .quiz-cont{border: 3px solid #dee2e6; min-height: 620px; padding: 30px;}
.quiz-warp .quiz-foot{margin-bottom: 30px; width: 100%; text-align: center; position: absolute; bottom: 0;}



/*종합평가 결과확인*/
.total-evaluation-result-warp{margin:50px 0;}
.total-evaluation-result-warp .result-header{ position: relative;}
.total-evaluation-result-warp .result-header .right-cont{position: absolute; bottom: 20px; right: 0; font-size: 18px; color: #6C737A; font-weight: 400; line-height: 40px;}
.total-evaluation-result-warp .result-header .result-header-title{font-size: 30px; color: #000; font-weight: 700; padding: 30px 10px 20px 10px;}
.total-evaluation-result-warp .result-summary-warp{background: #F8F7F9; border-radius: 20px; margin-bottom: 30px; padding: 30px; box-shadow: 0 0px 20px rgba(0,0,0,0.1), 0 3px 10px rgba(0,0,0,0.1);}

.total-evaluation-result-warp .user-evaluation-stat-warp .user-data-area{border-bottom: 1px solid #000; clear: both; overflow: hidden; padding: 15px 0 10px 0;}
.total-evaluation-result-warp .user-evaluation-stat-warp .user-data-area .user-name{float: left; font-size: 16px; color: #000;}
.total-evaluation-result-warp .user-evaluation-stat-warp .user-data-area .user-name span{font-size: 18px; font-weight: 700;}
.total-evaluation-result-warp .user-evaluation-stat-warp .user-data-area .user-school{float:right; color: #6C747A; font-style: 14px; padding: 3px 0 0 0;}

.result-summary-graph-warp{text-align: center; color: #000; background: #fff; border: 1px solid #ddd; border-radius: 20px; padding: 40px 0 30px 0;}
.result-summary-graph-warp .gauge-graph-cont-coment{margin: 40px 0 0 0;}

.gauge-graph-cont{position: absolute; bottom: 0px; width: 100%; text-align: center;}
.gauge-graph-cont .score{font-size: 40px; font-weight: 700; line-height: 110%;}
.gauge-graph-cont .score span{font-size: 48px; position: relative; top: 4px;}
.gauge-graph-cont .state{padding-top: 15px;}
.gauge-graph-cont .state span{background: #E0F3FF; border: 1px solid #5CAEDF; color: #2A89C2; font-weight: 700; font-size: 14px; padding: 5px 15px; border-radius: 30px;}
.gauge-graph-cont .grade-level{font-size: 12px; line-height: 100%; padding-top: 15px;}
.gauge-graph-cont .grade-level span{font-size: 14px; color: #000; margin: 0 6px; font-weight: 700;}
.gauge-graph-cont .grade-level span.text{color: #004FFF;}

.gauge-graph-cont-warp .gauge-graph-warp{position: relative; width: 350px; margin: 0 auto;}
.gauge-graph-cont-warp .user-thumb{position: absolute; z-index: 1004; width: 60px; height: 60px; border-radius: 60px; border: 5px solid #fff; background: #eee;}

.gauge-graph-cont-warp .gauge-graph-grade{ width: 350px; height: 175px; border-radius: 175px 175px 0 0; z-index: 1002; background: linear-gradient(to right,  #ff3232 0%,#ff9e30 14%,#fff728 30%,#34d622 48%,#207cca 66%,#283eff 83%,#8500f9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ position: relative;}
.gauge-graph-cont-warp .gauge-graph-percent{width: auto; overflow: hidden; position: relative;}
.gauge-graph-cont-warp .gauge-graph-bg{ position: absolute; left:0; bottom: 0; width: 350px; height: 175px; border-radius: 175px 175px 0 0; background: #BFCAD4; z-index: 1001;}
.gauge-graph-cont-warp .gauge-graph-space{ width: 300px; height: 150px; border-radius: 150px 150px 0 0; background: #fff; position: absolute; left:25px; bottom: 0; z-index: 1003;}

.gauge-graph-cont-warp .user-thumb.score001{left: -12.5px; bottom: -12.5px;}

.gauge-graph-cont-warp .user-thumb.score010{left: -5px; bottom: 25px;}
.gauge-graph-cont-warp .user-thumb.score81-85{right: 30px; top: 30px;}
.gauge-graph-cont-warp .user-thumb.score86-90{right: 5px; top: 65px;}
.gauge-graph-cont-warp .user-thumb.score91-95{right: 5px; top: 65px;}

.progress{height: 30px; border-radius: 5px; margin: 20px 0;}
.progress .progress-bar.answer-correct{background: #5CAEDF; vertical-align: bottom;}
.progress .progress-bar.answer-wrong{background: #F27474;}

.progress-warp .progress-title{color: #6C7379; font-size: 12px; line-height: 120%; letter-spacing: -1.0px; margin-top: 7px; text-align: center;}
.progress-warp .progress-title .progress-percent{display: block; color:#178fd4; font-weight: 700; font-size: 16px; padding: 3px 0 5px 0; letter-spacing: -0.2px;}
.progress-warp .progress-title .progress-percent em{font-style: normal; font-size: 13px; padding-left: 1px;}
.progress.length-type{width: 50px; margin: 0 auto; height: 100px; border-radius: 5px 5px 0 0 ; flex-direction: column-reverse;background: #F27474;}
.progress.length-type .progress-bar{flex-direction: column-reverse; justify-content: end; position: relative; overflow:visible;}
.progress.length-type .progress-bar span{position: absolute; bottom: 12px; display: block; z-index: 1000; width: 100%; text-align: center;}

.percentage-correct .progress{background: #F27474;}

.result-summary-graph-cont{position: relative;}
.result-summary-graph-cont .gauge-graph-area{width: 350px; height: 175px; margin: 0 auto; position: relative;}
.result-summary-graph-cont .gauge-graph-area .user-thumb{position: absolute; z-index: 1004; width: 60px; height: 60px; overflow: hidden; border-radius: 60px; border: 5px solid #fff; background: #eee;}
.result-summary-graph-cont .gauge-graph-area .gauge-graph{width: 350px; height: 175px; position: absolute; background: url(../images/gauge_graph/gauge-graph-grade.png); background-size: cover;}

.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score000{left: -20px; bottom: -20px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score001{left: -19px; bottom: -15.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score002{left: -18px; bottom: -11px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score003{left: -17px; bottom: -6.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score004{left: -16px; bottom: -2px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score005{left: -15px; bottom: 2.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score006{left: -14px; bottom: 7px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score007{left: -13px; bottom: 11.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score008{left: -12px; bottom: 16px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score009{left: -11px; bottom: 20.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score010{left: -10px; bottom: 25px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score011{left: -9px; bottom: 27.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score012{left: -8px; bottom: 30px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score013{left: -7px; bottom: 32.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score014{left: -6px; bottom: 35px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score015{left: -5px; bottom: 37.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score016{left: -4px; bottom: 40px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score017{left: -3px; bottom: 42.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score018{left: -2px; bottom: 45px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score019{left: -1px; bottom: 47.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score020{left: 0px; bottom: 50px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score021{left: 2.5px; bottom: 53px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score022{left: 5px; bottom: 56px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score023{left: 7.5px; bottom: 59px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score024{left: 10px; bottom: 62px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score025{left: 12.5px; bottom: 65px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score026{left: 15px; bottom: 68px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score027{left: 17.5px; bottom: 71px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score028{left: 20px; bottom: 74px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score029{left: 22.5px; bottom: 77px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score030{left: 25px; bottom: 80px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score031{left: 28px; bottom: 83px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score032{left: 31px; bottom: 86px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score033{left: 34px; bottom: 89px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score034{left: 37px; bottom: 92px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score035{left: 40px; bottom: 95px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score036{left: 43px; bottom: 98px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score037{left: 46px; bottom: 101px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score038{left: 49px; bottom: 104px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score039{left: 52px; bottom: 107px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score040{left: 55px; bottom: 110px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score041{left: 64px; bottom: 112.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score042{left: 73px; bottom: 115px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score043{left: 82px; bottom: 117.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score044{left: 91px; bottom: 120px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score045{left: 100px; bottom: 122.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score046{left: 109px; bottom: 125px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score047{left: 118px; bottom: 127.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score048{left: 127px; bottom: 130px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score049{left: 136px; bottom: 132.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score050{left: 145px; bottom: 135px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score051{right: 136px; bottom: 132.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score052{right: 127px; bottom: 130px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score053{right: 118px; bottom: 127.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score054{right: 109px; bottom: 125px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score055{right: 100px; bottom: 122.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score056{right: 91px; bottom: 120px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score057{right: 82px; bottom: 117.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score058{right: 73px; bottom: 115px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score059{right: 64px; bottom: 112.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score060{right: 55px; bottom: 110px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score061{right: 28px; bottom: 83px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score062{right: 31px; bottom: 86px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score063{right: 34px; bottom: 89px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score064{right: 37px; bottom: 92px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score065{right: 40px; bottom: 95px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score066{right: 43px; bottom: 98px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score067{right: 46px; bottom: 101px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score068{left: 49px; bottom: 104px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score069{right: 52px; bottom: 107px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score070{right: 25px; bottom: 80px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score071{right: 22.5px; bottom: 77px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score072{right: 20px; bottom: 74px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score073{right: 17.5px; bottom: 71px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score074{right: 15px; bottom: 68px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score075{right: 12.5px; bottom: 65px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score076{right: 10px; bottom: 62px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score077{right: 7.5px; bottom: 59px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score078{right: 5px; bottom: 56px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score079{right: 2.5px; bottom: 53px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score080{right: 0px; bottom: 50px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score081{right: -1px; bottom: 47.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score082{right: -2px; bottom: 45px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score083{right: -3px; bottom: 42.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score084{right: -4px; bottom: 40px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score085{right: -5px; bottom: 37.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score086{right: -6px; bottom: 35px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score087{right: -7px; bottom: 32.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score088{right: -8px; bottom: 30px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score089{right: -9px; bottom: 27.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score090{right: -10px; bottom: 25px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score091{left: -11px; bottom: 20.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score092{left: -12px; bottom: 16px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score093{left: -13px; bottom: 11.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score094{left: -14px; bottom: 7px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score095{left: -15px; bottom: 2.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score096{left: -16px; bottom: -2px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score097{left: -17px; bottom: -6.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score098{left: -18px; bottom: -11px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score099{left: -19px; bottom: -15.5px;}
.result-summary-graph-cont .gauge-graph-area .user-thumb.test-score100{right: -20px; bottom: -20px;}

.result-summary-graph-cont .gauge-graph-area .gauge-graph.score10{background: url(../images/gauge_graph/gauge-graph-grade10.png); background-size: cover;}
.result-summary-graph-cont .gauge-graph-area .gauge-graph.score20{background: url(../images/gauge_graph/gauge-graph-grade20.png); background-size: cover;}
.result-summary-graph-cont .gauge-graph-area .gauge-graph.score30{background: url(../images/gauge_graph/gauge-graph-grade30.png); background-size: cover;}
.result-summary-graph-cont .gauge-graph-area .gauge-graph.score40{background: url(../images/gauge_graph/gauge-graph-grade40.png); background-size: cover;}
.result-summary-graph-cont .gauge-graph-area .gauge-graph.score50{background: url(../images/gauge_graph/gauge-graph-grade50.png); background-size: cover;}
.result-summary-graph-cont .gauge-graph-area .gauge-graph.score60{background: url(../images/gauge_graph/gauge-graph-grade60.png); background-size: cover;}
.result-summary-graph-cont .gauge-graph-area .gauge-graph.score70{background: url(../images/gauge_graph/gauge-graph-grade70.png); background-size: cover;}
.result-summary-graph-cont .gauge-graph-area .gauge-graph.score80{background: url(../images/gauge_graph/gauge-graph-grade80.png); background-size: cover;}
.result-summary-graph-cont .gauge-graph-area .gauge-graph.score90{background: url(../images/gauge_graph/gauge-graph-grade90.png); background-size: cover;}
.result-summary-graph-cont .gauge-graph-area .gauge-graph.score100{background: url(../images/gauge_graph/gauge-graph-grade.png); background-size: cover;}


.correct-percent-box{width: 100%; text-align: center; color: #000;}
.correct-percent-box .title{font-size: 16px;}
.correct-percent-box .percentage{font-size: 100px; font-weight: 700; line-height: 100%; height: 100px; padding: 5px 0 0 0;}
.correct-percent-box .percentage span{font-size: 36px;}
.correct-percent-box .detail{font-size: 12px;}

.evaluation-question .card{border: 1px solid #CED4DA; margin-bottom: 20px;}
.evaluation-question .card.on{border: 5px solid #FFE25A;box-shadow: 0 5px 10px rgba(0,0,0,0.15), 0 5px 10px rgba(0,0,0,0.15);}
.evaluation-question .card .card-question{ font-weight: 700; width: 100%;}
.evaluation-question .card .card-question p{ font-size: 18px; color: #000; margin:0; display: inline-block;}
.evaluation-question .card .card-question span{font-size: 16px; line-height: 24px; color: #6C7379; display: inline-block; width: 50px;}
.evaluation-question .card .card-body{padding: 30px;}

.question-comment-warp{height: 100%; }
.question-comment-warp .comment-box-area{position: relative; padding: 34px 0 0 0;}
.question-comment-warp .comment-box-area .comment-box-icon{position: absolute; top:0px; left: 0; background:url(../images/comment_box_icon.png) no-repeat; background-size: 75px; width: 75px; height: 47px;}
.question-comment-warp .comment-box{background: #E6F6FF; height: 100%;  border:1px solid #222221; margin-bottom: 30px; color: #222221; padding: 15px 20px; border-radius: 20px;}
.question-comment-tag{ text-align: right;}
.question-comment-tag span{ display: inline-block; color:#0065A1; border:1px solid #0065A1; padding: 2px 10px; margin:5px 0 0 10px; font-size: 12px; border-radius: 3px;}

.question-multiple-choice li.answer-choice{color: #ff0000;}
.question-multiple-choice li.answer-correct{color: #0000ff;}
.question-multiple-choice li.answer-wrong{color: #ff0000;}

.table-percentage-evaluation{width: 100%;}
.table-percentage-evaluation thead tr th{border-bottom: 1px solid #aaa;}
.table-percentage-evaluation tr th{text-align: center;}
.table-percentage-evaluation tr{border-bottom: 1px solid #CED4DA;}
.table-percentage-evaluation tr th, .table-percentage-evaluation tr td{padding: 3px 10px; font-size: 12px;}
.table-percentage-evaluation tr:last-child{border-bottom: none;}

.unit-blit{font-size: 6px; display: inline-block; position: relative; top: -3px; margin-right: 5px;}
.unit-blit.ec01{color: #3585DF;}
.unit-blit.ec02{color: #EE6337;}
.unit-blit.ec03{color: #EAC13C;}
.unit-blit.ec04{color: #39D692;}
.unit-blit.step01{opacity: 0.9;}
.unit-blit.step02{opacity: 0.7;}
.unit-blit.step03{opacity: 0.5;}
.unit-blit.step04{opacity: 0.3;}

.chart-warp{max-width: 350px; height: 350px; margin: 20px auto 0 auto;}

.user-thumb-select input{ display: none;}
.user-thumb-select .dropdown-member-thumb{ position: absolute; left: 90px; top: -9px; transform: scaleX(0); transition: all 0.2s; box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; background: #fff; border: 1px solid #ced4da; border-radius: 100px; padding: 8px 12px;}
.user-thumb-select #member-thumb-btn:checked ~ .dropdown-member-thumb {transform: scaleX(1);}

.user-thumb-select #user-thumb00:checked ~ .dropdown-member-thumb,
.user-thumb-select #user-thumb01:checked ~ .dropdown-member-thumb,
.user-thumb-select #user-thumb02:checked ~ .dropdown-member-thumb,
.user-thumb-select #user-thumb03:checked ~ .dropdown-member-thumb,
.user-thumb-select #user-thumb04:checked ~ .dropdown-member-thumb,
.user-thumb-select #user-thumb05:checked ~ .dropdown-member-thumb {transform: scaleX(0);}

.user-thumb-select input[type=checkbox]+label{opacity: 1; border: 3px solid #1457a0; cursor: pointer; height: 62px; width: 62px; border-radius: 100%;  overflow: hidden; margin-bottom: 0;}
.user-thumb-select .dropdown-member-thumb span{display: inline-block; margin: 0 3px;}
.user-thumb-select .dropdown-member-thumb input[type=radio]{display: none;}
.user-thumb-select .dropdown-member-thumb input[type=radio]+label{ opacity: 1; display: inline-block; border: 3px solid #eee; cursor: pointer; height: 62px; width: 62px; border-radius: 100%; margin-bottom: 0;}
.user-thumb-select .dropdown-member-thumb input[type=radio]:checked+label{}
.user-thumb-select .dropdown-member-thumb input[type=radio]:hover+label{ border: 3px solid #1457a0;}
.user-thumb-select .dropdown-member-thumb input label img{height: 100%; width: 100%;}


#mk-fullscreen-searchform{position:initial; margin-top: 100px;}
.search-kwd-warp .kwd-list{padding: 3px 0 0 0;}
.search-kwd-warp .kwd-list .kwd-item{border-bottom: 1px solid rgba(255, 255, 255, 0.2); text-align: left; z-index: 999999; position: relative;}
.search-kwd-warp .kwd-list .kwd-item .kwd-txt{ color: #fff; font-size: 12px; padding: 12px 0 10px 5px; display: inline-block;}
.search-kwd-warp .kwd-list .kwd-item .kwd-ico{ display: inline-block;}
.search-kwd-warp .kwd-list .kwd-item .kwd-ico i{font-size: 12px; color: rgba(255, 255, 255, 0.3);}

.search-close-btn:after {display: inline-block; content: "\00d7"; font-style: normal; font-size: 30px;}


.section-bg-gray{background: #EFF5FA; padding: 80px 0;}

.board-list-notice .card{background: transparent; color: #180000;}
.board-list-notice .card .card-body{padding: 0;}
.board-list-notice .card .card-body .card-title{font-size: 16px; font-weight: 700; line-height: 140%; margin-bottom: 5px;}
.board-list-notice .card .card-body .card-text{font-size: 14px;}

.board-list-notice .main-notice-area .card dl dt {width: 100%;}
.board-list-notice .main-notice-area .card dl dd { float:left; width: 100%;}

.board-list-notice .sub-notice-area .card dl dt{float: left; width: 28%;}
.board-list-notice .sub-notice-area .card dl dd{float: right; width: 70%;}

.board-list-notice .card dl dt .thumb{display: inline-block; background: #eee;}
.board-list-notice .card dl dt .thumb img{width: 100%; height: 100%;}
.board-list-notice .main-notice-area .card dl dt .thumb{ width: 100%; height: 270px; }
.board-list-notice .main-notice-area .card dl dd{margin-top: 20px;}
.board-list-notice .sub-notice-area .card dl dt .thumb{ width: 100px; height: 75px;}

.board-list-faq .card .card-body .card-title{font-size: 18px; font-weight: 700; line-height: 140%; margin-bottom: 5px;}
.board-list-title{margin-bottom: 20px;}
.board-list-title .btn-more{color: #0040A1; font-size: 14px; padding: 7px 0 0 0; display: inline-block;}
.board-list-title .btn-more i{padding-left: 5px;}

.board-list-warp .board-list-notice-warp{ padding: 0 50px 0 15px;}
.board-list-notice .col-6.sub-notice-area{padding: 0;}


.top_courses .details .tc_content .course-title{font-size: 22px; font-weight: 700; line-height: 140%; min-height: 62px;}
.top_courses .details .learning-period-area{font-size: 14px;}

.thumblist-new-box .course-title{ font-size: 14px !important; line-height: 150%; margin-right: 3px;}
.thumblist-new-box .course-title .permission { font-size: 12px; font-weight: 700; padding: 6px 5px 5px 5px; line-height: 100%; position: relative; top: -1px; min-width: 45px;}
.thumblist-new-box .tc_content h6{margin-bottom: 0; min-height: 45px; display: flex; align-items: top;}
.thumblist-new-box .top_courses .details .tc_footer { padding:5px 20px;}


/* .box-btn-evaluation{background: url(/themes/theme2/images/box_btn_evaluation_icon.png) no-repeat 0px 49%; display: inline-block; background-size: 16px; color: #6C747A; font-size: 13px; padding: 8px 7px 8px 20px;} */

.details.fix-h-area{display:block; min-height: 105px;}
.course-btn{ display: inline-block;}
.course-btn .btn{margin: 0 5px 2px 0px;}

.card-progress-area .progress{ height: 20px; margin: 20px 10px 0px 10px;}
.card-progress-area .progress .progress-bar{padding: 2px 0 0 0; text-indent: 10px;}

.zoom-class-details{ padding: 3rem 20px 2rem 20px;max-width: 500px; width: 50%; margin: 0 auto;}
.zoom-class-details table th{text-align: justify;}
.zoom-class-details table th{text-align: left !important;}

.btn-dark:visited {color: #fff;}

.tc_footer.btn-area-ls{letter-spacing: -1px;}

.sub-topnav-area{background-color: rgb(4, 198, 198); /*background-color:#FFD200;*/ padding: 3rem 0 2rem 0;}
.sub-topnav-area.my-page{ padding-bottom:0;}

.sub-topnav-tab{ margin: 0; padding: 0; list-style: none; margin-top: 20px;}
.sub-topnav-tab li { display: inline-block; margin-right: 30px;}
.sub-topnav-tab li.active a, .sub-topnav-tab li a:hover {border-bottom-color: hsla(0, 0%, 100%, .8);}
.sub-topnav-tab li a {padding: 0 0 5px; border-bottom: 6px solid hsla(0, 0%, 100%, 0); color: #fff; display: block;}
.sub-topnav-area.class-view{}
.sub-topnav-area .lnb-area{ clear: both; overflow: hidden;}
.sub-topnav-area .lnb-area .lnb-depth {float: left;}
.sub-topnav-area .lnb-area .lnb-depth + .lnb-depth::before { content: ">"; color: #ffffff; opacity: 0.7; margin: 0 5px 0 8px;}
.sub-topnav-area .lnb-area .lnb-depth.active {color: #ffffff;}
.sub-topnav-area .lnb-area .lnb-depth a{color: #ffffff;}
.sub-topnav-area .sub-topnav-title{padding: 0.5rem 0 0 0; font-size: 36px; color: #fff; font-weight: 700; line-height: 100%;}

.dimlayer{position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.5); z-index:9999;}
.modal-results-loading{display:block; width:350px; height:250px; padding:30px 20px; border-radius:30px; text-align:center; background:#fff; opacity: 1; position: absolute; top: 35%; left: 50%; transform: translate(-50%, -50%);}
.modal-results-loading .text{display:block; color:#180000; font-size:14px;}
.modal-results-loading .loading-img{width:100%; max-width:250px; margin: 0 auto;}
.modal-results-loading .loading-img img{width:100%;}

.member-top-img{width: 100%; text-align: center; margin: 0 auto 20px auto;}
.member-top-img img{width: 100%; max-width: 360px; margin: 0 auto;}


.list-div-table .div-table-head {background: #DDDDDD;}
.list-div-table .div-table-head .div-table-th {font-weight: normal;}


.view-pc{display: block;}
.view-mo{display: none;}

.list-view-tbl-mo ul li{border-bottom: 1px solid #dee2e6; padding: 1rem .75rem;}
.list-view-tbl-mo .list-view-mo-cont dl{clear: both; overflow: hidden;}
.list-view-tbl-mo .list-view-mo-cont dl dt{float: left; width: 30%; padding-right: 10px; margin-top: 5px;}
.list-view-tbl-mo .list-view-mo-cont dl dd{float: right; width: 70%;}
.list-view-tbl-mo .list-view-mo-cont .title{font-weight: 700; font-size: 16px;}
.list-view-tbl-mo .list-view-mo-cont .title .btn-sm { padding: .15rem .5rem; font-size: .7rem; line-height: 1.5; position: relative; top: -2px;}
.list-view-tbl-mo .list-view-mo-cont .period{font-size: 13px;}
.list-view-tbl-mo .list-view-mo-cont .btn-area{text-align: center;}
.list-view-tbl-mo .list-view-mo-cont .btn-area a{width: 40%; margin: 5px 1% 0 1%; font-size: 14px;}

@media (max-width: 992px) {
    .section-bg-gray{padding: 50px 0px;}

    .board-list-warp .board-list-notice-warp{ padding: 0 15px 0 15px; width: 100%; max-width: 100%; flex: 100%;}
    .board-list-warp .board-list-faq-warp{ margin-top: 40px; width: 100%; max-width: 100%; flex: 100%;}
    .board-list-warp .main-notice-area{ width: 100%; max-width: 100%; flex: 100%;}
    .board-list-warp .sub-notice-area{max-width: 100%; flex: 100%; margin: 0 auto;}

    .board-list-notice .main-notice-area .card dl dt{float: left; width: 28%;}
    .board-list-notice .main-notice-area .card dl dd{float: right; width: 62%; margin: 0;}
    .board-list-notice .main-notice-area .card dl dt .thumb{ width: 100px; height: 75px;}

    .board-list-notice .sub-notice-area .card dl dt{float: left; width: 28%;}
    .board-list-notice .sub-notice-area .card dl dd{float: right; width: 62%;}
}


@media (min-width: 993px) {
    .fancybox-content, .fancybox-content .fancybox-iframe {
        border-radius: 20px !important;
        width: 1200px !important;
        margin-right: 400px !important;
        /*min-height: 650px;*/
    }
}


@media (max-width: 768px){
  .container.mo-full-w{padding: 0 0 0 0;}

  .total-evaluation-stepbox{margin: 30px 30px;}
  .total-evaluation-class-data { margin-bottom: 30px;}
  .total-evaluation-class-data .class-title{font-size: 30px; letter-spacing: -1px;}
  .total-evaluation-stepbox .stepbox-step{ font-size: 20px;}
  .total-evaluation-stepbox .stepbox-exbox{padding: 20px;}

  .total-evaluation-test-title { padding:25px 15px 20px 15px;  margin: 0px 0 30px 0; font-size: 28px;}
  .total-evaluation-test-title .col-md-4.right-cont{padding:10px 0 0 15px;}
  .total-evaluation-test-title .right-cont{text-align: left;}
  .total-evaluation-test-title .right-cont .btn-submit-quiz{float: right;}

  .table-marking-status-warp{height: auto; overflow-y: scroll; overflow-x: hidden; margin: 0 30px 30px 30px;}
  .btn-submit-quiz { font-size: 17px; padding: 10px 20px 8px 20px;}

  .quiz-warp{padding: 0 0px;}
  .quiz-warp .quiz-cont{border:none; min-height: 350px; padding: 0px 20px;}

  .search-kwd-warp .kwd-list{padding: 10px 0 0 0;}
  .search-kwd-warp .kwd-list .kwd-item .kwd-txt{font-size: 14px; padding: 15px 0 15px 5px;}

  .user-thumb-select .dropdown-member-thumb{ position: absolute; left: 75px; top: -6px;}
  .user-thumb-select input[type=checkbox]+label{ height: 52px; width: 52px;}

  .user-thumb-select .dropdown-member-thumb span{margin: 0 0px;}
  .user-thumb-select .dropdown-member-thumb input[type=radio]+label{ height: 40px; width: 40px;}

  .sub-topnav-area{padding: 6rem 0 2rem 0;}
  .sub-topnav-area .sub-topnav-title{line-height: 120%;}
  .top_courses .details .tc_footer { padding:5px 0px 0px 0px;}

  .zoom-class-details{width: 100%;}

  .view-pc{display: none;}
  .view-mo{display: block;}

}

@media (max-width: 520px){
    .instructor_search_result {text-align: left;}
    .candidate_revew_select.style2 ul li {display:inline-block;}
    .candidate_revew_select.style2{text-align: left !important;}

    .modal-results-loading{display:block; width:250px; height:150px;}


}