@keyframes shake {
    0% {transform: rotate(0) scale(1);}
    25% {transform: rotate(-15deg) translateY(15px) scale(0.98);}
    50% {transform: rotate(-5deg) translateY(20px) scale(0.95);}
    75% {transform: rotate(5deg) translateY(15px) scale(0.98);}
    100% {transform: translate(0) scale(1);}

}
.edu_card .wrapper .pic {overflow: hidden;}
.edu_card:hover .ecard_img{animation: shake 0.7s alternate infinite;}
.edu_card:hover .wrapper .txt ul li {border:1px solid #ccc;}
.edu_card .wrapper .txt ul li {border: 1px solid #fff;}

.inner {
    width: 100%;
}

.wrap_course_list>.inner .course_content {
    padding-bottom: 60px;
    margin-top: 16px;
}

.wrap_course_list>.inner .course_content .course_list {
    /* 더보기 버튼 */
}

.wrap_course_list>.inner .course_content .course_list ul {
    display: grid;
}

.wrap_course_list>.inner .course_content .course_list.list>ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 30px;
}

.wrap_course_list>.inner .course_content .course_list.gallery>ul {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 30px 20px;
}

.wrap_course_list>.inner .course_content .course_list .wrap_more_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 30px;
}

.wrap_course_list>.inner .course_content .course_list .wrap_more_btn .btn_st_more {
    width: 328px;
    height: 44px;
    line-height: 42px;
    font-size: 15px;
    color: #171717;
    text-align: center;
    background-color: #fff;
    border: 1px solid #838383;
    border-radius: 8px;
    opacity: 0.5;
    pointer-events: none;
}

.wrap_course_list>.inner .course_content .course_list .wrap_more_btn .btn_st_more.active {
    opacity: 1;
    pointer-events: initial;
}

@media (--mobile-viewport) {
    .wrap_course_list>.inner .course_content .course_list .wrap_more_btn {
        margin: 30px 16px 0;
    }

    .wrap_course_list>.inner .course_content .course_list .wrap_more_btn .btn_st_more {
        width: 100%;
    }
}

.wrap_course_list.tiny>.inner .couse_header {
    margin-top: 18px;
}

.wrap_course_list.tiny>.inner .couse_header h2 {
    height: 28px;
    line-height: 28px;
    font-size: 20px;
    padding: 0 20px;
}

@media (--mobile-viewport) {
    .wrap_course_list.tiny>.inner .couse_header h2 {
        height: 64px;
        line-height: 64px;
    }
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter {
    margin-top: 18px;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_search_filter {
    display: none;
    border-radius: 0;
    padding: 13px 58px 13px 16px;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_search_filter>.inner .filter_list+.filter_list {
    margin-left: 17px;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_search_filter>.inner .filter_list+.filter_list:before {
    top: 50%;
    bottom: initial;
    left: -8px;
    transform: translateY(-50%);
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_search_filter>.inner .filter_list .tit {
    display: none;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_search_filter .btn_reset_filter {
    position: absolute;
    top: 50%;
    right: 13px;
    width: 32px;
    height: 32px;
    font-size: 0;
    border-radius: 16px;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.12);
    transform: translateY(-50%);
    z-index: 10;
    padding: 0;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_search_filter .btn_reset_filter:after {
    position: absolute;
    left: 50%;
    width: 22px;
    height: 22px;
    transform: translateX(-50%) translateY(-50%);
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_sorting_area {
    z-index: 10;
    padding: 0 16px;
    margin-top: 0;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_sorting_area .wrap_total span {
    height: 44px;
    line-height: 44px;
    font-size: 14px;
    color: #171717;
    font-weight: 500;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_sorting_area .wrap_flex .wrap_ordering .wrap_change_sorting {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_sorting_area .wrap_flex .wrap_ordering .wrap_change_sorting .btn_change_sorting {
    position: relative;
    height: 44px;
    line-height: 44px;
    font-size: 14px;
    font-weight: 500;
    color: #171717;
    padding-right: 22px;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_sorting_area .wrap_flex .wrap_ordering .wrap_change_sorting .btn_change_sorting:after {
    content: '';
    position: absolute;
    top: 50%;
    right: 0;
    width: 16px;
    height: 16px;
    background-image: url(../images/common/icon_my_arrow_down_gray.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    transition: transform 0.5s;
    transform: translateY(-50%) rotateX(180deg);
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_sorting_area .wrap_flex .wrap_ordering .wrap_change_sorting .btn_change_sorting.active:after {
    z-index: 20;
    transform: translateY(-50%);
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_sorting_area .wrap_flex .wrap_ordering .wrap_sorting {
    display: none;
    position: absolute;
    top: -1px;
    right: 0;
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0 1px 12px 0 rgba(0, 0, 0, .12);
    z-index: 10;
    padding: 16px;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_sorting_area .wrap_flex .wrap_ordering .wrap_sorting.active {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0;
    animation: showMyLrnListSorting 0.2s forwards;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_sorting_area .wrap_flex .wrap_ordering .wrap_sorting .btn_sorting {
    display: block;
    width: 100%;
    /* text-align: right;
	 */
    word-break: keep-all;
    white-space: nowrap;
    padding-right: 20px;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_sorting_area .wrap_flex .wrap_ordering .wrap_sorting .btn_sorting+.btn_sorting {
    margin-top: 10px;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter .wrap_sorting_area .wrap_flex .wrap_ordering .wrap_sorting .btn_sorting+.btn_sorting:before {
    display: none;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter_mo {
    background-color: #f1f2f5;
    padding: 13px 16px;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter_mo .swiper-container {
    overflow: visible;
    padding: 0;
    margin: 0;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter_mo ul li {
    width: auto;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter_mo ul li button {
    position: relative;
    display: block;
    height: 36px;
    line-height: 34px;
    font-size: 14px;
    color: #171717;
    font-weight: 500;
    text-align: center;
    background-color: #fff;
    border: 1px solid #d7dce3;
    border-radius: 18px;
    padding: 0 38px 0 12px;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter_mo ul li button:before {
    content: '';
    position: absolute;
    top: 50%;
    right: 10px;
    width: 20px;
    height: 20px;
    background-image: url(../images/common/icon_dropdown_down_20_normal.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    transform: translateY(-50%);
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter_mo ul li button.active {
    color: #fff;
    background-color: #1940c1;
    border: 1px solid #1940c1;
}

.wrap_course_list.tiny>.inner .couse_header .wrap_filter_mo ul li button.active:before {
    background-image: url(../images/common/icon_dropdown_down_20_normal_white.svg);
}

.wrap_course_list.tiny>.inner .course_content {
    margin-top: 0;
}

.wrap_course_list.search>.inner .couse_header {
    margin-top: 0;
}

.wrap_course_list.search>.inner .couse_header .wrap_filter {
    margin-top: 30px;
}

.tiny.wrap_course_list>.inner .couse_header .wrap_filter .wrap_search_filter>.inner .filter_list ul li .btn_search_filter {
    width: 65px;
    height: 36px;
    border-radius: 18px;
}

.tiny.wrap_course_list>.inner .couse_header .wrap_filter .wrap_search_filter>.inner .filter_list ul li .btn_search_filter .txt {
    height: 34px;
    line-height: 34px;
}

.tiny.wrap_course_list>.inner .couse_header .wrap_filter .wrap_search_filter>.inner .filter_list ul li .btn_search_filter.active {
    justify-content: center;
    padding: 0;
}

.tiny.wrap_course_list>.inner .couse_header .wrap_filter .wrap_search_filter>.inner .filter_list ul li .btn_search_filter.active:before {
    display: none;
}

.tiny.wrap_course_list>.inner .couse_header .wrap_filter .wrap_search_filter>.inner .filter_list ul li .btn_search_filter.active.wide {
    padding: 0 13px;
}

.linear.wrap_course_list>.inner .course_content .course_list.list>ul {
    grid-template-columns: repeat(1, 1fr);
    gap: 20px;
}

@media (max-width: 1248px) {
    .wrap_course_list>.inner .course_content .course_list.list>ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        grid-gap: 10px;
    }
}

/* ---------------------------- */
/* (공통) 과정목록 아이템 */
/* ---------------------------- */
.course_item {
    width: 100%;
}

.course_item .wrap_thumbnail img:hover {
    transform: scale(1.08);
}

.course_item > .inner:hover {
    border-radius: 15px;
   box-shadow: 0 0 15px rgb(71 167 231 / 80%), 0 0 25px rgba(52, 152, 219, 0.6), 0 0 35px rgba(52, 152, 219, 0.4);
}

.course_item .wrap_thumbnail:hover:before {
    background: #0C78D6;
}


@media (max-width: 1248px) {
    .course_item {
        width: 97%;
    }
}

@media (max-width: 767px) {
    .course_item {
        width: 93%;
    }
}

.course_item>.inner {
    position: relative;
    background-color: #f1f2f5;
    border-radius: 16px;
    /* 과정 기본정보 */
    /* 과정 부가정보 */
}

.course_item>.inner .wrap_course_cont {
    /* 썸네일 */
    /* spec area */
    /* 가변 레이아웃 영역 */
}

.course_item>.inner .wrap_course_cont .wrap_thumbnail {
    position: relative;
    grid-column: 1;
    grid-row: 1 / span 2;
    overflow: hidden;
}

.course_item>.inner .wrap_course_cont .wrap_thumbnail .thumb_img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.course_item>.inner .wrap_course_cont .wrap_spec {
    grid-column: 2;
    grid-row: 1;
    /* 라벨 */
    /* 타이틀 */
    /* 날짜 */
}

.wrap_label {
    height: 21px;
}

.course_item>.inner .wrap_course_cont .wrap_spec .wrap_label ul {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 13px;
    overflow: hidden;
}

.course_item>.inner .wrap_course_cont .wrap_spec .wrap_label ul li {
    position: relative;
}

.course_item>.inner .wrap_course_cont .wrap_spec .wrap_label ul li span {
    display: block;
    height: 19px;
    line-height: 19px;
}

.course_item>.inner .wrap_course_cont .wrap_spec .wrap_label ul li span.txt {
    font-size: 13px;
    color: #1940c1;
    font-weight: bold;
    letter-spacing: 0;
}

.course_item>.inner .wrap_course_cont .wrap_spec .wrap_label ul li+li:before {
    content: '';
    position: absolute;
    top: 50%;
    left: -7px;
    width: 1px;
    height: 10px;
    background-color: #a2b4e6;
    transform: translateY(-50%);
}

.course_item>.inner .wrap_course_cont .wrap_spec .wrap_title p.tit {
    display: -webkit-box;
    height: 48px;
    line-height: 24px;
    font-size: 15px;
    color: #000;
    font-weight: bold;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.course_item>.inner .wrap_course_cont .wrap_spec .wrap_title p.tit b {
    font-weight: bold;
}

.course_item>.inner .wrap_course_cont .wrap_spec .wrap_title p.tit em {
    font-size: inherit;
    font-weight: inherit;
    background: #fafa3a;
    color: #000;
}

.course_item>.inner .wrap_course_cont .wrap_spec .wrap_date {
    height: 45px;
    margin-top: 6px;
}


.course_item>.inner .wrap_course_cont .wrap_spec .wrap_date ul {
    display: flex;
    align-items: center;
    justify-content: flex-srart;
    gap: 0;
}

.course_item>.inner .wrap_course_cont .wrap_spec .wrap_date ul li span.txt {
    height: 20px;
    line-height: 20px;
    font-size: 14px;
    color: #656565;
}

.course_item>.inner .wrap_course_cont .wrap_spec .wrap_date ul li+li span.txt:before {
    content: ', ';
}

.course_item>.inner .wrap_course_cont .wrap_span_area {
    grid-column: 2;
    grid-row: 2;
}

.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner {
    display: flex;
    min-height: 26px;
    align-items: center;
    justify-content: space-between;
}

.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_review {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 9px;
    flex-shrink: 0;
    /* 평점 */
    /* 리뷰 */
}

.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_review li span {
    position: relative;
    display: block;
    height: 18px;
    line-height: 18px;
    font-size: 14px;
    color: #3b3b3b;
    font-weight: bold;
    letter-spacing: 0;
}

.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_review li span:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    transform: translateY(-50%);
}

.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_review li.rating span {
    padding-left: 20px;
}

.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_review li.rating span:before {
    width: 16px;
    height: 16px;
    background-image: url(../images/common/icon_study_star_yellow.svg);
}

.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_review li.review span {
    padding-left: 19px;
}

.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_review li.review span:before {
    width: 14px;
    height: 14px;
    background-image: url(../images/common/icon_study_review.svg);
}

.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_review .st_rating {
    position: relative;
}

.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_tag ul {
    display: flex;
    gap: 5px;
    overflow-x: hidden;
    user-select: none;
}


.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_tag ul li span.txt {
    display: block;
    height: 24px;
    line-height: 22px;
    font-size: 12px;
    color: #656565;
    word-break: keep-all;
    white-space: nowrap;
    background-color: #fff;
    border: 1px solid #dbdbdb;
    border-radius: 3px;
    padding: 0 7px;
}



.scrollable li {
    flex: 0 0 auto;
}

.scrollable.draggable,
.scrollable.draggable * {
    cursor: grab;
}

.scrollable.active,
.scrollable.active * {
    cursor: grabbing;
}



span[class^="ncs_"] {
    display: block;
    height: 24px;
    line-height: 22px;
    font-size: 12px;
    word-break: keep-all;
    white-space: nowrap;
    border: 1px solid #dbdbdb;
    border-radius: 3px;
    padding: 0 7px;
}

.ncs_not {
    all : unset;
    border : 1px solid transparent !important;
}

.ncs_voucher {
    background-color: #fbf4d6;
    color: #ff7a43;
}

.ncs_sanup {
    background-color: #EFF5FF;
    color: #1D56BC;
}

.ncs_best {
    background-color: #fff1f0;
    color: #ee3f3f;
}

.ncs_chuchun {
    background-color: #f6f6f6;
    color: #3030f5;
}

.course_item>.inner .wrap_course_footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-top: 1px solid #e5e5e5;
}

.course_item>.inner .wrap_course_footer .wrap_price {
    flex-shrink: 0;
}

.course_item>.inner .wrap_course_footer .wrap_price span.price {
    display: block;
    height: 24px;
    line-height: 24px;
    font-size: 16px;
    color: #000;
    font-weight: 900;
}

.course_item>.inner .wrap_course_footer .wrap_price span.price em {
    font-weight: 900;
}

.course_item>.inner .wrap_course_footer .wrap_button {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 1;
}

.course_item>.inner .wrap_course_footer .wrap_button ul {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
}

.course_item>.inner .wrap_course_footer .wrap_button ul li .footer_button {
    display: block;
    width: 120px;
    height: 38px;
    line-height: 36px;
    font-size: 14px;
    color: #171717;
    font-weight: bold;
    text-align: center;
    background-color: #fff;
    border: 1px solid #dbdbdb;
    border-radius: 8px;
    padding: 0;
}

.course_item>.inner .wrap_course_footer .wrap_button ul li .footer_button.accent {
    color: #fff;
    background-color: #000;
    border: 1px solid #000;
}

.list.course_item>.inner {
    padding: 16px;
}

.list.course_item>.inner .wrap_course_cont {
    display: grid;
    grid-template-columns: 246px auto;
    gap: 0 20px;
}

.list.course_item>.inner .wrap_course_cont .wrap_thumbnail {
    height: 137px;
    border-radius: 14px;
}

.list.course_item>.inner .wrap_course_cont .wrap_spec .wrap_title {
    margin-top: 8px;
}

.list.course_item>.inner .wrap_course_cont .wrap_span_area {
    margin-top: 12px;
}

.list.course_item>.inner .wrap_course_footer {
    padding-top: 10px;
    margin-top: 13px;
}

.list.course_item.tablet>.inner .wrap_course_cont {
    gap: 0 14px;
}

.list.course_item.mobile>.inner {
    padding: 16px 16px 10px;
}

.list.course_item.mobile>.inner .wrap_course_cont {
    position: relative;
    grid-template-columns: 123px auto;
    gap: 0 14px;
}

.list.course_item.mobile>.inner .wrap_course_cont .wrap_thumbnail {
    height: 69px;
}

.list.course_item.mobile>.inner .wrap_course_cont .wrap_spec .wrap_title {
    margin-top: 4px;
}

.mobile.course_item>.inner .wrap_course_cont .wrap_thumbnail {
    grid-row: 1;
}

.mobile.course_item>.inner .wrap_course_cont .wrap_spec .wrap_title p.tit {
    font-size: 14px;
    line-height: 22px;
}

.mobile.course_item>.inner .wrap_course_cont .wrap_spec .wrap_date {
    position: absolute;
    bottom: 0;
    margin-top: 0;
}


.mobile.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner {
    gap: 14px;
}

.mobile.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_review {
    flex-basis: 123px;
}


.tablet.course_item>.inner .wrap_course_footer .wrap_button ul li .footer_button,
.mobile.course_item>.inner .wrap_course_footer .wrap_button ul li .footer_button {
    width: 100px;
}

.gallery.course_item>.inner .wrap_course_cont .wrap_thumbnail {
    border-radius: 16px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.gallery.course_item>.inner .wrap_course_cont .wrap_spec {
    padding: 16px 16px 0;
}

.gallery.course_item>.inner .wrap_course_cont .wrap_spec .wrap_title {
    margin-top: 4px;
}

.gallery.course_item>.inner .wrap_course_cont .wrap_span_area {
    padding: 0 14px;
}

.gallery.course_item>.inner .wrap_course_footer {
    flex-direction: column;
    gap: 16px;
    padding: 10px 0;
    margin: 16px 16px 0;
}

.gallery.course_item>.inner .wrap_course_footer .wrap_price {
    align-self: flex-end;
}

.gallery.course_item>.inner .wrap_course_footer .wrap_button {
    width: 100%;
}

.gallery.course_item>.inner .wrap_course_footer .wrap_button ul {
    width: 100%;
}

.gallery.course_item>.inner .wrap_course_footer .wrap_button ul li {
    flex: 1;
}

.gallery.course_item>.inner .wrap_course_footer .wrap_button ul li .footer_button {
    width: 100%;
    cursor: pointer;
}

.gallery.course_item.pc>.inner .wrap_course_cont .wrap_thumbnail {
    height: 155px;
}

.gallery.course_item.tablet>.inner .wrap_course_cont .wrap_thumbnail {
    height: 123px;
}

.gallery.course_item.mobile>.inner .wrap_course_cont .wrap_thumbnail {
    height: 87px;
}

@media (--mobile-viewport) {
    .gallery.course_item.medium>.inner .wrap_course_cont .wrap_thumbnail .wrap_spec {
        padding: 14px 14px 0;
    }

    .gallery.course_item.small>.inner .wrap_course_cont .wrap_thumbnail .wrap_spec {
        padding: 12px 12px 0;
    }
}

.tablet.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner {
    justify-content: flex-start;
    gap: 16px;
}

.pc.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_review {
    order: 2;
}

.pc.course_item>.inner .wrap_course_cont .wrap_span_area .span_inner .wrap_tag {
    order: 1;
    overflow: hidden;
}


@media (max-width: 1248px) {

    .board__tab,
    .board__tab-line {
        flex-wrap: nowrap;
        overflow-x: auto;
        width: 100%;
    }
}

@media (max-width: 1024px) {

    .board__tab,
    .board__tab-line {
        margin-top: 24px;
    }
}

@media (max-width: 767px) {
    .course_item>.inner .wrap_course_cont .wrap_spec .wrap_date {
        margin-bottom: 24px;
    }

    .list.course_item>.inner .wrap_course_cont .wrap_span_area {
        margin-top: 36px;
    }
}

.application_list .board__index-box {
    flex-wrap: wrap;
}

.application_list .board__index-box>li.board__index-term {
    flex-wrap: wrap;
}

.application_list .board__index-term select {
    width: 100%;
}


@media screen and (max-width: 767px) {
    .application_list .board__index-box>li.board__index-term .icon-custom-filter {
        width: 100%;
    }

    .application_list .board__index-term>label {
        flex: 1 1 calc(50% - 4px);
    }
}

@media (max-width: 1024px) {
    .board-frame {
        padding: 0px !important;
    }
}

/* -------------------------------------- */
/* CourseItem > 찜 버튼                    */
/* -------------------------------------- */

.course_item .wrap_button li.favorite {
    flex: initial !important;
    width: 38px !important;
}

.course_item .wrap_button .btn_favorite {
    outline: none;
    width: 38px;
    height: 38px;
    font-size: 0;
    background-image: url(../img/ncs/icon_favorite_38.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    transition: background-image .1s;
}

.course_item .wrap_button .btn_favorite.active {
    background-image: url(../img/ncs/icon_favorite_38_active.svg);
}

.btn_favorite {
    cursor: pointer;
}


.wrap_course_list .course_list li.no_search_result p {
    position: relative;
    line-height: 200px;
    font-size: 17px;
    color: #1a1a1a;
    font-weight: 500;
    text-align: center;
    padding: 142px 20px 0;
}

.wrap_course_list .course_list li.no_search_result p:before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    width: 128px;
    height: 310px;
    background-image: url(../img/ncs/icon_no_recent_search.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    transform: translateX(-50%);
}

@media (--mobile-viewport) {
    .wrap_course_list .course_list li.no_search_result p {
        padding: 98px 20px 0;
    }

    .wrap_course_list .course_list li.no_search_result p:before {
        width: 96px;
        height: 76px;
    }
}

.wrap_course_list.grid .course_list li.no_search_result {
    grid-column: 1 / span 2;
}

.wrap_course_list.grid .course_list.gallery li.no_search_result {
    grid-column: 1 / span 4;
}


.tag-area {
    position: relative;
    text-align: right;
    margin-top: 20px;
    margin-left: auto;
    width: 85%;
}

@media (max-width: 1024px) {
    .tag-area {
        width: 90%;
    }
}

@media screen and (max-width: 767px) {
    .tag-area {
        width: 100%;
    }
}

.tag-area2 {
    position: relative;
    text-align: center;
    width: 100%;
}

.tag-area li, 
.tag-area2 li{
    display: inline-block;
    margin: 0 4px 10px;
    box-sizing: border-box
}

.tag-area li a, 
.tag-area2 li a {
    display: block;
    color: #222;
    text-align: center;
    border: 1px solid #d6d6d6;
    border-radius: 35px;
    padding: 5px 16px;
    font-size: 14px
}

.tag-area li a:before, 
.tag-area2 li a:before {
    content: "#";
    margin-right: 4px;
    color: #888
}

.tag-area li a.active, 
.tag-area2 li a.active{
    background: #1c1f2a;
    color: #fff;
    border-color: #1c1f2a
}

.tag-area li a.active:before, 
.tag-area2 li a.active:before {
    color: #fff
}


.wrap_listing {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
}

.wrap_listing {
    display: block;
    font-size: 0;
    border: 0;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    transition: background-image 0.2s;
    padding: 0;
}

@media (max-width: 1248px) {
    .wrap_listing {
        display: none;
    }
}

.btn_list_type.list {
    background-image: url(../img/ncs/icon_cardtype_list.svg);
    color: transparent;
    width: 40px;
    height: 40px;
    outline: none;
    cursor: pointer;
}

.btn_list_type.list.active {
    background-image: url(../img/ncs/icon_cardtype_list_active.svg);
}

.btn_list_type.gallery {
    background-image: url(../img/ncs/icon_cardtype_gallery.svg);
    color: transparent;
    width: 40px;
    height: 40px;
    margin-left: 5px;
    outline: none;
    cursor: pointer;
    
}

.btn_list_type.gallery.active {
    background-image: url(../img/ncs/icon_cardtype_gallery_active.svg);
}

.course_item.list.tablet .inner .wrap_tag {
    width: 56vw;
    max-width: 56vw;
}

.course_item.list.mobile .inner .wrap_tag {
    width: 42vw;
    max-width: 42vw;
}


@media (min-width: 1024px) {
    .course_item.list.pc {
        width:93%;
    }
}


@media (min-width: 1248px) {
    .course_item.list.pc {
        width:98%;
    }
}

.box {
    padding-bottom: 5px;
    color : black;
}

.box_span {
    line-height: 26px;
    padding: 0px 8px;
    margin-right: 5px;
    border-radius: 35px;
    border: 1px solid rgb(189, 189, 189) !important;
    background-color: rgb(255, 255, 255);
    font-size: 14px;
    color: rgb(117, 117, 117);
    margin-left: 3px;
    cursor: pointer;
}

.box_span_pk {
    font-weight: 700;
    padding: 0px 8px !important;
    vertical-align: bottom;
    border-radius: 14px;
    border: 1px solid rgb(189, 189, 189) !important;
    background-color: rgb(255, 255, 255) !important;
    font-size: 10px !important;
    color: rgb(117, 117, 117) !important;
    margin-left: 8px;
    cursor: pointer;
}

.arrow_box {
    display: none;
    position: absolute;
    z-index: 9999;
    line-height: 20px;
    padding: 10px;
    border-radius: 8px;
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    background: #fff;
    color: black;
}

.box:hover+p.arrow_box {
    display: block;
}

.dday {
    color: #ee3f3f;
    letter-spacing: 0;
    font-weight: 700;
}


#modal {
    width: 50%;
    display: none;
    position: fixed;
    background: #ffffff;
    border-radius: 12px
}

@media (max-width: 1024px) {
    #modal {
        width: 65%;
    }
}

@media (max-width: 767px) {
    #modal {
        width: 80%;
    }
}

#modal .notice_tit{
    padding: 15px 20px;
    font-weight: bold;
    font-size: 20px;
    letter-spacing: -0.5px;
}

#modal_btn_close {
    float: right;
    width: 24px;
    outline: none;
}

/* 내용 */
#modal .score_center {
    height: 100%;
    padding: 20px 20px 0;
    color: #3a3a3a;
}

#modal .score_center .score_info {
    margin-bottom: 50px
}

#modal .score_center .score_info .tit {
    padding-left: 20px;
    margin-bottom: 10px;
    position: relative;
    color: #494850;
    font-size: 17px;
    font-weight: 700;
    font-family: 'NanumSquare', '나눔스퀘어'
}

#modal .score_center .score_info .tit:before {
    content: '';
    display: inline-block;
    position: absolute;
    top: 0px;
    left: 0;
    border-top: 9px solid transparent;
    border-left: 13px solid #494850;
    border-right: 13px solid transparent;
    border-bottom: 9px solid transparent
}

#modal .score_center .score_info .score_tb {
    width: 100%;
    border-top: 1px solid #494850
}

#modal .score_center .score_info .score_tb caption {
    height: 0;
    overflow: hidden;
    text-indent: -9999px
}

#modal .score_center .score_info .score_tb th {
    padding: 10px;
    border-bottom: 1px solid #D0D2D4;
    color: #494850;
    font-size: 13px;
    background: #F0F1F2
}

#modal .score_center .score_info .score_tb td {
    padding: 10px;
    border-bottom: 1px solid #d0d2d4;
    font-size: 13px;
}

#modal .score_center .score_info .score_tb.tb2 td {
    border-left: 1px dashed #d0d2d4;
    text-align: center
}

#modal .score_center .score_info .score_tb.tb2 td:first-child {
    border-left: 0
}

#modal .score_center .score_qust {
    margin-bottom: 50px
}

#modal .score_center .score_qust .qust_box {
    padding-top: 50px
}

#modal .score_center .score_qust .qust_box .num {
    margin-bottom: 30px;
    position: relative;
    font-size: 20px;
    font-weight: 900;
    letter-spacing: -1px
}

#modal .score_center .score_qust .qust_box .scoring {
    position: absolute;
    z-index: -1;
    top: -30px;
    left: -14px
}

#modal .score_center .score_qust .qust_box .tit {
    margin-bottom: 10px;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -0.5px
}

#modal .score_center .score_qust .qust_box .point {
    padding: 10px;
    margin-bottom: 20px;
    border: 1px solid #D0D2D4;
    font-size: 13px
}

#modal .score_center .score_qust .qust_box .answ {
    margin-bottom: 20px
}

#modal .score_center .score_qust .qust_box .answ ul li {
    margin-bottom: 10px;
    font-size: 13px
}

#modal .score_center .score_qust .qust_box .expl {
    width: 100%;
    padding: 20px;
    border: 1px solid #C6CACD;
    display: table;
    background: #F9F9F9
}

#modal .score_center .score_qust .qust_box .expl .tit {
    width: 100px;
    display: table-cell;
    vertical-align: top;
    color: #ca2020;
    font-size: 17px;
    font-weight: 700;
    font-family: 'NanumSquare', '나눔스퀘어'
}

#modal .score_center .score_qust .qust_box .expl .txt {
    display: table-cell;
    vertical-align: top;
    font-size: 13px
}

#modal .score_center .btn_end {
    width: 185px;
    height: 52px;
    margin: 0 auto 50px;
    border: 1px solid #24323E;
    display: inline-block;
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    background: #494850;
    cursor: pointer
}




.simplemodal-overlay {
    background: #000
}

.support_wrap > .content {
    cursor: pointer;
}


@media (min-width:1200px) {
    .edu_card { background:url(../img/main/edu_card_bg.gif) top; }
    .edu_card .wrapper a { display:table; width:1000px; margin:0 auto;}
    .edu_card .wrapper .pic { display:table-cell; vertical-align:middle; }
    .edu_card .wrapper .tit { display:table-cell; vertical-align:middle; padding-top:2%; color:#497e98; }
    .edu_card .wrapper .tit strong { display:block; font-size:1.5em; color:#222; line-height:1.5em; }
    .edu_card .wrapper .txt { display:table-cell; vertical-align:middle; padding-top:2%; overflow:hidden;}
    .edu_card .wrapper .txt ul li { float:left; background:#fff; border-radius:15px; margin:0 5px; padding:5px 10px; font-size:0.9em; color:#646464; letter-spacing:-0.5px; text-align:center; }

    .support { width:1200px; margin:0 auto; }
    .support .tit { border-bottom:1px solid #e0e0e0; padding-bottom:10px; font-size:1.3em; font-weight:600; color:#222; }
    .support_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; margin-left:auto; width:100%; }
    .support_wrap .content { width:11.5%; margin:2% 0; }
    .support_wrap .last { display:none;} 
    .support_wrap .content .pic {transition: ease 0.3s; display:block; width:100%; padding:0; text-align:center; }
    .support_wrap .content .pic img { width:39px; }
    .support_wrap .content p {transition: ease 0.3s; display:block; margin-top:8px; font-size:1.0em; color:#636363; text-align:center;}
    .support_wrap .content:hover .pic,.support_wrap .content:hover p {transform: translateY(-7px); }


    .info_banner { width:1200px; margin:20px auto; overflow:hidden; }
    .info_banner .manual a { float:left; background:url(../img/main/info_banner_01.gif) left; margin-right:1.5%; width:14%; padding:25px 0 25px 11%; font-size:0.9em; color:#646464; }
    .info_banner .company a { float:left; background:url(../img/main/info_banner_02.gif) left; margin-right:1.5%; width:14%; padding:25px 0 25px 11%; font-size:0.9em; color:#646464; }
    .info_banner .manual strong, .info_banner .company strong { display:block; font-size:1.4em; font-weight:500; color:#222; line-height:1.7em; }
    .info_banner .ceo a { float:right; background:url(../img/main/info_banner_03.jpg); width:44%; padding:24px 0 25px 3%; font-weight:300; font-size:0.9em; color:#fff;}
    .info_banner .ceo strong { display:block; font-size:1.5em; font-weight:600; line-height:1.5em; }
}

@media (min-width:768px) and (max-width:1314px) {
    .edu_card { background:url(../img/main/edu_card_bg.gif) top; }
    .edu_card .wrapper a { display:table; width:90%; margin:0 auto;}
    .edu_card .wrapper .pic { display:table-cell; vertical-align:middle; }
    .edu_card .wrapper .tit { display:table-cell; vertical-align:middle; padding-top:2.2%; color:#497e98; }
    .edu_card .wrapper .tit strong { display:block; font-size:1.2em; color:#222; line-height:1.5em; }
    .edu_card .wrapper .txt { display:table-cell; vertical-align:middle; padding-top:2.2%; overflow:hidden;}
    .edu_card .wrapper .txt ul li { float:left; background:#fff; border-radius:15px; margin:0 3px; padding:5px 10px; font-size:0.8em; color:#646464; letter-spacing:-0.5px; text-align:center; }

    .support { width:90%; margin:0 auto; }
    .support .tit { border-bottom:1px solid #e0e0e0; padding-bottom:10px; font-size:1.1em; font-weight:700; color:#222; }
    .support_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; margin-left:auto; width:100%; }
    .support_wrap .content { width:11.5%; margin:2% 0; }
    .support_wrap .last { display:none;} 
    .support_wrap .content .pic { display:block; width:100%; padding:0; text-align:center; }
    .support_wrap .content .pic img { width:28px; }
    .support_wrap .content p { display:block; margin-top:8px; font-size:0.85em; color:#636363; text-align:center;}	
        
    .info_banner { width:90%; margin:20px auto; overflow:hidden; }
    .info_banner .manual a { float:left; background:url(../img/main/info_banner_01.gif) left; background-size:cover; margin-right:1.5%; width:17%; padding:18px 0 18px 10%; font-size:79%; font-weight: bold; color:#646464; }
    .info_banner .company a { float:left; background:url(../img/main/info_banner_02.gif) left; background-size:cover; margin-right:1.5%; width:17%; padding:18px 0 18px 10%; font-size:79%; font-weight: bold; color:#646464; }
    .info_banner .manual strong, .info_banner .company strong { display:block; font-size:1.1em; font-weight:500; color:#222; line-height:1.4em; }
    .info_banner .ceo a { float:right; background:url(../img/main/info_banner_03.jpg); background-size:cover; width:40%; padding:18px 0 18px 3%; font-weight:bold; font-size:79%; color:#fff;}
    .info_banner .ceo strong { display:block; font-size:1.2em; font-weight:600; line-height:1.2em; }
}


@media (max-width:767px) {
    .edu_card { background:url(../img/main/edu_card_bg.gif) top; padding-bottom:6%; }
    .edu_card .wrapper a {  width:85%; margin:0 auto; text-align:center;}
    .edu_card .wrapper .pic { }
    .edu_card .wrapper .pic img { width:30%; }
    .edu_card .wrapper .tit { margin:10px 0 5px; color:#497e98; }
    .edu_card .wrapper .tit strong { display:block; font-size:1.3em; color:#222; line-height:1.3em; }
    .edu_card .wrapper .txt { overflow:hidden;}
    .edu_card .wrapper .txt ul li { display:inline-block; background:#fff; border-radius:15px; margin:5px 2.5px; padding:5px 10px; font-size:0.8em; color:#646464; letter-spacing:-0.5px; text-align:center; }

    .support { width:85%; margin:0 auto; }
    .support .tit { border-bottom:1px solid #e0e0e0; padding-bottom:10px; font-size:1.1em; font-weight:700; color:#222; }

    .support_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; margin-left:auto; width:100%; }
    .support_wrap .content { width:30%; margin:4% 0; }
    .support_wrap .last { opacity:0;} /* opacity:0; */
    .support_wrap .content .pic { display:block; width:100%; padding:0; text-align:center; }
    .support_wrap .content .pic img { width:28px; }
    .support_wrap .content p { display:block; margin-top:8px; font-size:0.9em; color:#636363; text-align:center;}	

    .info_banner { width:85%; margin:20px auto; overflow:hidden; }
    .info_banner .manual { background:url(../img/main/info_banner_01.gif) left top; background-size:cover;}
    .info_banner .company { background:url(../img/main/info_banner_02.gif) left top; background-size:cover;}
    .info_banner .manual strong, .info_banner .company strong { display:block; font-size:1.7em; font-weight:500; color:#222; line-height:1.2em; }
    .info_banner .manual a, .info_banner .company a { display:block; margin-bottom:3%; width:70%; padding:35px 0 23px 30%; font-size:0.9em; color:#646464;}
    .info_banner .ceo { background:url(../img/main/info_banner_03.jpg); background-size:cover;}
    .info_banner .ceo strong { display:block; font-size:1.7em; font-weight:600; line-height:1.2em; }
    .info_banner .ceo a { display:block; width:92%; padding:23px 0 20px 8%; font-weight:300; font-size:0.8em; color:#fff;}
}