@import url(/renewal/css/all-grades2024-146217d1e2459c4e37afceaea45a9af3.css);
:root {
  --color-primary: #02a39f;
  --color-primary-bg: #e6f4f4;
  --color-primary-50: #f9fbfc;
  --color-primary-100: #e8f6f6;
  --color-primary-150: #f2fafa;
  --color-primary-200: #d1eeed;
  --color-primary-300: #8cd5d3;
  --color-primary-400: #36bac1;
  --color-primary-600: #1e9fa7;
  --color-primary-700: #017c81;
  --color-primary-800: #015c61;
  --color-primary-disabled: #88a8a7;
  --color-secondary: #f28b9c;
  --color-secondary-500: #e26f8e;
  --color-secondary-600: #d66384;
  --button-primary: #02a39f;
  --button-primary-hover: #015c61;
  --button-primary-disable: #57AAA0;
  --button-secondary: #36bac1;
  --button-secondary-hover: #015c61;
  --button-secondary-disable: #57AAA0;
  --button-third: #f28b9c;
  --button-third-hover: #e26f8e;
  --button-third-disable: #d66384;
  --logo-images: url("/assets/images/common/logo-elementary-1486c11b230f2e3ec3947f479505e07a.svg");
  --logo-mteacher: url("/assets/images/elementary/logo-mteacher-3b376aaad6a8ba22af3f2e62b0d627a0.svg");
  --bg-prd-reference: url("/assets/images/elementary/bg-prd-reference-ac916699566b4164feba232cbb2fe2e7.png");
  --icon-star: url("/assets/images/elementary/icon-star-20dea88ee4cb44a73177b780c16566ef.svg");
  --bg-loading: url("/assets/images/elementary/bg-loading-0bcea9577e59378621b873ae3b63e5b0.png");
  --vh:var(--vh);
  --scroll-height:var(--scroll-height);
  --logo-make-x: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAaCAYAAACgoey0AAAABHNCSVQICAgIfAhkiAAAAa9JREFUSEutlktKBEEMhnv0Am5E8NmKr4WK4D1Ej6BzDzfqEXwsvIUg6sKN4Ep0IXgBRfe+UHz+/2CkralK0t1TEKa6k/zfpCpFdSPLsjtYcfQHz516vIZQj4g1ImDxrWOyU5M6jfyTmIYGlviqKxCu5D++B8yEQdhXiepVKHW8YMYOwT4dcBMq4AtMemHdDlEL7oKCc8+Kw2ElDyDhu25eDEzNM1iurEDYcNqfZW+wR9qaK6VvwYeR+AErDZU91rb2GM4ZJYCV0H8YiYlWKnGppS7qHOFh1lj2uQDO7mcjJocHzOQD2LwTrlZapmKJ3cdkQYHn8E3BrrRKq4CZsw1bUoRH4XvrJLjYuTxKW7BlBTAO30vdPY4dFw98AuDnFNxqLu2MEr4JW1Eq454/xvwaWIM+QWzyV3ADv6sKnHfyQ+iPgRcRtKsIce+4h8Vhwc8RTN2/IWDeTKewXGsI+F5hY4kYCy5prc4vcx/zmDBJG/xcahoxLbcX/I7YEY8gYlxwD3gPYmtOqIT1YXKp5Vjgqh96wkyejBS4LjAs9hYvuoovCY5dXzcll9YKb2P8ABWfSwGJdoa2AAAAAElFTkSuQmCC");
  --logo-make-x-white: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAiCAYAAAAzrKu4AAAABHNCSVQICAgIfAhkiAAAAgJJREFUWEfdl61OxEAUhZktbPoMIPhxwAuAq0KtQmMQKLAYEpIFg0GCIxgeAIFC1ZHgEQj+BFmeofQHTku7GYbO3nunraHJJrvtnXO+nrkz3aovHFO/jwul1I5xrtOfQLiBwUAzGakaMB3iBJAHXVBlWXYL7Q2LNglWjVuGyGMbgAjiGDqHhBYbLNfJAOc1gSNmR5cWgRUDAadc4ARQubwczAVOCOUOJoFzgPoBq6YFAuv4fieZJmpahVBxFEUrvu8/FTdeBwLBB5xf5UDa4ARQR9AYml7WRobwDIo/XeC4UJMSJ1eY1ERab7txEiwfyDVD6RI+L1TKVG9ae8zSd+Yz9U9ZboibyOGerUkw90FWYtrK5cIt1iXHSaryEoFxp7VMbgH1r2MjZlLOYEK4edS/SZJqBCaBoxZCo1VpG8xZrS5piValDlcC9WEadwXXtPk7gxOBWdLxkFzWdnJssEnGVR+1CccC4xpy6orGZuxpJJjUTFov3i7CMJwOgiDm7ENmAm3A2f4ovgNozgVK8lwtN+rrXq+3aXqNwZIkGXiel78Rsw+qV7jJaYZr0Lwv+tBhcKFDQUmTM9L4R69v3KTMfhDOjCixGFB9dgPWFArg2GCzgPpoAqX13Ba+XxFaJNgegM7bADI10jS9xDaxbdGuBTsFzH4XMDZNTPEZru1q10ff81snjgR0NoYAAAAASUVORK5CYII=");
  --icon-arrow-caution: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9.742' height='9.742' viewBox='0 0 9.742 9.742'%3E%3Cg fill='%23fff'%3E%3Cpath d='M 8.933247566223145 9.242263793945312 L 0.8090178370475769 9.242263793945312 L 4.871132850646973 1.118033289909363 L 8.933247566223145 9.242263793945312 Z' stroke='none'/%3E%3Cpath d='M 4.871132850646973 2.23607349395752 L 1.618038177490234 8.742263793945312 L 8.124227523803711 8.742263793945312 L 4.871132850646973 2.23607349395752 M 4.871132850646973 2.86102294921875e-06 L 9.742262840270996 9.742263793945312 L 2.86102294921875e-06 9.742263793945312 L 4.871132850646973 2.86102294921875e-06 Z' stroke='none' fill='%238cd5d3'/%3E%3C/g%3E%3C/svg%3E%0A");
  --float-btn-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20.242' height='12.243' viewBox='0 0 20.242 12.243'%3E%3Cg id='icon_arrow_open' transform='translate(2.121 10.122) rotate(-45)'%3E%3Cpath d='M0,0H11.313' transform='translate(0 0.001)' fill='none' stroke='%23fff' stroke-linecap='round' stroke-width='3'/%3E%3Cpath d='M11.313,0H0' transform='translate(11.314 11.313) rotate(-90)' fill='none' stroke='%23fff' stroke-linecap='round' stroke-width='3'/%3E%3C/g%3E%3C/svg%3E%0A");
  --drag-horizontal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3E%3Crect width='30' height='30' rx='15' transform='translate(0 30) rotate(-90)' fill='%23a4a4a4'/%3E%3Crect width='29' height='29' rx='14.5' transform='translate(0.5 29.5) rotate(-90)' fill='none' stroke='%23939393' stroke-width='1'/%3E%3Cg%3E%3Cpath d='M0,32l-3.464,6H3.464Z' transform='translate(55 15) rotate(90)' fill='%23fff'/%3E%3Cpath d='M0,28l3.464-6H-3.464Z' transform='translate(35 15) rotate(90)' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E%0A");
  --icon-download: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13.34' height='13.334' viewBox='0 0 13.34 13.334'%3E%3Cpath id='icon-download' d='M1724.67,362.333V369.9l3.23-2.738.86,1.018-4.33,3.666-.43.365-.43-.365-4.33-3.666.86-1.018,3.23,2.738v-7.563Zm-7.34,13.334h13.34v-1.334h-13.34Z' transform='translate(-1717.33 -362.333)' fill='%23333' fill-rule='evenodd'/%3E%3C/svg%3E%0A");
  --icon-favorite: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14.14' height='14.142' viewBox='0 0 14.14 14.142'%3E%3Cpath id='icon-favorite' d='M1757.57,366.408l.34-.093.25-.251,3.15-3.148,4.07,4.065-3.15,3.149-.25.25-.1.342-.51,1.874-5.67-5.677Zm3.74-5.378-.94.943-3.15,3.148-2.61.712-1.48.4,1.08,1.086,2.91,2.906-4,4,.94.943,4-4,2.91,2.906,1.09,1.086.4-1.482.71-2.61,3.15-3.148.94-.943-.94-.943-4.07-4.065Z' transform='translate(-1753.12 -361.03)' fill='%23333' fill-rule='evenodd'/%3E%3C/svg%3E%0A");
  --icon-share: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13.34' height='13.334' viewBox='0 0 13.34 13.334'%3E%3Cpath id='icon-share' d='M1800.33,365.833a1.167,1.167,0,1,0-1.16-1.166A1.166,1.166,0,0,0,1800.33,365.833Zm0,1.167a2.333,2.333,0,1,0-2.33-2.333,2.452,2.452,0,0,0,.05.472l-4.96,2.347a2.311,2.311,0,0,0-1.42-.486,2.334,2.334,0,1,0,0,4.667,2.3,2.3,0,0,0,1.67-.713l4.67,2.144a1.83,1.83,0,0,0-.01.235,2.337,2.337,0,1,0,.42-1.333l-4.5-2.065a2.392,2.392,0,0,0,.08-.6,2.253,2.253,0,0,0-.18-.9l4.74-2.247A2.328,2.328,0,0,0,1800.33,367Zm0,7.5a1.167,1.167,0,1,0-1.16-1.167A1.166,1.166,0,0,0,1800.33,374.5Zm-7.5-5.167a1.165,1.165,0,1,1-1.16-1.166A1.164,1.164,0,0,1,1792.83,369.333Z' transform='translate(-1789.33 -362.333)' fill='%23333' fill-rule='evenodd'/%3E%3C/svg%3E%0A");
}

.logo-make-x-svg {width: 15px; height: 12.56px; display:inline-block; background: var(--logo-make-x) center center no-repeat; background-size:100%;}

body.lesson-2024 {
  background-color: #f8f8f8;
  overscroll-behavior: none;
  /*touch-action: none;*/
  -webkit-touch-callout: none;
}
html.header-overlay,
html.active-overlay {scrollbar-gutter: auto;}

body.lesson-2024 h3,
body.lesson-2024 .h3 {font-weight:700;}
body.lesson-2024 .wrapper-lesson {min-width:1320px; height:100vh; height:calc(var(--vh, 1vh) * 100 - var(--scroll-height)); overflow:initial; padding-bottom:0; padding-top:0;}
body.lesson-2024 .wrapper-lesson main {padding:15px 0 24px;}

@supports (-webkit-touch-callout: none) {height:calc(var(--vh, 1vh) * 100 - 51px)}

body.lesson-2024 .other-lesson .other-items {padding-top:15px;}

body.lesson-2024 .wrapper-lesson .contents-header {margin-bottom:15px;}
body.lesson-2024 .wrapper-lesson .contents-header .header-inner {}
body.lesson-2024 .wrapper-lesson .contents-header .header-inner h2 {line-height:40px;}
body.lesson-2024 .wrapper-lesson .contents-header .header-inner h2 .title-item {min-width:100px; height:40px; margin-right:10px; display:inline-flex; justify-content: center; align-items: center; line-height:40px; background-color:#EFEFEF; border:1px solid #D5D5D5; border-radius:30px; font-size:16px; color:#838383; font-weight:500; transform:translateY(-2px)}
body.lesson-2024 .wrapper-lesson .contents-header .number-pages {color:#626262;}
body.lesson-2024 .wrapper-lesson .contents-header .buttons .other-lesson {}
body.lesson-2024 .wrapper-lesson .contents-header .buttons .other-lesson .button:hover {background-color:#fff;}
body.lesson-2024 .wrapper-lesson .contents-header .buttons .other-lesson .button.active svg {transform:rotate(180deg)}
body.lesson-2024 .wrapper-lesson .contents-header .buttons .other-lesson .item a::after {display:none;}
body.lesson-2024 .wrapper-lesson .contents-header #other-items-btn.active {border-color: var(--color-primary); background-color: var(--color-primary); color:#fff;}
body.lesson-2024 .wrapper-lesson .contents-header #other-items-btn.active svg {color:#fff;}

body.lesson-2024 .period-header {position:sticky; z-index:200;}
body.lesson-2024 .period-contents {gap:26px;}
body.lesson-2024 .period-contents section.type-primary {border-color:rgba(170, 170, 170, 0.99)}
body.lesson-2024 .period-contents section {min-height:calc(100vh - 151px); min-height:calc(var(--vh, 1vh) * 100 - 151px);}
body.lesson-2024 .period-contents section.type-primary .lesson-header {background: #999999 0% 0% no-repeat padding-box;}
body.lesson-2024 .period-contents .sub-lessons .lesson-data .data a > span {color:#999 !important;}

body.lesson-2024 .sub-lessons:last-child {border-bottom: 1px solid #e6e6e6; margin-bottom:60px;}
body.lesson-2024 .lesson-header .lesson-header-buttons {display:flex; align-items: center; gap:6px; position:relative;}
body.lesson-2024 .lesson-header .lesson-header-buttons button i {width:20px; height:20px; display:block; background-position:0 0; background-repeat:no-repeat; background-size:100%;}
body.lesson-2024 .lesson-header .lesson-header-buttons button i.ico-head-edit {width:15px; height:12.56px; background-image:var(--logo-make-x); }
body.lesson-2024 .lesson-header .lesson-header-buttons button i.ico-head-share {width:27px; height:19px; background-image:url(/assets/images/common/icon-aiclass-noclass-745d01ec57f18d687fa4b6ad8239234e.svg)}
body.lesson-2024 .lesson-header .input-inner-extra .icon-button svg {background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cg id='icon-search' transform='translate(-1798 -162)'%3E%3Crect width='20' height='20' transform='translate(1798 162)' fill='rgba(194,0,219,0.13)' opacity='0'/%3E%3Cpath d='M1811.96,170.75a5.21,5.21,0,1,1-5.21-5.208A5.207,5.207,0,0,1,1811.96,170.75Zm-.97,5.415a6.925,6.925,0,1,1,1.17-1.179l4.24,4.237-1.18,1.179Z' transform='translate(0.119 0.125)' fill='%23adadad' fill-rule='evenodd'/%3E%3C/g%3E%3C/svg%3E%0A") center center no-repeat; background-size:100%;}
body.lesson-2024 .lesson-header .input-inner-extra .icon-button svg use {display:none;}
/*
body.lesson-2024 .lesson-header .lesson-header-buttons button#listEditBtn.active {border-color:#000; color:#000;}
body.lesson-2024 .lesson-header .lesson-header-buttons button#listEditBtn.active i {background-image:url(/assets/images/subject/icon-list-edit-de835c115517c0c138513b3ef5dc4549.svg)}
body.lesson-2024 .lesson-header .lesson-header-buttons button#listShareBtn:disabled {background-color:#76696B; border-color:#555555; color:#EFEFEF; opacity:1;}
body.lesson-2024 .lesson-header .lesson-header-buttons button#listShareBtn:disabled i {background-image:url(/assets/images/subject/icon-head-share-disabled-1eea4e3e9581226880ba54e782de18ed.svg)}
body.lesson-2024 .lesson-header .lesson-header-buttons button#listEditBtn:disabled {background-color:#76696B; border-color:#555555; color:#EFEFEF; opacity:1;}
body.lesson-2024 .lesson-header .lesson-header-buttons button#listEditBtn:disabled i {background-image:url(/assets/images/subject/icon-head-edit-bda7e244a3fa403c2f793361f650d870.svg)}
*/
body.lesson-2024 .lesson-header h3 {display:flex; align-items:center;}
body.lesson-2024 .lesson-header .lesson-header-buttons .btn-caution img {vertical-align:top;}
body.lesson-2024 .lesson-header .input-inner-extra {max-width:192px;}
body.lesson-2024 .lesson-header .input-inner-extra input[type="search"]::placeholder {font-size:14px; color:#D2D2D2;}

.aiclass-caution {max-width:200px;}
.aiclass-caution .webui-popover-content-desc .logo-aiclass {height:21px; vertical-align: top; transform: translateY(2px); margin-right: 4px;}
.aiclass-caution .aiclass-caution-title {margin-bottom:8px; font-weight:600; color:#000;} /* #수정 2025-02-10 추가됨 */

body.lesson-2024 .tabs.type-line > .tab li.active {border-bottom-color :#999}
body.lesson-2024 .tabs.type-line > .tab li:hover a,
body.lesson-2024 .tabs.type-line > .tab li:focus a,
body.lesson-2024 .tabs.type-line > .tab li.active a {color:#000;}
body.lesson-2024 .tabs.type-line > .tab.type01 li a {color:#A4A4A4;}
body.lesson-2024 .tabs.type-line > .tab.type01 li:hover a,
body.lesson-2024 .tabs.type-line > .tab.type01 li:focus a,
body.lesson-2024 .tabs.type-line > .tab.type01 li.active a {font-weight:700;}
body.lesson-2024 .tabs.type-line > .tab.type01 li.active {border:0;}
body.lesson-2024 .tabs.type-line > .tab.type01 li.active:before {content:''; width:100%; height:2px; display:block; position:absolute; left:0; bottom:0; background-color:#8CD5D3;}

body.lesson-2024 .sub-lessons h4 {}
body.lesson-2024 .sub-lessons h4 strong {font-weight:500; font-size:16px; color:#000;}
body.lesson-2024 .sub-lessons .btn-more {height:36px; padding:0 16px; border-radius:18px; display:flex; align-items:center; z-index:1; font-size:14px;}
body.lesson-2024 .sub-lessons .btn-more:before {width:8px; height:8px; margin-right:6px; position:static; display:block; background:url(/assets/images/subject/icon-doc-plus-2a81d3618b17249804fcba279389ee5d.svg) 0 0 no-repeat; background-size:100%; transform:rotate(45deg);}
body.lesson-2024 .sub-lessons .btn-more:after {display:none;}
body.lesson-2024 .sub-lessons .btn-more strong {font-weight:700;}

body.lesson-2024 .data {position:relative; padding:15px 20px; border-radius:4px;}
body.lesson-2024 .data.disabled {overflow:hidden;}
body.lesson-2024 .data.disabled:hover {border: 1px solid #e6e6e6; background-color:#fff;}
body.lesson-2024 .data.disabled:before {content:''; width:100%; height:100%; display:block; position:absolute; left:0; top:0; background-color:rgba(246, 246, 246, .5); z-index:11;}
body.lesson-2024 .data:hover,
body.lesson-2024 .data:focus,
body.lesson-2024 .data.active,
body.lesson-2024 .data.active-vertical,
body.lesson-2024 .data.active-horizontal {border-color:#8CD5D3; background-color:#F2FAFA;}
body.lesson-2024 .data .image-wrap {min-height:64px; max-height:64px; border:1px solid #ddd; display: block; background-image:url(/assets/images/subject/icon-no-image-default-66aba035354c09e31b8536a1edb18aee.svg); background-size:21px 18px;}
body.lesson-2024 .data .image-wrap.bg-white {background-image:none; background-color:#fff;}
/* 세로 기준 가로 세로 100% body.lesson-2024 .data .image-wrap img {height: 100%; max-height: 100%; vertical-align: top; position: absolute; left: 50%; top:50%; transform: translate(-50%,-50%);} */
body.lesson-2024 .data .image-wrap img {width:100%}
body.lesson-2024 .data .image-wrap .ox {position:absolute; left:6px; top:6px;}

body.lesson-2024 .data .inner-wrap {width:100%;}
body.lesson-2024 .data a > span {display:block; align-items: center; font-weight:500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
body.lesson-2024 .data a strong.title-ellipsis {width:auto; display: inline-block; max-width:calc(100% - 26px); margin-top:4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle;}
body.lesson-2024 .data a > span[style*="display: none"] + strong.title-ellipsis {max-width:100%; margin-top:0; display: block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; white-space: normal;}
body.lesson-2024 .data a .txt-badge {display:inline-flex; justify-content: center;}

body.lesson-2024 .lesson-data .data a .study-label {font-size:12px; font-weight:500; color:#999; vertical-align: top; }
body.lesson-2024 .lesson-data .data a .study-depth {position:relative; margin-left:5px; padding-left:8px; font-size:12px; font-weight:500; color:#838383;}
body.lesson-2024 .lesson-data .data a .study-depth:before {content:''; width:1px; height:8px; display:block; position:absolute; left:0px; top:50%; transform:translateY(-50%); background-color:#E6E6E6;}

body.lesson-2024 .data a .badges .badge {border-color:rgba(0,0,0,0.15); z-index:0;}
body.lesson-2024 .data.no-link .image-wrap,
body.lesson-2024 .gu-mirror.no-link .inner-wrap .image-wrap {background-image:url(/assets/images/subject/icon-no-image-link-6b0f807022ca937ce68ac8dd959ba92d.svg); background-size:25px 23px;} /* 25 23 */
body.lesson-2024 .data.no-file .image-wrap,
body.lesson-2024 .gu-mirror.no-file .inner-wrap .image-wrap {background-image:url(/assets/images/subject/icon-no-image-file-013c2acea9bcd913f68ebc19a3ee8fc6.svg); background-size:23px 20px;} /* 23 20 */
body.lesson-2024 .data.no-scrap .image-wrap,
body.lesson-2024 .gu-mirror.no-scrap .inner-wrap .image-wrap {background-image:url(/assets/images/subject/icon-no-image-scrap-e8e4a3d686a97560c74ef67ac0948b1c.svg); background-size:25px 25px;} /* 25 25 */
body.lesson-2024 .data.no-image .image-wrap,
body.lesson-2024 .gu-mirror.no-image .inner-wrap .image-wrap {background-image:url(/assets/images/subject/icon-no-image-image-5255eac6674016b9d3f1bd3419506717.svg); background-size:29px 24px;} /* 29 24 */
body.lesson-2024 .data.no-pdf .image-wrap,
body.lesson-2024 .gu-mirror.no-pdf .inner-wrap .image-wrap {background-image:url(/assets/images/subject/icon-no-image-pdf-344d751c28f6746564bb78266cabc25e.svg); background-size:24px 32px;} /* 24 32 */
body.lesson-2024 .data.aiclass .image-wrap,
body.lesson-2024 .gu-mirror.aiclass .inner-wrap .image-wrap {background-image:url(/assets/images/subject/logo-aiclass-logo@2x-90d449cf2334159275f0d9614022e2a5.png); background-size:62px 25px; background-position:25px 24px;} /* 24 32 */

/* 24-12-18 파일 변환중 썸네일 추가 */
body.lesson-2024 .data.no-convert .image-wrap,
body.lesson-2024 .gu-mirror.no-convert .inner-wrap .image-wrap {background-image:url(/assets/images/subject/icon-no-image-convert-cf0852ae97a82bf40f3aa5f1e4de9a47.svg); background-size:20px 20px; background-position-y: 26%; background-color: #aaa; border: 1px solid #aaa; } /* 20 20 */
body.lesson-2024 .data.no-convert .image-wrap:after,
body.lesson-2024 .gu-mirror.no-convert .inner-wrap .image-wrap:after {content: "자료 등록 중"; position: absolute; top: 75%; left: 50%; transform: translate(-50%, -50%); font-size: 13px; font-weight: 600; color: #fff; width: inherit; opacity: 1;}

/* 25-2-11 자료 등록 실패 썸네일 추가 */
body.lesson-2024 .data.no-fail .image-wrap,
body.lesson-2024 .gu-mirror.no-fail .inner-wrap .image-wrap {background-image:url(/assets/images/subject/icon-no-image-fail-dc3de562139c7294bef3304af08bbdc3.svg); background-size:20px 20px; background-position-y: 27%; background-color: #aaa; border: 1px solid #aaa; }
body.lesson-2024 .data.no-fail .image-wrap:after,
body.lesson-2024 .gu-mirror.no-fail .inner-wrap .image-wrap:after {content: "자료 등록 실패"; position: absolute; top: 75%; left: 50%; transform: translate(-50%, -50%); font-size: 13px; font-weight: 600; color: #fff; width: inherit; opacity: 1;}

body.lesson-2024 .data strong {font-size:16px; vertical-align: -3px;}
body.lesson-2024 .data strong span {vertical-align: -3px;}
body.lesson-2024 .data a .number-pages {display:block; margin-top:4px;}
body.lesson-2024 .data a .number-pages .badge {font-size:14px; color:#A4A4A4; padding:0; background-color:transparent; line-height:20px; min-height:auto; display:block; text-overflow: ellipsis; overflow:hidden;}
body.lesson-2024 .data .title-ellipsis {font-size:16px; line-height:24px; }
body.lesson-2024 .data-afterimage,
body.lesson-2024 .no-data {border-radius:4px;}
body.lesson-2024 .image-wrap {border-radius:0px;}
body.lesson-2024 .image-wrap .badge.type-round-box {min-height:20px; padding: 2px 5px 0px; left:4px; top:4px; right:auto; bottom:auto; border-color:rgba(0,0,0,.15); background-color:rgba(0,0,0,0.7)}
body.lesson-2024 .image-wrap .image-wrap-buttons-group {position:absolute; right:4px; top:4px; z-index:10;} /* #120 파일 타입 미노출 수정 */
body.lesson-2024 .image-wrap .image-wrap-buttons-group .badge {position:relative; left:auto; top:auto; right:auto; bottom:auto; background-color:rgba(0,0,0,0.5)}
body.lesson-2024 .image-wrap .image-wrap-buttons-group .badge.type-round-box.btn-doc-edit {width:20px; height:20px; border-radius:4px;}
body.lesson-2024 .image-wrap .image-wrap-buttons-group .badge.type-round-box.btn-doc-edit img {width:12px; height:12px;}

body.lesson-2024 [aria-disabled="true"] {opacity: 0.5;}
body.lesson-2024 .gu-mirror {position: fixed !important; opacity: 80% !important; transform: none !important; display: flex !important; justify-content: space-between!important; align-items: center!important; gap: 20px!important; padding: 15px 20px!important; min-height: 94px!important; border: 1px solid #8CD5D3!important; border-radius: 4px!important; background-color: white!important; color: #838383!important; text-align: left!important; box-shadow: 5px 5px 10px 0px rgba(93, 144, 149, 0.2); z-index:9999;}
body.lesson-2024 .gu-mirror .active-vertical,
body.lesson-2024 .gu-mirror .active-horizontal {position: relative; border-color:#8CD5D3; background-color:#F2FAFA; /*box-shadow: 5px 5px 10px 0px rgba(93, 144, 149, 0.2);*/ box-shadow: none;}
body.lesson-2024 .gu-mirror.active-vertical::before,
body.lesson-2024 .gu-mirror.active-horizontal::before {content: "" !important; position: absolute !important; top: 50% !important; left: 0 !important; width: 30px !important; height: 30px !important; border-radius: 100% !important; background-image: url("/assets/images/common/icon-chevron-up-down-ef721092fa0bdcfd24a0fbf1432d78e9.svg")!important; background-position: center!important; background-repeat: no-repeat!important; background-size: contain!important; box-shadow: 5px 5px 20px 0px rgba(23, 128, 125, 0.2)!important; transform: translate(-50%, -50%)!important;}
body.lesson-2024 .gu-mirror.active-vertical::before {background-image: url("/assets/images/common/icon-chevron-up-down-ef721092fa0bdcfd24a0fbf1432d78e9.svg")!important;}
body.lesson-2024 .gu-mirror.active-horizontal::before {background-image: url("/assets/images/common/icon-chevron-left-right-780b6d6d3f3933e6e94ec5f5585654ae.svg")!important; z-index: 30;}
body.lesson-2024 .gu-mirror .inner-wrap {display: inline-flex; align-items: center; gap: 20px; overflow: hidden; background-color: #fff;}
body.lesson-2024 .gu-mirror .inner-wrap .image-wrap {width:119px; height:64px; position:relative;}
body.lesson-2024 .gu-mirror img {width:100%; height:auto; vertical-align: top; position: relative; left:0;} /* #120 shorts 썸네일 추가 수정 */
body.lesson-2024 .gu-mirror .badges {display: inline-flex; width: fit-content; margin-right: 4px;}
body.lesson-2024 .data.gu-mirror a .badges .badge {margin-bottom:4px;}
body.lesson-2024 .gu-mirror a {display:block; flex-wrap: wrap; align-items: center; gap: 4px 10px; width: 100%; overflow:hidden; text-overflow: ellipsis; white-space: nowrap;}
body.lesson-2024 .gu-mirror a > span[style*="display: none"] + strong.title-ellipsis {width:calc(100% - 20px); max-width:100%; display:block; display: -webkit-box; margin-top:0; -webkit-line-clamp: 2; white-space: normal;}
body.lesson-2024 .gu-transit a span.text-primary,
body.lesson-2024 .gu-mirror a span.text-primary {display:none!important;}
body.lesson-2024 .data strong.study-label {font-size:12px !important; vertical-align: middle}
body.lesson-2024 .data .study-depth {margin-left:5px; padding-left:8px;}
body.lesson-2024 .data i.icon-new {transform:translateY(50px); vertical-align:middle;}
body.lesson-2024 .gu-mirror .title-ellipsis {width:calc(100% - 26px); white-space:nowrap; display:inline-block; line-height: 1.5!important; -webkit-line-clamp:1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;}
body.lesson-2024 .gu-hide{display:none!important}
body.lesson-2024 .gu-unselectable {-webkit-user-select:none!important; -moz-user-select:none!important; -ms-user-select:none!important; user-select:none!important; -webkit-touch-callout: none;}
body.lesson-2024 .gu-transit {opacity: .3!important; box-sizing: border-box!important; border: 1px dashed #e6e6e6!important; background-color: #f6f6f6!important;}
body.lesson-2024 .gu-mirror .buttons{flex-shrink: 0;}
body.lesson-2024 .gu-transit .buttons{display:none!important;}
body.lesson-2024 .group-content.gu-mirror {flex-wrap:wrap; gap:0 20px!important;}
body.lesson-2024 .group-content.gu-mirror .outer-wrap {width:100%;}
body.lesson-2024 .group-content.gu-mirror .data-group-child-area {width:100%;}

body.lesson-2024 .type-filter.both-type {padding:19px 30px 19px 0; gap:0;}
body.lesson-2024 .type-filter.both-type .nav-slider {flex:1;}
body.lesson-2024 .data i.icon-new {font-size: 0; display: inline-block; width: 12px; height: 12px; margin-left: 4px; background: url(/assets/images/title/icon-new2-ab7ef8179c2b775996c7d809b8e2eac8.svg) no-repeat; transform: translateY(2px);}

body.lesson-2024 .nav-slider.type-filter {padding:19px 98px 19px 74px}
body.lesson-2024 .nav-slider.type-filter:not(.swiper-initialized) {padding:20px 30px;}
body.lesson-2024 .nav-slider.type-filter:not(.swiper-initialized):before,
body.lesson-2024 .nav-slider.type-filter:not(.swiper-initialized):after {display:none;}
body.lesson-2024 .nav-slider.type-filter:not(.swiper-initialized) .swiper-button {display:none !important;}
body.lesson-2024 .nav-slider.type-filter .swiper-slide label {padding-top:8px; padding-bottom:6px;}

body.lesson-2024 .buttons.type-rounded.type-primary [type=checkbox] + label,
body.lesson-2024 .buttons.type-rounded.type-primary [type=radio] + label,
body.lesson-2024 .nav-slider.type-filter .swiper-slide [type=checkbox] + label,
body.lesson-2024 .nav-slider.type-filter .swiper-slide [type=radio] + label {border-color:#eee; background-color:#eee;}
body.lesson-2024 .buttons.type-rounded.type-primary [type=checkbox]:checked + label,
body.lesson-2024 .buttons.type-rounded.type-primary [type=radio]:checked + label,
body.lesson-2024 .nav-slider.type-filter .swiper-slide [type=checkbox]:checked + label,
body.lesson-2024 .nav-slider.type-filter .swiper-slide [type=radio]:checked + label {border-color:#666; background-color:#666;}

.buttons.type-rounded.type-primary [type=checkbox]:checked + label,
.buttons.type-rounded.type-primary [type=radio]:checked + label {}

body.lesson-2024 .tab.nav-slider.nav-slider-bottom-line {border-color:rgba(170, 170, 170, 0.99);}
body.lesson-2024 .tab.nav-slider.nav-slider-bottom-line:before {background: linear-gradient(90deg, #fafafa 0%, #fafafa 5%, rgba(255, 255, 255, 0) 100%);}
body.lesson-2024 .tab.nav-slider.nav-slider-bottom-line::before,
body.lesson-2024 .tab.nav-slider.nav-slider-bottom-line::after {width:40px; background:none;}
body.lesson-2024 .tab.nav-slider .swiper-button {background-color:#F6F6F6;}
body.lesson-2024 .tab.nav-slider .swiper-button svg {width:11px; height:11px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14.142' height='14.142' viewBox='0 0 14.142 14.142'%3E%3Cpath id='icon_arrow_black' d='M0,8V0H8' transform='translate(12.728 7.071) rotate(135)' fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/svg%3E%0A") center center no-repeat; background-size:100%;}
body.lesson-2024 .tab.nav-slider .swiper-button svg use {display:none;}
body.lesson-2024 .tab.nav-slider .swiper-button.swiper-button-next {}
body.lesson-2024 .tab.nav-slider .swiper-button.swiper-button-prev svg {transform:rotate(180deg)}

.flex-item-buttons {display:flex; border-bottom: 1px solid #d2d2d2; background-color: #fafafa;}
.flex-item-buttons .nav-slider {flex:1; border:0; background:none;}
.flex-item-buttons .buttons.type01 {padding-right:30px; display:flex; align-items:center; gap:4px; }
.flex-item-buttons .buttons.type01 .tooltip-trigger {display:flex; align-items: center;}

body.lesson-2024 .button.type-icon:disabled {background-color:#F6F6F6; border-color:#D2D2D2; opacity:1;}
body.lesson-2024 .button.type-icon:hover {background-color:#E8F6F6; border-color:#01A39F;}
body.lesson-2024 .sub-lessons .button.type-icon:hover,
body.lesson-2024 .sub-lessons .button.type-icon.active {background-color: #f1f1f1; border-color: #000;}
body.lesson-2024 .button.type-icon:before {content:''; display:block; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); background-repeat:no-repeat; background-position:0 0; background-size:100%;}
body.lesson-2024 .button.type-icon.ico-delete:before {width:12px; height:12px; background-image:url(/assets/images/subject/icon-delete-default-4fd24c852bf74c396d9f2afcf0ccdb54.svg)}
body.lesson-2024 .button.type-icon.ico-delete:hover:before {background-image:url(/assets/images/subject/icon-delete-active-8ed3d6c6c8955bb252c0e84178437be1.svg)}
body.lesson-2024 .button.type-icon.ico-share:before {width:13px; height:13px; background-image:url(/assets/images/subject/icon-share-default-957178f161cda769c5fafe0821385e9e.svg)}
body.lesson-2024 .button.type-icon.ico-share:hover:before {background-image:var(--icon-share)/*background-image:url(/assets/images/subject/icon-share-active-9db166b4991b8f54304b49613e9f8e95.svg)*/}
body.lesson-2024 .button.type-icon.ico-favorite:before {width:14px; height:14px; background-image:url(/assets/images/subject/icon-favorite-default-f8594f9ce48dbd5e68b67245900b36d4.svg)}
body.lesson-2024 .button.type-icon.ico-favorite.active:before,
body.lesson-2024 .button.type-icon.ico-favorite:hover:before {background-image:var(--icon-favorite)/*background-image:url(/assets/images/subject/icon-favorite-active-6b755b27655aca3c52e5773c515f2293.svg)*/}
body.lesson-2024 .button.type-icon.ico-download:before {width:13px; height:13px; background-image:url(/assets/images/subject/icon-download-default-40af54e05c97a2b511a14d3858a8a7df.svg)}
body.lesson-2024 .button.type-icon.ico-download:hover:before {background-image:var(--icon-download)/*background-image:url(/assets/images/subject/icon-download-active-f23665545141d9072e1ede35fb90bf8f.svg)*/}

body.lesson-2024 .button.type-icon.ico-list-edit {}
body.lesson-2024 .button.type-icon.ico-list-edit.full-size {position:static; align-self: center;}
body.lesson-2024 .button.type-icon.ico-list-edit.full-size:before {width:13px; height:13px; top:40px; left:auto; right:27px; transform:none; background-image:url(/assets/images/subject/icon-study-edit-3e61a4d69698a7775ba76b5f3c2b778c.svg)}
body.lesson-2024 .button.type-icon.ico-list-edit.full-size:after {content:''; width:100%; height:96px; display:block; position:absolute; left:0; top:0; z-index:10;}
body.lesson-2024 .button.type-icon.ico-list-edit.full-size.active {background-color:#E8F6F6; border-color:#01A39F;}

body.lesson-2024 .buttons .full-size-ox input[type="checkbox"] {position:absolute; left:-9999px;}
body.lesson-2024 .buttons input[type="checkbox"] {position:absolute; left:-9999px;}
body.lesson-2024 .buttons input[type="checkbox"] + .button.type-icon.ico-list-checkbox.full-size {width:28px; height:28px; position:static; align-self: center; background: url(/assets/images/common/icon-check-c22df2571082e83ea6871c7668b1a310.svg) #fff center center no-repeat; border-radius:50%; border: 1px solid #d2d2d2; background-color: white;}
body.lesson-2024 .buttons input[type="checkbox"]:checked + .button.type-icon.ico-list-checkbox.full-size {background-color:#02a39f; border-color:#02a39f;}
body.lesson-2024 .buttons input[type="checkbox"] + .button.type-icon.ico-list-checkbox.full-size:after {content:''; width:100%; height:96px; display:block; position:absolute; left:0; top:0; z-index:10; cursor:pointer;}
body.lesson-2024 .buttons input[type="checkbox"] + .button.type-icon.ico-list-checkbox.full-size.active {background-color:#E8F6F6; border-color:#01A39F;}

body.lesson-2024 .data-group-child-area .button.type-icon.ico-list-edit.full-size:after,
body.lesson-2024 .data-group-child-area .buttons input[type="checkbox"] + .button.type-icon.ico-list-checkbox.full-size:after {height:64px;}
body.lesson-2024 .data-group-child-area .button.type-icon.ico-list-edit:before {position:static;}

body.lesson-2024 .webui-popover {z-index:1001;}
body.lesson-2024 .webui-popover-inner {margin:16px;}
body.lesson-2024 h3.webui-popover-title {margin:0 0 8px; font-size:16px; color:#000; line-height:24px; font-weight:500;}
body.lesson-2024 .webui-popover .webui-popover-content {margin:0;}
body.lesson-2024 .webui-popover .webui-popover-content .popover-my-data {width:max-content}
body.lesson-2024 .webui-popover .webui-popover-content .ul-dot {}
body.lesson-2024 .webui-popover .webui-popover-content .ul-dot > li {padding-left:16px; color:#838383; line-height:20px;}
body.lesson-2024 .webui-popover .webui-popover-content .ul-dot > li::before {top:8px;}
body.lesson-2024 .webui-popover .webui-popover-content .ul-dot > li.no-dot {color:#BBBBBB;}
body.lesson-2024 .webui-popover .webui-popover-content .ul-dot > li.no-dot:before {display:none;}

body.lesson-2024 .buttons.type-rounded label {border-radius:18px; }

.txt-hidden {font-size:0; width:0; height:0; position:absolute; left:-9999px;}

body.lesson-2024 .button.size-md.type01 {min-width:76px;}
body.lesson-2024 .icon-button.c-black {color:#000;}

.txt-badge {min-width:53px; height:18px; margin-left:4px; line-height:18px; text-align:center; border-radius:10px; background-color:#F4F4F4; font-size:10px; font-weight:500; color:#A4A4A4;}
.txt-badge.blue-box {border:1px solid #3577BD; background-color:#fff; color:#3577BD;}

.lesson-head-toggle-btn {position:relative; margin-left:12px;}
.lesson-head-toggle-btn input[type="checkbox"] {display:none;}
.lesson-head-toggle-btn input[type="checkbox"] + .lesson-head-toggle .toggle-txt.default {position:relative; z-index:1;}
.lesson-head-toggle-btn input[type="checkbox"]:checked + .lesson-head-toggle .toggle-txt {position:relative; z-index:1;}
.lesson-head-toggle-btn input[type="checkbox"] + .lesson-head-toggle {width:121px; height:30px; position:relative; display:inline-flex; align-items: center; justify-content: space-around; box-shadow: inset 0px 3px 6px #D15B5B19; border: 2px solid #FFFFFF; border-radius: 18px; cursor:pointer;}
.lesson-head-toggle-btn input[type="checkbox"] + .lesson-head-toggle .toggle-txt {font-size:15px; font-weight:700; transition: color ease-in-out .3s;}
.lesson-head-toggle-btn input[type="checkbox"] + .lesson-head-toggle .toggle-txt.default {color:#E36F82; transition: color ease-in-out .3s;}
.lesson-head-toggle-btn input[type="checkbox"] + .lesson-head-toggle:before {content:''; width:68px; height:calc(100% + 4px); display:block; position:absolute; left:-2px; top:-2px; background-color:#fff; box-shadow: 0px 3px 3px #00000029; border-radius:18px; transition:left ease-in-out .3s;}
.lesson-head-toggle-btn input[type="checkbox"]:checked + .lesson-head-toggle:before {left:calc(100% / 2 - 4px); transition:left ease-in-out .3s;}
.lesson-head-toggle-btn input[type="checkbox"]:checked + .lesson-head-toggle .toggle-txt {color:#E36F82; transition: color ease-in-out .3s;}
.lesson-head-toggle-btn input[type="checkbox"]:checked + .lesson-head-toggle .toggle-txt.default {color:#fff; transition: color ease-in-out .3s;}

.data.group-content {display:block;}
.data.group-content .outer-wrap {display:flex; align-items:center; gap:20px;}
.data.group-content .outer-wrap:before,
.data.group-content .outer-wrap:after {content:''; height:3px; display:block; position:absolute; border-radius:4px; background-color:#eee; border-width:0 1px 1px 1px; border-style:solid; border-color:#ddd;}
.data.group-content .outer-wrap:before {width:calc(100% - 8px); left:4px; bottom:-4px;}
.data.group-content .outer-wrap:after {width:calc(100% - 16px); left:8px; bottom:-7px;}
.data.group-content .outer-wrap .inner-wrap {flex:1;}
.data.group-content .data-group-child-area {display:none; margin-top:16px; padding:16px 0 0 0; border-top: 1px dashed #8CD5D3;}
.data.group-content .data-group-child-area .child-list {display:flex; flex-direction: column; gap:10px;}
.data.group-content .data-group-child-area .child-list > .child-list-item {position:relative; white-space: normal; display:flex; gap:10px;}
.data.group-content .data-group-child-area .child-list > .child-list-item.disabled {opacity:0.2}
.data.group-content .data-group-child-area .child-list > .child-list-item.disabled:before {content:''; width:100%; height:100%; display:block; position:absolute; left:0; top:0; z-index:15;}
.data.group-content .data-group-child-area .child-list > .child-list-item.disabled button {pointer-events: none;}
.data.group-content .data-group-child-area .child-list > .child-list-item a {width:auto; display:inline-block; font-weight:500; color:#838383; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;}
.data.group-content .data-group-child-area .child-list > .child-list-item a + .child-btns {display:inline-block;}
.data.group-content .data-group-child-area .child-list > .child-list-item.active a {color:#02A39F;}
.data.group-content .data-group-child-area .child-list > .child-list-item .buttons {height:28px; align-self:center;}
/*.data.group-content .data-group-child-area .child-list > .child-list-item:before {content:''; width:5px; height:5px; display:block; position:absolute; left:5px; top:50%; transform:translateY(-50%); background:url(/assets/images/subject/icon-group-child-312567776a2d8babf6002f5ba83795e4.svg) 0 0 no-repeat;}*/
.data.group-content .group-content-slide-btn {width:40px; height:22px; box-shadow: 0px 2px 2px #00000010; border: 1px solid #DDDDDD; border-radius: 18px; position:absolute; left:50%; bottom:-11px; transform:translateX(-50%); background-color:#fff; z-index:10;}
.data.group-content .group-content-slide-btn:before {content: ''; border-width: 0 1px 1px 0; border-style: solid; border-color: #4B4B4B; padding: 3px; display: inline-block; position: absolute; left: 50%; top:5px; transform: translateX(-50%) rotate(45deg);}
.data.group-content.active .group-content-slide-btn:before,
.data.group-content .group-content-slide-btn.on:before {top:8px; transform:translateX(-50%) rotate(225deg)}

body.lesson-2024 .data.group-content.disabled {overflow:visible}
body.lesson-2024 .data.group-content.disabled .group-content-slide-btn {pointer-events: none; z-index:11; overflow:hidden;}
body.lesson-2024 .data.group-content.disabled .group-content-slide-btn:after {content: ''; width: 100%; height: 100%; display: block; position: absolute; left: 0; top: 0; background-color: rgba(246, 246, 246, .5);}

.scrollable-container.has-bottom-toast-pop {overflow:hidden;}
.buttom-toast-area {width:100%; height:70px; padding:0 20px; display:flex; align-items: center; justify-content: space-between; position:absolute; left:0; bottom:0; transform:translateY(100%); background-color:rgba(240,241,241,0.9); border:1px solid #E3E3E3; z-index:20; transition:transform ease-in-out .3s;}
.buttom-toast-area.active {transform:translateY(0); transition:transform ease-in-out .3s;}
.buttom-toast-area .toast-msg {font-size:16px; color:#000; font-weight:700;}
.buttom-toast-area .toast-msg span {color:#02A39F;}
.buttom-toast-area .toast-msg.aiclass .logo-aiclass {width:64px; transform:translateY(10px)} /* #수정 2025-02-10 추가 됨 */
.buttom-toast-area .toast-buttons {display:flex; gap:4px;}
.buttom-toast-area .toast-buttons .toast-button {width:100px; height:46px; border-radius:4px; border:1px solid #D2D2D2; color:#626262; font-weight:500;}
/*.buttom-toast-area .toast-buttons .toast-button {width:100px; height:46px; border-radius:4px; border:1px solid #D2D2D2; font-size: 17px; color:#000; font-weight:600; background: #fff;} 24-11-15 , 24-12-18 상위 속성 수정 보류 */
.buttom-toast-area .toast-buttons .toast-button.toast-confirm {background-color:#01A39F; border-color:#0000001A; color:#fff;}
.buttom-toast-area .toast-buttons .toast-button.toast-confirm:disabled {background-color:#E6E6E6; color:#A4A4A4;}
.buttom-toast-area .toast-buttons .toast-button.toast-confirm:hover:not(:disabled) {background-color:#015C61;}
.toast-edit-revert {width: 259px; height: 44px; position: absolute; left: 50%; bottom: -100px; display: flex; align-items: center; justify-content: center; gap: 8px; border-radius: 4px; background-color: rgba(0, 0, 0, 0.8); transform: translateX(-50%); font-weight: 500; color: #fff; opacity:0; transition:opacity ease-in-out .3s; z-index:12;}
.toast-edit-revert.active {opacity:1; bottom: 86px; transition:opacity ease-in-out .3s;}
.toast-edit-revert i {height:16px; display:block;}
.toast-edit-revert i img {vertical-align: top;}

body.lesson-2024 .breadcrumbs.type-period li {font-size:15px;}
body.lesson-2024 .breadcrumbs.type-period li a {pointer-events:none;}
body.lesson-2024 .lesson-data {gap:16px;}
body.lesson-2024 .sub-lessons .lesson-data {gap:10px;}
body.lesson-2024 .sub-lessons .lesson-data .data {border-color:transparent;}
body.lesson-2024 .sub-lessons .lesson-data .data:hover {border-color:#C4C4C4; background-color:#FAFAFA }
body.lesson-2024 .badge-lesson {background: none; color: #02A39F; padding: 0; width: auto; height: auto; left: 0; top: 37px; font-size: 13px; font-weight: 700; word-break: keep-all;}
body.lesson-2024 .badge-lesson.txt-br {top:29px;}
body.lesson-2024 .badge-lesson.txt-3 {width: 40px; min-width: 40px; left: -10px; top: 36px;}
body.lesson-2024 .badge-lesson.line-br {top:27px; min-width:26px; width:26px; display:block;}
body.lesson-2024 .badge-lesson.line-br-3txt {min-width: 35px; width: 35px; left: -10px; top: 30px;}
body.lesson-2024 .badge-lesson.line-br2-3txt {min-width: 35px; width: 35px; left: -10px; top: 21px;}
body.lesson-2024 .lesson-items.potiion-relative {position:relative;}
body.lesson-2024 .lesson-items.scrollable:before {content:''; width:2px; height:100%; display:block; position:absolute; left:64px; top:135px; background-color:#b7e2e1;}
body.lesson-2024 .lesson-items .item {padding-left:60px;}
body.lesson-2024 .lesson-items .item:first-child:not(.item-style1):after {top:40px}
body.lesson-2024 .lesson-items .item.item-style1 {padding-bottom:16px;}
body.lesson-2024 .lesson-items .item.item-style1:last-child {padding-bottom:0;}
body.lesson-2024 .lesson-items .item.item-style1:before {top:27px; border-color:#d2d2d2;}
body.lesson-2024 .lesson-items .item.item-style1:after {top:37px; background-color:#d2d2d2;}
body.lesson-2024 .lesson-items .item.item-style1 .badge-lesson.txt-br {top:16px; color:#bfbfbf; min-width:26px; width:26px; display:block;}
body.lesson-2024 .lesson-items .item.item-style1 .lesson-data.no-draggable {pointer-events: none;}
body.lesson-2024 .lesson-items .item.item-style1:hover .lesson-data.no-draggable {pointer-events:inherit;}
body.lesson-2024 .lesson-items .item.item-style1 .lesson-data .data {min-height:auto; padding:0; background-color:#FAFAFA; border:1px solid #E6E6E6;}
body.lesson-2024 .lesson-items .item.item-style1 .lesson-data .data:hover {}
body.lesson-2024 .lesson-items .item.item-style1 .lesson-data .data .inner-wrap {flex:1;}
body.lesson-2024 .lesson-items .item.item-style1 .lesson-data .data .inner-wrap a {display:block; padding:15px 20px;}
body.lesson-2024 .lesson-items .item.item-style1 .lesson-data .data .inner-wrap a strong {color:#626262;}
body.lesson-2024 .lesson-items .item:before {left:30px;}
body.lesson-2024 .lesson-items .item:after {height:calc(100% - 10px); left:34px; top:8px; border-color:#02A39F; background-color:#b7e2e1;}
body.lesson-2024 .lesson-items.active-modify .item:last-child {padding-bottom:120px;}
/* body.lesson-2024 .lesson-items .item:last-child:after {display:none;} */
/* last-child 보더 삭제
body.lesson-2024 .lesson-items .item:last-child .badge-lesson:after {content: ''; width: 2px; height: calc(14vh); display: block; position: absolute; left: 33px; top:20px; background-color: #fff; z-index: 1;}
*/

.lesson-float-buttons {gap:4px; position:absolute; right:20px; bottom:20px; z-index:20; display:none}
.lesson-float-buttons.active {display:flex;}
.lesson-float-buttons .float-btn {width:180px; height:60px; display:flex; justify-content: center; align-items: center; gap:6px; box-shadow: 0px 3px 6px #00000029; border: 1px solid #D2D2D2; border-radius: 60px; background-color:#fff; font-size: 18px; font-weight:500;}
.lesson-float-buttons .float-btn.float-confirm {border-color:#0000001A; background: transparent linear-gradient(180deg, #29E6E1 0%, #00B5B1 100%) 0% 0% no-repeat padding-box; background-blend-mode: normal; color:#fff; text-shadow: 0px 0px 7px rgba(0, 150, 147, 1);}
.lesson-float-buttons .float-btn.float-confirm .lessong-btn-icon {width:26px; height:26px; display:block; background:url(/assets/images/subject/icon-float-btn-d7259862b5b5d85c70f065a2d8844742.svg) center center no-repeat;}

.data-upload-category {}
.data-upload-category-parent {margin-top:8px;}
.data-upload-category-parent .data-upload-category-child {display:none}
.data-upload-category-parent .data-upload-category-child.active {display:block;}
.data-upload-category-parent .data-upload-category-child .file-upload {margin-bottom:16px;}
.data-upload-category-parent .data-infor-txt {display:flex; flex-direction: column; gap:4px;}
.data-upload-category-parent .data-infor-txt li {padding-left:10px; position:relative;}
.data-upload-category-parent .data-infor-txt li:before {content:''; width:4px; height:4px; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%); background-color:#838383; border-radius:50%;}
.data-upload-category-parent .data-infor-txt.no-bullet li {padding-left:0;}
.data-upload-category-parent .data-infor-txt.no-bullet li.no-bullet:before {display:none;}

body.lesson-2024 .accordion .active .action {background-color: var(--color-primary-150);}

body.lesson-2024 .edu-information-section {padding:10px;}
body.lesson-2024 .edu-information-section .badge {padding:0; margin-top:4px; background-color:transparent; font-size:14px; color:#A4A4A4; font-weight:400;}
body.lesson-2024 .edu-information-section .button.size-xl {min-height:46px; font-size:14px;}
body.lesson-2024 .edu-information-section .section .text-xs strong {font-size:14px;}
body.lesson-2024 .dropdown-select .options span span {font-size:12px; color:#A4A4A4;}

body.lesson-2024 .float-bottom-buttons {width:80px; position:absolute; right:20px; bottom:20px; z-index:15}
body.lesson-2024 .float-bottom-buttons .float-button {width:80px; height:80px; padding:15px 0 10px; gap:8px 0; right:0px; bottom:0px; background: transparent linear-gradient(180deg, #29E6E1 0%, #00B5B1 100%) 0% 0% no-repeat padding-box; box-shadow: 0px 4px 8px #00000033; font-size:11px; line-height:12px; z-index:1;}
body.lesson-2024 .float-bottom-buttons.active .float-button {background:#7e7e7e;}
body.lesson-2024 .float-bottom-buttons .float-button .ico-line {width:16px; height:16px; display:block; background:var(--float-btn-arrow) center center no-repeat; background-size:100%; transition:transform ease-in-out .3s}
body.lesson-2024 .float-bottom-buttons.active .float-button .ico-line {transform:rotate(180deg); transition:transform ease-in-out .3s}
/* body.lesson-2024 .float-bottom-buttons .float-button .ico-line {width:26px; height:26px; display:block; position:relative;}
body.lesson-2024 .float-bottom-buttons .float-button .ico-line:after,
body.lesson-2024 .float-bottom-buttons .float-button .ico-line:before {content:''; width:3px; height:20px; display:block; position:absolute; left:50%; margin-left:-1px; background-color:#fff; border-radius:3px; transition:transform ease-in-out .3s}
body.lesson-2024 .float-bottom-buttons .float-button .ico-line:after {}
body.lesson-2024 .float-bottom-buttons .float-button .ico-line:before {transform:rotate(90deg)}
body.lesson-2024 .float-bottom-buttons.active .float-button .ico-line:after,
body.lesson-2024 .float-bottom-buttons.active .float-button .ico-line:before {transition:transform ease-in-out .3s}
body.lesson-2024 .float-bottom-buttons.active .float-button .ico-line:after {transform:rotate(45deg)}
body.lesson-2024 .float-bottom-buttons.active .float-button .ico-line:before {transform:rotate(135deg)} */
body.lesson-2024 .float-bottom-buttons .float-txt {font-size:12px; font-weight:500; color:#fff; line-height:14px;}
body.lesson-2024 .float-bottom-buttons .float-button-menu {width:56px; height:56px; position:absolute; left:50%; bottom:20px; background: transparent linear-gradient(135deg, #36BAC1 0%, #02A39F 100%) 0% 0% no-repeat padding-box; box-shadow: 5px 5px 15px #17807D33; border: 1px solid #0000000A; border-radius: 40px; transform:translateX(-50%); background-position:center center; background-repeat:no-repeat;}
body.lesson-2024 .float-bottom-buttons .float-button-menu .float-txt {width: max-content; opacity:0; visibility: hidden; padding:6px 7px; color:#fff; position: absolute; right: 64px; bottom: 14px; background: #000000 0% 0% no-repeat padding-box; border-radius: 4px; transition:all ease-out .3s; font-size:14px;}
body.lesson-2024 .float-bottom-buttons .float-button-menu:hover .float-txt {opacity: 0.65; visibility: visible; transition:all ease-in .3s;}
body.lesson-2024 .float-bottom-buttons .float-button-menu:before {content:''; display:block; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); background-repeat:no-repeat; background-position:center center; background-size:100%;}
body.lesson-2024 .float-bottom-buttons .float-button-menu.menu-1 {bottom:0px; opacity:0; transition:all ease-in-out .3s;}
body.lesson-2024 .float-bottom-buttons .float-button-menu.menu-2 {bottom:0px; opacity:0; transition:all ease-in-out .3s;}
body.lesson-2024 .float-bottom-buttons .float-button-menu.menu-1:before {width:17px; height:15px; background-image:var(--logo-make-x-white)}
body.lesson-2024 .float-bottom-buttons .float-button-menu.menu-2:before {width:19px; height:17px; background-image:url(/assets/images/subject/icon-upload-folder-arrow-up-5caef1d26080b4274dd8a5cb5ec5e5aa.svg)}
body.lesson-2024 .float-bottom-buttons.active .float-button-menu.menu-1 {bottom:92px; opacity:1; transition:all ease-in-out .3s;}
body.lesson-2024 .float-bottom-buttons.active .float-button-menu.menu-2 {bottom:158px; opacity:1; transition:all ease-in-out .3s;}

.max-width-1500 {display:none;}
.icon-size-20 {width: 20px; height: 20px; vertical-align: top;}

body.lesson-2024 .other-lesson .item a::after {display:none;}

.drag-handle {width:150px; height:100%; display:block; position:absolute; left:0; top:0; z-index:1;}
.drag-handle:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  box-shadow: 5px 5px 20px 0px rgba(23, 128, 125, 0.2);
  transform: translate(-50%, -50%);
}
.lesson-items .lesson-data .drag-handle:before {background-image: url("/assets/images/common/icon-chevron-up-down-ef721092fa0bdcfd24a0fbf1432d78e9.svg");}
.sub-lessons .lesson-data .drag-handle:before {background-image:var(--drag-horizontal);}
/* .sub-lessons .lesson-data .drag-handle:before {background-image: url("/assets/images/common/icon-chevron-left-right-780b6d6d3f3933e6e94ec5f5585654ae.svg");} */

.lesson-data .data > .drag-handle {height:94px;}
.child-list .drag-handle:before {width:20px; height:20px;}

.popup.open-alert .popup-container {width:332px; text-align:center; border-radius:12px;}
.popup.open-alert .popup-container .body {padding:34px 0 24px; overflow:hidden;}
.popup.open-alert .popup-container .body .open-alert-image img {vertical-align: top;}
.popup.open-alert .popup-container .body .open-alert-txt1 {font-size:18px; font-weight:700; color:#000;}
.popup.open-alert .popup-container .body .open-alert-txt1 strong {color:#144D80}
.popup.open-alert .popup-container .body .open-alert-txt2 {margin-top:16px; font-size:15px; color:#000;}
.popup.open-alert .popup-container .body .btn-open-alert {width:140px; height:40px; margin-top:24px; border-radius:4px; border:1px solid #0000001A; background-color:#1E51A1; font-size:14px; font-weight:500; color:#fff;}

body.lesson-2024 .period-guide-layer {height:calc(var(--vh, 1vh) * 100);}
body.lesson-2024 .period-guide-layer .period-guide {width:100%; height:100%; background:unset;}
body.lesson-2024 .period-guide-layer .period-guide img {width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit: contain;}
body.lesson-2024 .period-guide-layer .guide-content {background:unset;}
body.lesson-2024 .period-guide-layer .guide-content .helper {display:none;}
body.lesson-2024 .period-guide-layer .guide-content .close-button {z-index:1;}

.subject-msg-layer {height:40px; padding:0 20px; display:none; position:absolute; left:50%; transform:translateX(-50%); align-items: center; justify-content: space-between; background: transparent linear-gradient(274deg, #4684D9 0%, #1FAFAB 100%) 0% 0% no-repeat padding-box; box-shadow: 0px 3px 6px #00000029; border-radius: 22px;}
.subject-msg-layer.active {display:flex;}
.subject-msg-layer .icon-monitor {width:15px; height:15px; margin-right:8px; display:block; background:url(/assets/images/subject/icon-monitor-831d2d83e0370e1ee8a60eb800c4239c.svg) 0 0 no-repeat; background-size:100%;}
.subject-msg-layer .subject-msg-txt {width: max-content; margin-right:20px; font-size:15px; font-weight:500; color:#fff; line-height:21px;}
.subject-msg-layer .btn-subject-msg-close {width:12px; height:12px; background:url(/assets/images/subject/icon-popmsg-close-05ef1c348d3dc63f7af8bb37abe9c025.svg) 0 0 no-repeat; background-size:100%;}

body.lesson-2024 .other-lesson .item strong,
body.lesson-2024 .other-lesson .sub-item strong {display:none}
body.lesson-2024 .other-lesson .item strong,
body.lesson-2024 .other-lesson .sub-item strong,
body.lesson-2024 .other-lesson .item-wrap::before {height:5px; z-index:1;}
body.lesson-2024 .other-lesson .item strong,
body.lesson-2024 .other-lesson .sub-item strong,
body.lesson-2024 .other-lesson .item a,
body.lesson-2024 .other-lesson .sub-item a{font-size:16px;}
body.lesson-2024 .other-lesson .item .depth-2, .other-lesson .sub-item .depth-2 {padding:25px 0 20px;}

.type-filter.nav-slider .swiper-wrapper {padding-right:20px;}
.makex-dimd .popup.open-alert .popup-container .body {padding:36px 0;}
body.is-matrix .lesson-header {background-color:#5a77e1;}
body.is-matrix .period-contents section {border-color:#5a77e1;}

.line-box-content {height:36px; display:flex; align-items: center; justify-content: center; gap:0 8px; background-color:#eee;}
.line-box-content .line-box-content-icon {width:20px;}
.line-box-content .line-box-content-text {font-size:14px; color:#000;}
.line-box-content .btn-data-check {height:24px; padding:0 10px; line-height:24px; display:flex; gap:0 8px; font-size:12px; color:#000; border-radius:13px; border:1px solid #000; background-color:#fff;}
.line-box-content .btn-data-check img {width:10px;}

/* #77 25-09-03 문의하기버튼 추가 시작 */
.btn-inquiry i.ico-inquiry {width:16px; height:14px; background-image:url(/assets/images/common/icon-inquiry-e6e91f739b1c365759f7f7d532dad8f5.svg); position: relative; top: 1px;}
/* #77 25-09-03 문의하기버튼 추가 끝 */

@media (max-width:1500px) {
  .max-width-1500 {display:block;}
}

@media (max-width:1320px) {
  /* body.lesson-2024 .period-guide-layer .period-guide-layer {min-width:1320px; width:1320px; position:absolute; left:0;}
  body.lesson-2024 .period-guide-layer .period-guide {width:1320px;}
  body.lesson-2024 .period-guide-layer .guide-content {background-image:url(/assets/images/subject/img-period-guide-1320.png)}
  body.lesson-2024 .period-guide-layer.high-class .guide-content {background-image:url(/assets/images/subject/img-high-period-guide-1320.png)} */
}

/* #73 25-10-10 주제창 tip영역 추가 시작 */
.btn-tip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #2f6ed3;
  overflow: hidden;
}
.btn-tip:hover {
  font-weight: 500;
}
/*  25-10-28 마우스오버시 롤링 멈춤 시작 *!*/
.btn-tip:hover .tip-text {
  animation-play-state: paused;
}
/*  25-10-28 마우스오버시 롤링 멈춤 끝 */
.btn-tip i.ico-tip {
  width: 16px;
  height: 17px;
  background-image: url(/assets/images/common/icon-tip-abae720d25bc0d60a1ae42e9cfb421cc.svg);
  background-repeat: no-repeat;
  position: relative;
  top: -1px;
}
.icon-tip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  color: #fff;
  font-weight: 500;
  background-color: #2f6ed3;
  height: 25px;
  padding: 0 6px;
  border-radius: 4px;
}
.tip-wrap {
  position: relative;
  width: 260px;
  height: 1.5em;
}
.tip-text {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  width: 100%;
  white-space: nowrap;
  transform: translateY(10px); /* 아래에서 시작 */
  transition: opacity 0.8s ease-in-out, transform 0.8s ease-in-out;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* #73 25-10-10 주제창 tip영역 추가 끝 */


/* #73 25-11-12 갤러리타입 추가 시작 */
body.lesson-2024 .sub-lessons.type-gallery .split-container,
body.lesson-2024 .sub-lessons.type-list .split-container {
  margin-bottom: 20px;
  align-items: center;
}
body.lesson-2024 .sub-lessons.type-gallery .split-container h4,
body.lesson-2024 .sub-lessons.type-list .split-container h4 {
  margin-bottom: 0;
}
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.sort:hover,
body.lesson-2024 .sub-lessons.type-list .button.type-icon.sort:hover {
  background-color: #f6f6f6;
  border: 1px solid #d2d2d2;
}
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.sort.active,
body.lesson-2024 .sub-lessons.type-list .button.type-icon.sort.active {
  background-color: #02a39f;
  border-color: #02a39f;
}
body.lesson-2024 .sub-lessons.type-list .data .image-wrap .buttons {
  display: none;
}
body.lesson-2024 .sub-lessons.type-gallery .lesson-data {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px;
}
body.lesson-2024 .sub-lessons.type-gallery .lesson-data .data {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 0 0 calc((100% - 30px) / 4); /* 간격을 고려하여 너비 설정 */
  min-width: 0;
  box-sizing: border-box;
  text-align: left;
  /* background-color: #f0f0f0;
  border: 1px solid #ccc; */
  /* border: 1px solid blue; */
}
body.lesson-2024 .sub-lessons.type-gallery .lesson-data .data .inner-wrap ~ .buttons {
  display: none;
}
body.lesson-2024 .sub-lessons.type-gallery .lesson-data .data .image-wrap:after {
  display: none;
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 10;
}
body.lesson-2024 .sub-lessons.type-gallery .lesson-data .data .inner-wrap .image-wrap > .buttons {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 20;
}
body.lesson-2024 .sub-lessons.type-gallery .lesson-data .data:hover .image-wrap:after {
  display: block;
}
body.lesson-2024 .sub-lessons.type-gallery .lesson-data .data:hover .inner-wrap .image-wrap > .buttons {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
body.lesson-2024 .sub-lessons.type-gallery .lesson-data .data .inner-wrap {
  flex-direction: column;
}
body.lesson-2024 .sub-lessons.type-gallery .lesson-data .data .inner-wrap .desc,
body.lesson-2024 .child-list-item.gu-mirror.mirror-gallery .lesson-data .data .inner-wrap .desc {
  margin-top: 8px;
}
.sub-lessons.type-gallery .lesson-data .data a,
.sub-lessons.type-gallery .lesson-data .data a .number-pages {
  display: block;
  overflow: auto;
  text-overflow: initial;
  white-space: initial;
}
body.lesson-2024 .sub-lessons.type-gallery.type-gallery .lesson-data .data {
  padding: 8px;
}
.type-gallery .lesson-data .data > .drag-handle {
  height: 100%;
}
.type-gallery .drag-handle {
  /* width: 100%; */
  width: 20%; /* 수정(이미지 영역을 덮어서 제목 클릭(미리보기 실행)이 안됨 */
}
.type-gallery .lesson-data .data .image-wrap {
  /*min-height: initial;*/
  max-height: initial;
  /*min-width: initial;*/
  width: 100%;
  height: auto;
  aspect-ratio: 119 / 64;
  position: relative;
}
body.lesson-2024 .type-gallery .data.no-convert .image-wrap:before {
  content: "자료 등록 중";
  position: absolute;
  top: 75%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  width: inherit;
  opacity: 1;
}
body.lesson-2024 .type-gallery .data.no-fail .image-wrap:before {
  content: "자료 등록 실패";
  position: absolute;
  top: 75%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  width: inherit;
  opacity: 1;
}
body.lesson-2024 .gu-mirror.mirror-gallery {
  justify-content: space-between !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 20px !important;
  padding: 8px !important;
  min-height: 94px !important;
  border: 1px solid #8cd5d3 !important;
  border-radius: 4px !important;
  background-color: white !important;
  color: #838383 !important;
  text-align: left !important;
  box-shadow: 5px 5px 10px 0px rgba(93, 144, 149, 0.2);
  z-index: 20;
}
body.lesson-2024 .gu-mirror.mirror-gallery .inner-wrap {
  display: flex;
  flex-direction: column;
}
body.lesson-2024 .gu-mirror.mirror-gallery .data {
  padding: 0;
  border: none;
}
body.lesson-2024 .gu-mirror.mirror-gallery .data:hover {
  background-color: #fff;
  cursor: pointer;
}
body.lesson-2024 .gu-mirror.mirror-gallery .data a strong {
  color: #838383;
}
body.lesson-2024 .gu-mirror.mirror-gallery img {
  position: initial;
}
body.lesson-2024 .gu-mirror.mirror-gallery .inner-wrap .image-wrap {
  min-height: initial;
  max-height: initial;
  min-width: initial;
  width: 100%;
  height: auto;
  aspect-ratio: 119 / 64;
  position: relative;
}
body.lesson-2024 .gu-mirror.mirror-gallery .buttons {
  display: none;
}
.sub-lessons.type-gallery .data.active-horizontal:before {
  background-image: url(/assets/images/common/icon-chevron-left-right-780b6d6d3f3933e6e94ec5f5585654ae.svg);
  margin-left: 0px;
  z-index: 1;
}
.sub-lessons.type-gallery .data.active-horizontal:before,
.sub-lessons.type-gallery .data.active-vertical:before,
.gu-mirror .data.active-horizontal:before,
.gu-mirror .data.active-vertical:before {
  z-index: 1;
}
.gu-mirror.mirror-gallery .data.active-horizontal:before {
  margin-left: -8px;
}
body.lesson-2024 .sub-lessons.type-gallery .data .button.type-icon,
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon:hover,
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.active {
  background: transparent;
  border: 0;
}
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.ico-download:before,
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.ico-favorite:before,
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.ico-share:before,
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.ico-delete:before {
  width: 20px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0.7;
  transition: transform 0.5s ease-in-out;
}
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.ico-download:before {
  background-image: url(/assets/images/subject/icon-download-white-fe1644e5ffe92b1248662baa3e2754f0.svg);
}
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.ico-favorite:before {
  background-image: url(/assets/images/subject/icon-pin-white-a45d6442066addfad04b930d5b695a6a.svg);
}
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.ico-favorite.active:before {
  background-image: url(/assets/images/subject/icon-pin-active-142768670c595751e6ea4ff076926da1.svg);
}
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.ico-share:before {
  background-image: url(/assets/images/subject/icon-share-white-eda94cf03e9469a89f5418786c398cd6.svg);
}
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.ico-delete:before {
  background-image: url(/assets/images/subject/icon-delete-white-663272a6a8b404a4aa96276c4e322086.svg);
}
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon:hover.ico-download:before,
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon:hover.ico-favorite:before,
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon.active.ico-favorite:before,
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon:hover.ico-share:before,
body.lesson-2024 .sub-lessons.type-gallery .button.type-icon:hover.ico-delete:before {
  opacity: 1;
}
body.lesson-2024 .sub-lessons .data strong span.time {
  vertical-align: 0;
  color: #999;
  padding-left: 2px;
  font-size: 14px;
}
.sub-lessons.type-gallery a:hover:after {  /* #120 strong -> a 위치 변경 */
  display: none;
}
.sub-lessons.type-gallery a.tooltip:hover:after {   /* #120 strong -> a 위치 변경 */
  display: inline-block; /* #120 변경 */
}
.sub-lessons.type-gallery a:hover:after {  /* #120 strong -> a 위치 변경 */
  content: attr(data-tooltip);
  position: absolute;
  left: 0;
  top: 80%;
  margin-top: 8px;
  width: 100%;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  font-size: 12px;
  line-height: 1.4;
  padding: 6px 10px;
  border-radius: 6px;
  white-space: pre-line; /* 수정 줄바꿈 처리 */
  z-index: 20; /* 10->20 수정(전체공개 뱃지가 위로 노출됨) */
}
body.lesson-2024 .gu-mirror.mirror-gallery a strong:hover:after {
  display: none;
}
.sub-lessons.type-gallery a strong,
.mirror-gallery a strong {
  white-space: normal;
  display: block;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sub-lessons.type-list a strong {
  width: auto;
  display: inline-block;
  max-width: calc(100% - 26px);
  margin-top: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
.sub-lessons.type-gallery .image-wrap img {
  height: initial;
}
.lesson-header {
  height: 56px;
  line-height: 56px;
}
/* dragDrop 관련 수정 */
body.lesson-2024 .gu-mirror.active-horizontal::before {
  background-image: url("/assets/images/common/icon-chevron-left-right-780b6d6d3f3933e6e94ec5f5585654ae.svg") !important;
  z-index: 30;
} /* 추가(z-index: 30;)*/

body.lesson-2024 .gu-mirror.mirror-gallery buttons {
  display: none; /* 추가(버튼 미노출)*/
}

body.lesson-2024 .gu-transit .buttons {
  display: none !important;
} /* 추가(버튼 미노출)*/

body.lesson-2024 .gu-mirror.mirror-gallery {
  justify-content: space-between !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 20px !important;
  padding: 8px !important;
  min-height: 94px !important;
  border: 1px solid #8cd5d3 !important;
  border-radius: 4px !important;
  background-color: white !important;
  color: #838383 !important;
  text-align: left !important;
  box-shadow: 5px 5px 10px 0px rgba(93, 144, 149, 0.2);
  z-index: 20; /* 수정 (9999;->20)*/
}
body.lesson-2024 .type-gallery .data a .study-depth {
  margin-left: 0;
}
body.lesson-2024 .type-gallery .data .writer-info,
body.lesson-2024 .gu-mirror.mirror-gallery .writer-info {
  width: 100%;
  text-align: left !important;
  margin-top: -12px;
}
body.lesson-2024 .type-gallery .data .writer-info div,
body.lesson-2024 .gu-mirror.mirror-gallery .writer-info div {
  display: inline-flex;
  justify-content: flex-start;
}
body.lesson-2024 .type-gallery .data .new,
body.lesson-2024 .gu-mirror.mirror-gallery .data strong .new {
  vertical-align: 3px;
  margin-right: 2px;
}
body.lesson-2024 .gu-mirror.mirror-gallery:after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 10;
}
body.lesson-2024 .type-gallery .data .inner-wrap {
  gap: 8px;
}
body.lesson-2024 .gu-mirror.mirror-gallery .inner-wrap {
  gap: 8px;
}
body.lesson-2024 .sub-lessons.type-gallery .split-container {
  margin-bottom: 10px;
  align-items: center;
}
/* #73 25-11-12 갤러리타입 추가 끝 */

/* #110 25-12-08 아이콘 간헐적 오류건 시작 */
.icon-gallery-type,
.icon-list-type {
  width: 28px;
  height: 28px;
  font-size: 0 !important;
}
.icon-gallery-type {
  cursor: pointer;
  background-image: url("/assets/images/common/icon-gallery-gray-e47981801d80a29080f35f71ac772436.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
}
.icon-gallery-type.active:not(.disabled) {
  background-image: url("/assets/images/common/icon-gallery-white-add729ed479ad9f5d75f9429295149b0.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
}
.icon-list-type {
  cursor: pointer;
  background-image: url("/assets/images/common/icon-list-gray-0345987ac1f2a0134a18dd9916e66647.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px;
}
.icon-list-type.active:not(.disabled) {
  background-image: url("/assets/images/common/icon-list-white-8dcd4f63579aeb7111c367a73a297405.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px;
}
.type-icon.icon-prev,
.type-icon.icon-next {
  font-size: 0 !important;
}
.icon-prev,
.icon-prev.active:hover,
.icon-prev:hover {
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("/assets/images/common/icon-chevron-left-3d6a26721da32e107a7f918a2d16b3b8.svg");
  background-size: 16px;
}
.icon-prev.active {
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("/assets/images/common/icon-chevron-left-white2-c64cfd50644c9469bd3b8e45110cfac0.svg");
  background-size: 16px;
}
.icon-next,
.icon-next.active:hover,
.icon-next:hover {
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("/assets/images/common/icon-chevron-right-e606f83279b6adff72be7c6d04e995cc.svg");
  background-size: 16px;
}
.icon-next.active {
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("/assets/images/common/icon-chevron-right-white2-6322f98f35b0c9a1d64d2eec886477ca.svg");
  background-size: 16px;
}
.btn-other-lesson-more i.ico-chevron {
  width: 16px;
  height: 16px;
  background-image: url("/assets/images/common/icon-chevron-down-7d56ef8855cd85283551b23a3e28d6f4.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  position: relative;
  top: 1px;
}
.btn-other-lesson-more.active i.ico-chevron {
  width: 16px;
  height: 16px;
  background-image: url("/assets/images/common/icon-chevron-up-white-77337056f0139288b8b5002edf77564a.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  position: relative;
  top: 1px;
}
/* #110 25-12-08 아이콘 간헐적 오류건 끝 */

/* #73 25-12-09 갤러리타입 타이틀 폰트사이즈 수정 */
body.lesson-2024 .sub-lessons.type-gallery .lesson-data .data .inner-wrap a strong {
  font-size: 14px; /* 16px -> 14px */
}

/* #120 수업 보충 자료 3차 개선 요청 (new아이콘, 쇼츠썸네일) */
.ellipsis-multi.is-new {
  padding-right: 12px;
  position: relative; /* #120 추가 */
}
.ellipsis-multi.is-new::before{
  content: "N";
  position: absolute;
  right: 1px; /* 8px; ->1px  #120 변경*/
  bottom: 6px; /* 13px; ->6px #120 변경 */
  white-space: nowrap;
  width: 12px;
  height: 12px;
  text-align: center;
  line-height: 12px;
  border-radius: 2px;
  background: #fb647d;
  color: #fff;
  font-size: 8px;
  font-weight: 700;
  pointer-events: none;
}
body.lesson-2024 .image-wrap .image-wrap-buttons-group {
  z-index: 1
}
body.lesson-2024 .sub-lessons .data .image-wrap.shorts img,
body.lesson-2024 .lesson-items .data .image-wrap.shorts img {
  position: relative;
  width: 100%;
  height: 100%;
  aspect-ratio: 119 / 64; /* #120 shorts 썸네일 추가 */
  object-fit: cover;
  object-position: center;
}

/* #120 shorts 썸네일 추가 시작 */
body.lesson-2024 .gu-mirror .inner-wrap .image-wrap.shorts img {
  aspect-ratio: 119 / 64;
  object-fit: cover;
  object-position: center;
}
body.lesson-2024 .image-wrap .image-wrap-buttons-group img,
body.lesson-2024 .sub-lessons .data .image-wrap.shorts .image-wrap-buttons-group img,
body.lesson-2024 .lesson-items .data .image-wrap.shorts .image-wrap-buttons-group img {
  width: 20px;
  height: 20px;
  border-radius: 4px;
}
/* #120 shorts 썸네일 추가 끝 */

/* #145 주제창 비디오 영상 뱃지 추가 */
.badge.video {
  display: inline-block;
  font-size: 11px;
  height: 16px;
  background-color: #02A39F;
  color: #fff;
  line-height: 1;
  text-align: center;
  border-radius: 4px;
  padding: 0px 4px 1px;
}
.badge.video:before {
  content: "";
  display: inline-flex;
  position: relative;
  top: 3px;
  width: 14px;
  height: 14px;
  background: url("/assets/images/subject/icon-video-258b796e54997ddd690b8fe6ca33a1c8.svg") no-repeat;
  background-size: contain;
  padding-right: 18px;
}
body.lesson-2024 .data .image-wrap.video {
  border: 2px solid rgba(255,0,0, 0.4);
}
