
#pc_menu.menu {top:74px;z-index:999;}
.dim {z-index:7000;}
/*.menu_btn {display:block !important;}*/
.select_course_list {left:-331px;}

.page_contents {position:relative;border-bottom: 1px solid #e1e1e1;background-color: #f3f3f3;}

.note_btn {
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background: #a9acb8 url(/res/lms/img/study/common/btn_classnote.png) no-repeat center;
    cursor: pointer;
    vertical-align: middle;
    margin-left:5px;
    margin-right:5px;
}

.video_btn {
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background: #a9acb8 url(/res/lms/img/study/common/btn_video.png) no-repeat center;
    cursor: pointer;
    vertical-align: middle;
    margin-left:5px;
    margin-right:5px;
}

.subtitle_button {
    display: inline-block;
    width: 40px;
    height: 40px;
    margin-left:5px;
    margin-right:5px;
    border-radius: 20px;
    background: #a9acb8 url(/res/lms/img/study/common/btn_caption.png) no-repeat center;
    cursor: pointer;
    vertical-align: middle;
}


.learning_progress { display:none;color:#666666;margin-bottom:10px;padding-left:5px;padding-right:5px;border:1px solid #cccccc;border-radius: 5px;;font-size: 12px; }
.learning_progress.on { display:inline-block; }
.learning_progress .learning_progress_title { font-family: notokr-medium, NanumGothicBold; }

@media screen and (min-width: 1281px) {
/* min-width: 1001px -> 1281px 변경 */
    .page_contents {padding-right:337px}

    .content_header {
        position:absolute;
        top:0;
        left:0;
        right:0;
        height: 60px;
        line-height:60px;
        padding:0 20px;
        box-sizing: border-box;
        background-color: #ffffff;
        text-align: left;
        border-bottom: 1px solid #dadada;
    }

    .content_header .exit {
        position:absolute;
        left:30px;
        top:0;
        line-height:60px;
    }

    .content_header .btn_report {
        position:absolute;
        right:30px;
        top:0px;
        height:60px;
        line-height:24px;
        cursor:pointer;
        border-left: 1px solid #dadada;
        padding-left:30px;
    }

    .content_header .btn_report img {
        height:16px;
        padding-bottom:2px;
        line-height: 60px;
        vertical-align: middle;
    }

    .content_header .btn_report span {
        line-height: 60px;
        font-family: notokr-bold, NanumGothicBold;
        font-size: 14px;
        margin-left:10px;
    }

    .content_header .course_tit_group {
        display:inline-block;
    }

    .play_container {
        padding-top:60px;
    }

    .play_menu {
        display: block;
        position: absolute;
        right: 0;
        top: 60px;
        width: 336px;
        bottom:0;
        border-left: 1px solid #dadada;
        background-color: #ffffff;
        z-index: 999;
    }
    .play_menu .menu_height {
        overflow-y: auto;
        box-sizing: border-box;
        top: 60px;
        position: absolute;
        right: 0;
        left: 0;
        bottom: 0;
    }

    .play_menu_close.mobile {
        margin: 20px;
        float: right;
    }
    .play_menu .time_menu {
        position: relative;
        padding: 20px 30px 20px 55px;
        border-top: 1px solid #e1e1e1;
        cursor: pointer;
    }
    .play_menu .time_menu.on {
        background-color: #eeeeee;
    }
    .play_menu .time_menu:first-child {
        border-top: none;
    }
    .play_menu .time_menu:hover {
        text-decoration: underline;
    }
    .play_menu .time_menu.status1{
        background: url('/res/lms/img/study/reference/ico_attd.png') no-repeat 16px 31px;
    }
    .play_menu .time_menu.status2{
        background: url('/res/lms/img/study/reference/ico_img.png') no-repeat 16px 31px;
    }
    .play_menu .time_menu.status3{
        background: url('/res/lms/img/study/reference/ico_none.png') no-repeat 16px 31px;
    }
    .play_menu .time_menu.status4{
        background: url('/res/lms/img/study/reference/ico_late.png') no-repeat 16px 31px;
    }
    .play_menu .time_menu span {
        font-family: notokr-bold, NanumGothicBold;
        line-height: 24px;
        font-size: 15px;
    }
    .play_menu .time_menu .child_view {
        position: absolute;
        width: 20px;
        height: 15px;
        cursor: pointer;
        right: 15px;
        bottom: 15px;
        background-image: url('/res/lms/img/study/common/opt_arr_up.png');
        background-repeat: no-repeat;
        background-position: center;
    }
    .play_menu .time_menu .child_view.on {
        background-image: url('/res/lms/img/study/common/opt_arr_down.png');
    }
    .play_menu .time_menu .child_view.offline {
        background-image: none;
    }
    .play_menu .time_menu .during_time {
        margin-top:10px;
        font-size:12px;
        color:#b0b0b0;
    }

    .radio_group {height:60px;}
    .radio_group div {float: left;width:50%;height:59px;border-bottom:1px solid #cecece;font-family: notokr-bold, NanumGothicBold;line-height:59px;text-align: center;cursor:pointer;}
    .radio_group div.on {height:55px;border-bottom:4px solid #20beca;color:#20beca;}



    .time_sub_container {
        display: none;
        background-color: #f7f7f7;
    }
    .time_sub_container .time_sub_menu {
        padding: 0 30px 0 60px;
        height: 55px;
        line-height: 55px;
        white-space: nowrap;overflow: hidden;
        text-overflow: ellipsis;cursor:pointer
    }


    .time_sub_container .time_sub_menu.time_item_menu.status1{
        background-image: url('/res/lms/img/study/reference/ico_attd_2.png');  background-repeat:no-repeat; background-position:  23px 17px;
    }
    .time_sub_container .time_sub_menu.time_item_menu.status2{
        background-image: url('/res/lms/img/study/reference/ico_img_2.png');  background-repeat:no-repeat; background-position:  23px 17px;
    }
    .time_sub_container .time_sub_menu.time_item_menu.status3{
        background-image: url('/res/lms/img/study/reference/ico_none_2.png'); background-repeat:no-repeat; background-position:  23px 17px;
    }
    .time_sub_container .time_sub_menu.time_item_menu.status4{
        background-image: url('/res/lms/img/study/reference/ico_late_2.png'); background-repeat:no-repeat; background-position:  23px 17px;
    }

    .time_sub_container .time_sub_menu.time_sub_item_menu.status1{
        background-image: url('/res/lms/img/study/reference/ico_attd_2.png');  background-repeat:no-repeat; background-position: 29px 19px; background-size:16px 16px;
    }
    .time_sub_container .time_sub_menu.time_sub_item_menu.status2{
        background-image: url('/res/lms/img/study/reference/ico_img_2.png'); background-repeat:no-repeat; background-position: 29px 19px; background-size:16px 16px;
    }
    .time_sub_container .time_sub_menu.time_sub_item_menu.status3{
        background-image: url('/res/lms/img/study/reference/ico_none_2.png'); background-repeat:no-repeat; background-position: 29px 19px; background-size:16px 16px;
    }
    .time_sub_container .time_sub_menu.time_sub_item_menu.status4{
        background-image: url('/res/lms/img/study/reference/ico_late_2.png'); background-repeat:no-repeat; background-position: 29px 19px; background-size:16px 16px;
    }



    .time_sub_container .time_sub_menu.on {
        background-color: #e8e8e8;
    }
    .time_sub_container .time_sub_menu.time_sub_item_menu.on {
        background-color: #eeeeee;
    }
    .time_sub_container .time_sub_menu span {
        line-height: 55px;
        float: right;
    }


    .memo_bookmark {text-align: center}
    .memo_section_write_input {width:100%;height:45px;padding:10px;margin:0 0 5px 0;border:1px solid #e5e5e5;background:#fcfcfc;font-size:14px;color:#000000;text-align:left;box-sizing: border-box}
    .memo_section_write {padding:20px;cursor:pointer}
    .memo_section_write_textarea {width:100%;height:386px;margin:0;padding:10px;border:1px solid #e5e5e5;background:#fcfcfc;font-size:14px;color:#000000;text-align:left;box-sizing: border-box;}
    .memo_section_write_button_section {overflow:auto;margin-top:20px;text-align:right;}
    .memo_section_write_button {border-radius:5px;display: -moz-inline-stack;display: inline-block;zoom: 1;*display: inline;text-align: center;width:107px;height:42px;background-color:#003679;font-family: notokr-regular;line-height:42px;color:#ffffff;}
    .memo_section_cancel_button {border-radius:5px;display: -moz-inline-stack;display: inline-block;zoom: 1;*display: inline;text-align: center;width:107px;height:42px;background-color:#999;font-family: notokr-regular;line-height:42px;color:#ffffff;}

    .memo_section_list {overflow: hidden;height: 400px;margin-bottom:20px;border-top:1px solid #e1e1e1;background: #fff}
    .memo_section_list_item {position:relative;border-bottom:1px solid #e1e1e1;border-top:1px solid #fff;border-left:1px solid #fff;border-right:1px solid #fff;cursor:pointer;padding-top:12px;padding-bottom:12px; }
    .memo_section_list_item.on {border:1px solid #253a73;background: #f1f5f9}
    .memo_section_list_item img {cursor: pointer;}
    .memo_time {width:80px;left:0;top:12px;position:absolute;font-family: notokr-bold, NanumGothicBold;text-align: center;}
    .memo_title {padding-left:80px;padding-right:40px; text-align: left;white-space: nowrap;text-overflow: ellipsis;overflow:hidden; }
    .memo_del {position:absolute;right:15px;width:12px;top:14px;color:#ffffff;font-size: 14px;}
    .memo_del .del { width:12px; }

    .memo_pager {display:inline-block;overflow: auto;margin: 0 auto 30px;}
    .memo_pager > div {float:left;width:40px;height:40px;border:1px solid #cecece;text-align: center;line-height:40px;cursor:pointer}
    .memo_pager > div img {margin: 15px;vertical-align: middle}
    .memo_pager > div.btn_memo_prev {margin-right:15px;}
    .memo_pager > div.btn_memo_next {margin-left:15px;}
    .memo_pager > div.btn_memo_no {margin-left:-1px;}
    .memo_pager > div.btn_memo_no.first {margin-left:0;}
    .memo_pager > div.on {background-color: #7d7d7d;color:#fff}


    .page_contents {background-color: #f3f3f3}
    .play_nav {height: 55px;border-top: 1px solid #dadada;border-bottom: 1px solid #dadada;background-color: #ffffff;}
    .play_nav .play_name {line-height: 55px}
    .play_nav .nav_btn_group {position: relative;padding: 0 30px;height: 20px;text-align: center;margin: 18px 0;}
    .play_nav .nav_btn_group img {margin-top:4px;vertical-align: middle}
    .play_nav .nav_btn_group span {display: inline-block;height: 100%;font-family:notokr-medium, NanumGothicBold;line-height: 20px;}
    .play_nav .nav_btn_group span.left {margin-left: 10px;padding-right:30px;border-right: 1px solid #dadada;cursor:pointer;}
    .play_nav .nav_btn_group span.right {margin-right: 10px;padding-left:30px;border-left: 1px solid #dadada;cursor:pointer;}
    .play_nav .nav_btn_group .current_point {display: inline-block;color: #969ba8}


    .play_info {
        padding:20px;
        line-height:24px;
    }
    .play_info .depth1 {
        margin-bottom:10px;
        font-size: 17px;
        font-family: notokr-medium, NanumGothicBold;
    }

    .class_helper {
        margin: 30px auto 0;
        padding-bottom: 30px;
        text-align: center;
    }


    .class_helper .helper_menu {
        width: 990px;
        height: 55px;
        display: block;
        margin: 0 auto;
        /*margin-bottom: 20px;
        margin-right: 320px;
        margin-left: 320px;*/
    }
    .class_helper .helper_menu .h_menu {
        display: inline-block;
        width: 495px;
        height: 55px;
        line-height: 55px;
        text-align: center;
        color: #a6aab5;
        background-color: #ffffff;
        cursor: pointer;
        float: left;
    }
    .class_helper .helper_menu .h_menu:hover {
        text-decoration: underline;
    }
    .class_helper .helper_menu .h_menu.on {
        color: #ffffff;
        background-color: #485dbe;
    }
    .helper_contents {
        width: 910px;
    }
    .helper_contents.printout.on {
        display: inline-block;
    }
    .helper_contents.printout > div {
        position: relative;
        height: 190px !important;
    }
    /*.helper_contents.printout > div:first-child {
        margin-bottom: 40px;
    }*/
    .helper_contents.printout > div > img {
        position: absolute;
        top: 26%;
        right: -40px;
        cursor: pointer;
        z-index: 1000;
    }
    .helper_contents.printout .helper_content_title {
        margin-bottom: 30px;
        padding-left: 20px;
        font-size: 15px;
        font-family: notokr-medium, NanumGothicBold;
        background: url('/res/lms/img/study/01_web/img1_1_circle.png?V=2024010501') no-repeat 0 5px;
    }
    .helper_contents.memo {
        display: none;
        min-height: 68px;
        padding :0;
        margin:0;
    }
    .helper_contents.memo.on {
        display: inline-block !important;
    }
    .helper_contents .memo_write {
        border: 1px solid #d5d5d5;
        width: 89%;
        height: 68px;
        float: left;
    }
    .helper_contents .memo_register {
        display: inline-block;
        width: 10%;
        height: 74px;
        line-height: 74px;
        color: #ffffff;
        text-align: center;
        background-color: #5d626e;
        font-family: notokr-medium, NanumGothicBold;
        cursor: pointer;
        float: left;
    }
    .helper_contents .memo_list {
        margin-top: 100px;
    }
    .helper_contents .memo_item {
        position: relative;
        padding: 20px 0;
        width: 100%;
        border-bottom: 1px solid #ebebeb;
    }
    .helper_contents .memo_date {
        width: 100%;
        color: #b3b3b3;
        text-align: left;
    }
    .helper_contents .del {
        margin-top: 3px;
        margin-left: 10px;
        cursor: pointer;
    }
    .helper_contents .memo_text {
        max-width: 80%;
        margin-bottom: 10px;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        text-align: left;
    }
    .location {
        height: 55px;
        line-height: 55px;
        background-color: #ffffff;
        padding: 0 20px;
        font-family: notokr-medium, NanumGothicBold;
        border-bottom: 1px solid #dadada;
        font-size: 15px;
    }
    .content_container {
        height: 190px;
    }
    /*.content_container.first {
        border-bottom: 1px solid #e1e1e1;
    }*/
    .content_container .content {
        display: inline-block;
        width: 22%;
        margin-left: 4%;
        float: left;
        cursor: pointer;
    }
    .content_container .content:hover .content_tit{
        text-decoration: underline;
    }
    .content_container .content:first-child {
        margin-left: 0;
    }
    .content_container .content_img {
        position: relative;
        width: 100%;
        height: 116px;
        background-color: #eaeaea;
    }
    .content_container .content_img img {
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -57px;
        margin-top: -39px;
    }
    .content_container .content_img img.img-cover {
        position: static;
        margin: 0 !important;
        width: 100%;
        height: 116px;
    }
    .content_container .content_tit {
        margin-top: 20px;
    }

}

@media screen and (min-width: 768px) and (max-width: 1280px) {
/* max-width: 1000px -> 1280px 변경 */
    .page_contents {
        background-color: #f3f3f3;
    }
    .content_header {
        position: absolute;
        top:-60px;
        left:0;
        right:0;
        height: 60px;
        background-color: #ffffff;
        line-height:60px;
        padding:0 20px;
        box-sizing: border-box;
        border-bottom: 1px solid #dadada;
        text-align: left;
    }
    .content_header .exit {
        position:absolute;
        left:30px;
        top:0;
        line-height:60px;
    }

    .content_header .btn_report {
        position:absolute;
        right:30px;
        top:0px;
        height:60px;
        cursor:pointer;
        border-left: 1px solid #dadada;
        padding-left:30px;
    }

    .content_header .btn_report img {
        height:16px;
        padding-bottom:2px;
        line-height: 60px;
        vertical-align: middle;
    }

    .content_header .btn_report span {
        line-height: 60px;
        font-family: notokr-bold, NanumGothicBold;
        font-size: 14px;
        margin-left:10px;
    }

    .content_header .course_tit_group {
        display:inline-block;
    }
    .play_container {
        margin-top:60px;
    }
    .page_contents {
        background-color: #f3f3f3;
    }

    .play_nav {
        height: 55px;
        background-color: #ffffff;
        border-top: 1px solid #dadada;
        border-bottom: 1px solid #dadada;
        position: relative;
        /* margin-top: 12px; */
        text-align: center;
    }
    .play_nav .play_name {
        line-height: 55px;
    }
    .play_nav .nav_btn_group {position: relative;padding: 0 30px;height: 20px;text-align: center;margin: 18px 0;}
    .play_nav .nav_btn_group img {margin-top:4px;vertical-align: middle}
    .play_nav .nav_btn_group span {display: inline-block;height: 100%;font-family:notokr-medium, NanumGothicBold;line-height: 20px;}
    .play_nav .nav_btn_group span.left {margin-left: 10px;padding-right:30px;border-right: 1px solid #dadada;cursor:pointer;}
    .play_nav .nav_btn_group span.right {margin-right: 10px;padding-left:30px;border-left: 1px solid #dadada;cursor:pointer;}
    .play_nav .nav_btn_group .current_point {display: inline-block;color: #969ba8}
    .play_info {
        padding:20px;
        line-height:24px;
    }
    .play_info .depth1 {
        margin-bottom:10px;
        font-size: 17px;
        font-family: notokr-medium, NanumGothicBold;
    }
    .class_helper {
        padding: 30px;
    }
    .class_helper .helper_menu {
        height: 55px;
        margin-bottom: 20px;
    }
    .class_helper .helper_menu .h_menu {
        display: inline-block;
        width: 50%;
        height: 55px;
        line-height: 55px;
        text-align: center;
        color: #a6aab5;
        background-color: #ffffff;
        cursor: pointer;
        float: left;
    }
    .class_helper .helper_menu .h_menu:hover {
        text-decoration: underline;
    }
    .class_helper .helper_menu .h_menu.on {
        color: #ffffff;
        background-color: #485dbe;
    }
    .helper_contents {
    }
    .helper_contents.printout {
        padding: 40px;
        background-color: #ffffff;
    }
    .helper_contents.printout.on {
        display: block;
    }
    .helper_contents.printout > div {
        position: relative;
        height: 170px !important;
    }
    /*.helper_contents.printout > div:first-child {
        margin-bottom: 40px;
    }*/
    .helper_contents.printout > div > img {
        position: absolute;
        top: 26%;
        right: -40px;
        cursor: pointer;
        z-index: 1000;
    }
    .helper_contents.printout .helper_content_title {
        margin-bottom: 30px;
        padding-left: 20px;
        font-size: 15px;
        font-family: notokr-medium, NanumGothicBold;
        background: url('/res/lms/img/study/01_web/img1_1_circle.png?V=2024010501') no-repeat 0 5px;
    }
    .helper_contents.memo {
        display: none;
        min-height: 68px;
        padding :0;
        margin:0;
        background-color: #ffffff;
    }
    .helper_contents.memo.on {
        display: block !important;
    }
    .helper_contents .memo_write {
        border: 1px solid #d5d5d5;
        width: 84%;
        height: 68px;
        float: left;
    }
    .helper_contents .memo_register {
        display: inline-block;
        width: 15%;
        height: 74px;
        line-height: 74px;
        color: #ffffff;
        text-align: center;
        background-color: #5d626e;
        font-family: notokr-medium, NanumGothicBold;
        cursor: pointer;
        float: left;
    }
    .helper_contents .memo_list {
        margin-top: 100px;
    }
    .helper_contents .memo_item {
        position: relative;
        padding: 20px 0;
        width: 100%;
        border-bottom: 1px solid #ebebeb;
    }
    .helper_contents .memo_date {
        width: 100%;
        color: #b3b3b3;
        text-align: left;
    }
    .helper_contents .del {
        margin-top: 3px;
        margin-left: 10px;
        cursor: pointer;
    }
    .helper_contents .memo_text {
        max-width: 80%;
        margin-bottom: 10px;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        text-align: left;
    }
    .location {
        height: 55px;
        line-height: 55px;
        background-color: #ffffff;
        padding: 0 20px;
        font-family: notokr-medium, NanumGothicBold;
        border-bottom: 1px solid #dadada;
        font-size: 15px;
    }
    .content_container {
        height: 190px;
    }
    /*.content_container.first {
        border-bottom: 1px solid #e1e1e1;
    }*/
    .content_container .content {
        display: inline-block;
        width: 22%;
        margin-left: 4%;
        float: left;
    }
    .content_container .content:hover .content_tit{
        text-decoration: underline;
    }
    .content_container .content:first-child {
        margin-left: 0;
    }
    .content_container .content_img {
        position: relative;
        width: 100%;
        height: 116px;
        background-color: #eaeaea;
    }
    .content_container .content_img img {
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -57px;
        margin-top: -39px;
    }

    .content_container .content_img img.img-cover {
        position: static;
        margin: 0 !important;
        width: 100%;
        height: 116px;
    }
    .content_container .content_tit {
        margin-top: 20px;

    }


    .play_menu_close {
        padding: 20px;
        float: right;
    }
    .play_menu .time_menu {
        padding: 20px 30px;
        border-top: 1px solid #e1e1e1;
    }
    .play_menu .time_menu:first-child {
        border-top: none;
    }
    .play_menu .time_menu span {font-size: 15px;font-family: notokr-bold, NanumGothicBold;line-height: 24px;}
    .time_sub_container {background-color: #ededed}
    .time_sub_container .time_sub_menu {overflow: hidden;padding: 10px 30px 10px 57px;line-height: 24px;cursor: pointer;white-space: nowrap;text-overflow: ellipsis;}
    .time_sub_container .time_sub_menu span {float: right;line-height: 55px;}
    .time_sub_container .time_sub_menu .during_time {height: 12px;margin-top:5px;font-size: 12px;color: #b0b0b0;line-height: 12px;}


    .time_sub_container .time_sub_menu.time_item_menu.status1{
        background-image: url('/res/lms/img/study/reference/ico_attd_2.png');  background-repeat:no-repeat; background-position:  23px 14px;
    }
    .time_sub_container .time_sub_menu.time_item_menu.status2{
        background-image: url('/res/lms/img/study/reference/ico_img_2.png');  background-repeat:no-repeat; background-position:  23px 14px;
    }
    .time_sub_container .time_sub_menu.time_item_menu.status3{
        background-image: url('/res/lms/img/study/reference/ico_none_2.png'); background-repeat:no-repeat; background-position:  23px 14px;
    }
    .time_sub_container .time_sub_menu.time_item_menu.status4{
        background-image: url('/res/lms/img/study/reference/ico_late_2.png'); background-repeat:no-repeat; background-position:  23px 14px;
    }

    .time_sub_container .time_sub_menu.time_sub_item_menu.status1{
        background-image: url('/res/lms/img/study/reference/ico_attd_2.png');  background-repeat:no-repeat; background-position:33px 15px; background-size:16px 16px;
    }
    .time_sub_container .time_sub_menu.time_sub_item_menu.status2{
        background-image: url('/res/lms/img/study/reference/ico_img_2.png'); background-repeat:no-repeat; background-position:33px 15px;background-size:16px 16px;
    }
    .time_sub_container .time_sub_menu.time_sub_item_menu.status3{
        background-image: url('/res/lms/img/study/reference/ico_none_2.png'); background-repeat:no-repeat; background-position:33px 15px;background-size:16px 16px;
    }
    .time_sub_container .time_sub_menu.time_sub_item_menu.status4{
        background-image: url('/res/lms/img/study/reference/ico_late_2.png'); background-repeat:no-repeat; background-position:33px 15px;background-size:16px 16px;
    }




    .play_menu .time_sub_menu.on {background-color: #d8d8d8}
    .play_menu .time_sub_menu.time_sub_item_menu.on {background-color: #dddddd}



    .page_contents {margin-left: 0;background-color: #f3f3f3;}
    .play_menu {background-color: #ffffff}
    .play_menu_close.mobile {float: right;margin: 20px;}
    .play_menu .time_menu {position: relative;padding: 20px 30px 20px 55px;border-top: 1px solid #e1e1e1;cursor: pointer}
    .play_menu .time_menu.on {background-color: #eeeeee}
    .play_menu .time_menu:first-child {border-top: none}
    .play_menu .time_menu:hover {text-decoration: underline}
    .play_menu .time_menu.status1 {background: url('/res/lms/img/study/reference/ico_attd.png') no-repeat 16px 31px}
    .play_menu .time_menu.status2 {background: url('/res/lms/img/study/reference/ico_img.png') no-repeat 16px 31px}
    .play_menu .time_menu.status3 {background: url('/res/lms/img/study/reference/ico_none.png') no-repeat 16px 31px}
    .play_menu .time_menu.status4 {background: url('/res/lms/img/study/reference/ico_late.png') no-repeat 16px 31px}
    .play_menu .time_menu span {font-size: 15px;font-family: notokr-bold, NanumGothicBold;line-height: 24px}
    .play_menu .time_menu .child_view {position: absolute;bottom: 15px;right: 15px;width: 20px;height: 15px;background: url('/res/lms/img/study/common/opt_arr_up.png') no-repeat center;cursor: pointer}
    .play_menu .time_menu .child_view.on {background-image: url('/res/lms/img/study/common/opt_arr_down.png')}
    .play_menu .time_menu .child_view.offline {background-image: none}
    .play_menu .time_menu .during_time {margin-top:10px;font-size:12px;color:#b0b0b0;}

    .radio_group {height:60px;}
    .radio_group div {float: left;width:50%;height:59px;border-bottom:1px solid #cecece;font-family: notokr-bold, NanumGothicBold;line-height:59px;text-align: center;cursor:pointer;}
    .radio_group div.on {height:55px;border-bottom:4px solid #20beca;color:#20beca;}


    .memo_bookmark {text-align: center}
    .memo_section_write_input {width:100%;height:45px;padding:10px;margin:0 0 5px 0;border:1px solid #e5e5e5;background:#fcfcfc;font-size:14px;color:#000000;text-align:left;box-sizing: border-box}
    .memo_section_write {padding:20px;cursor:pointer}
    .memo_section_write_textarea {width:100%;height:386px;margin:0;padding:10px;border:1px solid #e5e5e5;background:#fcfcfc;font-size:14px;color:#000000;text-align:left;box-sizing: border-box;}
    .memo_section_write_button_section {overflow:auto;margin-top:20px;text-align:right;}
    .memo_section_cancel_button {border-radius:5px;display: -moz-inline-stack;display: inline-block;zoom: 1;*display: inline;text-align: center;width:107px;height:42px;background-color:#999;font-family: notokr-regular;line-height:42px;color:#ffffff;}
    .memo_section_write_button {border-radius:5px;display: -moz-inline-stack;display: inline-block;zoom: 1;*display: inline;text-align: center;width:107px;height:42px;background-color:#003679;font-family: notokr-regular;line-height:42px;color:#ffffff;}

    .memo_section_list {overflow: hidden;height: 400px;margin-bottom:20px;border-top:1px solid #e1e1e1;background: #fff}
    .memo_section_list_item {position:relative;border-bottom:1px solid #e1e1e1;border-top:1px solid #fff;border-left:1px solid #fff;border-right:1px solid #fff;cursor:pointer;padding-top:12px;padding-bottom:12px; }
    .memo_section_list_item.on {border:1px solid #253a73;background: #f1f5f9}
    .memo_section_list_item img {cursor: pointer;}
    .memo_time {width:80px;left:0;top:12px;position:absolute;font-family: notokr-bold, NanumGothicBold;text-align: center;}
    .memo_title {padding-left:80px;padding-right:40px; text-align: left;white-space: nowrap;text-overflow: ellipsis;overflow:hidden; }
    .memo_del {position:absolute;right:15px;width:12px;top:14px;color:#ffffff;font-size: 14px;}
    .memo_del .del { width:12px; }

    .memo_pager {display:inline-block;overflow: auto;margin: 0 auto 30px;}
    .memo_pager > div {float:left;width:40px;height:40px;border:1px solid #cecece;text-align: center;line-height:40px;cursor:pointer}
    .memo_pager > div img {margin: 15px;vertical-align: middle}
    .memo_pager > div.btn_memo_prev {margin-right:15px;}
    .memo_pager > div.btn_memo_next {margin-left:15px;}
    .memo_pager > div.btn_memo_no {margin-left:-1px;}
    .memo_pager > div.btn_memo_no.first {margin-left:0;}
    .memo_pager > div.on {background-color: #7d7d7d;color:#fff}

}

@media screen and (max-width: 767px) {

    .page_contents {
        background-color: #f3f3f3;
    }
    .content_header {
        position: relative;
        top:0;
        left:0;
        right:0;
        height: 50px;
        background-color: #ffffff;
        line-height:50px;
        padding:0 20px;
        box-sizing: border-box;
        border-bottom: 1px solid #dadada;
        text-align: left;
    }
    .content_header .exit {
        position:absolute;
        left:30px;
        top:0;
        line-height:60px;
    }

    .content_header .btn_report {
        position:absolute;
        right:20px;
        top:12px;
        height:24px;
        cursor:pointer;
        border-left: 1px solid #dadada;
        padding-left:20px;
    }

    .content_header .btn_report img {
        float:left;
        margin-top:2px;
    }

    .content_header .course_tit_group {
        display:inline-block;
        white-space: nowrap;
        width: calc(100% - 60px);
        overflow-x: auto;
    }
    .play_container {
    }
    .play_nav {
    }
    .play_info {
        padding:20px;
        line-height:24px;
    }
    .play_info .depth1 {
        margin-bottom:10px;
        font-size: 17px;
        font-family: notokr-bold;
    }
    .class_helper {
        padding: 20px;
    }
    .class_helper .helper_menu {
        height: 55px;
        margin-bottom: 20px;
    }
    .class_helper .helper_menu .h_menu {
        display: inline-block;
        width: 50%;
        height: 55px;
        line-height: 55px;
        text-align: center;
        color: #a6aab5;
        background-color: #ffffff;
        cursor: pointer;
        float: left;
    }
    .class_helper .helper_menu .h_menu:hover {
        text-decoration: underline;
    }
    .class_helper .helper_menu .h_menu.on {
        color: #ffffff;
        background-color: #485dbe;
    }
    .helper_contents {
    }
    .helper_contents.printout.on {
        display: block;
    }
    .helper_contents.printout > div {
        position: relative;
        height: 254px !important;
        background-color: #ffffff;
    }
    .helper_contents.printout > div:first-child {
        margin-bottom: 40px;
    }
    .helper_contents.printout > div > img {
        display: none;
    }
    .helper_contents.printout .helper_content_title {
        height: 53px;
        line-height: 53px;
        padding-left: 40px;
        font-size: 15px;
        font-family: notokr-bold;
        background: url('/res/lms/img/study/01_web/img1_1_circle.png?V=2024010501') no-repeat 20px 22px;
        border-bottom: 2px solid #003679;
    }
    .helper_contents.memo {
        display: none;
        padding :0;
        margin:0;
        min-height: 68px;
        background-color: #ffffff;
    }
    .helper_contents.memo.on {
        display: block !important;
    }
    .helper_contents .memo_write {
        border: 1px solid #d5d5d5;
        width: 77%;
        height: 68px;
        float: left;
    }
    .helper_contents .memo_register {
        display: inline-block;
        width: 20%;
        height: 74px;
        line-height: 74px;
        color: #ffffff;
        text-align: center;
        background-color: #5d626e;
        font-family: notokr-bold;
        cursor: pointer;
        float: left;
    }
    .helper_contents .memo_list {
        margin-top: 100px;
    }
    .helper_contents .memo_item {
        position: relative;
        padding: 20px 0;
        width: 100%;
        border-bottom: 1px solid #ebebeb;
    }
    .helper_contents .memo_date {
        width: 100%;
        color: #b3b3b3;
        text-align: left;
    }
    .helper_contents .del {
        margin-top: 3px;
        margin-left: 10px;
        cursor: pointer;
    }
    .helper_contents .memo_text {
        max-width: 80%;
        margin-bottom: 10px;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        text-align: left;
    }
     .content_container {
        height: 200px;
    }
    /*.content_container.first {
        border-bottom: 1px solid #e1e1e1;
    }*/
    .content_container .content {
        height: 59px;
        padding: 20px;
        border-bottom: 1px solid #ebebeb;
    }
    .content_container .content:hover .content_tit{
        text-decoration: underline;
    }
    .content_container .content_img {
        display: inline-block;
        position: relative;
        width: 30%;
        height: 59px;
        margin-right: 5%;
        background-color: #eaeaea;
        float: left;
    }
    .content_container .content_img img {
        position: absolute;
        margin-left: -57px;
        margin-top: -39px;
    }
    .content_container .content_img img.img-cover {
        position: static;
        margin: 0 !important;
        width: 100%;
        height: 59px;
    }
    .content_container .content_tit {
        max-width: 50%;
        display: inline-block;
        height: 59px;
        line-height: 28px;
        float: left;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .play_nav {height: 55px;border-top: 1px solid #dadada;border-bottom: 1px solid #dadada;background-color: #ffffff}
    .play_nav .nav_btn_group {position: relative;padding: 0 20px;height: 20px;text-align: center;margin: 18px 0;}
    .play_nav .nav_btn_group img {margin-top:4px;vertical-align: middle}
    .play_nav .nav_btn_group span {display: inline-block;height: 100%;font-family:notokr-bold;line-height: 20px;}
    .play_nav .nav_btn_group span.left {margin-left: 10px;padding-right:30px;border-right: 1px solid #dadada;cursor:pointer;}
    .play_nav .nav_btn_group span.right {margin-right: 10px;padding-left:30px;border-left: 1px solid #dadada;cursor:pointer;}
    .play_nav .nav_btn_group .current_point {display: inline-block;color: #969ba8}
    .location {
        height: 55px;
        line-height: 55px;
        background-color: #ffffff;
        padding: 0 20px;
        font-family: notokr-bold;
        border-bottom: 1px solid #dadada;
    }
    .location_sub {
        height: 40px;
        line-height: 40px;
        padding-left: 20px;
        background-color: #070111;
        color: #ffffff;
    }
    .play_menu {
        background-color: #ffffff;
    }
    .radio_group {height:58px;}
    .radio_group div {
        float: left;
        width:50%;
        height:57px;
        border-bottom:1px solid #cecece;
        font-family: notokr-bold, NanumGothicBold;
        line-height:54px;
        text-align: center;
        cursor:pointer;
    }
    .radio_group div.on {
        height:53px;
        border-bottom:4px solid #20beca;
        color:#20beca;
    }
    .play_menu_close {
        padding: 20px;
        float: right;
    }
    .play_menu .time_menu {
        padding: 10px 65px;
        border-top: 1px solid #e1e1e1;
    }
    .play_menu .time_menu:first-child {
        border-top: none;
    }
    .play_menu .time_menu span {
        font-family: notokr-bold, NanumGothicBold;
        line-height: 18px;
        font-size: 13px;
    }
    .play_menu .time_menu .during_time {
        margin-top:5px;
        font-size:12px;
        color:#b0b0b0;
    }
    .time_sub_container {
        background-color: #e8e8e8;
    }
    .time_sub_container .time_sub_menu {
        padding: 10px 30px 10px 65px;
        font-size:13px;
        cursor: pointer;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .time_sub_container .time_sub_menu span {
        line-height: 55px;
        float: right;
    }
    .time_sub_container .time_sub_menu .during_time {
        margin-top:5px;
        font-size: 12px;
        color: #b0b0b0;
        height: 12px;
        line-height: 12px;
    }


    .time_sub_container .time_sub_menu.time_item_menu.status1{
        background-image: url('/res/lms/img/study/reference/ico_attd_2.png');  background-repeat:no-repeat; background-position:  23px center;
    }
    .time_sub_container .time_sub_menu.time_item_menu.status2{
        background-image: url('/res/lms/img/study/reference/ico_img_2.png');  background-repeat:no-repeat; background-position:  23px center;
    }
    .time_sub_container .time_sub_menu.time_item_menu.status3{
        background-image: url('/res/lms/img/study/reference/ico_none_2.png'); background-repeat:no-repeat; background-position:  23px center;
    }
    .time_sub_container .time_sub_menu.time_item_menu.status4{
        background-image: url('/res/lms/img/study/reference/ico_late_2.png'); background-repeat:no-repeat; background-position:  23px center;
    }

    .time_sub_container .time_sub_menu.time_sub_item_menu.status1{
        background-image: url('/res/lms/img/study/reference/ico_attd_2.png');  background-repeat:no-repeat; background-position: 29px center; background-size:16px 16px;
    }
    .time_sub_container .time_sub_menu.time_sub_item_menu.status2{
        background-image: url('/res/lms/img/study/reference/ico_img_2.png'); background-repeat:no-repeat; background-position: 29px center; background-size:16px 16px;
    }
    .time_sub_container .time_sub_menu.time_sub_item_menu.status3{
        background-image: url('/res/lms/img/study/reference/ico_none_2.png'); background-repeat:no-repeat; background-position: 29px center; background-size:16px 16px;
    }
    .time_sub_container .time_sub_menu.time_sub_item_menu.status4{
        background-image: url('/res/lms/img/study/reference/ico_late_2.png'); background-repeat:no-repeat; background-position: 29px center; background-size:16px 16px;
    }



    .play_menu .time_menu.status1 {background: url('/res/lms/img/study/reference/ico_attd.png') no-repeat 16px center}
    .play_menu .time_menu.status2 {background: url('/res/lms/img/study/reference/ico_img.png') no-repeat 16px center}
    .play_menu .time_menu.status3 {background: url('/res/lms/img/study/reference/ico_none.png') no-repeat 16px center}
    .play_menu .time_menu.status4 {background: url('/res/lms/img/study/reference/ico_late.png') no-repeat 16px center}

    .play_menu .time_sub_menu.status1 {background: url('/res/lms/img/study/common/ico_small_finish.png') no-repeat 23px center}
    .play_menu .time_sub_menu.status2 {background: url('/res/lms/img/study/common/ico_small_ing.png') no-repeat 23px center}
    .play_menu .time_sub_menu.status3 {background: url('/res/lms/img/study/common/ico_small_none.png') no-repeat 23px center}
    .play_menu .time_sub_menu.on {background-color: #d8d8d8}
    .play_menu .time_sub_menu.time_sub_item_menu.on {background-color: #dddddd}

    .memo_bookmark {text-align: center}
    .memo_section_write_input {width:100%;height:45px;padding:10px;margin:0 0 5px 0;border:1px solid #e5e5e5;background:#fcfcfc;font-size:14px;color:#000000;text-align:left;box-sizing: border-box}
    .memo_section_write {padding:20px;cursor:pointer}
    .memo_section_write_textarea {width:100%;height:386px;margin:0;padding:10px;border:1px solid #e5e5e5;background:#fcfcfc;font-size:14px;color:#000000;text-align:left;box-sizing: border-box;}
    .memo_section_write_button_section {overflow:auto;margin-top:20px;text-align:right;}
    .memo_section_cancel_button {border-radius:5px;display: -moz-inline-stack;display: inline-block;zoom: 1;*display: inline;text-align: center;width:107px;height:42px;background-color:#999;font-family: notokr-regular;line-height:42px;color:#ffffff;}
    .memo_section_write_button {border-radius:5px;display: -moz-inline-stack;display: inline-block;zoom: 1;*display: inline;text-align: center;width:107px;height:42px;background-color:#003679;font-family: notokr-regular;line-height:42px;color:#ffffff;}

    .memo_section_list {overflow: hidden;height: 400px;margin-bottom:20px;border-top:1px solid #e1e1e1;background: #fff}
    .memo_section_list_item {position:relative;border-bottom:1px solid #e1e1e1;border-top:1px solid #fff;border-left:1px solid #fff;border-right:1px solid #fff;cursor:pointer;padding-top:12px;padding-bottom:12px; }
    .memo_section_list_item.on {border:1px solid #253a73;background: #f1f5f9}
    .memo_section_list_item img {cursor: pointer;}
    .memo_time {width:80px;left:0;top:12px;position:absolute;font-family: notokr-bold, NanumGothicBold;text-align: center;}
    .memo_title {padding-left:80px;padding-right:40px; text-align: left;white-space: nowrap;text-overflow: ellipsis;overflow:hidden; }
    .memo_del {position:absolute;right:15px;width:12px;top:14px;color:#ffffff;font-size: 14px;}
    .memo_del .del { width:12px; }

    .memo_pager {display:inline-block;overflow: auto;margin: 0 auto 30px;}
    .memo_pager > div {float:left;width:40px;height:40px;border:1px solid #cecece;text-align: center;line-height:40px;cursor:pointer}
    .memo_pager > div img {margin: 15px;vertical-align: middle}
    .memo_pager > div.btn_memo_prev {margin-right:15px;}
    .memo_pager > div.btn_memo_next {margin-left:15px;}
    .memo_pager > div.btn_memo_no {margin-left:-1px;}
    .memo_pager > div.btn_memo_no.first {margin-left:0;}
    .memo_pager > div.on {background-color: #7d7d7d;color:#fff}

}














/*퀴즈 관련 때기*/
@media screen and (max-width:1364px){
	/* 25-02-27 추가 */
	.player {
    	width:100% !important;max-width:1024px !important
    }
    .player > div {
    	width:100% !important;max-width:1024px !important;/*max-height:calc(100dvh - 134px)*/
    }
}

@media screen and (min-width: 1281px) {
	/* min-width: 1001px -> 1281px 변경 */

    .player {
    	
    }

    .player .quiz_item {
        padding: 20px;
        background-color: #ffffff;
        position: relative;;
    }

    .player .quiz_item .quiz_item_img {
        position: absolute;
        left: 5px;
        top: 5px;
        display: none;
    }

    .player .quiz_item .quiz_item_q {
        margin-bottom: 15px;
        font-family: notokr-medium, NanumGothicBold;
        font-size: 14px;
    }

    .player .quiz_item .quiz_type {
        background-color: #fff2f3;
        border: 1px solid #d7d7d5;
        padding: 20px;
    }

    .player .quiz_item .quiz_type img {
        vertical-align: middle;
    }

    .player .quiz_item .quiz_type.multiple > div,
    .player .quiz_item .quiz_type.ox > div {
        margin-top: 10px;
    }

    .player .quiz_item .quiz_type.multiple > div:first-child,
    .player .quiz_item .quiz_type.ox > div:first-child {
        margin-top: 0;
    }

    .player .quiz_item .quiz_type.multiple span,
    .player .quiz_item .quiz_type.ox span {
        display: inline-block;
        margin-left: 10px;
    }

    .player .quiz_item .quiz_type.multiple textarea {
        width: 100%;
        box-sizing: border-box; padding:10px;
        height:200px;
        float: none !important;
    }

    .player .quiz_item .quiz_type.short input {
        width: 96%;
        padding: 0 2%;
    }

    .player .quiz_item .quiz_type.essays textarea {
        width: 100%;
        box-sizing: border-box; padding:10px;
        height:200px;
        float: none !important;
    }

    .player .quiz_item .answer_item {
        height: 40px;
        line-height: 40px;
        background: #dcdada;
        margin-top: 15px;
        padding: 10px 20px;
    }

    .player .answer_list {
        border: 1px solid #003679;
        padding: 20px;
        margin-top: 15px;
        display: none;
    }

    .player .answer_list p {
        line-height: 24px;
    }

    .answer_title {
        font-family: notokr-medium, NanumGothicBold;
        font-size: 14px;
        margin-bottom: 10px;

    }

    .show_answer {
        float: right;
        font-size: 16px;
        width: 140px;
        height: 41px;
        font-family: notokr-medium, NanumGothicBold;
        color: #003679;
        text-align: center;
        line-height: 41px;
        border: 1px solid #003679;
        cursor: pointer;
    }
}



@media screen and (min-width: 768px) and (max-width: 1280px) {
	/* max-width: 1000px -> 1280px 변경 */

    .player {
        /*height: 860px;*/
    }

    .player .quiz_item {
        padding: 20px;
        position: relative;
        background-color: #ffffff;
    }

    .player .quiz_item .quiz_item_img {
        position: absolute;
        left: 5px;
        top: 5px;
        display: none;
    }

    .player .quiz_item .quiz_item_q {
        margin-bottom: 15px;
        font-family: notokr-medium, NanumGothicBold;
        font-size: 14px;
    }

    .player .quiz_item .quiz_type {
        background-color: #fff2f3;
        border: 1px solid #d7d7d5;
        padding: 20px;
    }

    .player .quiz_item .quiz_type img {
        vertical-align: middle;
    }

    .player .quiz_item .quiz_type.multiple > div,
    .player .quiz_item .quiz_type.ox > div {
        margin-top: 10px;
    }

    .player .quiz_item .quiz_type.multiple > div:first-child,
    .player .quiz_item .quiz_type.ox > div:first-child {
        margin-top: 0;
    }

    .player .quiz_item .quiz_type.multiple span,
    .player .quiz_item .quiz_type.ox span {
        display: inline-block;
        margin-left: 10px;
    }

    .player .quiz_item .quiz_type.multiple textarea {
        width: 100%;
        box-sizing: border-box; padding:10px;
        height:180px;
        float: none !important;
    }


    .player .quiz_item .quiz_type.short input {
        width: 96%;
        padding: 0 2%;
    }

    .player .quiz_item .quiz_type.essays textarea {
        width: 100%;
        box-sizing: border-box; padding:10px;
        height:180px;
        float: none !important;
    }

    .player .quiz_item .answer_item {
        height: 40px;
        line-height: 40px;
        background: #dcdada;
        margin-top: 15px;
        padding: 10px 20px;
    }

    .player .answer_list {
        display: none;
        margin: 20px 0 20px;
        padding: 20px;
        border: 1px solid #003679;
    }

    .player .answer_list p {
        line-height: 24px;
    }

    .answer_title {
        font-family: notokr-medium, NanumGothicBold;
        font-size: 14px;
        margin-bottom: 10px;

    }

    .show_answer {
        float: right;
        font-size: 16px;
        width: 140px;
        height: 41px;
        font-family: notokr-medium, NanumGothicBold;
        color: #003679;
        text-align: center;
        line-height: 41px;
        border: 1px solid #003679;
        cursor: pointer;
    }

}

@media screen and (max-width: 767px) {

    .player {
    }

    .player .quiz_item {
        padding: 20px;
        background-color: #ffffff;
        position: relative;
    }

    .player .quiz_item .quiz_item_img {
        position: absolute;
        left: 5px;
        top: 5px;
        display: none;
    }

    .player .quiz_item .quiz_item_q {
        margin-bottom: 15px;
        font-family: notokr-bold;
        font-size: 14px;
    }

    .player .quiz_item .quiz_type {
        background-color: #fff2f3;
        border: 1px solid #d7d7d5;
        padding: 20px;
    }

    .player .quiz_item .quiz_type img {
        vertical-align: middle;
    }

    .player .quiz_item .quiz_type.multiple > div,
    .player .quiz_item .quiz_type.ox > div {
        margin-top: 10px;
    }

    .player .quiz_item .quiz_type.multiple > div:first-child,
    .player .quiz_item .quiz_type.ox > div:first-child {
        margin-top: 0;
    }

    .player .quiz_item .quiz_type.multiple span,
    .player .quiz_item .quiz_type.ox span {
        display: inline-block;
        margin-left: 10px;
    }

    .player .quiz_item .quiz_type.multiple textarea {
        width: 100%;
        box-sizing: border-box; padding:10px;
        height:150px;
        float: none !important;
    }


    .player .quiz_item .quiz_type.short input {
        width: 96%;
        padding: 0 2%;
    }

    .player .quiz_item .quiz_type.essays textarea {
        width: 100%;
        box-sizing: border-box; padding:10px;
        height:150px;
        float: none !important;
    }

    .player .quiz_item .answer_item {
        height: 40px;
        line-height: 40px;
        background: #dcdada;
        margin-top: 15px;
        padding: 10px 20px;
    }

    .player .answer_list {
        display: none;
        margin: 20px 0 20px;
        padding: 20px;
        border: 1px solid #003679;
    }

    .player .answer_list p {
        line-height: 24px
    }

    .answer_title {
        margin-bottom: 10px;
        font-family: notokr-bold;
        font-size: 14px
    }

    .show_answer {
        float: right;
        width: 140px;
        height: 41px;
        border: 1px solid #003679;
        font-size: 16px;
        font-family: notokr-bold;
        color: #003679;
        text-align: center;
        line-height: 41px;
        cursor: pointer;
    }
}
