@charset "utf-8";

/* --- common --- */
[class^="btn_beaconh50"] { background-color: #4F57F4; }
[class^="btn_beaconh50"] [class^="txt_white"] { color: #fff; }
[class^="btn_beaconh50"] [class^="txt_gray"] { color: #A6A8B3; }
[class^="btn_beaconh50"] [class^="txt_blue"] { color: #4F57F4; }

.btn_beaconh50.processing { background: #F4F4F6 !important; color: #4F57F4 !important; pointer-events: none; cursor: wait; box-shadow: none; }
.btn_beaconh50.disabled { background: #F4F4F6 !important; color: #4F57F4 !important; pointer-events: none; box-shadow: none; }
.btn_beaconh50.disabled_notopen { background: #F4F4F6 !important; color: #4F57F4 !important; pointer-events: none; box-shadow: none; }
.btn_beaconh50.calculatewidth{ width: calc(100% - 100px);}
@media print {
    .err_btn .btn_beaconh50 { border-radius: 4px; text-indent: -9999px; }
    .floating_btn .btn_beaconh50 .txt_btn_name { font-size: 0.875rem; }
}
/* --- //common --- */

/* --- 학습현황 스타일 --- */
.lecture_box .tit_s20cBlack { margin: 0px 0px 12px 0px; }
.lecture_box { margin: 0px 16px; }
.lecture_list_wrap { display: flex; flex-direction: column; gap: 12px; padding: 0; list-style: none; }

    .lecture_item { background-color: #E4E4E4; border-radius: 4px; padding: 18px; cursor: pointer; border: 1px solid transparent; transition: all 0.2s ease; }
        .lec_item_header { display: flex; align-items: center; justify-content: space-between; }
            .lec_info_group { flex-grow: 1; display: flex; align-items: center; gap: 10px; }
                .lec_badge_turn { box-sizing: content-box; text-align: center; min-width: 39px; width: 39px; font-size: 16px; font-weight: 500; color: #868686; padding: 2px 0; }
                .lec_badge_turn.bgPrimary { color: #fff !important; padding: 4px 14px; border-radius: 4px; }
                .lec_txt_date { margin-right: auto; text-align: center; font-size: 16px; color: #868686; }
            .lec_right_group { display: flex; align-items: center; gap: 10px; }
                .lec_txt_location { font-size: 16px; color: #868686; font-weight: 500; }
                .lec_icon_toggle { min-width: 17px; height: 17px; color: #A6A8B3; transition: transform 0.3s ease; margin-left: 4px; }
        .lec_item_body { margin-top: 13px; display: none; justify-content: space-between; align-items: center; }
            .lec_txt_title { font-size: 15px; color: #868686; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-left: 10px; flex: 1; }
            .lec_beacon_status { background: #fff; border: 1px solid #DEDEE6; border-radius: 4px; padding: 5px 14px; margin-right: 8px; font-size: 13px; color: #868686; }
    .lecture_item.active { background-color: var(--color-Lprimary); border: 2px solid var(--color-primary); }
    .lecture_item.active .lec_txt_date, .lecture_item.active .lec_txt_location { font-weight: 700; }
    .lecture_item.active .lec_txt_date, .lecture_item.active .lec_txt_location, .lecture_item.active .lec_txt_title, .lecture_item.active .lec_icon_toggle { color: var(--color-Dark); }
    .lecture_item.active .lec_beacon_status { color: var(--color-primary); border-color: var(--color-primary); }
    .lecture_item.active.disabled { pointer-events: none; }
    .lecture_item.expanded .lec_item_body { display: flex; }
    .lecture_item.expanded .lec_icon_toggle { transform: rotate(0deg); }
    .lecture_item:not(.expanded) .lec_icon_toggle { transform: rotate(90deg); }
/* --- //학습현황 스타일 --- */

@media screen and (min-width: 1023px) and (max-width: 2560px) {
    .lecture_box { margin: 0px; }
    .bottom_btn_w{display: none;}
}
/* --- 미디어 쿼리 (Tablet: 768px ~ 1022px) --- */
@media screen and (min-width: 768px) and (max-width: 1022px) {
    .lecture_item { padding: 8px; }
    .lec_badge_turn { min-width: 35px; width: 35px; font-size: 12px; }
    .lec_badge_turn.bgPrimary { padding: 2px 8px; }
    .lec_txt_date,
    .lec_txt_location { font-size: 15px; }
    .lec_beacon_status { padding: 4px 14px; margin-right: 8px; font-size: 12px;}

}
/* --- 미디어 쿼리 (Mobile: 100px ~ 767px) --- */
@media screen and (min-width: 100px) and (max-width: 767px) {
    .lecture_item { padding: 8px; }
    .lec_badge_turn { min-width: 32px; width: 32px; font-size: 11px; }
    .lec_badge_turn.bgPrimary { padding: 2px 4px; }
    .lec_txt_date, .lec_txt_location, .lec_txt_title { font-size: 0.8em; }
    .lecture_box .tit_s20cBlack { font-size: 1rem; }
    .lec_beacon_status { padding: 3px 11px; margin-right: 8px; font-size: 10.3px;}

}
/* --- //학습현황 스타일 --- */

/* --- 메인 --- */
.main_personal_w .btn_beaconh50 { display: inline-flex; align-items: center; justify-content: center; width: 140px; height: 40px; padding: 30px 35px; background: #F4F4F6; color: #4F57F4; font-size: 1rem; font-weight: 700; border-radius: 5px; text-decoration: none; white-space: nowrap; }

@media screen and (min-width:1023px) and (max-width:1365px) {
    .main_personal_w .btn_beaconh50 { margin-right: 35px; }
}
@media screen and (min-width:100px) and (max-width:767px) {
    .main_personal_w .btn_beaconh50 { display: flex; align-self: flex-end; width: 110px; height: 36px; padding: 0; font-size: 0.875rem; border-radius: 5px; }
}
/* --- //메인 --- */
