/* 팝업 공통 */
.k-window-content.layer-popup{ width: 100%; height: 100%; padding: 0; border-radius: 0 0 10px 10px;}
.k-window-content.layer-popup .popup-content{ width: 100%; height: calc(100% - 90px); padding: 25px 30px; box-sizing: border-box; overflow-y: auto;}
.k-window-content.layer-popup .popup-content::-webkit-scrollbar { width: 8px;}
.k-window-content.layer-popup .popup-content::-webkit-scrollbar-track { background-color: #F1F1F1; border-radius: 6px; }
.k-window-content.layer-popup .popup-content::-webkit-scrollbar-thumb { border-radius: 6px; background-color: #ccc; }
.k-window-content.layer-popup .popup-btn{ display: flex; gap: 8px; justify-content: center; align-items: center; width: 100%; padding: 20px 10px; border-radius: 0; border-top: 1px solid #; background: #f7f7f7; box-sizing: border-box;}
.k-window-content.layer-popup .popup-btn > button{ min-width: 94px; box-sizing: border-box;}
.k-window-content.layer-popup .popup-btn > button.btn-fill:focus{ color: #fff; border-color: #001f90; background: #001f90;}

.k-window-content.layer-popup .popup-content .info-box{ display: inline-block; width: 100%; padding: 10px 20px; border-radius: 4px; background: #f8f8f8; box-sizing: border-box;}
.k-window-content.layer-popup .popup-content .info-box > h3{ float: left; line-height: 28px; text-align: left; font-size: 16px; color: #212529; font-weight: 600;}
/* .k-window-content.layer-popup .popup-content .info-box > h3::before{ content: ''; display: inline-block; width: 34px; height: 28px; vertical-align: middle; margin-right: 12px; border-radius: 100%; background: url(../../images/sub/icon_alert.png) no-repeat 50% 50% #fff;} */
.k-window-content.layer-popup .popup-content .info-box > ul{ float: left; width: 100%; margin-top: 6px;}
.k-window-content.layer-popup .popup-content .info-box > ul > li{ float: left; display: flex; gap: 8px; width: 100%;}
.k-window-content.layer-popup .popup-content .info-box > ul > li > p{ line-height: 20px; text-align: left; font-size: 13px; color: #6c757d; font-weight: 400;}
.k-window-content.layer-popup .popup-content .info-box > ul > li > p > span{ color: #212529; font-weight: 600;}

.btn-default{ border-radius: 4px;}
.btn-fill{ color: #fff; border: none; background: #001f90;}
.btn-fill:hover{ background: #00176c;}
.btn-fill:disabled{ color: #c0c0c0; font-weight: 400!important; border: 1px solid #ddd; background: #fafafa; cursor: default;}
.btn-fill:disabled:hover{ background: #fafafa;}
.btn-border{ color: #212529; border: 1px solid #c0c0c0; border-radius: 4px; background: #fff; box-sizing: border-box;}
.btn-border:hover{ border-color: #212529;}
.btn-border:disabled{ color: #c0c0c0; font-weight: 400!important; border-color: #ddd; background: #fafafa; cursor: default;}
.btn-border:disabled:hover{ border-color: #ddd;}
.btn-50{ min-width: 124px; height: 50px; padding: 0 25px; font-size: 16px; font-weight: 700; letter-spacing: -0.32px; border-radius: 6px;}

.radio-list, .check-list{ display: flex; gap: 20px; align-items: center;}

/* input[type=radio] */
.radio-list input[type="radio"].radio{ display: none;}
.radio-list input[type="radio"].radio + label{ display: flex; gap: 8px; align-items: center; line-height: 19px; text-align: left; font-size: 16px; color: #343a40; font-weight: 400; cursor: pointer;}
.radio-list input[type="radio"].radio + label > i{ display: inline-block; width: 16px; height: 16px; border-radius: 100%; border: 1px solid #adb5bd; background: #fff; box-sizing: border-box;}
.radio-list input[type="radio"].radio:checked + label > i{ border: none;  background: url(../../images/common/icon_radio_checked.png);}
.radio-list input[type="radio"].radio:disabled + label{ color: #adb5bd;}
.radio-list input[type="radio"].radio:disabled + label > i{ border: 1px solid #adb5bd; background: #dee2e6;}


.k-window-content.layer-popup textarea{ width: 100%; height: 350px; padding: 20px; line-height: 28px; font-size: 18px; color: #222; font-weight: 400; letter-spacing: -0.36px; border-radius: 8px; border: 1px solid #ddd; box-sizing: border-box!important;}
.k-window-content.layer-popup textarea::placeholder{ color: #c0c0c0;}
.k-window-content.layer-popup textarea:focus{ color: #222; border-color: #222;}
.k-window-content.layer-popup textarea:disabled{ color: #c0c0c0; border-color: #ddd; background: #fafafa;}

.k-window-content.layer-popup .popup-content .info-box + ul.input-form{ margin-top: 30px;}
.k-window-content.layer-popup .popup-content ul.input-form + .info-box{ margin-top: 30px;}
.k-window-content.layer-popup .popup-content ul.input-form{ display: flex; flex-direction: column; width: 100%; border-top: 1px solid #000;}
.k-window-content.layer-popup .popup-content ul.input-form > li{ display: flex; justify-content: start; align-items: center; width: 100%; min-height: 94px; border-bottom: 1px solid #eee; box-sizing: border-box;}
.k-window-content.layer-popup .popup-content ul.input-form > li > p{ width: 160px; padding: 22px; line-height: 25px; text-align: left; font-size: 18px; color: #000; font-weight: 700; letter-spacing: -0.36px; box-sizing: border-box;}
.k-window-content.layer-popup .popup-content ul.input-form > li > p > span.ess{ margin-right: 5px; color: #dc3545; font-weight: 400;}
.k-window-content.layer-popup .popup-content ul.input-form > li > div{ display: flex; flex-wrap: wrap; justify-content: start; align-items: center; gap: 0 10px; width: calc(100% - 160px); padding: 22px; box-sizing: border-box;}
.k-window-content.layer-popup .popup-content ul.input-form > li > div > p{ line-height: 25px; text-align: left; font-size: 18px; color: #495057; font-weight: 400; letter-spacing: -0.36px;}


/* 목록이 존재하지 않는 경우 */
.none-data{ display: flex; justify-content: center; align-items: center; width: 100%; height: 100px; border-top: 1px solid #dee2e6; border-bottom: 1px solid #dee2e6;}
.none-data > p{ line-height: 18px; font-size: 15px; color: #6c757d; font-weight: 400; letter-spacing: -0.3px;}


/* ------------------------------------------------------- 학습창 */
#stdWindow{ display: flex;}
#stdWindow:-webkit-scrollbar { display: none;}
#stdWindow:-webkit-scrollbar { -ms-overflow-style: none; scrollbar-width: none;}
#stdWindow .std-video-wrap{ pointer-events: auto; width: calc(100% - 440px); text-align: center; background: url(../../images/common/img_watermark.png) 50% 50%;}
#stdWindow .std-video-wrap::-webkit-scrollbar{ width: 8px;}
#stdWindow .std-video-wrap::-webkit-scrollbar-track { background-color: #F1F1F1; border-radius: 6px; }
#stdWindow .std-video-wrap::-webkit-scrollbar-thumb { border-radius: 6px; background-color: #ccc; }
#stdWindow .std-video-wrap > div#mn_cntnts_area{ position: relative; width: 100%; overflow: auto;}
#stdWindow .std-video-wrap > div#mn_cntnts_area::-webkit-scrollbar{ width: 8px;}
#stdWindow .std-video-wrap > div#mn_cntnts_area::-webkit-scrollbar-track { background-color: #F1F1F1; border-radius: 6px; }
#stdWindow .std-video-wrap > div#mn_cntnts_area::-webkit-scrollbar-thumb { border-radius: 6px; background-color: #ccc; }
#opinionContainer{ position: absolute; z-index: 9999; background: #fff; border-radius: 10px; border: 1px solid #e8e8e8; top: 50%; left: 50%; width: 20vw; height: 15vw; overflow: hidden; box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.06), 0 10px 15px 0 rgba(0, 0, 0, 0.07); }
#opinionContainer .popup-header{ padding: 15px 5px 15px 20px; display: flex; justify-content: space-between; align-items: center; font-size: 1.1rem; font-weight: bold; border-bottom: 1px solid #ced4da; }
#opinionContainer .popup-content{ padding: 25px 30px; overflow-y: auto; height: calc(100% - 65px); }
#opinionContainer .popup-close-btn{ border: none; width: 34px; height: 34px; padding: 0; background: url(../../images/common/btn_popup_close.png) no-repeat 50% 50%; }
#opinionList > li{ padding: 15px 0; text-align: left; }
#opinionList > li:first-child{ padding-top: 0; }
#stdWindow .std-video-wrap > ul{ display: flex; gap: 18px; justify-content: end; align-items: center; width: 100%; height: 80px; padding: 20px; background: #212529; box-sizing: border-box;}
#stdWindow .std-video-wrap > ul > li{ line-height: 24px; text-align: center; font-size: 16px; color: #fff; font-weight: 500; letter-spacing: -0.32px; cursor: pointer;}
#stdWindow .std-video-wrap > ul > li::after{ display: inline-block; content: ''; width: 1px; height: 15px; margin-left: 17px; vertical-align: middle; background: rgba(255, 255, 255, 0.2);}
#stdWindow .std-video-wrap > ul > li:last-child::after{ content: none;}
#stdWindow .std-info-wrap{ width: 440px; padding: 18px 25px 25px; background: #f9f9f9; box-sizing: border-box; z-index: 1;}
#stdWindow .std-info-wrap .tab-content{ height: calc(100% - 85px); margin-top: 25px; overflow-y: auto;}
#stdWindow .std-info-wrap .tab-content::-webkit-scrollbar{ width: 8px;}
#stdWindow .std-info-wrap .tab-content::-webkit-scrollbar-track { background-color: #F1F1F1; border-radius: 6px; }
#stdWindow .std-info-wrap .tab-content::-webkit-scrollbar-thumb { border-radius: 6px; background-color: #ccc; }
#stdWindow .std-info-wrap .pgs-wrap > h2{ width: 100%; margin-bottom: 15px; line-height: 32px; text-align: left; font-size: 20px; color: #000; font-weight: 600; letter-spacing: -0.4px;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-box{ width: 100%; padding: 22px 25px 25px; background: #fff; box-sizing: border-box;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-box > p{ width: 100%; margin-bottom: 4px; line-height: 26px; text-align: left; font-size: 16px; color: #212529; font-weight: 600;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-box > ul{ display: flex; flex-direction: column; width: 100%;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-box > ul > li{ display: flex; gap: 8px; width: 100%;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-box > ul > li > i{ line-height: 27px; text-align: left; font-size: 16px; color: #6c757d; font-weight: 400;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-box > ul > li > p{ line-height: 27px; text-align: left; font-size: 16px; color: #6c757d; font-weight: 400;}
#stdWindow .std-info-wrap .pgs-wrap .progress-box{ display: flex; gap: 20px; width: 100%; padding: 0 5px; margin: 30px 0; box-sizing: border-box;}
#stdWindow .std-info-wrap .pgs-wrap .progress-box > p{ width: 75px; line-height: 27px; text-align: left; font-size: 16px; color: #212529; font-weight: 700; letter-spacing: -0.32px;}
#stdWindow .std-info-wrap .pgs-wrap .progress-box > div{ display: flex; gap: 15px; width: calc(100% - 95px);}
#stdWindow .std-info-wrap .pgs-wrap .progress-box > div > p{ position: relative; width: 100%; height: 16px; margin: 6px 0; border-radius: 100px; background: #dee2e6; box-sizing: border-box;}
#stdWindow .std-info-wrap .pgs-wrap .progress-box > div > p > span{ position: absolute; top: 0; left: 0; display: inline-block; height: 16px; border-radius: 100px; background: #001f90;}
#stdWindow .std-info-wrap .pgs-wrap .progress-box > div > span{ line-height: 27px; text-align: right; font-size: 17px; color: #001f90; font-weight: 400; letter-spacing: -0.34px;}
#stdWindow .std-info-wrap .pgs-wrap .progress-box > div > span > strong{ font-size: 18px; font-weight: 700;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list{ width: 100%; background: #fff;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list .chapter-tit{ display: inline-block; width: 100%; padding: 25px 25px 30px; box-sizing: border-box;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list .chapter-tit > h3{ float: left; width: 100%; margin-bottom: 12px; line-height: 29px; text-align: left; font-size: 18px; color: #212529; font-weight: 600; letter-spacing: -0.36px;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list .chapter-tit > p{ float: left; display: inline-block; margin-right: 12px; line-height: 19px; text-align: left; font-size: 15px; font-weight: 500; letter-spacing: -0.3px;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list .chapter-tit > p::after{ display: inline-block; content: ''; width: 1px; height: 12px; margin: 3.5px 0; margin-left: 12px; vertical-align: middle; background: #e9ecef;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list .chapter-tit > p.cmplt{ color: #001f90;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list .chapter-tit > p.n-cmplt{ color: #dc3545;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list .chapter-tit > span{ float: left; line-height: 19px; text-align: left; font-size: 15px; color: #6c757d; font-weight: 400; letter-spacing: -0.3px;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list .chapter-tit > span > strong{ color: #001f90;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list > button{ width: 100%; height: 50px; line-height: 19px; text-align: center; font-size: 16px; color: #212529; font-weight: 600; letter-spacing: -0.32px; border: none; border-top: 1px solid #e9ecef; border-bottom: 1px solid #e9ecef; background: #fff; box-sizing: border-box;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list > button::after{ content: ''; display: inline-block; width: 18px; height: 18px; margin-left: 5px; vertical-align: middle; background: url(../../images/sub/btn_toggle_hide_18.png) no-repeat 50% 50%;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list > button.show::after{ background: url(../../images/sub/btn_toggle_show_18.png) no-repeat 50% 50%;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list > ul.page-list{ display: flex; flex-wrap: wrap; justify-content: start; align-items: center; gap: 8px; width: 100%; padding: 22px 25px; border-bottom: 1px solid #e9ecef; box-sizing: border-box;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list > ul.page-list > li{ display: inline-block; width: 26.8px; height: 26.8px; line-height: 26px; font-size: 14px; color: #6c757d; font-weight: 500; border-radius: 100%; border: 1px solid #6c758d; background: #fff; cursor: pointer;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list > ul.page-list > li.on{ color: #fff; border: none; background: #001f90;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list > ul.page-list > li.pass{ color: #c0c0c0; border-color: #eee; background: #eee;}
#stdWindow .std-info-wrap .pgs-wrap .chapter-list > ul.page-list > li.pass.on{ color: #fff; border: none; background: #001f90;}
#stdWindow .std-info-wrap .memo-wrap{ width: 100%;}
#stdWindow .std-info-wrap .memo-wrap > button{ width: 100%; height: 50px; margin-top: 25px; line-height: 19px; text-align: center; font-size: 16px; color: #fff; font-weight: 700; letter-spacing: -0.32px;}
#stdWindow .std-info-wrap .scrap-wrap{ width: 100%;}
#stdWindow .std-info-wrap .scrap-wrap .scrap-list{ display: flex; flex-direction: column; background: #fff;}
#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box{ position: relative; width: 100%; padding: 30px 20px; border-bottom: 1px solid #e9ecef; box-sizing: border-box;}
#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box > h3{ width: 100%; margin-bottom: 18px; line-height: 30px; text-align: left; font-size: 20px; color: #000; letter-spacing: -0.4px;}
#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap{ width: 100%; padding: 22px 10px 20px; border-top: 1px solid #e9ecef; box-sizing: border-box;}
#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap > h4{ display: flex; justify-content: start; align-items: start; width: 100%; box-sizing: border-box;}
#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap > h4 > span{ width: calc(100% - 30px); line-height: 20px; text-align: left; font-size: 20px; color: #000; font-weight: 500; letter-spacing: -0.32px; cursor: pointer;}
#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap > h4 > span:hover{ text-decoration: underline;}
#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap > h4 > button{ display: inline-block; width: 20px; height: 20px; margin-left: auto; text-indent: -999em; border-radius: 100%; border: none; background: url(../../images/sub/btn_close_tooltip.png) no-repeat 50% 50% #e9ecef; background-size: 13px;}
#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap > .scrap-memo{ width: 100%; margin: 12px 0; line-height: 24px; text-align: left; font-size: 15px; color: #6c757d; font-weight: 400; letter-spacing: -0.3px;}
#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap > span{ display: block; width: 100%; line-height: 21px; text-align: left; font-size: 15px; color: #6c757d; font-weight: 400; letter-spacing: -0.3px;}
#bodyf section{ height: 100%; }
#bodyf section .cname_section{ width: 100%; height: 100%; }
#bodyf section:after { content: ''; background-size: contain; background-repeat: no-repeat; }
.bodyfBox{ position: relative; width: 1280px; margin: 0 auto; pointer-events: auto; }
.body_mp4 .player-btn{ z-index: 2; position: absolute; width: 72px; height: 72px; top: 20rem; background-color: #fff; border: 1px solid #c0c0c0; background-size: 60%; border-radius: 100%; transition: opacity 0.25s linear; }
.body_mp4 .player-btn.prev{ left: 4px; background-image: url(../../images/sub/btn_slide_prev.svg); background-repeat: no-repeat; background-position: center center; }
.body_mp4 .player-btn.next{ right: 4px; background-image: url(../../images/sub/btn_slide_next.svg); background-repeat: no-repeat; background-position: center center; }
.playback-speed{ position: absolute; top: 0; left: 0; width: 100%; padding: 6px 10px 9px; background-color: rgba(34, 34, 34, 0.7); text-align: left; }
.playback-speed > span{ display: inline-block; color: #fff; font-size: 14px; font-weight: bold; line-height: 21px; letter-spacing: -0.28px; }
.playback-speed .speed-btn{ position: relative; padding: 0 12px; color: #ffffff80; opacity: 0.5; font-size: 14px; font-weight: 500; line-height: 21px; letter-spacing: -0.28px; border: none; background-color: transparent; text-align: center; }
.playback-speed .speed-btn::after{ content: ""; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 1px; height: 12px; background-color: #ffffff4c; opacity: 0.3; }
.playback-speed .speed-btn.active{ color: #fff; font-weight: bold; opacity: 1; }
.speedSelector { color: #212529; }
#speedSelector{ appearance: none; padding: 5px 10px; border: 1px solid #ded4da; border-radius: 5px; background: #FFF url(/images/common/icon_btn_dropdown.png) no-repeat 100% 50% / 30%; cursor: pointer; }

/* 학습실_미리보기 */
#stdWindow.std-wndw-smpl .std-video-wrap{ width: 100%;}
#stdWindow.std-wndw-smpl .std-info-wrap{ position: fixed; left: -999em; top: -999em;}

/* 학습실_스크랩 하기 팝업 */
#stdScrapWindow .popup-content input[type=text]{ margin-top: 15px;}
#stdScrapWindow .popup-content textarea{ height: 350px; margin-top: 10px;}
/* 학습실_질문 하기 팝업 */
#stdQstnWindow .popup-content ul.input-list{ height: 40px;}
#stdQstnWindow .popup-content .info-wrap{ margin-top: 15px;}
#stdQstnWindow .popup-content input[type=text]{ margin-top: 15px;}
#stdQstnWindow .popup-content textarea{ height: 350px; margin-top: 10px;}
/* 학습실_컨텐츠오류신고 팝업 */
#stdErrWindow .popup-content input[type=text]{ margin-top: 15px;}
#stdErrWindow .popup-content textarea{ height: 350px; margin-top: 10px;}

/* 진행평가 팝업 */
.popup-content > ul.evl-info{ display: flex; gap: 20px; width: 100%; padding: 6.5px 0; margin-bottom: 10px;}
.popup-content > ul.evl-info > li{ display: flex; gap: 15px; align-items: center;}
.popup-content > ul.evl-info > li::after{ display: inline-block; content: ''; width: 1px; height: 15px; margin-left: 4px; vertical-align: middle; background: #dee2e6;}
.popup-content > ul.evl-info > li:last-child::after{ content: none;}
.popup-content > ul.evl-info > li > span{ line-height: 19px; text-align: left; font-size: 15px; color: #6c757d; font-weight: 500; letter-spacing: -0.3px;}
.popup-content > ul.evl-info > li > p{ line-height: 19px; text-align: left; font-size: 15px; color: #212529; font-weight: 500; letter-spacing: -0.3px;}

.popup-content > div.caution-box{ width: 100%; margin-bottom: 30px; border-radius: 8px; border: 1px solid #ced4da; box-sizing: border-box;}
.popup-content > div.caution-box > h2{ width: 100%; padding: 22px; line-height: 32px; text-align: left; font-size: 18px; color: #000; font-weight: 700; letter-spacing: -0.36px; border-radius: 8px 8px 0 0; border-bottom: 1px solid #ced4da; background: #fff; box-sizing: border-box;}
.popup-content > div.caution-box > h2 > button.btn-toggle{ float: right; display: none; width: 32px; height: 32px; border: none; background: url(../../images/sub/btn_toggle32.png) no-repeat 50% 50%;}
.popup-content > div.caution-box > h2 > button.btn-toggle.hide{ transform: rotate(180deg);}
.popup-content > div.caution-box > ul{ display: flex; gap: 20px; flex-direction: column; width: 100%; padding: 25px 30px 30px; border-radius: 0 0 8px 8px; background: #f8f8f8; box-sizing: border-box;}
.popup-content > div.caution-box > ul > li{ display: flex; flex-direction: column; align-items: start; gap: 2px; width: 100%;}
.popup-content > div.caution-box > ul > li > p{ line-height: 29px; text-align: left; font-size: 18px; color: #343a40; font-weight: 500;}
.popup-content > div.caution-box > ul > li > p > span{ color: #dc3545;}
.popup-content > div.caution-box > ul > li > a{ width: 100%; padding-left: 28px; line-height: 25px; text-align: left; font-size: 16px; color: #212529; font-weight: 500; text-decoration: underline; box-sizing: border-box;}
.popup-content > div.caution-box > ul > li > span{ display: inline-block; width: 100%; padding-left: 28px; line-height: 25px; text-align: left; font-size: 16px; color: #6c757d; font-weight: 400; box-sizing: border-box;}
.popup-content > div.caution-box > ul > li > span.line{ text-decoration: underline;}
.popup-content > div.evl-list{ display: flex; gap: 30px; flex-direction: column; border-top: 1px solid #000;}
.popup-content > div.evl-list .evl-box{ width: 100%; border-bottom: 1px solid #ececec;}
.popup-content > div.evl-list .evl-box .qstn{ display: flex; gap: 8px; width: 100%; padding: 22px 20px; border-top: 1px solid #ececec; border-bottom: 1px solid #ececec; background: #fafafa; box-sizing: border-box;}
.popup-content > div.evl-list .evl-box .qstn > span{ line-height: 34px; text-align: left; font-size: 24px; color: #212529; font-weight: 700; letter-spacing: -0.48px;}
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont{ display: flex; flex-direction: column; gap: 10px; align-items: start; justify-content: start;}
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont > p{ line-height: 34px; text-align: left; font-size: 18px; color: #212529; font-weight: 600; letter-spacing: -0.36px;}
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont > p > span{ display: inline-block; width: auto; height: 29px; padding: 6px 10px; line-height: 16px; text-align: center; font-size: 13px; color: #dc3545; font-weight: 500; margin-left: 15px; border-radius: 4px; border: 1px solid #f8d7da; background: #fff; box-sizing: border-box;}
/* 시험문항 이미지 위치 */
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont.q-fix-type_B{ flex-direction: column;}/* 이미지 위치 : 아래 */
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont.q-fix-type_B > p{ order: 1;}
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont.q-fix-type_B > img{ order: 2; max-width: 100%;}
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont.q-fix-type_T{ flex-direction: column; }/* 이미지 위치 : 위 */
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont.q-fix-type_T > p{ order: 2;}
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont.q-fix-type_T > img{ order: 1; max-width: 100%;}
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont.q-fix-type_L{ flex-direction: row;}/* 이미지 위치 : 왼쪽 */
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont.q-fix-type_L > p{ order: 2;}
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont.q-fix-type_L > img{ order: 1; max-width: 200px;}
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont.q-fix-type_R{ flex-direction: row;}/* 이미지 위치 : 오른쪽 */
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont.q-fix-type_R > p{ order: 1;}
.popup-content > div.evl-list .evl-box .qstn > .qstn-cont.q-fix-type_R > img{ order: 2; max-width: 200px;}
.popup-content > div.evl-list .evl-box .cont{ width: 100%; padding: 30px; box-sizing: border-box;}
.popup-content > div.evl-list .evl-box .cont > textarea{ height: 200px;}
.popup-content > div.evl-list .evl-box .cont > ul{ display: flex; gap: 15px; align-items: start; flex-direction: column;}
.popup-content > div.evl-list .evl-box .cont > ul > li{ width: 100%;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio]{ display: none;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label{ display: flex; gap: 10px; align-items: start;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > i{ display: inline-block; width: 24px; height: 24px; font-style: normal; line-height: 24px; text-align: center; font-size: 14px; color: #828282; font-weight: 500; letter-spacing: -0.28px; border-radius: 100%; border: 1px solid #828282; box-sizing: border-box;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p{ display: flex; flex-direction: column; justify-content: start; align-items: start; gap: 10px; width: calc(100% - 34px);}
/* 시험보기별 이미지 위치 */
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p.fix-type_B{ flex-direction: column;}/* 이미지 위치 : 아래 */
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p.fix-type_B > span{ order: 1;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p.fix-type_B > img{ order: 2; max-width: 100%;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p.fix-type_T{ flex-direction: column; }/* 이미지 위치 : 위 */
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p.fix-type_T > span{ order: 2;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p.fix-type_T > img{ order: 1; max-width: 100%;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p.fix-type_L{ flex-direction: row;}/* 이미지 위치 : 왼쪽 */
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p.fix-type_L > span{ order: 2;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p.fix-type_L > img{ order: 1; max-width: 200px;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p.fix-type_R{ flex-direction: row;}/* 이미지 위치 : 오른쪽 */
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p.fix-type_R > span{ order: 1;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p.fix-type_R > img{ order: 2; max-width: 200px;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p > span{ line-height: 24px; text-align: left; font-size: 16px; color: #828282; font-weight: 400; letter-spacing: -0.32px;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio] + label > p > img{ max-width: }
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio]:checked + label{ color: #000; font-weight: 500;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio]:checked + label > i{ color: #fff; font-weight: 700; border: none; background: #000;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio]:checked:disabled + label{ color: #000; font-weight: 500;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio]:checked:disabled + label > i{ color: #fff; font-weight: 700; border: none; background: #000;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio]:disabled + label{ cursor: default;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=radio]:disabled + label > i{ border: 1px solid #828282; background: #fff;}

.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=checkbox]{ display: none;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=checkbox] + label{ display: flex; gap: 10px; align-items: start;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=checkbox] + label > i{ display: inline-block; width: 24px; height: 24px; font-style: normal; line-height: 24px; text-align: center; font-size: 14px; color: #828282; font-weight: 500; letter-spacing: -0.28px; border-radius: 100%; border: 1px solid #828282; box-sizing: border-box;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=checkbox] + label > p{ display: flex; flex-direction: column; gap: 10px;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=checkbox] + label > p > span{ line-height: 24px; text-align: left; font-size: 16px; color: #828282; font-weight: 400; letter-spacing: -0.32px;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=checkbox]:checked + label{ color: #000; font-weight: 500;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=checkbox]:checked + label > i{ color: #fff; font-weight: 700; border: none; background: #000;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=checkbox]:checked:disabled + label{ color: #000; font-weight: 500;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=checkbox]:checked:disabled + label > i{ color: #fff; font-weight: 700; border: none; background: #000;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=checkbox]:disabled + label{ cursor: default;}
.popup-content > div.evl-list .evl-box .cont > ul > li > input[type=checkbox]:disabled + label > i{ border: 1px solid #828282; background: #fff;}

/* 플로팅 기능 추가 관련 css */
#evlWindow .popup-content{ padding-top: 80px;}
#evlWindow .popup-content > ul.evl-info{ position: absolute; top: 0; height: 80px; padding: 31.5px 0; margin: 0; width: calc(100% - 60px); background: #fff; box-sizing: border-box;}

/* 설문응시 팝업 */
#survTkexmWindow .popup-content .info-box + .evl-list{ margin-top: 30px;}

/* 시험결과 팝업 */
#testRsltWindow .popup-content{ text-align: left;}
#testRsltWindow .popup-content span.test-tag{ display: inline-block; width: auto; height: 29px; padding: 6px 10px; line-height: 16px; text-align: center; font-size: 13px; font-weight: 500; border-radius: 4px; box-sizing: border-box;}
#testRsltWindow .popup-content span.test-tag.cmplt{ color: #001f90; border: 1px solid #cfe2ff;}
#testRsltWindow .popup-content span.test-tag.ing{ color: #dc3545; border: 1px solid #f8d7da;}
#testRsltWindow .popup-content span.test-tag + ul.evl-info{ margin-top: 10px;}
#testRsltWindow .popup-content .alert-text{ width: 100%; margin-bottom: 15px; line-height: 24px; text-align: left; font-size: 15px; color: #dc3545; font-weight: 500;}
#testRsltWindow .popup-content .alert-text::before{ display: inline-block; content: ''; width: 20px; height: 20px; vertical-align: middle; margin-right: 6px; background: url(../../images/sub/icon_alert_red.png) no-repeat 50% 50%;}
#testRsltWindow .popup-content > div.evl-list .evl-box .qstn > span{ position: relative;}
#testRsltWindow .popup-content > div.evl-list .evl-box .qstn > span::before{ position: absolute; top: -12px; left: -12px; content: ''; width: 58px; height: 58px; background-repeat: no-repeat; background-position: 50% 50%;}
#testRsltWindow .popup-content > div.evl-list .evl-box .qstn > span.Y::before{ background-image: url(../../images/sub/img_marking_y.png);}
#testRsltWindow .popup-content > div.evl-list .evl-box .qstn > span.N::before{ background-image: url(../../images/sub/img_marking_n.png);}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap{ width: 100%; padding: 25px; border-top: 1px solid #ececec; background: #f5f6fa; box-sizing: border-box;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer{ display: flex; align-items: start; width: 100%; box-sizing: border-box;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > span{ display: inline-block; width: 90px; line-height: 27px; text-align: left; font-size: 16px; color: #000; font-weight: 500;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div{ display: flex; width: calc(100% - 90px);}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.number{ flex: none; display: inline-block; width: 28px; height: 28px; margin-right: 10px; line-height: 28px; text-align: center; font-size: 14px; color: #fff; font-weight: 700; border-radius: 100%; background: #001f90;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.ansr-explain{ display: flex; flex-direction: column; justify-content: start; align-items: start; gap: 10px;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.ansr-explain > span{ line-height: 24px; text-align: left; font-size: 15px; color: #6c757d; font-weight: 400; letter-spacing: -0.3px;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .explain{ display: flex; align-items: start; width: 100%; padding-bottom: 22px; margin-top: 22px; border-top: 1px solid #ececec; }
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .explain > span{ display: inline-block; width: 90px; line-height: 27px; text-align: left; font-size: 16px; color: #000; font-weight: 500;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .explain > div{ width: calc(100% - 90px);}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .explain > div > p{ display: flex; flex-direction: column; justify-content: start; align-items: start; gap: 10px;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .explain > div > p > span{ line-height: 24px; text-align: left; font-size: 15px; color: #6c757d; font-weight: 400; letter-spacing: -0.3px;}
/* 시험해설 이미지 위치 */
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.e-fix-type_B{ flex-direction: column;}/* 이미지 위치 : 아래 */
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.e-fix-type_B > span{ order: 1;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.e-fix-type_B > img{ order: 2; max-width: 100%;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.e-fix-type_T{ flex-direction: column; }/* 이미지 위치 : 위 */
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.e-fix-type_T > span{ order: 2;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.e-fix-type_T > img{ order: 1; max-width: 100%;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.e-fix-type_L{ flex-direction: row;}/* 이미지 위치 : 왼쪽 */
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.e-fix-type_L > span{ order: 2;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.e-fix-type_L > img{ order: 1; max-width: 200px;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.e-fix-type_R{ flex-direction: row;}/* 이미지 위치 : 오른쪽 */
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.e-fix-type_R > span{ order: 1;}
#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.e-fix-type_R > img{ order: 2; max-width: 200px;}

#evlPreviewWindow .popup-content{ text-align: left;}
#evlPreviewWindow .popup-content span.test-tag{ display: inline-block; width: auto; height: 29px; padding: 6px 10px; line-height: 16px; text-align: center; font-size: 13px; font-weight: 500; border-radius: 4px; box-sizing: border-box;}
#evlPreviewWindow .popup-content span.test-tag.cmplt{ color: #001f90; border: 1px solid #cfe2ff;}
#evlPreviewWindow .popup-content span.test-tag.ing{ color: #dc3545; border: 1px solid #f8d7da;}
#evlPreviewWindow .popup-content span.test-tag + ul.evl-info{ margin-top: 10px;}
#evlPreviewWindow .popup-content .alert-text{ width: 100%; margin-bottom: 15px; line-height: 24px; text-align: left; font-size: 15px; color: #dc3545; font-weight: 500;}
#evlPreviewWindow .popup-content .alert-text::before{ display: inline-block; content: ''; width: 20px; height: 20px; vertical-align: middle; margin-right: 6px; background: url(../../images/sub/icon_alert_red.png) no-repeat 50% 50%;}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .qstn > span{ position: relative;}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .qstn > span::before{ position: absolute; top: -12px; left: -12px; content: ''; width: 58px; height: 58px; background-repeat: no-repeat; background-position: 50% 50%;}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .qstn > span.Y::before{ background-image: url(../../images/sub/img_marking_y.png);}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .qstn > span.N::before{ background-image: url(../../images/sub/img_marking_n.png);}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap{ width: 100%; padding: 25px; border-top: 1px solid #ececec; background: #f5f6fa; box-sizing: border-box;}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer{ display: flex; align-items: start; width: 100%; box-sizing: border-box;}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > span{ display: inline-block; width: 90px; line-height: 27px; text-align: left; font-size: 16px; color: #000; font-weight: 500;}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div{ width: calc(100% - 90px);}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.number{ display: inline-block; width: 28px; height: 28px; margin-right: 10px; line-height: 28px; text-align: center; font-size: 14px; color: #fff; font-weight: 700; border-radius: 100%; background: #001f90;}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > span{ line-height: 24px; text-align: left; font-size: 15px; color: #6c757d; font-weight: 400; letter-spacing: -0.3px;}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap > .explain{ display: flex; align-items: start; width: 100%; padding-bottom: 22px; margin-top: 22px; border-top: 1px solid #ececec; }
#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap > .explain > span{ display: inline-block; width: 90px; line-height: 27px; text-align: left; font-size: 16px; color: #000; font-weight: 500;}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap > .explain > div{ width: calc(100% - 90px);}
#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap > .explain > div > span{ line-height: 24px; text-align: left; font-size: 15px; color: #6c757d; font-weight: 400; letter-spacing: -0.3px;}

/* 과제제출 팝업 */
.popup-content.hw-content > h3{ width: 100%; margin-top: 30px; line-height: 32px; text-align: left; font-size: 20px; color: #000; font-weight: 600; letter-spacing: -0.4px;}
.popup-content.hw-content > .hw-info{ display: flex; flex-direction: column; gap: 15px; align-items: center; justify-content: center; width: 100%; padding: 30px 22px; margin-top: 15px; border-radius: 6px; border: 1px solid #eee; background: #fff; box-sizing: border-box;}
.popup-content.hw-content > .hw-info > p{ line-height: 25px; text-align: center; font-size: 16px; color: #6c757d; font-weight: 400;}
.popup-content.hw-content > ul.input-form{ margin-top: 15px;}
.popup-content.hw-content > ul.input-form > li > div > textarea{ height: 240px;}

/* 과제결과 팝업 */
.popup-content.hw-content > ul.input-form.hw-rslt > li > div > textarea{ padding: 0; border: none; background: none;}
#hwRsltWindow .popup-content > h3:first-child{ margin-top: 0;}
#hwRsltWindow .popup-content ul.input-form > li > div > ul.radio-list{ margin-top: 20px;}

/* 수료증 발급일자 변경 팝업 */
#certiIssdSetWindow .popup-content > h2{ line-height: 32px; text-align: left; font-size: 20px; color: #000; font-weight: 600; letter-spacing: -0.4px;}
#certiIssdSetWindow .popup-content > p{ display: flex; gap: 3px; flex-wrap: wrap; margin: 20px 0; line-height: 27px; text-align: left; font-size: 16px; color: #6c757d; font-weight: 400;}
#certiIssdSetWindow .popup-content img{ margin-bottom: 20px;}
#certiIssdSetWindow .popup-content ul.radio-list{ gap: 30px; justify-content: center; align-items: center; width: 100%; height: 68px; padding: 16px 25px 20px; border-radius: 4px; background: #f8f8f8; box-sizing: border-box;}
#certiIssdSetWindow .popup-content .bar{ display: flex; width: 100%; height: 1px; margin: 40px 0; background: #ced4da;}

/* 추가금결제 팝업 */
.pymt-agree-cont{ width: 100%; border-radius: 8px; border: 1px solid #ced4da; background: #fff;}
.pymt-agree-cont > h3{ width: 100%; padding: 22px; line-height: 32px; text-align: left; font-size: 18px; color: #000; font-weight: 700; letter-spacing: -0.36px; border-radius: 8px 8px 0 0; border-bottom: 1px solid #ced4da; box-sizing: border-box;}
.pymt-agree-cont > div.content{ width: 100%; padding: 25px 30px 30px; background: #f8f8f8; border-radius: 0 0 8px 8px; box-sizing: border-box;}
.pymt-agree-cont > div.content > h4{ line-height: 29px; text-align: left; font-size: 18px; color: #343a40; font-weight: 500; box-sizing: border-box;}
.pymt-agree-cont > div.content > p+h4{ margin-top: 20px;}
.pymt-agree-cont > div.content > p{ width: 100% ; padding-left: 20px; line-height: 26px; text-align: left; font-size: 16px; color: #6c757d; font-weight: 400; box-sizing: border-box;}
.pymt-agree-cont > div.content > p.flex{ display: flex; gap: 0 4px; flex-wrap: wrap;}
.pymt-agree-cont > div.content > p.flex > i{ font-style: normal;}
.pymt-agree-cont > div.content > p.flex span{ display: block; width: 100%; font-size: 700;}
.pymt-agree-cont > div.content > .mt-10{ margin-top: 10px;}
.pymt-agree-cont > div.content > .mt-20{ margin-top: 20px;}
.add-pymt-agree .agree-wrap{ padding: 15px 0 0;}
.add-pymt-agree .agree-wrap > p.text{ margin-bottom: 2px; line-height: 28px; text-align: center; font-size: 16px; color: #495057; font-weight: 400;}
.add-pymt-agree .agree-wrap > p.date{ line-height: 25px; text-align: center; font-size: 18px; color: #000; font-weight: 500;}
.add-pymt-agree .agree-wrap > ul.radio-list{ justify-content: center; margin-top: 15px;}

/* 진도현황 확인서 팝업 */
#pgsStsConfWindow .popup-content .btn-wrap{ margin: 0 0 15px}
#pgsStsConfWindow .popup-content .btn-wrap button > i{ width: 16px; height: 16px; margin-top: 0; margin-left: 0; margin-right: 4px; background: url(../../images/sub/icon_pdf.png) no-repeat 50% 50%;}
.pop-confirm-wrap{ width: 100%; height: fit-content; padding: 55px; border: 1px solid #ced4da; box-sizing: border-box;}
.pop-confirm-wrap > h2{ line-height: 44px; text-align: center; font-size: 34px; color: #000; font-weight: 700; letter-spacing: -0.68px;}
.pop-confirm-wrap h3{ width: 100%; margin-bottom: 15px; line-height: 30px; text-align: left; font-size: 20px; color: #000; font-weight: 700; letter-spacing: -0.4px;}
.pop-confirm-wrap > div.apply-wrap{ width: 100%; box-sizing: border-box;}
.pop-confirm-wrap > div.apply-wrap > ul{ display: flex; flex-direction: column; gap: 8px; width: 100%; padding: 25px 15px; border-top: 1px solid #adb5bd; border-bottom: 1px solid #e9ecef; box-sizing: border-box;}
.pop-confirm-wrap > div.apply-wrap > ul > li{ display: flex; width: 100%;}
.pop-confirm-wrap > div.apply-wrap > ul > li > span{ display: inline-block; width: 120px; line-height: 21px; text-align: left; font-size: 14px; color: #6c757d; font-weight: 400; letter-spacing: -0.28px;}
.pop-confirm-wrap > div.apply-wrap > ul > li > p{ width: cal(100% - 120px); line-height: 21px; text-align: left; font-size: 14px; color: #6c757d; font-weight: 400; letter-spacing: -0.28px;}
.pop-confirm-wrap > div.apply-wrap > p{ display: block; width: 100%; margin-top: 40px; line-height: 24px; text-align: center; font-size: 15px; color: #495057; font-weight: 400; letter-spacing: -0.3px;}
.pop-confirm-wrap > div.apply-wrap > span{ display: block; margin-top: 4px; line-height: 24px; text-align: center; font-size: 15px; color: #495057; font-weight: 400; letter-spacing: -0.3px;}
.pop-confirm-wrap > div.apply-wrap .stamp-wrap{ position: relative; display: inline-block; width: auto; padding: 10px 0 0; margin: 10px auto 0;}
.pop-confirm-wrap > div.apply-wrap .stamp-wrap > h4{ position: relative; line-height: 29px; text-align: center; font-size: 18px; color: #212529; font-weight: 600; letter-spacing: -0.36px; z-index: 10;}
.pop-confirm-wrap > div.apply-wrap .stamp-wrap > i{ position: absolute; top: 0; right: -30px; display: block; width: 60px; height: 60px; border-radius: 100%; background: url(../../images/sub/img_edupre_stamp.png) no-repeat 50% 50%; background-size: cover; z-index: 9;}
.pop-confirm-wrap > div.sts-wrap{ margin-top: 70px;}

@media screen and (max-width: 1590px){
	#stdWindow{ flex-direction: column;}
	#stdWindow .std-video-wrap{ width: 100%;}
	#stdWindow .std-video-wrap > ul{ gap: 14px; height: 76px;}
	#stdWindow .std-video-wrap > ul > li{ line-height: 20px; font-size: 13px;}
	#stdWindow .std-video-wrap > ul > li::after{ margin-right: 14px;}
	#stdWindow .std-info-wrap{ width: 100%;}
	#stdWindow .std-info-wrap .tab-content{ height: 100%;}
	#stdWindow .std-info-wrap .pgs-wrap > h2{ margin-bottom: 10px; line-height: 29px; font-size: 18px; letter-spacing: -0.36px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-box{ padding: 18px 20px 20px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-box > p{ margin-bottom: 2px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-box > ul > li > i{ line-height: 24px; font-size: 14px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-box > ul > li > p{ line-height: 24px; font-size: 14px;}
	#stdWindow .std-info-wrap .pgs-wrap .progress-box > p{ font-size: 16px; letter-spacing: -0.32px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-list .chapter-tit{ padding: 25px 20px 30px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-list > ul.page-list{ gap: 5px; padding: 22px 20px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-list > ul.page-list > li{ width: 25.5px; height: 25.5px; line-height: 25px;}
	#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box{ padding: 25px 20px 30px;}
	#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box > h3{ line-height: 29px; font-size: 18px; letter-spacing: -0.36px;}
	#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap{ padding: 15px 10px;}
	#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap > h4{ line-height: 20px; font-size: 15px;}
	#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap > h4 > span{ line-height: 20px; font-size: 15px;}
	.bodyfBox{ width: 100%; }
	#opinionContainer{ width: 80vw; height: 50vw; }
}

@media screen and (max-width: 1024px){
	.k-window-content.layer-popup .popup-content .info-box{ padding: 18px 20px 20px;}
	.k-window-content.layer-popup .popup-content .info-box > h3{ line-height: 26px; font-size: 16px;}
	.k-window-content.layer-popup .popup-content .info-box > ul > li > p{ line-height: 24px; font-size: 14px;}

	/* 진행평가 팝업 */
	.popup-content > ul.evl-info{ flex-direction: column; gap: 10px; padding: 0; margin-bottom: 20px;}
	.popup-content > ul.evl-info > li::after{ content: none;}
	.popup-content > ul.evl-info > li > span{ line-height: 18px; font-size: 14px; letter-spacing: -0.28px;}
	.popup-content > ul.evl-info > li > p{ line-height: 18px; font-size: 14px; letter-spacing: -0.28px;}
	.popup-content > div.caution-box{ margin-bottom: 20px; border-radius: 6px;}
	.popup-content > div.caution-box > h2{ padding: 12px 15px; font-size: 16px; letter-spacing: -0.32px; border-radius: 6px 6px 0 0;}
	.popup-content > div.caution-box > h2 > button.btn-toggle{ display: block;}
	.popup-content > div.caution-box > ul{ gap: 15px; padding: 20px 25px; border-radius: 0 0 6px 6px;}
	.popup-content > div.caution-box > ul > li > p{ line-height: 25px; font-size: 16px;}
	.popup-content > div.caution-box > ul > li > span{ line-height: 22px; font-size: 14px;}
	.popup-content > div.evl-list{ gap: 20px;}
	.popup-content > div.evl-list .evl-box .qstn{ flex-direction: column; gap: 8px; padding: 15px 20px 20px;}
	.popup-content > div.evl-list .evl-box .qstn > span{ line-height: 28px; font-size: 20px; letter-spacing: -0.4px;}
	.popup-content > div.evl-list .evl-box .qstn > .qstn-cont > p{ line-height: 22px; font-size: 16px; letter-spacing: -0.32px;}
	.popup-content > div.evl-list .evl-box .qstn > .qstn-cont > p > span{ height: 21px; padding: 4px 10px; margin-left: 8px; line-height: 12px; font-size: 10px;}
	.popup-content > div.evl-list .evl-box .cont{ padding: 20px;}
	.popup-content > div.evl-list .evl-box .cont > textarea{ height: 130px;}
	#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > span{ line-height: 25px; font-size: 15px;}
	#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.number{ width: 25px; height: 25px;}
	#testRsltWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > span{ line-height: 22px; font-size: 14px; letter-spacing: -0.26px;}
	#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > span{ line-height: 25px; font-size: 15px;}
	#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > p.number{ width: 25px; height: 25px;}
	#evlPreviewWindow .popup-content > div.evl-list .evl-box .answer-wrap > .answer > div > span{ line-height: 22px; font-size: 14px; letter-spacing: -0.26px;}

	/* 플로팅 기능 추가 관련 css */
	#evlWindow .popup-content{ padding-top: 132px;}
	#evlWindow .popup-content > ul.evl-info{ height: 132px; padding: 15px 0; margin: 0; width: calc(100% - 60px); background: #fff; box-sizing: border-box;}

	/* 과제제출 팝업 */
	.popup-content.hw-content > h3{ margin-top: 20px;}
	.popup-content.hw-content > .hw-info > p{ line-height: 22px; font-size: 14px;}
	.popup-content.hw-content > .hw-info > p+button{ height: 40px; padding: 11px 12px; line-height: 17px; font-size: 14px; letter-spacing: -0.28px;}
	#hwRsltWindow .popup-content ul.input-form > li > div > ul.radio-list{ width: 100%; height: auto; flex-direction: column; gap: 3px; align-items: start; margin-top: 15px;}
	#hwRsltWindow .popup-content ul.input-form > li > div > ul.radio-list > li input[type=radio]+label{ line-height: 32px;}

	/* 설문응시 팝업 */

	/* 시험결과 팝업 */
	#testRsltWindow .popup-content span.test-tag{ height: 18px; padding: 3px 6px; line-height: 12px; font-size: 10px; border-radius: 3px;}
	#testRsltWindow .popup-content span.test-tag + ul.evl-info{ margin-top: 15px;}
	#testRsltWindow .popup-content > ul.evl-info > li > span{ width: 75px;}
	#testRsltWindow .popup-content > ul.evl-info > li > p{ width: calc(100% - 75px);}
	#testRsltWindow .popup-content .alert-text{ line-height: 20px; font-size: 14px;}
	#testRsltWindow .popup-content > div.evl-list .evl-box .qstn > span::before{ left: -19px;}
	
	/* ------------------------------------------------------- 학습창 */
	#stdWindow .std-info-wrap{ width: 100%;}
	#stdWindow .std-info-wrap .tab-content{ height: 100%;}
	#stdWindow .std-info-wrap .pgs-wrap > h2{ margin-bottom: 10px; line-height: 29px; font-size: 18px; letter-spacing: -0.36px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-box{ padding: 18px 20px 20px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-box > p{ margin-bottom: 2px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-box > ul > li > i{ line-height: 24px; font-size: 14px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-box > ul > li > p{ line-height: 24px; font-size: 14px;}
	#stdWindow .std-info-wrap .pgs-wrap .progress-box > p{ font-size: 16px; letter-spacing: -0.32px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-list .chapter-tit{ padding: 25px 20px 30px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-list > ul.page-list{ gap: 5px; padding: 22px 20px;}
	#stdWindow .std-info-wrap .pgs-wrap .chapter-list > ul.page-list > li{ width: 25.5px; height: 25.5px; line-height: 25px;}
	#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box{ padding: 25px 20px 30px;}
	#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box > h3{ line-height: 29px; font-size: 18px; letter-spacing: -0.36px;}
	#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap{ padding: 15px 10px;}
	#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap > h4{ line-height: 20px; font-size: 15px;}
	#stdWindow .std-info-wrap .scrap-wrap .scrap-list .scrap-box .page-scrap > h4 > span{ line-height: 20px; font-size: 15px;}
	.body_mp4 .player-btn{ width: 62px; height: 62px; }
}

@media screen and (max-width: 860px){
	/* ------------------------------------------------------- 학습창 */
	.body_mp4 .player-btn{ top: 8rem; width: 42px; height: 42px; }
	.playback-speed{ padding: 8.5px 10px 11.5px; }
	.playback-speed > span{ font-size: 13px; line-height: 19.5px; letter-spacing: -0.26px; }
	.playback-speed .speed-btn{ font-size: 13px; line-height: 19.5px; letter-spacing: -0.26px; }
}