@charset "UTF-8";
.test-home__status-subject .tab--wrapper .box-bg__gray .box-bg__white .graph,
.test-home__status-subject .aitest--scrolled .scroll-target,
.test-home .aitest--scrolled .scroll-target,
.test-subject__graph .graph,
.seating__layout,
.attendancelist--box.is--scroll .table--list .tbl--scroll,
.timetable--box.is--scroll .timetable--table,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__box,
.intro-today__info .info-class__button,
.layer-area,
.layer-list__video .layer__container .list--video {
  -webkit-transform: translate3d(0, 0, 0);
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .graph::-webkit-scrollbar,
.test-home__status-subject .aitest--scrolled .scroll-target::-webkit-scrollbar,
.test-home .aitest--scrolled .scroll-target::-webkit-scrollbar,
.test-subject__graph .graph::-webkit-scrollbar,
.seating__layout::-webkit-scrollbar,
.attendancelist--box.is--scroll .table--list .tbl--scroll::-webkit-scrollbar,
.timetable--box.is--scroll .timetable--table::-webkit-scrollbar,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__box::-webkit-scrollbar,
.intro-today__info .info-class__button::-webkit-scrollbar,
.layer-area::-webkit-scrollbar,
.layer-list__video .layer__container .list--video::-webkit-scrollbar {
  height: 13px;
  border: 5px solid rgba(255, 255, 255, 0);
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .graph::-webkit-scrollbar-button:start:decrement,
.test-home__status-subject
  .aitest--scrolled
  .scroll-target::-webkit-scrollbar-button:start:decrement,
.test-home
  .aitest--scrolled
  .scroll-target::-webkit-scrollbar-button:start:decrement,
.test-subject__graph .graph::-webkit-scrollbar-button:start:decrement,
.seating__layout::-webkit-scrollbar-button:start:decrement,
.attendancelist--box.is--scroll
  .table--list
  .tbl--scroll::-webkit-scrollbar-button:start:decrement,
.timetable--box.is--scroll
  .timetable--table::-webkit-scrollbar-button:start:decrement,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__box::-webkit-scrollbar-button:start:decrement,
.intro-today__info
  .info-class__button::-webkit-scrollbar-button:start:decrement,
.layer-area::-webkit-scrollbar-button:start:decrement,
.layer-list__video
  .layer__container
  .list--video::-webkit-scrollbar-button:start:decrement,
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .graph::-webkit-scrollbar-button:end:increment,
.test-home__status-subject
  .aitest--scrolled
  .scroll-target::-webkit-scrollbar-button:end:increment,
.test-home
  .aitest--scrolled
  .scroll-target::-webkit-scrollbar-button:end:increment,
.test-subject__graph .graph::-webkit-scrollbar-button:end:increment,
.seating__layout::-webkit-scrollbar-button:end:increment,
.attendancelist--box.is--scroll
  .table--list
  .tbl--scroll::-webkit-scrollbar-button:end:increment,
.timetable--box.is--scroll
  .timetable--table::-webkit-scrollbar-button:end:increment,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__box::-webkit-scrollbar-button:end:increment,
.intro-today__info .info-class__button::-webkit-scrollbar-button:end:increment,
.layer-area::-webkit-scrollbar-button:end:increment,
.layer-list__video
  .layer__container
  .list--video::-webkit-scrollbar-button:end:increment {
  display: block;
  width: 0;
  height: 0;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .graph::-webkit-scrollbar-track,
.test-home__status-subject
  .aitest--scrolled
  .scroll-target::-webkit-scrollbar-track,
.test-home .aitest--scrolled .scroll-target::-webkit-scrollbar-track,
.test-subject__graph .graph::-webkit-scrollbar-track,
.seating__layout::-webkit-scrollbar-track,
.attendancelist--box.is--scroll
  .table--list
  .tbl--scroll::-webkit-scrollbar-track,
.timetable--box.is--scroll .timetable--table::-webkit-scrollbar-track,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__box::-webkit-scrollbar-track,
.intro-today__info .info-class__button::-webkit-scrollbar-track,
.layer-area::-webkit-scrollbar-track,
.layer-list__video .layer__container .list--video::-webkit-scrollbar-track {
  background: transparent;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .graph::-webkit-scrollbar-thumb,
.test-home__status-subject
  .aitest--scrolled
  .scroll-target::-webkit-scrollbar-thumb,
.test-home .aitest--scrolled .scroll-target::-webkit-scrollbar-thumb,
.test-subject__graph .graph::-webkit-scrollbar-thumb,
.seating__layout::-webkit-scrollbar-thumb,
.attendancelist--box.is--scroll
  .table--list
  .tbl--scroll::-webkit-scrollbar-thumb,
.timetable--box.is--scroll .timetable--table::-webkit-scrollbar-thumb,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__box::-webkit-scrollbar-thumb,
.intro-today__info .info-class__button::-webkit-scrollbar-thumb,
.layer-area::-webkit-scrollbar-thumb,
.layer-list__video .layer__container .list--video::-webkit-scrollbar-thumb {
  border: 5px solid rgba(0, 0, 0, 0);
  background-clip: padding-box;
  background-color: #d9d9d9;
  border-radius: 6px;
}
/* 240206 .scroll_custom 추가했습니다. */
/* 240326  test_solve.large,  label_inner추가 */
/* 240405 .class_design .layer__contents .table--list 추가 */
/* 240409 .layer-area.layer-notice .contents 추가 */
/* 240829 .myclass_student .mystudent--list .table--list tbody td .tooltip--box-text 추가 */
/* 250403 .layer-area.layer-notice .contents_box .contents .detail 추가 */
.layer-area.layer-notice .contents_box .contents .detail,
.layer-area.layer-notice .contents,
.class_design .layer__contents .table--list,
.x_label_tooltip .label_inner,
.test_solve.large .line-tooltip__textbox,
.scroll_custom,
.make--box-items.lesson-explain .input-box,
.test-home__status-subject .aitest--scrolled .scroll-target,
.test-home .aitest--scrolled .scroll-target,
.mypage-terms--box,
.mypage-alert.is--task .tab--contents,
.workbook-make__scroll,
.workbook-make .workbook-preview__body,
.workbook-passage__contents,
.mystudent-area .mystudent--list .table--list tbody td .tooltip--box-text,
.open-box--contents,
.drawing--box .start-person__random.people-list .people-list__list,
.seating__layout,
.seating-old .seating-old__setting .setting__history,
.stopwatch-body.start .stopwatch-record,
.game--participate .people-list .people-list__list,
.people--participate .people-list .people-list__list,
.sticker-class--box ul,
.teacher-makeclass .teacher-makeclass__data .makeclass-edit--datalist,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--video
  .input-box.no-input,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--document
  .input-box.no-input,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--workbook
  .input-box.no-input,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--lesson
  .input-box.no-input,
.today-lesson .today-lesson--data .today-lesson--data__list,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__list,
.intro-today__info .today-info__worklist .info-worklist--scroll,
.intro-noti.teacher-online .tooltip--box-text,
.layer__contents,
.layer-agree .agree-box .agree-box__inner,
.layer-check__attendance-detail
  .attendance-detail--inner
  table
  .tooltip--box-text,
.layer-option__participate .layer__contents .show--03 .selected-list,
.layer-option__participate .layer__contents .show--03 .input-box--text.no-input,
.layer-student__upload .layer__container .layer__contents .scroll-y,
.list__tbody,
.myclass_student .mystudent--list .table--list tbody td .tooltip--box-text {
  -webkit-transform: translate3d(0, 0, 0);
}
.layer-area.layer-notice .contents_box .contents .detail::-webkit-scrollbar,
.layer-area.layer-notice .contents::-webkit-scrollbar,
.class_design .layer__contents .table--list::-webkit-scrollbar,
.x_label_tooltip .label_inner::-webkit-scrollbar,
.test_solve.large .line-tooltip__textbox::-webkit-scrollbar,
.scroll_custom::-webkit-scrollbar,
.make--box-items.lesson-explain .input-box::-webkit-scrollbar,
.test-home__status-subject .aitest--scrolled .scroll-target::-webkit-scrollbar,
.test-home .aitest--scrolled .scroll-target::-webkit-scrollbar,
.mypage-terms--box::-webkit-scrollbar,
.mypage-alert.is--task .tab--contents::-webkit-scrollbar,
.workbook-make__scroll::-webkit-scrollbar,
.workbook-make .workbook-preview__body::-webkit-scrollbar,
.workbook-passage__contents::-webkit-scrollbar,
.mystudent-area
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box-text::-webkit-scrollbar,
.open-box--contents::-webkit-scrollbar,
.drawing--box
  .start-person__random.people-list
  .people-list__list::-webkit-scrollbar,
.seating__layout::-webkit-scrollbar,
.seating-old .seating-old__setting .setting__history::-webkit-scrollbar,
.stopwatch-body.start .stopwatch-record::-webkit-scrollbar,
.game--participate .people-list .people-list__list::-webkit-scrollbar,
.people--participate .people-list .people-list__list::-webkit-scrollbar,
.sticker-class--box ul::-webkit-scrollbar,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit--datalist::-webkit-scrollbar,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--video
  .input-box.no-input::-webkit-scrollbar,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--document
  .input-box.no-input::-webkit-scrollbar,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--workbook
  .input-box.no-input::-webkit-scrollbar,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--lesson
  .input-box.no-input::-webkit-scrollbar,
.today-lesson .today-lesson--data .today-lesson--data__list::-webkit-scrollbar,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__list::-webkit-scrollbar,
.intro-today__info
  .today-info__worklist
  .info-worklist--scroll::-webkit-scrollbar,
.intro-noti.teacher-online .tooltip--box-text::-webkit-scrollbar,
.layer__contents::-webkit-scrollbar,
.layer-agree .agree-box .agree-box__inner::-webkit-scrollbar,
.layer-check__attendance-detail
  .attendance-detail--inner
  table
  .tooltip--box-text::-webkit-scrollbar,
.layer-option__participate
  .layer__contents
  .show--03
  .selected-list::-webkit-scrollbar,
.layer-option__participate
  .layer__contents
  .show--03
  .input-box--text.no-input::-webkit-scrollbar,
.layer-student__upload
  .layer__container
  .layer__contents
  .scroll-y::-webkit-scrollbar,
.list__tbody::-webkit-scrollbar,
.myclass_student
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box-text::-webkit-scrollbar {
  width: 13px;
}
.layer-area.layer-notice .contents_box .contents .detail:end:increment,
.layer-area.layer-notice .contents_box .contents .detail:start:increment,
.layer-area.layer-notice .contents:end:increment,
.layer-area.layer-notice .contents:start:increment,
.class_design .layer__contents .table--list:end:increment,
.class_design .layer__contents .table--list:start:increment,
.x_label_tooltip .label_inner::-webkit-scrollbar-button:end:increment,
.x_label_tooltip .label_inner::-webkit-scrollbar-button:start:increment,
.test_solve.large
  .line-tooltip__textbox::-webkit-scrollbar-button:start:increment,
.test_solve.large
  .line-tooltip__textbox::-webkit-scrollbar-button:end:increment,
.scroll_custom::-webkit-scrollbar-button:end:increment,
.scroll_custom::-webkit-scrollbar-button:start:decrement,
.make--box-items.lesson-explain
  .input-box::-webkit-scrollbar-button:start:decrement,
.test-home__status-subject
  .aitest--scrolled
  .scroll-target::-webkit-scrollbar-button:start:decrement,
.test-home
  .aitest--scrolled
  .scroll-target::-webkit-scrollbar-button:start:decrement,
.mypage-terms--box::-webkit-scrollbar-button:start:decrement,
.mypage-alert.is--task .tab--contents::-webkit-scrollbar-button:start:decrement,
.workbook-make__scroll::-webkit-scrollbar-button:start:decrement,
.workbook-make
  .workbook-preview__body::-webkit-scrollbar-button:start:decrement,
.workbook-passage__contents::-webkit-scrollbar-button:start:decrement,
.mystudent-area
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box-text::-webkit-scrollbar-button:start:decrement,
.open-box--contents::-webkit-scrollbar-button:start:decrement,
.drawing--box
  .start-person__random.people-list
  .people-list__list::-webkit-scrollbar-button:start:decrement,
.seating__layout::-webkit-scrollbar-button:start:decrement,
.seating-old
  .seating-old__setting
  .setting__history::-webkit-scrollbar-button:start:decrement,
.stopwatch-body.start
  .stopwatch-record::-webkit-scrollbar-button:start:decrement,
.game--participate
  .people-list
  .people-list__list::-webkit-scrollbar-button:start:decrement,
.people--participate
  .people-list
  .people-list__list::-webkit-scrollbar-button:start:decrement,
.sticker-class--box ul::-webkit-scrollbar-button:start:decrement,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit--datalist::-webkit-scrollbar-button:start:decrement,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--video
  .input-box.no-input::-webkit-scrollbar-button:start:decrement,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--document
  .input-box.no-input::-webkit-scrollbar-button:start:decrement,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--workbook
  .input-box.no-input::-webkit-scrollbar-button:start:decrement,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--lesson
  .input-box.no-input::-webkit-scrollbar-button:start:decrement,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list::-webkit-scrollbar-button:start:decrement,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__list::-webkit-scrollbar-button:start:decrement,
.intro-today__info
  .today-info__worklist
  .info-worklist--scroll::-webkit-scrollbar-button:start:decrement,
.intro-noti.teacher-online
  .tooltip--box-text::-webkit-scrollbar-button:start:decrement,
.layer__contents::-webkit-scrollbar-button:start:decrement,
.layer-agree
  .agree-box
  .agree-box__inner::-webkit-scrollbar-button:start:decrement,
.layer-check__attendance-detail
  .attendance-detail--inner
  table
  .tooltip--box-text::-webkit-scrollbar-button:start:decrement,
.layer-option__participate
  .layer__contents
  .show--03
  .selected-list::-webkit-scrollbar-button:start:decrement,
.layer-option__participate
  .layer__contents
  .show--03
  .input-box--text.no-input::-webkit-scrollbar-button:start:decrement,
.layer-student__upload
  .layer__container
  .layer__contents
  .scroll-y::-webkit-scrollbar-button:start:decrement,
.list__tbody::-webkit-scrollbar-button:start:decrement,
.make--box-items.lesson-explain
  .input-box::-webkit-scrollbar-button:end:increment,
.test-home__status-subject
  .aitest--scrolled
  .scroll-target::-webkit-scrollbar-button:end:increment,
.test-home
  .aitest--scrolled
  .scroll-target::-webkit-scrollbar-button:end:increment,
.mypage-terms--box::-webkit-scrollbar-button:end:increment,
.mypage-alert.is--task .tab--contents::-webkit-scrollbar-button:end:increment,
.workbook-make__scroll::-webkit-scrollbar-button:end:increment,
.workbook-make .workbook-preview__body::-webkit-scrollbar-button:end:increment,
.workbook-passage__contents::-webkit-scrollbar-button:end:increment,
.mystudent-area
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box-text::-webkit-scrollbar-button:end:increment,
.open-box--contents::-webkit-scrollbar-button:end:increment,
.drawing--box
  .start-person__random.people-list
  .people-list__list::-webkit-scrollbar-button:end:increment,
.seating__layout::-webkit-scrollbar-button:end:increment,
.seating-old
  .seating-old__setting
  .setting__history::-webkit-scrollbar-button:end:increment,
.stopwatch-body.start .stopwatch-record::-webkit-scrollbar-button:end:increment,
.game--participate
  .people-list
  .people-list__list::-webkit-scrollbar-button:end:increment,
.people--participate
  .people-list
  .people-list__list::-webkit-scrollbar-button:end:increment,
.sticker-class--box ul::-webkit-scrollbar-button:end:increment,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit--datalist::-webkit-scrollbar-button:end:increment,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--video
  .input-box.no-input::-webkit-scrollbar-button:end:increment,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--document
  .input-box.no-input::-webkit-scrollbar-button:end:increment,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--workbook
  .input-box.no-input::-webkit-scrollbar-button:end:increment,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--lesson
  .input-box.no-input::-webkit-scrollbar-button:end:increment,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list::-webkit-scrollbar-button:end:increment,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__list::-webkit-scrollbar-button:end:increment,
.intro-today__info
  .today-info__worklist
  .info-worklist--scroll::-webkit-scrollbar-button:end:increment,
.intro-noti.teacher-online
  .tooltip--box-text::-webkit-scrollbar-button:end:increment,
.layer__contents::-webkit-scrollbar-button:end:increment,
.layer-agree
  .agree-box
  .agree-box__inner::-webkit-scrollbar-button:end:increment,
.layer-check__attendance-detail
  .attendance-detail--inner
  table
  .tooltip--box-text::-webkit-scrollbar-button:end:increment,
.layer-option__participate
  .layer__contents
  .show--03
  .selected-list::-webkit-scrollbar-button:end:increment,
.layer-option__participate
  .layer__contents
  .show--03
  .input-box--text.no-input::-webkit-scrollbar-button:end:increment,
.layer-student__upload
  .layer__container
  .layer__contents
  .scroll-y::-webkit-scrollbar-button:end:increment,
.list__tbody::-webkit-scrollbar-button:end:increment,
.myclass_student
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box-text::-webkit-scrollbar-button:end:increment {
  display: block;
  width: 0;
  height: 0;
}
.layer-area.layer-notice
  .contents_box
  .contents
  .detail::-webkit-scrollbar-track,
.layer-area.layer-notice .contents::-webkit-scrollbar-track,
.class_design .layer__contents .table--list::-webkit-scrollbar-track,
.x_label_tooltip .label_inner::-webkit-scrollbar-track,
.test_solve.large .line-tooltip__textbox::-webkit-scrollbar-track,
.scroll_custom::-webkit-scrollbar-track,
.make--box-items.lesson-explain .input-box::-webkit-scrollbar-track,
.test-home__status-subject
  .aitest--scrolled
  .scroll-target::-webkit-scrollbar-track,
.test-home .aitest--scrolled .scroll-target::-webkit-scrollbar-track,
.mypage-terms--box::-webkit-scrollbar-track,
.mypage-alert.is--task .tab--contents::-webkit-scrollbar-track,
.workbook-make__scroll::-webkit-scrollbar-track,
.workbook-make .workbook-preview__body::-webkit-scrollbar-track,
.workbook-passage__contents::-webkit-scrollbar-track,
.mystudent-area
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box-text::-webkit-scrollbar-track,
.open-box--contents::-webkit-scrollbar-track,
.drawing--box
  .start-person__random.people-list
  .people-list__list::-webkit-scrollbar-track,
.seating__layout::-webkit-scrollbar-track,
.seating-old .seating-old__setting .setting__history::-webkit-scrollbar-track,
.stopwatch-body.start .stopwatch-record::-webkit-scrollbar-track,
.game--participate .people-list .people-list__list::-webkit-scrollbar-track,
.people--participate .people-list .people-list__list::-webkit-scrollbar-track,
.sticker-class--box ul::-webkit-scrollbar-track,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit--datalist::-webkit-scrollbar-track,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--video
  .input-box.no-input::-webkit-scrollbar-track,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--document
  .input-box.no-input::-webkit-scrollbar-track,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--workbook
  .input-box.no-input::-webkit-scrollbar-track,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--lesson
  .input-box.no-input::-webkit-scrollbar-track,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list::-webkit-scrollbar-track,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__list::-webkit-scrollbar-track,
.intro-today__info
  .today-info__worklist
  .info-worklist--scroll::-webkit-scrollbar-track,
.intro-noti.teacher-online .tooltip--box-text::-webkit-scrollbar-track,
.layer__contents::-webkit-scrollbar-track,
.layer-agree .agree-box .agree-box__inner::-webkit-scrollbar-track,
.layer-check__attendance-detail
  .attendance-detail--inner
  table
  .tooltip--box-text::-webkit-scrollbar-track,
.layer-option__participate
  .layer__contents
  .show--03
  .selected-list::-webkit-scrollbar-track,
.layer-option__participate
  .layer__contents
  .show--03
  .input-box--text.no-input::-webkit-scrollbar-track,
.layer-student__upload
  .layer__container
  .layer__contents
  .scroll-y::-webkit-scrollbar-track,
.list__tbody::-webkit-scrollbar-track,
.myclass_student
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box-text::-webkit-scrollbar-track {
  background: transparent;
}
.layer-area.layer-notice
  .contents_box
  .contents
  .detail::-webkit-scrollbar-thumb,
.layer-area.layer-notice .contents::-webkit-scrollbar-thumb,
.class_design .layer__contents .table--list::-webkit-scrollbar-thumb,
.x_label_tooltip .label_inner::-webkit-scrollbar-thumb,
.test_solve.large .line-tooltip__textbox::-webkit-scrollbar-thumb,
.scroll_custom::-webkit-scrollbar-thumb,
.make--box-items.lesson-explain .input-box::-webkit-scrollbar-thumb,
.test-home__status-subject
  .aitest--scrolled
  .scroll-target::-webkit-scrollbar-thumb,
.test-home .aitest--scrolled .scroll-target::-webkit-scrollbar-thumb,
.mypage-terms--box::-webkit-scrollbar-thumb,
.mypage-alert.is--task .tab--contents::-webkit-scrollbar-thumb,
.workbook-make__scroll::-webkit-scrollbar-thumb,
.workbook-make .workbook-preview__body::-webkit-scrollbar-thumb,
.workbook-passage__contents::-webkit-scrollbar-thumb,
.mystudent-area
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box-text::-webkit-scrollbar-thumb,
.open-box--contents::-webkit-scrollbar-thumb,
.drawing--box
  .start-person__random.people-list
  .people-list__list::-webkit-scrollbar-thumb,
.seating__layout::-webkit-scrollbar-thumb,
.seating-old .seating-old__setting .setting__history::-webkit-scrollbar-thumb,
.stopwatch-body.start .stopwatch-record::-webkit-scrollbar-thumb,
.game--participate .people-list .people-list__list::-webkit-scrollbar-thumb,
.people--participate .people-list .people-list__list::-webkit-scrollbar-thumb,
.sticker-class--box ul::-webkit-scrollbar-thumb,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit--datalist::-webkit-scrollbar-thumb,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--video
  .input-box.no-input::-webkit-scrollbar-thumb,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--document
  .input-box.no-input::-webkit-scrollbar-thumb,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--workbook
  .input-box.no-input::-webkit-scrollbar-thumb,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--lesson
  .input-box.no-input::-webkit-scrollbar-thumb,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list::-webkit-scrollbar-thumb,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__list::-webkit-scrollbar-thumb,
.intro-today__info
  .today-info__worklist
  .info-worklist--scroll::-webkit-scrollbar-thumb,
.intro-noti.teacher-online .tooltip--box-text::-webkit-scrollbar-thumb,
.layer__contents::-webkit-scrollbar-thumb,
.layer-agree .agree-box .agree-box__inner::-webkit-scrollbar-thumb,
.layer-check__attendance-detail
  .attendance-detail--inner
  table
  .tooltip--box-text::-webkit-scrollbar-thumb,
.layer-option__participate
  .layer__contents
  .show--03
  .selected-list::-webkit-scrollbar-thumb,
.layer-option__participate
  .layer__contents
  .show--03
  .input-box--text.no-input::-webkit-scrollbar-thumb,
.layer-student__upload
  .layer__container
  .layer__contents
  .scroll-y::-webkit-scrollbar-thumb,
.list__tbody::-webkit-scrollbar-thumb,
.myclass_student
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box-text::-webkit-scrollbar-thumb {
  border: 5px solid rgba(0, 0, 0, 0);
  background-clip: padding-box;
  background-color: #d9d9d9;
  border-radius: 6px;
}

.guide-clone--wrapper,
.main-banner--inner {
  max-width: 1200px;
  padding-left: 36px;
  padding-right: 36px;
}
@media (max-width: 1199px) {
  .guide-clone--wrapper,
  .main-banner--inner {
    max-width: 1288px;
    padding-left: 80px;
    padding-right: 80px;
  }
}
@media (max-width: 768px) {
  .guide-clone--wrapper,
  .main-banner--inner {
    padding-left: 20px;
    padding-right: 20px;
  }
}

.layer-area {
  padding-top: 36px;
  padding-bottom: 36px;
}
@media (min-width: 769px) and (max-width: 1199px) {
  .layer-area {
    padding-top: 56px;
    padding-bottom: 56px;
  }
}
@media (max-width: 768px) {
  .layer-area {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}

.teacher-makelesson .input-check input:checked + .input--box .input--text,
.teacher-noticewrite .input-check input:checked + .input--box .input--text,
.teacher-makeclass .input-check input:checked + .input--box .input--text,
.teacher-makelesson .input-check input:checked + .input--box .input--text > p,
.teacher-noticewrite .input-check input:checked + .input--box .input--text > p,
.teacher-makeclass .input-check input:checked + .input--box .input--text > p,
.teacher-makelesson .input-radio input:checked + .input--box .input--text,
.teacher-noticewrite .input-radio input:checked + .input--box .input--text,
.teacher-makeclass .input-radio input:checked + .input--box .input--text,
.teacher-makelesson .input-radio input:checked + .input--box .input--text > p,
.teacher-noticewrite .input-radio input:checked + .input--box .input--text > p,
.teacher-makeclass .input-radio input:checked + .input--box .input--text > p {
  color: #7e44fb;
  font-weight: 700;
}
.teacher-makelesson .input-check.text-black input:checked + .input--box,
.teacher-noticewrite .input-check.text-black input:checked + .input--box,
.teacher-makeclass .input-check.text-black input:checked + .input--box,
.teacher-makelesson
  .input-check.text-black
  input:checked
  + .input--box
  .input--text,
.teacher-noticewrite
  .input-check.text-black
  input:checked
  + .input--box
  .input--text,
.teacher-makeclass
  .input-check.text-black
  input:checked
  + .input--box
  .input--text,
.teacher-makelesson .input-radio.text-black input:checked + .input--box,
.teacher-noticewrite .input-radio.text-black input:checked + .input--box,
.teacher-makeclass .input-radio.text-black input:checked + .input--box,
.teacher-makelesson
  .input-radio.text-black
  input:checked
  + .input--box
  .input--text,
.teacher-noticewrite
  .input-radio.text-black
  input:checked
  + .input--box
  .input--text,
.teacher-makeclass
  .input-radio.text-black
  input:checked
  + .input--box
  .input--text {
  color: #000000;
  font-weight: 400;
}

.make--box-items.lesson-basic.info .dropdown--select::before,
.make--box-items.lesson-filelist .filelist__thum,
.make--box-items.lesson-filelist .filelist__thum.empty::after,
.make--box-items.lesson-adds .box-items--box .button-add .icon,
.mypage--left__profile .profile-image .image,
.datepicker .datepicker--nav .datepicker_left,
.datepicker .datepicker--nav .datepicker_right,
.datepicker-inline .datepicker--nav .datepicker_left,
.datepicker-inline .datepicker--nav .datepicker_right,
.workbook--make .box-grid .cell-06 .icon,
.workbook--make .box-grid .cell-06 .arrow::before,
.workbook--intro.is--student .week__summary .icon,
.detail-analysis--box > div::before,
.workbook-preview__body .preview-check,
.textbook--item .item--top-box::before,
.textbook--item .top-box--download::after,
.textbook--item .top-box--like::before,
.mystudent--contents .mystudent--list .table--list th .profile,
.mystudent--contents .mystudent--list .table--list td .profile,
.mystudent-detail__info .detail-info__profile .user-profile,
.student--card__top .card-top__left .user-profile,
.class-info--thumnail,
.class-info--thumnail.empty::after,
.class-related--box .tab-studentmanage .table--list .ico--arrow-right::after,
.seating__student .swiper-button-prev,
.seating__student .swiper-button-next,
.seating-new
  .seating-new__setting
  .clock-timepad
  .clock-timepad--number
  .timepad-number--button::after,
.student-namebox .namebox--thum,
.student-namebox .namebox--remove,
.timetable--button button,
.timetable--table table thead th .timetable--table-arrow,
.lesson--item-icon,
.teacher-mylesson--icon,
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box::before,
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box::after,
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box
  .title::after,
.myclass__index .index__mylesson-info .mylesson-info--box .info-box__ing::after,
.report-month__badgebox .month__badge.is--profile .profile,
.report-month__badgebox .month__badge.is--profile .profile .badge,
.report-month__badgebox .month__badge.is--profile .profile .bg,
.report-month__guide .month-guide--left .icon,
.report-total__information .total-monthly .tension--button-next,
.report-total__information .total-monthly .tension--button-prev,
.report-total__information .total-monthly .tension-line-chart,
.report-total__top3 .people-list__list li .top3-student::after,
.report-total .report-month__detail .detail--button::after,
.main-login--button .login--item-button::after,
.main-login--form > div.student .is--search button::after,
.main-login--form .login--form-title__back,
.main-login--scroll,
.main-howto--item-icon,
.intro--title::before,
.intro-lesson--title::before,
.intro-lesson--box .swiper-button-prev,
.intro-lesson--box .swiper-button-next,
.intro-mystat--title::before,
.intro-mystat .monthly--box-item .icon,
.intro-recommend--title::before,
.intro-notice--title::before,
.intro-today__ai .today-ai--image__box,
.intro-today__info .today-info__profile__box .profile-box__image,
.intro-today__info .today-info__profile__like .profile-like__icon,
.intro-select.workbook--make .box-grid .cell-06 .icon,
.password-change--rule .text-bullet::before,
.join-step--item.active .join-step--item-icon span,
.join-step--item.pass .join-step--item-icon span,
.digital-pledge--step .pledge--steps .tooltip--box-text p .icon,
.layer-area.modal-area .layer-close,
.layer__title-close,
.layer-inner__close {
  background-color: transparent;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  color: transparent;
  font-size: 0;
}

.join-formbox,
.layer__container,
.toast-default {
  padding: 40px 24px;
  background-color: #ffffff;
  border-radius: 20px;
}

.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .dropdown--box {
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.16);
  border-radius: 8px;
}

.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .dropdown--item {
  background-color: transparent;
  border: none;
  color: #000000;
  font-size: 14px;
  line-height: 16px;
}

.main-notice--info {
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.main-notice--info span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 8px;
  position: relative;
  color: rgba(0, 0, 0, 0.7);
  font-size: 14px; /* 250617 수정 */
}
.main-notice--info span:not(:first-child)::before {
  position: relative;
  display: block;
  width: 1px;
  height: 11.6px;
  border: 0.8px solid #000000;
  opacity: 0.15;
  content: "";
}

.today-lesson .today-lesson--data .today-lesson--data__list .data-list__title {
  overflow: hidden;
  position: relative;
  min-height: 18px;
  font-size: 16px;
  line-height: 18;
  cursor: default;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-list__title
  > * {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  max-width: 100%;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-list__title
  .clone {
  position: fixed !important;
  width: auto !important;
  max-width: none !important;
  top: 0 !important;
  left: 0 !important;
  text-overflow: inherit !important;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-list__title
  .clone
  span {
  width: auto !important;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .animate.data-list__title
  span {
  overflow: visible;
  position: absolute;
  max-width: none;
  top: 0;
  left: 100%;
  text-overflow: inherit;
  white-space: nowrap;
  transition: left 3s;
  -webkit-animation: marquee 7s linear infinite;
  -moz-animation: marquee 7s linear infinite;
  animation: marquee 7s linear infinite;
}

.layer-area {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  min-width: 1024px;
}

.layer-area {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  overflow: hidden;
  overflow-x: auto;
  max-width: 100%;
  padding-left: 36px;
  padding-right: 36px;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 999;
}
@media (max-width: 1199px) {
  .layer-area {
    padding-top: 36px;
    padding-bottom: 36px;
  }
}
.layer-area.scroll--contents .layer__contents {
  overflow: hidden;
}
.layer-area.is__small .layer__container {
  width: 569px;
}
.layer-area.is__small .layer__title {
  padding: 22px 24px;
  background-color: transparent;
}
.layer-area.is__small .layer__title-text {
  font-size: 18px;
  line-height: 20px;
}
.layer-area.is__small .layer__title-text::before {
  vertical-align: middle;
  height: 18px;
  margin-right: 9px;
}
.layer-area.is__small .layer__contents {
  padding: 32px 24px 32px;
}
.layer-area.modal-area .layer__contents {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-width: 400px;
  min-height: 128px;
  padding: 48px 24px 38px;
  text-align: center;
}
.layer-area.modal-area .layer__contents + .page__button {
  padding-top: 0;
  justify-content: center;
}
.layer-area.modal-area .layer-close {
  position: absolute;
  top: 22px;
  right: 31px;
  width: 28px;
  height: 28px;
  background-image: url("../images/ico/close-black.svg");
}
.layer-area.modal-area .page__button {
  justify-content: stretch;
  padding: 0 24px 24px;
  margin-top: 2px;
  gap: 12px;
}
.layer-area.modal-area .page__button button:not([class*="width"]),
.layer-area.modal-area .page__button a:not([class*="width"]) {
  width: 100%;
  height: 44px;
  min-width: inherit;
  max-width: 180px;
  margin: 0;
}
.layer-area.modal-area.is--large .layer__contents {
  width: 450px;
}
.layer-area.modal-area.width-450 .layer__container {
  width: 426px;
}
.layer-area.modal-area.width-450 .layer__container .layer__contents {
  width: auto;
}
.layer-area.modal-area.width-484 .layer__container {
  width: 484px;
}
.layer-area.modal-area.width-484 .layer__container .layer__contents {
  width: auto;
}
.layer-area.modal-area.is--makelesson .layer__container {
  width: 570px;
}
.layer-area.modal-area.is--makelesson .layer__container .layer__contents {
  padding: 40px;
}
.layer-area.modal-area.is--makelesson
  .layer__container
  .layer__contents
  p.modal--title {
  color: #000000;
  font-size: 22px;
  font-weight: 700;
  text-align: center;
  line-height: 25px;
  margin-bottom: 40px;
}
.layer-area.modal-area.is--makelesson
  .layer__container
  .layer__contents
  p.modal--text {
  margin-top: 16px;
  margin-bottom: 40px;
  font-size: 16px;
  text-align: center;
  line-height: 18px;
}
.layer-area.modal-area.is--makelesson .layer__container .page__button {
  justify-content: center;
  padding-bottom: 40px;
  margin-top: 0;
}
.layer-area.modal-area.is--makelesson
  .layer__container
  .page__button
  .button-main {
  width: 183px;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
}
.layer-area.modal-area.is--makelesson.class .box-grid {
  gap: 12px;
}
.layer-area.modal-area.is--makelesson.class .box-grid .cell-06 {
  width: calc((100% - 12px) / 2);
}
.layer-area.modal-area.is--makelesson.class .box-grid .cell-06 .dropdown--area {
  width: 100%;
}
.layer-area.modal-area.is--makelesson.class .dropdown--select {
  font-weight: 400;
}
.layer-area.modal-area.is--makelesson.class .input-box--text.no-input {
  min-height: 56px;
  padding: 13px;
  margin-top: 12px;
  background-color: #f6f6f6;
  border-color: rgba(0, 0, 0, 0.16);
}
.layer__container {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  flex-grow: 0;
  position: relative;
  overflow: hidden;
  max-width: calc(100% - 60px);
  max-height: calc(100% - 24px);
  padding: 0;
  border-radius: 20px;
  box-shadow: 0px 12px 20px rgba(0, 0, 0, 0.1);
  z-index: 10;
}
.layer__container .box--search + .table--list {
  margin-top: 24px;
}
.layer__container .pagenavi--box:last-child {
  margin-top: 48px;
}
.layer__container .page__button {
  flex-shrink: 0;
  flex-grow: 0;
  position: relative;
  padding: 48px 34px 40px;
}
.layer__container .page__button a:not([class^="width-"]),
.layer__container .page__button button:not([class^="width-"]) {
  width: 164px;
  min-width: 164px;
}
.layer__container .page__button-right {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
}
.layer__container .page__button.is--large a,
.layer__container .page__button.is--large button {
  width: 240px;
}
.layer__title {
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 22px 34px;
  background-color: rgba(217, 217, 217, 0.3);
  border-radius: 20px 20px 0 0;
}
.layer__title-text {
  color: #341761;
  font-weight: 700;
  font-size: 20px;
  line-height: 32px;
}
.layer__title-text::before {
  display: inline-block;
  width: 2px;
  height: 16px;
  margin-right: 12px;
  background-color: #341761;
  content: "";
}
.layer__title-text.no--bullet::before {
  display: none;
}
.layer__title-close {
  width: 32px;
  height: 32px;
  background-image: url("../images/ico/close-black.svg");
}
.layer__contents {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  overflow: hidden;
  overflow-y: auto;
  min-height: 20px;
  padding: 36px 34px 0;
}
.layer__contents.no--scroll {
  overflow: hidden;
}
.layer__dim {
  display: none;
}
.layer-agree .layer__container {
  width: 809px;
  min-width: 809px;
}
.layer-agree .layer__contents {
  padding: 35px 35px 0;
}
.layer-agree .layer__contents .agree-box__row p.f-16-sb {
  color: #341761;
}
.layer-agree .button-main {
  width: 164px;
  height: 44px;
  min-width: inherit;
}
.layer-agree .agree-box {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  overflow: hidden;
  width: 100%;
}
.layer-agree .agree-box .agree-box__inner {
  overflow: hidden;
  overflow-y: auto;
  width: 100%;
  padding: 20px 15px;
  margin: 0 6px;
  /* [KT요청 : 230908] 에디터 입력 내용 폰트 통일 */
  /* [KT요청 : 230908] 에디터 입력 내용 테이블 스타일 수정 */
}
.layer-agree .agree-box .agree-box__inner::-webkit-scrollbar {
  width: 3px;
}
.layer-agree .agree-box .agree-box__inner::-webkit-scrollbar-thumb {
  border-right: none;
  border-left: none;
}
.layer-agree .agree-box .agree-box__inner * {
  font-size: 14px !important;
  line-height: 22px !important;
}
.layer-agree .agree-box .agree-box__inner.mypage-terms--box {
  height: auto;
  background-color: #ffffff;
  border-radius: 0;
  /* [KT요청 : 230908] 에디터 입력 내용 폰트 통일 */
}
.layer-agree .agree-box .agree-box__inner.mypage-terms--box * {
  font-size: 14px !important;
  line-height: 22px !important;
}
.layer-agree .agree-box .agree-box__inner #personalSbst table,
.layer-agree .agree-box .agree-box__inner #termsSbst table,
.layer-agree .agree-box .agree-box__inner pre-line table {
  overflow: hidden;
  box-shadow: 0 0 0 1px #d9d9d9;
  border-radius: 10px;
}
.layer-agree .agree-box .agree-box__inner #personalSbst table thead th,
.layer-agree .agree-box .agree-box__inner #termsSbst table thead th,
.layer-agree .agree-box .agree-box__inner pre-line table thead th {
  background: #f8f9fd;
  border-bottom: 1px solid #d9d9d9;
  border-right: 1px solid #d9d9d9;
  border-radius: 10px 10px 0 0;
  font-weight: 400;
  padding: 11px;
}
.layer-agree
  .agree-box
  .agree-box__inner
  #personalSbst
  table
  thead
  th:last-child,
.layer-agree .agree-box .agree-box__inner #termsSbst table thead th:last-child,
.layer-agree .agree-box .agree-box__inner pre-line table thead th:last-child {
  border-right-width: 0;
}
.layer-agree .agree-box .agree-box__inner #personalSbst table tbody tr th,
.layer-agree .agree-box .agree-box__inner #personalSbst table tbody tr td,
.layer-agree .agree-box .agree-box__inner #termsSbst table tbody tr th,
.layer-agree .agree-box .agree-box__inner #termsSbst table tbody tr td,
.layer-agree .agree-box .agree-box__inner pre-line table tbody tr th,
.layer-agree .agree-box .agree-box__inner pre-line table tbody tr td {
  border-bottom: 1px solid #d9d9d9;
}
.layer-agree
  .agree-box
  .agree-box__inner
  #personalSbst
  table
  tbody
  tr
  th[rowspan]:not(:first-child),
.layer-agree
  .agree-box
  .agree-box__inner
  #personalSbst
  table
  tbody
  tr
  td[rowspan]:not(:first-child),
.layer-agree
  .agree-box
  .agree-box__inner
  #termsSbst
  table
  tbody
  tr
  th[rowspan]:not(:first-child),
.layer-agree
  .agree-box
  .agree-box__inner
  #termsSbst
  table
  tbody
  tr
  td[rowspan]:not(:first-child),
.layer-agree
  .agree-box
  .agree-box__inner
  pre-line
  table
  tbody
  tr
  th[rowspan]:not(:first-child),
.layer-agree
  .agree-box
  .agree-box__inner
  pre-line
  table
  tbody
  tr
  td[rowspan]:not(:first-child) {
  border-left: 1px solid #d9d9d9;
}
.layer-agree
  .agree-box
  .agree-box__inner
  #personalSbst
  table
  tbody
  tr
  th:first-child,
.layer-agree
  .agree-box
  .agree-box__inner
  #personalSbst
  table
  tbody
  tr
  td:first-child,
.layer-agree
  .agree-box
  .agree-box__inner
  #termsSbst
  table
  tbody
  tr
  th:first-child,
.layer-agree
  .agree-box
  .agree-box__inner
  #termsSbst
  table
  tbody
  tr
  td:first-child,
.layer-agree
  .agree-box
  .agree-box__inner
  pre-line
  table
  tbody
  tr
  th:first-child,
.layer-agree
  .agree-box
  .agree-box__inner
  pre-line
  table
  tbody
  tr
  td:first-child {
  text-align: center;
}
.layer-agree .agree-box .agree-box__inner #personalSbst table tbody tr th,
.layer-agree .agree-box .agree-box__inner #termsSbst table tbody tr th,
.layer-agree .agree-box .agree-box__inner pre-line table tbody tr th {
  vertical-align: middle;
  color: #341761;
  font-size: 16px;
  font-weight: 700;
  text-align: left;
  line-height: 18px;
  background: #f8f9fd;
  border-right: 1px solid #d9d9d9;
  padding: 0 32px;
  border-radius: 10px 0 0 10px;
}
.layer-agree .agree-box .agree-box__inner #personalSbst table tbody tr td,
.layer-agree .agree-box .agree-box__inner #termsSbst table tbody tr td,
.layer-agree .agree-box .agree-box__inner pre-line table tbody tr td {
  padding: 16px 18px;
  font-size: 14px;
  line-height: 22px;
  border-right: 1px solid #d9d9d9;
  background-color: #ffffff;
  border-radius: 0 0 10px 10px;
  word-break: keep-all;
}
.layer-agree
  .agree-box
  .agree-box__inner
  #personalSbst
  table
  tbody
  tr
  td:last-child,
.layer-agree
  .agree-box
  .agree-box__inner
  #termsSbst
  table
  tbody
  tr
  td:last-child,
.layer-agree
  .agree-box
  .agree-box__inner
  pre-line
  table
  tbody
  tr
  td:last-child {
  border-right-width: 0;
}
.layer-agree .agree-box .agree-box__inner #personalSbst table tbody tr td span,
.layer-agree .agree-box .agree-box__inner #personalSbst table tbody tr td p,
.layer-agree .agree-box .agree-box__inner #personalSbst table tbody tr td div,
.layer-agree .agree-box .agree-box__inner #termsSbst table tbody tr td span,
.layer-agree .agree-box .agree-box__inner #termsSbst table tbody tr td p,
.layer-agree .agree-box .agree-box__inner #termsSbst table tbody tr td div,
.layer-agree .agree-box .agree-box__inner pre-line table tbody tr td span,
.layer-agree .agree-box .agree-box__inner pre-line table tbody tr td p,
.layer-agree .agree-box .agree-box__inner pre-line table tbody tr td div {
  max-width: 100%;
  word-break: break-all;
}
.layer-agree .agree-box .agree-box__inner #personalSbst table tbody tr td span,
.layer-agree .agree-box .agree-box__inner #termsSbst table tbody tr td span,
.layer-agree .agree-box .agree-box__inner pre-line table tbody tr td span {
  display: inline-block;
}
.layer-agree
  .agree-box
  .agree-box__inner
  #personalSbst
  table
  tbody
  tr:first-child
  th,
.layer-agree
  .agree-box
  .agree-box__inner
  #personalSbst
  table
  tbody
  tr:first-child
  td,
.layer-agree
  .agree-box
  .agree-box__inner
  #termsSbst
  table
  tbody
  tr:first-child
  th,
.layer-agree
  .agree-box
  .agree-box__inner
  #termsSbst
  table
  tbody
  tr:first-child
  td,
.layer-agree
  .agree-box
  .agree-box__inner
  pre-line
  table
  tbody
  tr:first-child
  th,
.layer-agree
  .agree-box
  .agree-box__inner
  pre-line
  table
  tbody
  tr:first-child
  td {
  background-color: #f8f9fd;
  text-align: center;
}
.layer-agree
  .agree-box
  .agree-box__inner
  #personalSbst
  table
  tbody
  tr:last-child
  th,
.layer-agree
  .agree-box
  .agree-box__inner
  #personalSbst
  table
  tbody
  tr:last-child
  td,
.layer-agree
  .agree-box
  .agree-box__inner
  #termsSbst
  table
  tbody
  tr:last-child
  th,
.layer-agree
  .agree-box
  .agree-box__inner
  #termsSbst
  table
  tbody
  tr:last-child
  td,
.layer-agree .agree-box .agree-box__inner pre-line table tbody tr:last-child th,
.layer-agree
  .agree-box
  .agree-box__inner
  pre-line
  table
  tbody
  tr:last-child
  td {
  border-bottom-width: 0;
}
.layer-agree .agree-box .agree-box__row + .agree-box__row {
  margin-top: 34px;
}
.layer-agree.layer-agreeupdate .layer__contents .agree-update__desc {
  margin-top: 0;
}
.layer-agree.layer-agreeupdate .layer__contents .agree-update__desc::before {
  top: 7px;
  opacity: 1;
}
.layer-agree.layer-agreeupdate .layer__contents .agree-update__desc,
.layer-agree.layer-agreeupdate .layer__contents .agree-update__desc p {
  font-size: 14px;
  line-height: 24px;
}
.layer-agree.layer-agreeupdate .layer__contents .agree-box {
  height: 270px;
  margin-top: 14px;
}
.layer-agree.layer-agreeupdate .layer__contents .agree-box__title {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-top: 30px;
}
.layer-agree.layer-agreeupdate .layer__contents .agree-box__title .title {
  color: #000000;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
}
.layer-agree.layer-agreeupdate .layer__contents .input-check .input--box {
  gap: 10px;
}
.layer-agree.layer-agreeupdate
  .layer__contents
  .input-check
  .input--box::before {
  width: 18px;
  height: 18px;
}
.layer-agree.layer-agreeupdate
  .layer__contents
  .input-check
  .input--box
  .input--text {
  padding-top: 0;
  padding-bottom: 0;
}
.layer-agree.layer-agreeupdate .layer__contents .agree-total {
  margin-top: 40px;
  font-size: 0;
  text-align: center;
}
.layer-search__school .layer__container {
  width: 893px;
  min-width: 893px;
}
.layer-search__school .layer__container .page__button {
  padding-bottom: 58px;
}
.layer-search__school .school--inner {
  padding-bottom: 40px;
}
.layer-search__school .table--list {
  min-height: 137px;
}
.layer-setting__school .layer__container {
  width: 873px;
  min-width: 873px;
  height: 858px;
}
.layer-setting__school .layer__container .layer__contents {
  padding: 36px 24px 0;
}
.layer-setting__school .layer__container .layer__contents .search--text-desc {
  margin-top: 12px;
  color: #000000;
  font-size: 14px;
  line-height: 16px;
}
.layer-setting__school .layer__container .layer__contents .table--list {
  margin: 30px 10px 0;
}
.layer-setting__school
  .layer__container
  .layer__contents
  .table--list
  table
  tbody
  tr:first-child
  td {
  border-top: 1px solid #d9d9d9;
}
.layer-setting__school
  .layer__container
  .layer__contents
  .table--list
  table
  tbody
  tr
  td {
  padding-top: 15px;
  padding-bottom: 15px;
}
.layer-setting__school
  .layer__container
  .layer__contents
  .table--list
  table
  tbody
  tr
  td.chk {
  padding-left: 9px;
}
.layer-setting__school
  .layer__container
  .layer__contents
  .table--list
  table
  tbody
  tr
  td.text
  p {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 6px;
  text-align: left;
}
.layer-setting__school
  .layer__container
  .layer__contents
  .table--list
  table
  tbody
  tr
  td.text
  p
  span {
  display: block;
}
.layer-setting__school
  .layer__container
  .layer__contents
  .table--list
  table
  tbody
  tr
  td.text
  p
  span.tag {
  flex-shrink: 0;
  flex-grow: 0;
  width: 62px;
  padding: 5px 0;
  background-color: #f4f4f4;
  border-radius: 6px;
  color: #000000;
  font-size: 16px;
  text-align: center;
  line-height: 18px;
}
.layer-setting__school
  .layer__container
  .layer__contents
  .table--list
  table
  tbody
  tr
  td.text
  p
  span.text {
  color: rgba(0, 0, 0, 0.5);
  font-size: 16px;
  line-height: 18px;
}
.layer-setting__school
  .layer__container
  .layer__contents
  .table--list
  table
  tbody
  tr
  td.text
  p
  span.text
  strong {
  color: rgba(0, 0, 0, 0.8);
  font-size: 18px;
  line-height: 20px;
  font-weight: 700;
}
.layer-setting__school
  .layer__container
  .layer__contents
  .table--list
  table
  tbody
  tr
  td
  .school--addr {
  margin-top: 4px;
}
.layer-setting__school
  .layer__container
  .layer__contents
  .table--list
  table
  tbody
  tr
  td.empty {
  padding-top: 28px;
  padding-bottom: 34px;
  border-top: none;
  border-bottom: 1px solid #d9d9d9;
  color: rgba(0, 0, 0, 0.4);
  font-size: 18px;
  font-weight: 400;
  line-height: 20px;
}
.layer-check__information .layer__container {
  width: 893px;
  min-width: 893px;
}
.layer-check__information .information--inner {
  padding-right: 88px;
  padding-left: 88px;
}
.layer-check__information .information--inner .table--edit {
  overflow: hidden;
  border: 1px solid #d9d9d9;
  border-radius: 10px;
}
.layer-check__information .information--inner .table--edit table th,
.layer-check__information .information--inner .table--edit table td {
  height: 65px;
  border-top: 1px solid #d9d9d9;
}
.layer-check__information .information--inner .table--edit table tbody tr th {
  padding: 0 33px;
  background-color: #f8faff;
  border-right: 1px solid #d9d9d9;
}
.layer-check__information .information--inner .table--edit table tbody tr td {
  padding: 0 30px;
}
.layer-check__information
  .information--inner
  .table--edit
  table
  tbody
  tr
  td
  .input-box {
  padding: 0;
  background-color: transparent;
  border: none;
  border-radius: 0;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.layer-check__information
  .information--inner
  .table--edit
  table
  tbody
  tr:first-child
  th,
.layer-check__information
  .information--inner
  .table--edit
  table
  tbody
  tr:first-child
  td {
  border-top: none;
}
.layer-check__information .information--inner .table--edit + .f-center {
  text-align: left;
}
.layer-check__information .page__button .button-main {
  width: 168px;
}
.layer-search__teacher .layer__container {
  width: 936px;
  min-width: 936px;
  height: 878px;
}
.layer-search__keyword .layer__container {
  width: 936px;
  min-width: 936px;
}
.layer-search__keyword .layer__container .f-left {
  line-height: 24px;
}
.layer-check__attendance-detail .layer__contents {
  padding: 24px 24px 0;
}
.layer-check__attendance-detail .attendance-detail--inner table thead th {
  font-weight: 400;
}
.layer-check__attendance-detail
  .attendance-detail--inner
  table
  tbody
  tr:last-child
  .tooltip--box-wrap
  .tooltip--box-inner::before,
.layer-check__attendance-detail
  .attendance-detail--inner
  table
  tbody
  tr:last-child
  .tooltip--box-wrap
  .tooltip--box-inner::after {
  top: auto;
  bottom: 0;
  margin-bottom: 1px;
  transform: translateY(100%);
}
.layer-check__attendance-detail
  .attendance-detail--inner
  table
  tbody
  tr:last-child
  .tooltip--box-wrap
  .tooltip--box-inner::before {
  margin-left: -1px;
}
.layer-check__attendance-detail
  .attendance-detail--inner
  table
  tbody
  tr:last-child
  .tooltip--box-wrap
  .tooltip--box {
  top: auto;
  bottom: calc(100% + 8px);
}
.layer-check__attendance-detail
  .attendance-detail--inner
  table
  .tooltip--box:hover {
  display: block;
}
.layer-check__attendance-detail
  .attendance-detail--inner
  table
  .tooltip--box-text {
  overflow-y: auto;
  max-width: 300px;
  max-height: 300px;
  white-space: initial;
}
.layer-check__attendance-detail .page__button {
  padding-top: 33px;
}
.layer-check__attendance-detail.is--student .layer__container {
  width: 1048px;
  min-width: 1048px;
}
.layer-check__attendance-detail.is--student .layer__contents {
  padding-top: 14px;
  padding-right: 0;
  padding-left: 0;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--dateset {
  margin-right: 24px;
  margin-left: 24px;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list__thead {
  margin-top: 14px;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list__tbody {
  display: flex;
  flex-direction: column;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  th,
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  td {
  line-height: 24px;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  th:nth-child(1),
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  td:nth-child(1) {
  width: 84px;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  th:nth-child(2),
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  td:nth-child(2) {
  width: 200px;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  th:nth-child(3),
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  td:nth-child(3) {
  width: 210px;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  th:nth-child(4),
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  td:nth-child(4) {
  width: 180px;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  th:nth-child(5),
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  td:nth-child(5) {
  width: auto;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  th:nth-child(6),
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  td:nth-child(6) {
  width: 130px;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  th:nth-child(1) {
  width: 98px;
  padding-left: 14px;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .table--list
  table
  th:nth-child(6) {
  width: 144px;
  padding-right: 14px;
}
@media (max-width: 1199px) {
  .layer-check__attendance-detail.is--student
    .layer__contents
    .attendance-detail--inner
    .table--list
    table
    th:nth-child(1) {
    width: 10.8%;
  }
  .layer-check__attendance-detail.is--student
    .layer__contents
    .attendance-detail--inner
    .table--list
    table
    th:nth-child(2) {
    width: 20%;
  }
  .layer-check__attendance-detail.is--student
    .layer__contents
    .attendance-detail--inner
    .table--list
    table
    th:nth-child(3) {
    width: 21%;
  }
  .layer-check__attendance-detail.is--student
    .layer__contents
    .attendance-detail--inner
    .table--list
    table
    th:nth-child(4) {
    width: 18%;
  }
  .layer-check__attendance-detail.is--student
    .layer__contents
    .attendance-detail--inner
    .table--list
    table
    th:nth-child(5) {
    width: 14.8%;
  }
  .layer-check__attendance-detail.is--student
    .layer__contents
    .attendance-detail--inner
    .table--list
    table
    th:nth-child(6) {
    width: 15.4%;
  }
  .layer-check__attendance-detail.is--student
    .layer__contents
    .attendance-detail--inner
    .table--list
    table
    td:nth-child(1) {
    width: 8.7591%;
  }
  .layer-check__attendance-detail.is--student
    .layer__contents
    .attendance-detail--inner
    .table--list
    table
    td:nth-child(2) {
    width: 20.855%;
  }
  .layer-check__attendance-detail.is--student
    .layer__contents
    .attendance-detail--inner
    .table--list
    table
    td:nth-child(3) {
    width: 21.8978%;
  }
  .layer-check__attendance-detail.is--student
    .layer__contents
    .attendance-detail--inner
    .table--list
    table
    td:nth-child(4) {
    width: 18.7695%;
  }
  .layer-check__attendance-detail.is--student
    .layer__contents
    .attendance-detail--inner
    .table--list
    table
    td:nth-child(5) {
    width: 15.4327%;
  }
  .layer-check__attendance-detail.is--student
    .layer__contents
    .attendance-detail--inner
    .table--list
    table
    td:nth-child(6) {
    width: 13.5557%;
  }
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .input--datepicker {
  font-size: 16px;
}
.layer-check__attendance-detail.is--student
  .layer__contents
  .attendance-detail--inner
  .tooltip--box-wrap
  .tooltip--button {
  border-bottom: 1px solid #000000;
}
.layer-check__attendance-detail.is--student .page__button {
  padding-bottom: 28px;
}
.layer-check__attendance-detail.is--subject .layer__container {
  width: 936px;
  min-width: 936px;
}
.layer-check__attendance-detail.is--self .layer__container {
  width: 997px;
  min-width: 997px;
}
.layer-check__attendance-detail.is--self .layer__container .table--title {
  font-weight: 700;
}
.layer-check__attendance-detail.is--self
  .layer__container
  .table--list
  th:nth-child(1),
.layer-check__attendance-detail.is--self
  .layer__container
  .table--list
  td:nth-child(1) {
  padding-left: 5px;
}
.layer-check__attendance-detail.is--self
  .layer__container
  .table--list
  th:last-child,
.layer-check__attendance-detail.is--self
  .layer__container
  .table--list
  td:last-child {
  padding-right: 40px;
}
.layer-option__participate .layer__container {
  width: 936px;
  min-width: 936px;
}
.layer-option__participate .layer__container .page__button {
  padding-top: 28px;
  padding-bottom: 44px;
}
.layer-option__participate .layer__contents {
  padding: 0;
}
.layer-option__participate .layer__contents .input-radio {
  min-width: 143px;
}
.layer-option__participate .layer__contents .input-radio + .input-radio {
  margin-left: 15px;
}
.layer-option__participate
  .layer__contents
  .show--01
  .box--edit-items
  .dropdown--area:not(.width-full):not(.width-140),
.layer-option__participate
  .layer__contents
  .show--02
  .box--edit-items
  .dropdown--area:not(.width-full):not(.width-140) {
  width: 204px;
}
.layer-option__participate
  .layer__contents
  .show--01
  .input-radio:not(:first-child),
.layer-option__participate
  .layer__contents
  .show--02
  .input-radio:not(:first-child) {
  margin-left: 45px;
}
.layer-option__participate
  .layer__contents
  .input-checked-group
  .input-radio:not(:first-child) {
  margin-left: 45px;
}
@media (max-width: 1199px) {
  .layer-option__participate
    .layer__contents
    .show--03
    .box--edit-items
    dd.is--tablet-row {
    flex-wrap: nowrap;
  }
}
.layer-option__participate .layer__contents .show--03 .selected-list {
  overflow: hidden;
  overflow-y: auto;
  max-height: 248px;
}
.layer-option__participate
  .layer__contents
  .show--03
  .input-box--text.no-input {
  overflow: hidden;
  overflow-y: auto;
}
.layer-option__participate .layer__contents .selected-list.type-box {
  flex-shrink: 0;
  flex-grow: 0;
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.16);
  border-radius: 8px;
  padding: 14px;
}
.layer-option__participate .layer__contents .selected-list ul {
  display: flex;
  flex-direction: column;
}
.layer-option__participate .layer__contents .selected-list li {
  position: relative;
  background: #f6f6f6;
  border-radius: 8px;
  padding: 11px 14px;
  padding-right: 30px;
}
.layer-option__participate .layer__contents .selected-list li .f-12 {
  line-height: 14px;
}
.layer-option__participate .layer__contents .selected-list li .btn-delete {
  position: absolute;
  right: 8px;
  top: 8px;
}
.layer-option__participate .layer__contents .selected-list li.no--data {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 188px;
  color: #a6a6a6;
  font-size: 16px;
  line-height: 18px;
}
.layer-option__participate
  .layer__contents
  .selected-list
  .selected-list__title {
  margin-bottom: 8px;
  font-weight: 400;
  font-size: 14px;
  line-height: 22px;
}
.layer-option__participate
  .layer__contents
  .selected-list
  .selected-list__title
  + .p {
  margin-top: 4px;
}
@media (max-width: 1199px) {
  .layer-option__participate .layer__contents .input-radio {
    min-width: 123px;
  }
  .layer-option__participate .layer__contents .input-radio + .input-radio {
    margin-left: 0px;
  }
}
.layer-option__roulettetext .layer__container {
  width: 936px;
  min-width: 936px;
}
.layer-option__roulettetext .layer__container .page__button {
  padding-top: 28px;
  padding-bottom: 44px;
}
.layer-option__roulettetext .layer__container .input-box--text {
  font-size: 16px;
}
.layer-option__roulettetext .layer__contents {
  padding: 0;
}
.layer-seating__save .layer__container {
  width: 697px;
}
.layer-seating__save .layer__container .box--edit {
  padding: 0;
}
.layer-seating__save .layer__container .page__button {
  padding-top: 36px;
}
.layer-seating__save .layer__contents {
  padding-top: 24px;
}
.layer-option__sticker .layer__container {
  width: 936px;
  min-width: 936px;
}
.layer-option__sticker .layer__container .page__button {
  padding-top: 28px;
  padding-bottom: 44px;
}
.layer-option__sticker .layer__container .input-box--text {
  font-size: 16px;
}
.layer-option__sticker .layer__container .box--edit-items > dl > dt {
  width: auto;
  margin-right: 16px;
}
.layer-option__sticker .layer__container .ico {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 56px;
  height: 56px;
  flex-shrink: 0;
  background-size: 100%;
  border-radius: 100%;
  font-size: 0;
}
.layer-option__sticker .layer__container .ico .button-icon {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 20px;
  height: 20px;
  background-color: #ffffff;
}
.layer-option__sticker .layer__container .ico .button-icon p[class^="ico"] {
  opacity: 0.3;
}
.layer-option__sticker .layer__container .ico .button-icon .ico-edit-black {
  background-image: url("../images/ico/pencle-black.svg");
}
.layer-option__sticker .layer__container .sticker-1 {
  background-color: #d1eff3;
}
.layer-option__sticker .layer__container .sticker-2 {
  background-color: #ffd5d5;
}
.layer-option__sticker .layer__container .sticker-3 {
  background-color: #dbeaff;
}
.layer-option__sticker .layer__container .sticker-4 {
  background-color: #fff1e2;
}
.layer-option__sticker .layer__container .sticker-5 {
  background-color: #e2fbff;
}
.layer-option__sticker .layer__container .sticker-6 {
  background-color: #fff0cb;
}
.layer-option__sticker .layer__container .sticker-7 {
  background-color: #e2f8e4;
}
.layer-option__sticker .layer__container .sticker-8 {
  background-color: #f5dbfc;
}
.layer-option__sticker .layer__container .sticker-9 {
  background-color: #dff6f2;
}
.layer-option__sticker .layer__container .sticker-10 {
  background-color: #ffecda;
}
.layer-option__sticker .layer__container .sticker-11 {
  background-color: #f4f9cd;
}
.layer-option__sticker .layer__container .sticker-12 {
  background-color: #ffeaf5;
}
.layer-option__sticker .layer__container .sticker-10 {
  background-size: 50px 50px;
  background-position: 50% 50%;
}
.layer-option__sticker .layer__container .sticker-check {
  position: relative;
  width: 56px;
  height: 56px;
  font-size: 0;
}
.layer-option__sticker .layer__container .sticker-check__list {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
}
.layer-option__sticker .layer__container .sticker-check input {
  position: absolute;
  width: 56px;
  height: 56px;
  appearance: none;
  z-index: 2;
  border-radius: 100%;
}
.layer-option__sticker .layer__container .sticker-check input:checked {
  background-color: rgba(0, 0, 0, 0.3);
}
.layer-option__sticker
  .layer__container
  .sticker-check
  input:checked
  + .ico::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 22px;
  height: 20px;
  background-image: url("../images/ico/check-white.svg");
  background-repeat: no-repeat;
  z-index: 5;
}
.layer-option__sticker .layer__container .layer-inner {
  width: 466px;
  left: 48px;
  top: 42px;
}
.layer-option__sticker .layer__container .layer-inner.last {
  top: inherit;
  bottom: 20px;
}
.layer-option__sticker .layer__container .layer-inner.middle {
  top: 50%;
  transform: translateY(-50%);
  left: 65px;
  margin-top: -10px;
  bottom: inherit;
}
.layer-option__sticker .layer__contents {
  padding: 0;
  min-height: 240px;
}
.layer-search__plan .layer__container {
  width: 1005px;
  min-width: 1005px;
}
.layer-search__plan .layer__container .table--list th:last-child,
.layer-search__plan .layer__container .table--list td:last-child {
  padding-right: 14px;
}
.layer-search__plan .layer__container .table--list td:not(.empty):nth-child(1) {
  padding-left: 34px;
  text-align: left;
}
.layer-search__plan .layer__container .table--list td:not(.empty):nth-child(3) {
  padding-left: 51px;
  text-align: left;
}
.layer-search__plan .layer__container .table--list .button-main.is--msmall {
  width: 83px;
}
.layer-search__plan .page__button {
  padding: 84px 0 28px;
}
.layer-check__plan .layer__container .layer__contents {
  padding: 0 0 32px;
}
.layer-list__thumbnail .layer__container {
  width: 1176px;
  min-width: 1176px;
  height: 923px;
}
.layer-list__thumbnail .layer__container .layer__contents {
  height: 100%;
  padding: 14px 0 56px 0;
}
.layer-list__thumbnail .layer__container .layer__contents .tab-box {
  height: 54px;
}
.layer-list__thumbnail .layer__container .layer__contents .tab--wrapper {
  height: 100%;
}
.layer-list__thumbnail .layer__container .layer__contents .tab--contents {
  /* height: 100%; */
  padding: 28px 36px 0;
}
.layer-list__thumbnail
  .layer__container
  .layer__contents
  .box--search
  .dropdown--area {
  width: 150px;
}
.layer-list__thumbnail
  .layer__container
  .layer__contents
  .box--search
  .button-main {
  width: 98px;
}
@media (max-width: 1199px) {
  .layer-list__thumbnail
    .layer__container
    .layer__contents
    .box--search
    .dropdown--area {
    width: 100px;
  }
  .layer-list__thumbnail
    .layer__container
    .layer__contents
    .box--search
    .button-main {
    width: 80px;
  }
}
.layer-list__thumbnail .layer__container .layer__contents .list--lesson {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 24px;
  flex-wrap: wrap;
  min-height: 448px;
  padding-top: 24px;
}
.layer-list__thumbnail .layer__container .layer__contents .list--lesson li {
  width: calc((100% - 72px) / 4);
}
@media (max-width: 1199px) {
  .layer-list__thumbnail .layer__container .layer__contents .list--lesson li {
    width: calc((100% - 48px) / 3);
  }
}
.layer-list__thumbnail
  .layer__container
  .layer__contents
  .list--lesson
  + .pagenavi--box {
  margin-top: 32px;
}
.layer-list__thumbnail .layer__container .layer__contents .box--empty {
  width: 100%;
  min-height: 214px;
  height: calc(100% - 40px);
  padding-bottom: 28px;
}
.layer-list__thumbnail .layer__container .page__button {
  padding: 20px 0 40px;
}
.layer-list__thumbnail.layer-edit__video
  .layer__container
  .layer__contents
  .recommend--item
  .input--border {
  border-width: 2px;
}
.layer-list__thumbnail.layer-edit__video
  .layer__container
  .layer__contents
  .recommend--item
  input[type="checkbox"],
.layer-list__thumbnail.layer-edit__video
  .layer__container
  .layer__contents
  .recommend--item
  .input-check {
  left: auto;
  right: 16px;
}
.layer-list__thumbnail.layer-edit__video
  .layer__container
  .layer__contents
  .recommend--item
  input:checked
  + .input-check.input--out
  .input--box::before {
  background-color: #7e44fb;
  border-color: rgba(255, 255, 255, 0.5);
}
.layer-list__thumbnail.layer-edit__document .textbook--item {
  border: none;
}
.layer-list__thumbnail.layer-edit__document .textbook--item .item--top-box {
  overflow: hidden;
  height: 164px;
  padding: 19px 16px;
  border-radius: 16px;
}
@media (max-width: 1199px) {
  .layer-list__thumbnail.layer-edit__document .textbook--item .item--top-box {
    height: 0;
    padding: 0 16px 62.1212%;
  }
}
.layer-list__thumbnail.layer-edit__document
  .textbook--item
  .item--top-box::before {
  width: 80px;
  height: 80px;
  right: 16px;
  bottom: 16px;
}
.layer-list__thumbnail.layer-edit__document
  .textbook--item
  .item--top-box
  input[type="checkbox"] {
  position: absolute;
  width: 24px;
  height: 24px;
  top: 16px;
  right: 16px;
  opacity: 0;
  z-index: 15;
}
.layer-list__thumbnail.layer-edit__document
  .textbook--item
  .item--top-box
  .input-check {
  position: absolute;
  top: 16px;
  right: 16px;
}
.layer-list__thumbnail.layer-edit__document
  .textbook--item
  .item--top-box
  .input--border {
  position: absolute;
  display: none;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 2px solid #7e44fb;
  border-radius: 16px;
}
.layer-list__thumbnail.layer-edit__document
  .textbook--item
  .item--top-box
  input:checked
  + .input-check.input--out
  .input--box::before {
  background-color: #7e44fb;
  border-color: rgba(255, 255, 255, 0.5);
}
.layer-list__thumbnail.layer-edit__document
  .textbook--item
  .item--top-box
  input:checked
  + .input-check
  + .input--border {
  display: block;
}
.layer-list__thumbnail.layer-edit__document
  .textbook--item
  .item--top-box
  .state-box.ing {
  padding: 7px 10px;
  margin-top: 8px;
  background-color: #f7f3ff;
  font-size: 16px;
  font-weight: 700;
  line-height: 18px;
}
.layer-list__thumbnail.layer-edit__document
  .textbook--item
  .item--top-box
  .top-box--sub {
  font-size: 16px;
  font-weight: 400;
  line-height: 18px;
}
@media (max-width: 1199px) {
  .layer-list__thumbnail.layer-edit__document
    .textbook--item
    .item--top-box
    .top-box--sub {
    margin-top: 19px;
  }
}
.layer-list__thumbnail.layer-edit__document
  .textbook--item
  .item--top-box
  .top-box--title {
  position: absolute;
  left: 16px;
  bottom: 16px;
  font-size: 20px;
  font-weight: 700;
  line-height: 23px;
}
.layer-list__thumbnail.layer-edit__document .textbook--item .item--bottom-box {
  padding: 0;
}
.layer-list__thumbnail.layer-edit__document
  .textbook--item
  .item--bottom-box
  .bottom-box--title {
  margin-top: 14px;
}
.layer-list__thumbnail.layer-edit__workbook .textbook--item {
  border: none;
}
.layer-list__thumbnail.layer-edit__workbook .textbook--item .item--top-box {
  overflow: hidden;
  height: 164px;
  padding: 19px 16px;
  border-radius: 16px;
}
@media (max-width: 1199px) {
  .layer-list__thumbnail.layer-edit__workbook .textbook--item .item--top-box {
    height: 0;
    padding: 0 16px 62.1212%;
  }
}
.layer-list__thumbnail.layer-edit__workbook
  .textbook--item
  .item--top-box::before {
  width: 80px;
  height: 80px;
  right: 16px;
  bottom: 16px;
}
.layer-list__thumbnail.layer-edit__workbook
  .textbook--item
  .item--top-box
  input[type="checkbox"] {
  position: absolute;
  width: 24px;
  height: 24px;
  top: 16px;
  right: 16px;
  opacity: 0;
  z-index: 15;
}
.layer-list__thumbnail.layer-edit__workbook
  .textbook--item
  .item--top-box
  .input-check {
  position: absolute;
  top: 16px;
  right: 16px;
}
.layer-list__thumbnail.layer-edit__workbook
  .textbook--item
  .item--top-box
  .input--border {
  position: absolute;
  display: none;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 2px solid #7e44fb;
  border-radius: 16px;
}
.layer-list__thumbnail.layer-edit__workbook
  .textbook--item
  .item--top-box
  input:checked
  + .input-check.input--out
  .input--box::before {
  background-color: #7e44fb;
  border-color: rgba(255, 255, 255, 0.5);
}
.layer-list__thumbnail.layer-edit__workbook
  .textbook--item
  .item--top-box
  input:checked
  + .input-check
  + .input--border {
  display: block;
}
.layer-list__thumbnail.layer-edit__workbook
  .textbook--item
  .item--top-box
  .state-box.ing {
  padding: 5px 10px;
  background-color: #f7f3ff;
  font-size: 14px;
  font-weight: 700;
  line-height: 16px;
  height: 26px;
}
@media (max-width: 1199px) {
  .layer-list__thumbnail.layer-edit__workbook
    .textbook--item
    .item--top-box
    .top-box--category {
    margin-top: 16px;
  }
}
.layer-list__thumbnail.layer-edit__workbook
  .textbook--item
  .item--top-box
  .top-box--sub {
  font-size: 16px;
  font-weight: 400;
  line-height: 18px;
}
.layer-list__thumbnail.layer-edit__workbook
  .textbook--item
  .item--top-box
  .top-box--title {
  position: absolute;
  right: 16px;
  bottom: 16px;
  left: 16px;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  height: 50px;
}
.layer-list__thumbnail.layer-edit__workbook
  .textbook--item
  .item--top-box
  .top-box--subcategory {
  position: absolute;
  right: 16px;
  bottom: 74px;
  left: 16px;
}
.layer-preview__box {
  z-index: 1000;
}
.layer-preview__box .layer__container {
  width: 1272px;
  min-width: 1272px;
}
.layer-preview__box .layer__container .layer__contents {
  padding: 0;
}
.layer-write__activity .layer__container,
.layer-write__survey .layer__container {
  overflow: visible;
  width: 1137px;
  min-width: 1137px;
}
.layer-write__activity .layer__container .layer__contents,
.layer-write__survey .layer__container .layer__contents {
  padding: 0 10px;
}
.layer-write__activity .layer__container .page__button,
.layer-write__survey .layer__container .page__button {
  padding: 48px 0;
}
.layer-write__activity .layer__container .page__button .page__button-right,
.layer-write__survey .layer__container .page__button .page__button-right {
  width: auto;
  top: 48px;
  right: 34px;
}
.layer-write__activity
  .layer__container
  .page__button
  .page__button-right
  .button-text,
.layer-write__survey
  .layer__container
  .page__button
  .page__button-right
  .button-text {
  flex-shrink: 1;
  flex-grow: 1;
  padding-right: 12px;
  padding-left: 12px;
  margin-top: 7px;
  white-space: nowrap;
}
.layer-write__activity .layer__container .button-items-control,
.layer-write__survey .layer__container .button-items-control {
  display: flex;
  flex-direction: row;
  justify-content: end;
  align-items: center;
  width: 100%;
  opacity: 0.7;
  margin-top: 4px;
  margin-right: -4px;
}
.layer-write__activity .layer__container .button-box-delete,
.layer-write__survey .layer__container .button-box-delete {
  margin-right: -4px;
  margin-left: 8px;
}
.layer-write__activity .layer__container .box--edit-items + .open-box,
.layer-write__survey .layer__container .box--edit-items + .open-box {
  margin-top: 16px;
}
.layer-write__activity .layer__container .open-box + .open-box,
.layer-write__survey .layer__container .open-box + .open-box {
  margin-top: 24px;
}
.layer-write__activity .layer__container textarea,
.layer-write__survey .layer__container textarea {
  padding: 12px 14px;
}
.layer-write__notice .layer__container {
  width: 1128px;
  min-width: 1128px;
}
.layer-write__notice .layer__container .layer__contents {
  padding: 0;
}
.layer-write__notice .layer__container .layer__contents .input-box--text .f-14 {
  font-size: 16px;
}
.layer-write__notice .layer__container .layer__contents .tooltip--box {
  top: auto;
  bottom: calc(100% + 12px);
}
.layer-write__notice .layer__container .page__button {
  padding: 42px 0 48px 0;
}
.layer-group__manage .layer__container {
  width: 936px;
  min-width: 936px;
}
.layer-group__manage .layer__container .layer__contents {
  padding: 0 34px 58px;
  text-align: left;
}
.layer-group__manage .layer__container .layer__contents .box--edit {
  padding-left: 0;
  padding-right: 0;
}
.layer-group__manage
  .layer__container
  .layer__contents
  .box--edit
  .box--edit-title
  + .box--edit-setting {
  margin-top: 18px;
}
.layer-group__manage
  .layer__container
  .layer__contents
  .box--edit
  .box--edit-setting {
  margin-bottom: 24px;
}
.layer-group__manage
  .layer__container
  .layer__contents
  .box--edit
  .box--edit-setting
  .button-text {
  padding-left: 12px;
  padding-right: 14px;
}
.layer-group__manage
  .layer__container
  .layer__contents
  .box--edit
  .box--edit-item {
  margin-top: 24px;
}
.layer-group__manage .layer__container .layer__contents .info-tag__menu {
  margin-right: auto;
  margin-left: auto;
}
.layer-group__manage .layer__container .page__button {
  padding: 18px 0 28px 0;
}
.layer-group__manage.type--add .layer__container .layer__contents,
.layer-group__manage.type--modify .layer__container .layer__contents {
  padding-bottom: 20px;
}
.layer-repeat__cycle .layer__container {
  width: 657px;
}
.layer-repeat__cycle .layer__container .layer__contents {
  padding: 22px 24px 28px;
}
.layer-repeat__cycle .layer__container .layer__contents .box--edit {
  width: 100%;
  padding: 0;
  /* [이슈리스트 : 0825][2558] 반복 주기 설정 팝업 : 스크롤 작동 처리 */
  height: 100%;
}
.layer-repeat__cycle .layer__container .layer__contents dl dt {
  width: 108px;
}
.layer-repeat__cycle .layer__container .layer__contents dl dd .box-flex {
  width: 100%;
}
.layer-repeat__cycle
  .layer__container
  .layer__contents
  dl
  dd
  .dropdown--area:not(.width-full):not([class*="width"]) {
  width: 167px;
}
.layer-repeat__cycle .layer__container .layer__contents .input-box--datetime {
  width: calc((100% - 33px) / 2);
}
.layer-repeat__cycle
  .layer__container
  .layer__contents
  .input-box--datetime
  .dropdown--area {
  flex-shrink: 1;
  flex-grow: 1;
  width: auto;
}
.layer-repeat__cycle
  .layer__container
  .layer__contents
  .input-box--datetime
  + .f-16-sb {
  width: 33px;
}
.layer-repeat__cycle .layer__container .layer__contents .cycle__day-time dt {
  line-height: 36px;
}
.layer-repeat__cycle
  .layer__container
  .layer__contents
  .cycle__day
  .dropdown--box {
  max-height: 181px;
}
.layer-repeat__cycle
  .layer__container
  .layer__contents
  .cycle__week-time
  dd
  .flex--fixed.width-50 {
  width: 56px;
}
.layer-repeat__cycle .layer__container .page__button {
  justify-content: center;
  padding-top: 24px !important;
}
.layer-repeat__cycle .layer__container .page__button a:not([class*="width"]),
.layer-repeat__cycle
  .layer__container
  .page__button
  button:not([class*="width"]) {
  margin: 0;
}
.layer-feedback__write .layer__container {
  width: 682px;
  max-height: 579px;
}
.layer-feedback__write .layer__container .layer__contents {
  padding-top: 24px;
  height: calc(100% - 128px);
}
.layer-feedback__write .layer__container .page__button {
  padding-top: 0px;
  padding-bottom: 28px;
}
.layer-feedback__write .layer__container .input-box--textarea {
  height: 100%;
}
.layer-feedback__write .layer__container .input-box--textarea textarea {
  max-height: 379px;
  min-height: 200px;
}
.layer-setting__attendance .layer__container .layer__contents {
  padding: 14px 34px 34px;
}
.layer-setting__attendance .layer__container .layer__contents .button-main {
  min-width: 94px;
  padding: 0 13px;
}
.layer-setting__attendance
  .layer__container
  .layer__contents
  .dropdown--area.has--data
  .dropdown--select {
  color: inherit;
}
.layer-setting__attendance .layer__container .layer__contents .padding-l-15 {
  padding-left: 0 !important;
}
.layer-setting__attendance .layer__container .layer__contents .td-title--text {
  font-weight: 400;
}
.layer-setting__attendance.live .layer__container {
  width: 838px;
  min-width: 838px;
}
.layer-setting__attendance.video .layer__container {
  width: 1059px;
  min-width: 1059px;
}
.layer-setting__attendance.livevideo .layer__container {
  width: 1247px;
  min-width: 1247px;
}
.layer-modify__coursecomplete .layer__container {
  width: 963px;
  min-width: 963px;
}
.layer-modify__coursecomplete .layer__container .layer__contents {
  padding: 24px 34px 0px;
}
.layer-modify__coursecomplete
  .layer__container
  .layer__contents
  .dropdown--area.has--data
  .dropdown--select {
  color: inherit;
}
.layer-modify__coursecomplete
  .layer__container
  .layer__contents
  .dropdown--item[data-color="f-green"] {
  font-weight: 700;
  color: #00ba13;
}
.layer-modify__coursecomplete
  .layer__container
  .layer__contents
  .dropdown--item[data-color="f-red"] {
  font-weight: 700;
  color: #ff3a3a;
}
.layer-modify__coursecomplete
  .layer__container
  .layer__contents
  .padding-l-15.td-title {
  padding-left: 0 !important;
}
.layer-modify__coursecomplete .layer__container .page__button {
  padding: 0 0 28px;
}
.layer-search__addstudent .layer__container {
  width: 699px;
}
.layer-search__addstudent .layer__container .layer__contents {
  padding: 24px 34px 0px;
}
.layer-search__addstudent .layer__container .page__button {
  padding: 48px 0;
}
.layer-check__requeststate .layer__container {
  width: 699px;
}
.layer-check__requeststate .layer__container .layer__contents {
  padding: 24px 34px 0px;
}
.layer-check__requeststate .layer__container .page__button {
  padding: 0px 0 28px;
}
.layer-option__seating .layer__container {
  width: 1080px;
  min-width: 1080px;
}
@media (max-width: 1199px) {
  .layer-option__seating .layer__container {
    width: 952px;
    min-width: 952px;
  }
}
.layer-option__seating .layer__container .layer__contents {
  padding: 24px 24px 0px;
}
.layer-option__seating .layer__container .page__button {
  padding: 48px 0 48px;
}
.layer-option__seating .layer__container .seating-old {
  padding: 0;
}
.layer-option__seating .layer__container .seating-old .seating__layout {
  height: 500px;
}
.layer-option__seating .layer__container .seating-old .seating__layout--title {
  margin-top: 63px;
  margin-bottom: 44px;
}
.layer-option__seating
  .layer__container
  .seating-old
  .seating__layout:not(.is--empty)
  .student__layout {
  justify-content: flex-start;
  height: 100%;
}
.layer-option__seating
  .layer__container
  .seating-old
  .seating__layout:not(.is--empty)
  .student__layout
  .layout--desk.is--teacher {
  flex-shrink: 0;
  flex-grow: 0;
}
.layer-option__seating .layer__container .seating-old .setting__history {
  height: 500px;
}
.layer-option__seating
  .layer__container
  .seating-old
  .setting__history--box
  .date {
  font-size: 14px;
}
.layer-option__seating
  .layer__container
  .seating-old
  .setting__history--box
  .text {
  font-size: 12px;
}
.layer-group__drawing .layer__container {
  width: 450px;
}
.layer-group__drawing .layer__container .layer__contents {
  padding: 40px 10px;
}
.layer-group__drawing .layer__container .page__button {
  padding: 0px 0px 28px;
}
.layer-write__simplelesson .layer__container {
  width: 1138px;
  min-width: 1138px;
}
.layer-write__simplelesson .layer__container .layer__contents {
  padding: 0px 10px 24px;
}
.layer-write__simplelesson
  .layer__container
  .layer__contents
  .box--edit
  > div
  + div {
  margin-top: 35px;
}
.layer-write__simplelesson .layer__container .page__button {
  padding: 24px 0px 48px;
}
.layer-write__lecture .layer__container {
  width: 1138px;
  min-width: 1138px;
}
.layer-write__lecture .layer__container .layer__contents {
  padding: 0px 10px 24px;
}
.layer-write__lecture .layer__container .layer__contents .preview-box {
  position: relative;
  width: 306px;
  height: 171px;
  border-radius: 8px;
  overflow: hidden;
  margin-top: 16px;
}
.layer-write__lecture .layer__container .layer__contents .preview-box video {
  position: relative;
  z-index: 1;
}
.layer-write__lecture
  .layer__container
  .layer__contents
  .preview-box
  .button-play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 42px;
  height: 42px;
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 100%;
  z-index: 2;
}
.layer-write__lecture
  .layer__container
  .layer__contents
  .preview-box
  .button-play
  span {
  vertical-align: middle;
  background-position: 90% 50%;
}
.layer-write__lecture .layer__container .page__button {
  padding: 24px 0px 48px;
}
.layer-write__lecture .layer__container .no-input .f-16 {
  font-size: 16px;
  font-weight: 400;
}
.layer-option__distribute .layer__container {
  width: 1138px;
  min-width: 1138px;
}
.layer-option__distribute .layer__container .layer__contents {
  padding: 0px 0px 24px;
}
.layer-option__distribute .layer__container .page__button {
  padding: 24px 0px 48px;
}
.layer-option__distribute .layer__container .open-box {
  position: static;
}
.layer-option__distribute.is--workbook .open-box.disabled .open-box--contents {
  opacity: 0.3;
}
.layer-write__textbook .layer__container {
  width: 1138px;
  min-width: 1138px;
}
.layer-write__textbook .layer__container .layer__contents {
  padding: 0px 10px 24px;
}
.layer-write__textbook .layer__container .layer__contents .preview-box {
  position: relative;
  width: 306px;
  height: 171px;
  border-radius: 8px;
  overflow: hidden;
  margin-top: 16px;
}
.layer-write__textbook .layer__container .layer__contents .preview-box video {
  position: relative;
  z-index: 1;
}
.layer-write__textbook
  .layer__container
  .layer__contents
  .preview-box
  .button-play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 42px;
  height: 42px;
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 100%;
  z-index: 2;
}
.layer-write__textbook
  .layer__container
  .layer__contents
  .preview-box
  .button-play
  span {
  vertical-align: middle;
  background-position: 90% 50%;
}
.layer-write__textbook .layer__container .layer__contents .no-input .f-16 {
  font-weight: 400;
}
.layer-write__textbook .layer__container .page__button {
  padding: 24px 0px 48px;
}
.layer-option__classassign .layer__container {
  width: 833px;
  min-width: 833px;
}
.layer-option__classassign .layer__container .layer__contents {
  padding: 24px 10px 0px;
}
.layer-option__classassign .layer__container .box--search {
  margin: 0 24px;
}
.layer-option__classassign .layer__container .label--block label .input--text {
  text-align: center;
}
.layer-option__classassign .layer__container .label--block label .input--box {
  padding-left: 14px;
}
.layer-option__classassign .layer__container .label--block .list__thead {
  height: 46px;
}
.layer-option__classassign .layer__container .label--block .list__tbody {
  height: 340px;
  padding: 0 16px;
}
.layer-send__sms .layer__container {
  width: 833px;
  min-width: 833px;
}
.layer-send__sms .layer__container .layer__contents {
  padding: 0px 10px 0px;
}
.layer-send__sms .layer__container .page__button {
  padding: 48px 0px 48px;
}
.layer-send__sms .layer__container .label--block label .input--text {
  text-align: center;
}
.layer-send__sms .layer__container .label--block label .input--box {
  padding-left: 14px;
}
.layer-send__sms .layer__container .label--block .list__thead {
  height: 46px;
}
.layer-send__sms .layer__container .label--block .list__tbody {
  height: 340px;
  padding: 0 16px;
}
.layer-list__video.no--data .layer__contents {
  height: 100%;
}
.layer-list__video .layer__container {
  width: 1272px;
  min-width: 1272px;
}
.layer-list__video .layer__container .layer__contents {
  padding: 0;
}
.layer-list__video .layer__container .page__button {
  padding: 88px 0 28px;
}
.layer-list__video .layer__container .preview-box__video {
  width: 59.132%;
  max-width: 744px;
  padding-top: 33%;
}
@media (max-width: 1199px) {
  .layer-list__video .layer__container .preview-box__video {
    width: 56.132%;
  }
}
.layer-list__video .layer__container .preview-box__description {
  position: relative;
  width: 100%;
  padding: 28px 34px 30px 30px;
}
.layer-list__video .layer__container .preview-box__description .dropdown--area {
  margin-top: -7px;
  margin-left: 5px;
  flex-shrink: 0;
}
@media (max-width: 1199px) {
  .layer-list__video .layer__container .preview-box__description {
    padding: 20px 24px 20px 20px;
  }
}
.layer-list__video .layer__container .description-text {
  margin-top: 22px;
}
.layer-list__video .layer__container .description-title {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-all; /* 241125 추가 */
}
/* @media (max-width: 1199px) { 241125 삭제
  .layer-list__video .layer__container .description-title {
    min-height: 62px;
  }
} */
.layer-list__video .layer__container .description-button {
  position: absolute;
  bottom: 28px;
  left: 35px;
}
@media (max-width: 1199px) {
  .layer-list__video .layer__container .description-button {
    left: 25px;
    bottom: 18px;
  }
  .layer-list__video .layer__container .description-button .btn + .btn {
    margin-left: 20px;
  }
  .layer-list__video .layer__container .description-button .btn .text {
    margin-top: 6px;
  }
}
.layer-list__video .layer__container .video-box {
  border-top: 1px solid #d9d9d9;
  padding: 29px 0 0 34px;
}
.layer-list__video .layer__container .video-box.is--hide .list--video {
  display: none;
}
.layer-list__video .layer__container .video-box.is--hide.open .list--video {
  display: flex;
}
.layer-list__video .layer__container .video-box.is--hide.open .button-icon {
  transform: rotate(180deg);
}
.layer-list__video .layer__container .video-control {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  position: relative;
  padding-bottom: 14px;
}
.layer-list__video .layer__container .video-control__titles {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.layer-list__video .layer__container .video-control__titles .divider {
  position: relative;
}
.layer-list__video
  .layer__container
  .video-control__titles
  .divider
  + .divider {
  padding-left: 13px;
  margin-left: 12px;
}
.layer-list__video
  .layer__container
  .video-control__titles
  .divider
  + .divider::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 14px;
  background-color: #000000;
  opacity: 0.3;
}
.layer-list__video .layer__container .video-control__titles button {
  margin: -10px 0 0 20px;
}
.layer-list__video .layer__container .video-control__title {
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
}
.layer-list__video .layer__container .video-control .button-icon {
  position: absolute;
  right: 26px;
  top: -10px;
}
.layer-list__video .layer__container .list--video {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 20px;
  overflow-x: auto;
  padding-bottom: 32px;
}
.layer-list__video .layer__container .list--video li {
  width: 272px;
}
.layer-list__video .layer__container .list--video .recommend--item {
  flex-shrink: 0;
  flex-grow: 0;
}
.layer-list__video
  .layer__container
  .list--video
  .recommend--item
  .recommend--thum {
  border-radius: 8px;
}
.layer-list__video
  .layer__container
  .list--video
  .recommend--item
  input[type="radio"] {
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
}
.layer-list__video
  .layer__container
  .list--video
  .recommend--item
  .input-radio {
  display: none;
}
.layer-list__video
  .layer__container
  .list--video
  .recommend--item
  input:checked
  ~ [class^="ico-"] {
  display: block;
}
.layer-list__video
  .layer__container
  .list--video
  .recommend--item
  .input--border {
  border-radius: 8px;
  backdrop-filter: blur(5px);
  background: rgba(126, 68, 251, 0.4);
}
.layer-list__video .layer__container .list--video .recommend--item .image {
  border-radius: 8px;
}
.layer-list__video
  .layer__container
  .list--video
  .recommend--item
  [class^="ico-"] {
  position: absolute;
  display: none;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 16;
}
.layer-list__video .layer__container .list--video .recommend--item .state-info {
  position: absolute;
  z-index: 14;
  left: 12px;
  top: 12px;
  display: inline-block;
  height: 20px;
  background: #7e44fb;
  border-radius: 16px;
  font-weight: 700;
  font-size: 12px;
  line-height: 14px;
  color: #ffffff;
  padding: 5px 8px 3px;
}
.layer-list__video .layer__container .list--video .recommend--title {
  font-size: 14px;
  font-weight: 400;
  margin-top: 10px;
  word-break: break-all; /*241125 추가*/
}
.layer-list__video .layer__container .box--empty {
  height: 100%;
}
.layer-list__video .layer__container .watching-list-box {
  padding: 19px 24px;
  border-top: 1px solid #d9d9d9;
}
.layer-list__video .layer__container .watching-list-box .is--scroll-y {
  margin: 0 -24px;
}
.layer-list__video .layer__container .video-err {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #000000;
  font-size: 16px;
  line-height: 20px;
}
.layer-area.layer-list__watching {
  /* 241127 이슈 280 추가 */
  min-width: fit-content;
}
.layer-list__watching .layer__container {
  width: 1272px;
  min-width: 1272px;
}
.layer-list__watching .layer__container .layer__contents {
  padding: 36px 34px;
}
.layer-list__watching .layer__container .layer__contents .state-box {
  height: 30px;
  border-radius: 35px;
  padding-top: 6px;
}
.layer-list__watching .layer__container .page__button {
  padding: 88px 0 28px;
}
.layer-option__assessment .layer__container {
  width: 1126px;
  min-width: 1126px;
}
.layer-option__assessment .layer__container .layer__contents {
  padding: 0;
}
.layer-option__assessment
  .layer__container
  .layer__contents
  .box--edit-items
  .input-check {
  width: 120px;
}
.layer-option__assessment .layer__container .page__button {
  padding: 88px 0 28px;
}
.layer-signupclass__pw .layer__container {
  width: 569px;
}
.layer-signupclass__pw .layer__container .layer__contents {
  padding: 24px 24px 0;
}
.layer-signupclass__pw .signupclass__pw-guide {
  padding: 24px;
}
.layer-signupclass__pw .signupclass__pw-textbox {
  margin-top: 24px;
}
.layer-signupclass__pw .signupclass__pw-textbox p {
  line-height: 22px;
}
.layer-signupclass__pw .signupclass__pw-textbox p + p {
  margin-top: 17px;
}
.layer-signupclass__pw .input-box {
  margin-top: 24px;
  font-size: 16px;
}
.layer-signupclass__pw .signupclass__pw-desc {
  margin-top: 6px;
}
.layer-write__question .layer__container {
  width: 1128px;
  min-width: 1128px;
}
.layer-write__question .layer__container .layer__contents {
  padding: 0px 10px 24px;
}
.layer-write__question
  .layer__container
  .layer__contents
  .input-box
  .f-bold.f-black-35 {
  font-weight: 400;
}
.layer-write__question .layer__container .page__button {
  padding: 24px 0px 48px;
}
.layer-search__completestate .layer__container {
  width: 1139px;
  min-width: 1139px;
}
.layer-search__completestate .layer__container .layer__contents {
  height: 100%;
  padding: 14px 0 0px 0;
}
.layer-search__completestate
  .layer__container
  .layer__contents
  .tooltip--box-wrap {
  font-size: 0;
}
.layer-search__completestate
  .layer__container
  .layer__contents
  .tab-tags--wrapper.is--scroll
  .tab-tags--box:not(.tags-select)
  .tag--button {
  width: 270px;
}
.layer-search__completestate
  .layer__container
  .layer__contents
  .tab-tags
  .tag--button {
  max-width: 320px;
}
.layer-search__completestate .layer__container .layer__contents .tab-text {
  font-weight: 700;
}
.layer-search__completestate .layer__container .layer__contents .tab--button {
  color: rgba(0, 0, 0, 0.6);
  font-weight: 700;
}
.layer-search__completestate
  .layer__container
  .layer__contents
  .tab--button.active {
  color: black;
  font-size: 18px;
}
.layer-search__completestate .layer__container .layer__contents .tab--contents {
  padding: 29px 24px 40px;
}
.layer-search__completestate
  .layer__container
  .layer__contents
  .table--list.is--scroll-y {
  margin: 0 -24px;
}
.layer-search__completestate
  .layer__container
  .layer__contents
  .table--list.is--scroll-y
  .table--list__thead
  tr
  th {
  font-weight: 400;
}
.layer-search__completestate
  .layer__container
  .layer__contents
  .table--list.is--scroll-y
  .table--list__tbody {
  position: relative;
  padding-right: 0px;
  padding-left: 0px;
  margin-right: 24px;
  margin-left: 24px;
}
.layer-search__completestate
  .layer__container
  .layer__contents
  .table--list.is--scroll-y
  .table--list__tbody::before,
.layer-search__completestate
  .layer__container
  .layer__contents
  .table--list.is--scroll-y
  .table--list__tbody::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 100%;
  top: 0;
  background-color: #ffffff;
  z-index: 5;
}
.layer-search__completestate
  .layer__container
  .layer__contents
  .table--list.is--scroll-y
  .table--list__tbody::after {
  right: 0;
}
.layer-search__completestate .layer__container .layer__contents .link-name {
  display: flex;
  flex-direction: row;
  align-items: center;
  display: inline-flex;
  margin-right: -18px;
  font-weight: 700;
}
.layer-search__completestate
  .layer__container
  .layer__contents
  .link-name
  .ico-next-black {
  vertical-align: middle;
  margin-top: -1px;
}
.layer-search__completestate.is--class .layer__contents {
  height: 100%;
  padding: 11px 0 0px 0;
}
.layer-search__completestate.is--class .completestate-info {
  padding: 28px 0;
}
.layer-search__completestate.is--class .completestate-info + .table--list {
  margin-top: 0 !important;
}
.layer-search__completestate.is--class .completestate__titles {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.layer-search__completestate.is--class .completestate__titles p {
  font-weight: 700;
  font-size: 22px;
  line-height: 25px;
  margin-right: 4px;
}
.layer-search__completestate.is--class .completestate__titles .sub_text {
  position: absolute;
  right: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 20px;
  text-align: right;
  color: rgba(0, 0, 0, 0.6);
}
.layer-search__completestate.is--class .completestate__date {
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  color: rgba(0, 0, 0, 0.6);
  margin-top: 18px;
}
.layer-search__completestate.is--class .completestate-box {
  border-radius: 16px;
  height: 124px;
  background-color: #f9f9f9;
  padding: 20px 0 16px;
}
.layer-search__completestate.is--class .completestate-box ul {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.layer-search__completestate.is--class .completestate-box li {
  flex-shrink: 1;
  flex-grow: 1;
  position: relative;
  text-align: center;
}
.layer-search__completestate.is--class .completestate-box li + li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 80px;
  background-color: rgba(0, 0, 0, 0.1);
}
.layer-search__completestate.is--class .completestate-box li p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-end;
}
.layer-search__completestate.is--class .completestate__title {
  display: block;
  font-weight: 700;
  font-size: 14px;
  line-height: 16px;
  color: rgba(0, 0, 0, 0.6);
  margin-bottom: 29px;
}
.layer-search__completestate.is--class .completestate__number {
  display: inline-block;
  font-size: 32px;
  line-height: 36px;
  font-style: normal;
}
.layer-search__completestate.is--class .completestate__unit {
  display: inline-block;
  font-size: 16px;
  line-height: 18px;
  color: rgba(0, 0, 0, 0.6);
  margin-bottom: 5px;
  margin-left: 2px;
}
.layer-search__completestate.is--student .layer__contents {
  height: 100%;
  padding: 11px 0 0px 0;
}
.layer-completion__state .layer__container {
  width: 569px;
}
.layer-completion__state .layer__container .layer__contents .tab--contents {
  padding: 24px;
}
.layer-completion__state .layer__container .completion-state--item {
  margin-top: 24px;
}
.layer-completion__state .layer__container .completion-state--item a {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 7px 24px;
}
.layer-completion__state .layer__container .completion-state--item .file-name {
  border-bottom: 1px solid #000000;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.layer-completion__state .layer__container .completion-state--file {
  margin-top: 24px;
}
.layer-completion__state .layer__container .page__button {
  padding-top: 24px;
}
.layer-search__workbook .layer__container {
  width: 1128px;
  min-width: 1128px;
}
.layer-search__workbook .layer__container .layer__contents {
  padding: 0px 0px 24px;
}
.layer-search__workbook .layer__container .page__button {
  padding: 24px 0px 48px;
}
.layer-student__upload .layer__container {
  width: 916px;
  min-width: 916px;
}
.layer-student__upload .layer__container .layer__contents {
  padding: 24px 24px 0;
}
.layer-student__upload .layer__container .layer__contents .box--search {
  margin-bottom: 24px;
}
.layer-student__upload
  .layer__container
  .layer__contents
  .box--search
  .dropdown--area {
  width: 156px;
}
.layer-student__upload
  .layer__container
  .layer__contents
  .student-upload__subtitle {
  margin-bottom: 12px;
}
.layer-student__upload
  .layer__container
  .layer__contents
  .student-upload__student {
  flex-shrink: 0;
  flex-grow: 0;
  align-items: start;
  height: 94px;
  margin-bottom: 17px;
  padding: 14px;
}
.layer-student__upload
  .layer__container
  .layer__contents
  .student-upload__student
  .upload-student__inner {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px;
}
.layer-student__upload .layer__container .layer__contents .scroll-y {
  overflow: hidden;
  overflow-y: auto;
}
.layer-student__upload .layer__container .layer__contents .box--empty {
  min-height: 0;
  height: 300px;
}
.layer-student__upload .layer__container .page__button {
  padding: 40px 0;
}
.layer-option__scope .layer__container {
  width: 1138px;
  min-width: 1138px;
}
.layer-option__scope .layer__container .layer__contents {
  padding: 24px;
}
.layer-option__scope .layer__container .layer__contents .list--box {
  width: 350px;
}
.layer-view__textbook .layer__title {
  padding: 22px 24px;
  background-color: transparent;
  border-bottom: 1px solid rgba(0, 0, 0, 0.16);
}
.layer-view__textbook .layer__container {
  width: 1128px;
  min-width: 1128px;
}
.layer-view__textbook .layer__container .layer__contents {
  padding: 18px 24px 0;
}
.layer-view__textbook .textbook-preview__files {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
.layer-view__textbook .textbook-preview__files .file-item {
  margin-bottom: 18px;
}
.layer-view__textbook .textbook-preview__box {
  position: relative;
  padding: 24px 110px 18px;
  border-radius: 20px;
  background-color: #f8f9fd;
}
.layer-view__textbook .textbook-preview__box .pagenavi--box {
  margin-top: 18px;
}
.layer-view__textbook .textbook-preview__box .button-icon {
  position: absolute;
  top: 50%;
  margin-top: -12px;
  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05);
}
.layer-view__textbook .textbook-preview__box .button-icon:disabled {
  opacity: 0.5;
  box-shadow: none;
  background-color: #d9d9d9;
}
.layer-view__textbook .textbook-preview__box .button-icon:disabled > p {
  opacity: 0.5;
}
.layer-view__textbook .textbook-preview__contents {
  border: 1px solid #d9d9d9;
  text-align: center;
  padding: 2px;
}
.layer-view__textbook .textbook-preview__prev {
  left: 24px;
}
.layer-view__textbook .textbook-preview__next {
  right: 24px;
  transform: rotate(180deg);
}
.layer-view__textbook .textbook-preview__explain {
  padding: 40px 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 18px;
  text-align: center;
}
.layer-view__preview .layer__container {
  width: 1128px;
  min-width: 1128px;
}
.layer-view__preview .layer__container .layer__contents {
  padding: 0;
}
.layer-view__preview.workbook-preview--box .page__button {
  margin-bottom: 0;
  padding: 0 0 40px;
  height: auto;
}
.layer-view__preview.workbook-preview--box .page__button .pagenavi--step {
  justify-content: center;
  margin-top: 0px;
}
.layer-view__preview.workbook-preview--box
  .workbook-preview__titles
  .dropdown--area {
  display: inline-flex;
  margin-left: auto;
}
.layer-view__preview.workbook-preview--box
  .workbook-preview__titles
  .dropdown--item:disabled {
  opacity: 0.3;
}
.layer-write__notify .layer__container:not(.alert):not(.confirm) {
  /* 240809 오류신고 팝업 내 alert팝업 오류로 수정 */ /* 240826 confirm 팝업 오류 수정 추가 */
  width: 687px;
}
.layer-write__notify
  .layer__container:not(.alert):not(.confirm)
  .layer__contents {
  /* 240809 오류신고 팝업 내 alert팝업 오류로 수정 */ /* 240826 confirm 팝업 오류 수정 추가 */
  padding: 0;
}
.layer-check__workbook .layer__container {
  width: 1128px;
  min-width: 1128px;
}
.layer-check__workbook .layer__container .layer__contents {
  padding: 36px 24px;
}
.layer-check__workbook .layer__container .layer__contents .textbook--filter {
  gap: 12px;
  flex-wrap: nowrap;
  margin-bottom: 24px;
}
.layer-check__workbook
  .layer__container
  .layer__contents
  .textbook--filter
  .dropdown--area {
  width: 150px;
  flex-shrink: 0;
}
.layer-check__workbook
  .layer__container
  .layer__contents
  .textbook--filter
  .button-main {
  width: 98px;
  flex-shrink: 0;
}
@media (max-width: 1199px) {
  .layer-check__workbook .layer__container .layer__contents .textbook--item {
    width: calc((100% - 72px) / 3);
  }
}
.layer-check__workbook .layer__container .page__button {
  padding: 30px 0px 28px;
}
.layer-workbook__result .layer__container {
  width: 848px;
  min-width: 848px;
}
.layer-workbook__result .layer__container .layer__contents {
  padding: 12px 24px 24px;
}
.layer-workbook__result .layer__container .layer__contents .box-bg__gray {
  background-color: #f6f6f6;
}
.layer-workbook__result .layer__container .box--edit-title {
  min-height: 0;
  margin-top: 40px;
  margin-bottom: 20px;
  line-height: 1;
}
.layer-workbook__result .layer__container .box--edit-title.first {
  margin-top: 0;
}
.layer-workbook__result .layer__container .contents-info-box {
  padding: 24px 30px 10px;
  border: none;
}
.layer-workbook__result
  .layer__container
  .contents-info-box
  .contents-info__sub {
  padding-top: 4px;
}
.layer-workbook__result .layer__container .contents-info__title {
  color: #000000;
  font-size: 20px;
  line-height: 23px;
  font-weight: 700;
}
.layer-workbook__result .layer__container .contents-info__sub {
  padding-left: 70px;
}
.layer-workbook__result .layer__container .workbook-result__filter {
  gap: 12px;
  margin-bottom: 12px;
}
.layer-workbook__result
  .layer__container
  .workbook-result__filter
  .dropdown--area {
  width: 140px;
}
.layer-workbook__result
  .layer__container
  .workbook-result__filter
  .ico-document-black {
  margin-right: 4px;
}
.layer-workbook__result
  .layer__container
  .workbook-result__ratio
  .monthly--box {
  display: flex;
  flex-direction: row;
  justify-content: stretch;
  align-items: stretch;
  padding: 20px 24px;
}
.layer-workbook__result
  .layer__container
  .workbook-result__ratio
  .monthly--box-item {
  flex-shrink: 1;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.layer-workbook__result
  .layer__container
  .workbook-result__ratio
  .monthly--box-item
  .tag {
  margin-top: 0;
}
.layer-workbook__result
  .layer__container
  .workbook-result__ratio
  .monthly--box-item
  .icon {
  margin-top: 11px;
}
.layer-workbook__result
  .layer__container
  .workbook-result__ratio
  .monthly--box-item
  .number {
  margin-top: 5px;
}
.layer-workbook__result
  .layer__container
  .workbook-result__ratio
  .monthly--box-item
  .desc {
  margin-top: 15px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 14px;
  line-height: 16px;
}
.layer-workbook__result .layer__container .workbook-result__time table th {
  height: 38px;
  padding-top: 8px;
  padding-bottom: 8px;
  font-size: 14px;
  line-height: 16px;
}
.layer-workbook__result .layer__container .workbook-result__time table th br {
  display: none;
}
@media (max-width: 1199px) {
  .layer-workbook__result .layer__container .workbook-result__time table th br {
    display: block;
  }
}
.layer-workbook__result .layer__container .workbook-result__time table td {
  height: 50px;
  color: #000000;
  font-size: 14px;
  line-height: 18px;
}
.layer-workbook__result
  .layer__container
  .workbook-result__time
  table
  td:nth-child(3) {
  color: #072fff;
}
.layer-workbook__result
  .layer__container
  .workbook-result__time
  table
  td:nth-child(4) {
  color: #6f16ff;
}
.layer-workbook__result
  .layer__container
  .workbook-result--table
  .box--edit-title {
  margin-right: 10px;
  margin-left: 10px;
}
.layer-workbook__result
  .layer__container
  .workbook-result--table
  .table--list
  table
  thead
  th:first-child {
  padding-left: 14px;
}
.layer-workbook__result
  .layer__container
  .workbook-result--table
  .table--list
  table
  thead
  th:last-child {
  padding-right: 14px;
}
.layer-workbook__result
  .layer__container
  .workbook-result--table
  .table--list
  table
  tbody
  tr
  td {
  height: 68px;
  padding: 0;
  text-align: center;
}
.layer-workbook__result
  .layer__container
  .workbook-result--table
  .table--list
  table
  tbody
  tr
  td
  p {
  vertical-align: middle;
  display: inline-block;
}
.layer-workbook__result .layer__container .box--edit {
  padding-bottom: 24px;
}
.layer-workbook__result .layer__container .box-grid {
  display: flex;
  flex-direction: row;
  justify-content: stretch;
  align-items: stretch;
  gap: 14px;
}
.layer-workbook__result .layer__container .box-grid .cell-06 {
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  align-items: stretch;
}
.layer-workbook__result .layer__container .box-grid .cell-06:first-child {
  width: calc((100% - 14px) / 2 - 5px);
}
.layer-workbook__result .layer__container .box-grid .cell-06:last-child {
  width: calc((100% - 14px) / 2 + 5px);
}
.layer-workbook__result .layer__container .box-grid .cell-06 .box--edit-title {
  margin-left: 5px;
}
.layer-workbook__result .layer__container .box-grid .cell-06 .box-bg__white {
  display: flex;
  flex-direction: row;
  justify-content: stretch;
  align-items: stretch;
  height: 100%;
}
.layer-workbook__result .layer__container .page__button {
  padding-top: 24px;
}
.layer-workbook__result .layer__container .page__button .button-main {
  width: 240px;
}
.layer-find_myid .layer__container {
  width: 518px;
}
.layer-find_myid .layer__container .layer__contents {
  padding: 0;
}
.layer-find_myid .layer__container .layer__contents .tab-box .tab--button {
  width: 50%;
}
.layer-find_myid .layer__container .layer__contents .tab--contents {
  padding: 24px 24px 40px;
}
.layer-find_myid
  .layer__container
  .layer__contents
  .find-id__after
  .find-id__after--list {
  padding-right: 20px;
  padding-left: 20px;
  border: 1px solid rgba(0, 0, 0, 0.16);
  border-radius: 16px;
}
.layer-find_myid
  .layer__container
  .layer__contents
  .find-id__after
  .find-id__after--row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding-top: 24px;
  padding-bottom: 24px;
  border-top: 1px solid #d9d9d9;
}
.layer-find_myid
  .layer__container
  .layer__contents
  .find-id__after
  .find-id__after--row:first-child {
  border-top: none;
}
.layer-find_myid
  .layer__container
  .layer__contents
  .find-id__after
  .find-id__after--row
  .date {
  color: rgba(0, 0, 0, 0.8);
  font-size: 16px;
  line-height: 18px;
}
.layer-find_myid .layer__container .layer__contents .find-id--title {
  margin-bottom: 30px;
  color: #000000;
  font-size: 22px;
  text-align: center;
  line-height: 30px;
}
.layer-find_myid .layer__container .layer__contents .find-id--title strong {
  color: #7e44fb;
  font-weight: 700;
}
.layer-find_myid .layer__container .layer__contents .input-box {
  margin-top: 14px;
}
.layer-find_myid .layer__container .layer__contents .input-box:first-child {
  margin-top: 0;
}
.layer-find_myid .layer__container .layer__contents .input-box--text.is--large {
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 16px;
  line-height: 18px;
}
.layer-find_myid
  .layer__container
  .layer__contents
  .input-box--text.is--large::placeholder {
  font-size: 16px;
  line-height: 18px;
}
.layer-find_myid
  .layer__container
  .layer__contents
  .input-box--text.is--large:-moz-placeholder {
  font-size: 16px;
  line-height: 18px;
}
.layer-find_myid
  .layer__container
  .layer__contents
  .input-box--text.is--large::-webkit-input-placeholder {
  font-size: 16px;
  line-height: 18px;
}
.layer-find_myid .layer__container .layer__contents .text-button {
  margin-top: 8px;
  text-align: right;
}
.layer-find_myid .layer__container .layer__contents .text-button button,
.layer-find_myid .layer__container .layer__contents .text-button a {
  margin-left: 16px;
  color: #000000;
  font-size: 14px;
  line-height: 16px;
  border-bottom: 1px solid #000000;
}
.layer-find_myid
  .layer__container
  .layer__contents
  .text-button
  button:first-child,
.layer-find_myid .layer__container .layer__contents .text-button a:first-child {
  margin-left: 0;
}
.layer-find_myid .layer__container .layer__contents .text-button + .button {
  margin-top: 24px;
}
.layer-find_myid .layer__container .layer__contents .button {
  margin-top: 40px;
  text-align: center;
}
.layer-find_myid .layer__container .layer__contents .button .button-main {
  width: 234px;
}

.toast-default {
  position: fixed;
  width: max-content;
  width: -moz-max-content;
  width: -webkit-max-content;
  width: -o-max-content;
  width: -ms-max-content;
  max-width: calc(100% - 48px);
  padding: 17px 30px;
  bottom: 60px;
  left: 50%;
  background-color: #ffffff;
  border-radius: 20px;
  box-shadow: 0px 12px 20px rgba(0, 0, 0, 0.1);
  transform: translateX(-50%);
  z-index: 1001;
}
.toast-default p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 24px;
  color: #000000;
  font-size: 20px;
  line-height: 25px;
  font-weight: 500;
}
.toast-default p > span {
  display: block;
  word-break: break-all;
  white-space: normal;
}
.toast-default p > span.ico-40 {
  flex-shrink: 0;
  flex-grow: 0;
}

.list--box {
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.16);
  border-radius: 8px;
  overflow: hidden;
  width: 240px;
}
.list--box__wrap {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  width: 100%;
}
.list--box__wrap .list--box {
  width: 100%;
}
.list--box label {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 0;
  margin-top: 0px;
}
.list--box .input--box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  min-height: 51px;
  padding-left: 16px;
  gap: 12px;
  /* [VOS : 230803][1132080]  여러줄 일 경우 상하 여백 추가 */
}
.list--box .input--box .input--text {
  padding: 10px 0;
}
.list--box .input--box.has-number .input--text {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.list--box .input--box.has-number .input--text .number {
  margin-right: 10px;
}
.list--box .input--text {
  width: 100%;
  padding: 12px 0;
}
.list--box .input--stext {
  flex-shrink: 0;
  flex-grow: 0;
  font-size: 14px;
  line-height: 16px;
  padding-right: 16px;
  color: rgba(0, 0, 0, 0.5);
}
.list--box.is--hide .input--box::before {
  position: absolute;
  opacity: 0;
}
.list--box dl .list__tbody label {
  margin: 0;
}
.list--box dl .list__tbody label.input-radio + .input-radio {
  margin: 0;
}
.list__thead {
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 51px;
  padding: 0 16px;
  background: #fafafa;
  border-bottom: 1px solid #d9d9d9;
}
.list__thead label {
  height: 100%;
  width: 100%;
}
.list__thead label.input-check {
  margin-bottom: 0;
}
.list__thead strong {
  font-weight: 700;
  font-size: 16px;
  line-height: 18px;
  color: #341761;
}
.list__tbody {
  overflow-y: auto;
  overflow: overlay;
}
.list__tbody label {
  border-bottom: 1px solid #d9d9d9;
  min-height: 51px;
}
.list__tbody label:not(.input-check) input:checked + .input--box {
  background-color: rgba(126, 68, 251, 0.1);
}
.list__tbody label:is(.input-check):not(.passed) input:checked + .input--box {
  background-color: rgba(126, 68, 251, 0.1);
}
.list__tbody .list__li {
  overflow: hidden;
  margin-top: 1px;
}
.list__tbody .list__li li {
  flex-shrink: 1;
  flex-grow: 1;
  border-bottom: 1px solid #d9d9d9;
  min-height: 51px;
  position: relative;
}
.list__tbody .list__li li:hover {
  background-color: rgba(126, 68, 251, 0.1);
}
.list__tbody .list__li li label {
  border-bottom-width: 0;
}
.list__button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 22px 0;
}
.list__button:is(button) {
  width: 100%;
  justify-content: flex-start;
  min-height: 50px;
  padding: 10px 0 10px 16px;
  font-size: 16px;
  background-color: #ffffff;
  /* [VOS 이슈 0803][1132080] 텍스트 왼쪽 정렬 추가 */
  text-align: left;
}
.list__button:is(button).active {
  padding-right: 45px;
  background-color: rgba(126, 68, 251, 0.1);
}
.list__button:is(button).active:after {
  content: "";
  position: absolute;
  right: 22px;
  width: 14px;
  height: 14px;
  background-image: url("../images/ico/check-violet.svg");
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}
.list__button:is(button).checked {
  background-color: #ffffff;
}
.list--button-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-direction: column;
  gap: 12px;
}
.list--button-prev,
.list--button-next {
  width: 44px;
  height: 44px;
  background-color: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.list--button-next {
  transform: rotate(180deg);
}

.contents-info-box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  padding: 30px 29px 32px;
}
.layer-area .contents-info-box {
  border-bottom: 1px solid #d9d9d9;
}
.contents-info__subwrap {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  /* [이슈리스트 : 0821][2439] 텍스트 간격 유지 */
  flex-shrink: 0;
}
.contents-info__sub {
  flex-shrink: 0;
  flex-grow: 0;
  padding: 12px 0px 0 65px;
}
.contents-info__sub > p,
.contents-info__sub > div {
  display: flex;
  flex-direction: row;
  align-items: center;
  font-size: 16px;
  line-height: 18px;
  margin-bottom: 20px;
  gap: 10px;
}
.contents-info__sub > p strong,
.contents-info__sub > div strong {
  width: 87px;
  font-weight: 700;
}
.layer-area .contents-info__sub > p,
.layer-area .contents-info__sub > div {
  margin-bottom: 24px;
}
.layer-area .contents-info__sub > div {
  margin-top: -4px;
}
.contents-info__button {
  margin-top: 35px;
}
.contents-info__title {
  font-weight: 800;
  font-size: 28px;
  line-height: 32px;
}
.contents-info__explain {
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  color: rgba(0, 0, 0, 0.6);
  margin-top: 14px;
}
.contents-info__explain .tag {
  position: relative;
  padding-left: 11px;
  margin-left: 10px;
}
.contents-info__explain .tag::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 12px;
  opacity: 0.12;
  background-color: #000000;
}
.contents-info__state {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 20px;
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  color: #7e44fb;
  gap: 10px;
}
.contents-info__state .state-box {
  height: 34px;
  padding: 7px 10px;
  line-height: 20px;
  font-size: 18px;
  color: #7e44fb;
  background-color: rgba(126, 68, 251, 0.1);
}

.layer-inner {
  display: none;
  position: absolute;
  border-radius: 16px;
  background-color: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.16);
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
  width: max-content;
  z-index: 10;
}
.layer-inner.open {
  display: block;
}
.layer-inner__head {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  padding: 15px 24px;
  height: 50px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.16);
}
.layer-inner__title {
  font-weight: 700;
  font-size: 16px;
  line-height: 18px;
  color: #341761;
}
.layer-inner__close {
  position: absolute;
  top: 11px;
  right: 24px;
  width: 28px;
  height: 28px;
  background-image: url("../images/ico/close-black.svg");
}
.layer-inner__body {
  padding: 16px 24px;
}

/* 개발에서 작성한 css */
/* 로그인 후 메인 : 서비스 공지 */
.login_notice_modal [class*="table_contents_"] img {
  max-width: 100%;
}

/*------------------------------------------ JOIN ------------------------------------------*/
.join-formbox .input-box,
.join-formbox .input-box input,
.join-formbox .input-box--text,
.join-formbox .input-box--text input,
.join-formbox .input-box--text:not(input),
.join-formbox .input-box--text:not(input) input,
.join-formbox .input-box--text:not(input).is--large,
.join-formbox .input-box--text:not(input).is--large input {
  color: #000000;
  font-size: 16px;
  font-weight: 700;
}
.join-formbox .input-box::placeholder,
.join-formbox .input-box input::placeholder,
.join-formbox .input-box--text::placeholder,
.join-formbox .input-box--text input::placeholder,
.join-formbox .input-box--text.is--large:not(input)::placeholder,
.join-formbox .input-box--text:not(input).is--large input::placeholder {
  color: rgba(0, 0, 0, 0.5);
  font-weight: 400;
}
.join-formbox .input-box::-moz-placeholder,
.join-formbox .input-box input::-moz-placeholder,
.join-formbox .input-box--text::-moz-placeholder,
.join-formbox .input-box--text input::-moz-placeholder,
.join-formbox .input-box--text.is--large:not(input)::-moz-placeholder,
.join-formbox .input-box--text:not(input).is--large input::-moz-placeholder {
  color: rgba(0, 0, 0, 0.5);
  font-weight: 400;
}
.join-formbox .input-box::-webkit-input-placeholder,
.join-formbox .input-box input::-webkit-input-placeholder,
.join-formbox .input-box--text::-webkit-input-placeholder,
.join-formbox .input-box--text input::-webkit-input-placeholder,
.join-formbox .input-box--text.is--large:not(input)::-webkit-input-placeholder,
.join-formbox
  .input-box--text:not(input).is--large
  input::-webkit-input-placeholder {
  color: rgba(0, 0, 0, 0.5);
  font-weight: 400;
}

.join {
  background-color: #edf1fc;
}
.join .contents-area {
  padding-top: 160px;
  padding-bottom: 160px;
}
.join-step {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding-bottom: 33px;
}
.join-step--item {
  position: relative;
  width: 62px;
  height: 62px;
}
.join-step--item-icon {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 100%;
  height: 100%;
  background: #ffffff;
  border: 2px solid rgba(0, 0, 0, 0.2);
  border-radius: 62px;
  color: rgba(0, 0, 0, 0.3);
  font-size: 24px;
  font-weight: 700;
}
.join-step--item-icon span {
  position: absolute;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.join-step--item-text {
  position: absolute;
  top: 100%;
  left: 50%;
  margin-top: 15px;
  color: rgba(0, 0, 0, 0.4);
  font-size: 16px;
  line-height: 18px;
  white-space: nowrap;
  transform: translateX(-50%);
}
.join-step--item:not(:last-child) {
  margin-right: 112px;
}
.join-step--item.item01 .join-step--item-icon {
  background-size: auto 30px;
}
.join-step--item.item01 .join-step--item-icon span {
  background-image: url("../images/join/step01.svg");
}
.join-step--item.item02 .join-step--item-icon {
  background-size: auto 30px;
}
.join-step--item.item02 .join-step--item-icon span {
  background-image: url("../images/join/step02.svg");
}
.join-step--item.item03 .join-step--item-icon {
  background-size: auto 27px;
}
.join-step--item.item03 .join-step--item-icon span {
  background-image: url("../images/join/step03.svg");
}
.join-step--item.active .join-step--item-icon {
  background-color: #7e44fb;
  border-color: #7e44fb;
  font-size: 0;
}
.join-step--item.active .join-step--item-icon span {
  display: block;
  background-size: auto 30px;
}
.join-step--item.active .join-step--item-text {
  color: #7e44fb;
  font-weight: 700;
}
.join-step--item.active .join-step--divider span::before,
.join-step--item.active .join-step--divider span::after {
  background-color: #7e44fb;
}
.join-step--item.pass .join-step--item-icon {
  border-color: #7e44fb;
  font-size: 0;
}
.join-step--item.pass .join-step--item-icon span {
  display: block;
  background-size: auto 15px;
  background-image: url("../images/ico/check-violet.svg");
}
.join-step--item.pass .join-step--item-text {
  color: #7e44fb;
}
.join-step--item.pass .join-step--divider span::before,
.join-step--item.pass .join-step--divider span::after {
  background-color: #7e44fb;
}
.join-step--divider {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 8px;
  position: absolute;
  top: 50%;
  right: 0;
  margin-right: -80px;
  transform: translateY(-50%);
}
.join-step--divider span {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.join-step--divider span::before,
.join-step--divider span::after {
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 4px;
  background-color: rgba(0, 0, 0, 0.1);
  content: "";
}
.join-formbox {
  margin-top: 54px;
  padding-bottom: 44px;
}
.join-formbox .page__button {
  margin-top: 56px;
}
.join-formbox .dropdown--area .dropdown--select {
  color: rgba(0, 0, 0, 0.5);
  font-size: 14px;
}
.join-formbox .dropdown--area.has--data .dropdown--select {
  color: #000000;
  font-weight: 700;
}
.join-agree__box {
  max-width: 770px;
  margin-top: 40px;
  margin-right: auto;
  margin-left: auto;
}
.join-agree__check {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.join-agree__check strong {
  color: #7e44fb;
}
.join-agree__check .input-check .input--box .input--text {
  font-size: 16px;
  font-weight: 700;
  line-height: 18px;
}
.join-agree__check-show {
  border-bottom: 1px solid #7e44fb;
  color: #7e44fb;
  font-size: 16px;
  font-weight: 700;
  line-height: 18px;
}
.join-agree__all {
  padding-bottom: 24px;
  margin-bottom: 24px;
  border-bottom: 1px solid #d9d9d9;
}
.join-agree__all .input-check .input--box .input--text {
  font-size: 18px;
  font-weight: 800;
}
.join-info__box {
  padding-top: 33px;
  padding-right: 136px;
  padding-left: 136px;
}
.join-info__form {
  padding-left: 24px;
}
.join-info__form table tbody tr:not(:first-child) th,
.join-info__form table tbody tr:not(:first-child) td {
  padding-top: 40px;
}
.join-info__divider {
  margin-top: 58px;
  margin-bottom: 58px;
  border-bottom: 1px solid #d9d9d9;
}
.join-comp {
  margin-top: 83px;
  background-repeat: no-repeat;
  background-position: center top;
}
.join-comp.is--welcome {
  padding-top: 191px;
  background-image: url("../images/img/join-done.png");
  background-size: auto 136px;
}
.join-comp.is--wait {
  padding-top: 190px;
  background-image: url("../images/img/join-wait.png");
  background-size: auto 135px;
}
.join-comp + .join-comp {
  margin-top: 75px;
}

@media (max-width: 768px) {
  .digital-pledge--area {
    margin-right: 22px;
    margin-left: 22px;
  }
}
.digital-pledge--step {
  position: relative;
  height: 30px;
  padding: 9px;
  margin-top: 42px;
  background-color: #dbe1f1;
  border-radius: 30px;
}
.digital-pledge--step .pledge--steps {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: relative;
  height: 12px;
  z-index: 10;
}
.digital-pledge--step .pledge--steps .tooltip--box {
  margin-left: 0;
  margin-bottom: 11px;
  top: auto;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
}
.digital-pledge--step .pledge--steps .tooltip--box-wrap {
  margin: 0;
}
.digital-pledge--step .pledge--steps .tooltip--box-wrap,
.digital-pledge--step .pledge--steps .tooltip--box-wrap .tooltip--button {
  display: block;
}
.digital-pledge--step .pledge--steps .tooltip--box-wrap .tooltip--button {
  width: 12px;
  height: 12px;
  background-color: rgba(161, 169, 192, 0.25);
  border-radius: 12px;
  font-size: 0;
}
.digital-pledge--step .pledge--steps .tooltip--box-wrap:hover .tooltip--button {
  background-color: #a1a9c0;
  cursor: default;
}
.digital-pledge--step .pledge--steps .tooltip--box-text {
  padding: 9px 20px;
}
.digital-pledge--step .pledge--steps .tooltip--box-text p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 8px;
  text-align: center;
}
.digital-pledge--step .pledge--steps .tooltip--box-text p .icon {
  width: 40px;
  height: 40px;
}
.digital-pledge--step .pledge--steps .tooltip--box-text p .text {
  color: #000000;
  font-size: 16px;
  font-weight: 700;
}
.digital-pledge--step
  .pledge--steps
  .pledge--step.step01
  .tooltip--box-text
  p
  .icon {
  background-image: url("../images/ico/digital-step01.svg");
}
.digital-pledge--step
  .pledge--steps
  .pledge--step.step02
  .tooltip--box-text
  p
  .icon {
  background-image: url("../images/ico/digital-step02.svg");
}
.digital-pledge--step
  .pledge--steps
  .pledge--step.step03
  .tooltip--box-text
  p
  .icon {
  background-image: url("../images/ico/digital-step03.svg");
}
.digital-pledge--step
  .pledge--steps
  .pledge--step.step04
  .tooltip--box-text
  p
  .icon {
  background-image: url("../images/ico/digital-step04.svg");
}
.digital-pledge--step
  .pledge--steps
  .pledge--step.step05
  .tooltip--box-text
  p
  .icon {
  background-image: url("../images/ico/digital-step05.svg");
}
.digital-pledge--step
  .pledge--steps
  .pledge--step.step06
  .tooltip--box-text
  p
  .icon {
  background-image: url("../images/ico/digital-step06.svg");
}
.digital-pledge--step
  .pledge--steps
  .pledge--step.step07
  .tooltip--box-text
  p
  .icon {
  background-image: url("../images/ico/digital-step07.svg");
}
.digital-pledge--step
  .pledge--steps
  .pledge--step.step08
  .tooltip--box-text
  p
  .icon {
  background-image: url("../images/ico/digital-step08.svg");
}
.digital-pledge--step .pledge--bar {
  overflow: hidden;
  position: absolute;
  width: 100%;
  height: 100%;
  padding: 9px;
  top: 0;
  left: 0;
  z-index: 5;
  border-radius: 30px;
}
.digital-pledge--step .pledge--bar::after {
  position: relative;
  display: block;
  height: 30px;
  margin-top: -9px;
  margin-left: -9px;
  background: linear-gradient(90deg, #a044fb 3.55%, #7e44fb 97.16%);
  border-radius: 30px;
  content: "";
}
.digital-pledge--step.active01
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active01
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active01
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active01
  .pledge--steps
  .pledge--step.step01
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active01 .pledge--bar::after {
  width: calc((100% - 96px) / 7 * 0 + 12px + 18px);
}
.digital-pledge--step.active02
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active02
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active02
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active02
  .pledge--steps
  .pledge--step.step01
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active02
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active02
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active02
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active02
  .pledge--steps
  .pledge--step.step02
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active02 .pledge--bar::after {
  width: calc((100% - 96px) / 7 * 1 + 24px + 18px);
}
.digital-pledge--step.active03
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active03
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active03
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active03
  .pledge--steps
  .pledge--step.step01
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active03
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active03
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active03
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active03
  .pledge--steps
  .pledge--step.step02
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active03
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active03
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active03
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active03
  .pledge--steps
  .pledge--step.step03
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active03 .pledge--bar::after {
  width: calc((100% - 96px) / 7 * 2 + 36px + 18px);
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step01
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step02
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step03
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active04
  .pledge--steps
  .pledge--step.step04
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active04 .pledge--bar::after {
  width: calc((100% - 96px) / 7 * 3 + 48px + 18px);
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step01
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step02
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step03
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step04
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step05
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step05
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step05
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active05
  .pledge--steps
  .pledge--step.step05
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active05 .pledge--bar::after {
  width: calc((100% - 96px) / 7 * 4 + 60px + 18px);
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step01
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step02
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step03
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step04
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step05
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step05
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step05
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step05
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step06
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step06
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step06
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active06
  .pledge--steps
  .pledge--step.step06
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active06 .pledge--bar::after {
  width: calc((100% - 96px) / 7 * 5 + 72px + 18px);
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step01
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step02
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step03
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step04
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step05
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step05
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step05
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step05
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step06
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step06
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step06
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step06
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step07
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step07
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step07
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active07
  .pledge--steps
  .pledge--step.step07
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active07 .pledge--bar::after {
  width: calc((100% - 96px) / 7 * 6 + 84px + 18px);
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step01
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step01
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step02
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step02
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step03
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step03
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step04
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step04
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step05
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step05
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step05
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step05
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step06
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step06
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step06
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step06
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step07
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step07
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step07
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step07
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step08
  .tooltip--button:hover {
  cursor: pointer;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step08
  .tooltip--button:not(.on) {
  background-color: #aa7dfd;
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step08
  .tooltip--button:not(.on):hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.digital-pledge--step.active08
  .pledge--steps
  .pledge--step.step08
  .tooltip--button.on
  p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-top: -16px;
  margin-left: -16px;
  background-color: #ffffff;
  border-radius: 44px;
  box-shadow: 3px 2px 4px 0px rgba(118, 84, 165, 0.44);
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.digital-pledge--step.active08 .pledge--bar::after {
  width: calc((100% - 96px) / 7 * 7 + 96px + 18px);
}
.digital-pledge--box {
  position: relative;
  margin-top: 31px;
}
.digital-pledge--box .pledge__pagenation {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 44px;
  height: 44px;
  top: 50%;
  margin-top: -75px;
  background-color: #ffffff;
  border: 1px solid #f6f6f6;
  border-radius: 44px;
  box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
  z-index: 10;
}
.digital-pledge--box .pledge__pagenation:disabled p,
.digital-pledge--box .pledge__pagenation.disabled p {
  opacity: 0.3;
}
.digital-pledge--box .pledge__pagenation.prev {
  left: -22px;
  padding-right: 2px;
}
.digital-pledge--box .pledge__pagenation.prev p {
  transform: rotate(180deg);
}
.digital-pledge--box .pledge__pagenation.next {
  right: -22px;
  padding-left: 2px;
}
.digital-pledge--box .pledge__contents {
  position: relative;
  text-align: center;
  z-index: 5;
}
.digital-pledge--box .pledge__contents .pledge-content {
  padding: 24px;
}
.digital-pledge--box .pledge__contents .pledge-content .image {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  border-radius: 16px;
  background-color: #ffdfdb;
}
.digital-pledge--box .pledge__contents .pledge-content .image img {
  display: block;
  max-width: 100%;
  max-height: 100%;
}
.digital-pledge--box .pledge__contents .pledge-content .text {
  margin-top: 30px;
  color: #000000;
  font-size: 24px;
  font-weight: 700;
}
.digital-pledge--box .pledge__contents .pledge-content .button-main {
  width: 240px;
  margin-top: 30px;
}
.digital-pledge--box
  .pledge__contents
  .pledge-content
  .button-main.violet-light {
  color: #7e44fb;
  cursor: default;
}
.digital-pledge--buttons {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 100px;
  margin-top: 48px;
  margin-bottom: 63px;
}
.digital-pledge--buttons .button {
  color: #7e44fb;
  font-size: 32px;
  font-weight: 800;
  line-height: 36px;
}
.digital-pledge--buttons .button:disabled,
.digital-pledge--buttons .button.disabled {
  opacity: 0.2;
}

.password-change {
  width: 552px;
  padding: 45px 36px 40px;
  margin: 62px auto 89px;
}
.password-change--title {
  color: #000000;
  font-size: 24px;
  line-height: 27px;
  font-weight: 800;
}
.password-change--guide {
  margin-top: 31px;
}
.password-change--guide .text-bullet {
  padding-left: 12px;
  margin-top: 0;
  color: #000000;
  font-size: 14px;
  line-height: 30px;
}
.password-change--guide .text-bullet span {
  color: #ff3a3a;
}
.password-change--guide .text-bullet::before {
  width: 4px;
  height: 4px;
  top: 12px;
  left: 0;
  opacity: 1;
}
.password-change--form {
  margin-top: 54px;
}
.password-change--form input {
  margin-top: 20px;
}
.password-change--form input:first-child {
  margin-top: 0;
}
.password-change--rule {
  margin: 28px -5px 0;
}
.password-change--rule .text-bullet {
  padding-left: 30px;
  margin-top: 8px;
  color: #000000;
  font-size: 14px;
  line-height: 20px;
}
.password-change--rule .text-bullet::before {
  width: 20px;
  height: 20px;
  top: 0;
  left: 0;
  background-image: url("../images/ico/check-write-black.svg");
  opacity: 1;
}
.password-change--rule .text-bullet:first-child {
  margin-top: 0;
}
.password-change--rule .text-bullet.violet {
  color: #7e44fb;
}
.password-change--rule .text-bullet.violet::before {
  background-image: url("../images/ico/check-write-violet.svg");
}
.password-change .page__button {
  margin-top: 50px;
}
.password-change .page__button a,
.password-change .page__button button {
  min-width: 183px;
}

.wrap.is--dark {
  position: relative;
}
.wrap.is--dark.is--dark:not(.is--intro)::after {
  position: absolute;
  width: 2749px;
  top: 101px;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  background-image: url("../images/main/bg.jpg");
  background-repeat: no-repeat;
  background-position: center -31px;
  background-size: 100% auto;
  content: "";
}

.container {
  position: relative;
  z-index: 10;
}

.main-banner {
  background-color: #ffffff;
}
.main-banner--inner {
  height: 75px;
  margin: 0 auto;
}
.main-banner--box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: relative;
  width: 100%;
  height: 100%;
}
.main-banner--indicator {
  flex-shrink: 0;
  flex-grow: 0;
  overflow: hidden;
  width: 160px;
  margin-left: -9px;
  z-index: 10;
}
.main-banner--indicator button,
.main-banner--indicator p {
  float: left;
}
.main-banner--indicator button {
  width: 24px;
  height: 24px;
  background-image: url("../images/ico/main-left-black.svg");
  background-position: center;
  color: transparent;
  font-size: 0;
}
.main-banner--indicator .swiper-pagination {
  margin-top: 0;
  padding: 0 6px;
  font-size: 16px;
  line-height: 24px;
}
.main-banner--indicator .swiper-button-next {
  transform: rotate(180deg);
}
.main-banner--close {
  flex-shrink: 0;
  flex-grow: 0;
  width: 160px;
  font-size: 16px;
  line-height: 25px;
  white-space: nowrap;
  z-index: 10;
}
.main-banner--close .ico-close-black {
  vertical-align: middle;
  width: 24px;
  height: 24px;
  margin-top: -1px;
  background-image: url("../images/ico/main-close-black.svg");
}
.main-banner .swiper-slide {
  overflow: hidden;
  display: flex;
  height: 75px;
  justify-content: center;
  align-items: center;
  background-repeat: no-repeat;
  background-position: center;
  color: #1b0d48;
  font-size: 24px;
  font-weight: 800;
  text-align: center;
  line-height: 27px;
}
.main-banner .swiper-slide:not(a):not(button) {
  cursor: default;
}
.main-banner .swiper-slide strong {
  color: #7764f5;
  font-weight: 800;
}
.main-banner .swiper-slide img {
  display: block;
  max-height: 100%;
}

.main-login {
  position: relative;
  height: 710px;
  margin-top: 37px;
}
.main-login--visual {
  position: relative;
  height: 434px;
  right: 0;
  padding-top: 95px;
  padding-left: 173px;
  margin-left: -110px;
  background-image: url("../images/main/blackboard.png");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 1105px auto;
}
@media (max-width: 1199px) {
  .main-login--visual {
    width: calc(100% + 190px);
  }
}
.main-login--visual .login--visual-title {
  font-size: 28px;
  font-weight: 700;
}
.main-login--visual .login--visual-text {
  display: inline-block;
  margin-top: -10px;
  padding-right: 42px;
  padding-top: 23px;
  padding-bottom: 4px;
  background-image: url("../images/main/title-icon.svg");
  background-repeat: no-repeat;
  background-position: right bottom;
  font-size: 38px;
  font-weight: 800;
}
.main-login--visual .login--visual-text span {
  position: relative;
  color: #3dffdc;
}
.main-login--visual .login--visual-text span strong {
  position: relative;
  font-weight: 800;
  z-index: 10;
}
.main-login--visual .login--visual-text span::after {
  position: absolute;
  height: 22px;
  left: -4px;
  bottom: -2px;
  right: -8px;
  background-color: rgba(254, 255, 200, 0.14);
  border-radius: 22px;
  z-index: 5;
  content: "";
}
.main-login--visual .login--visual-desc {
  margin-top: 39px;
  font-size: 20px;
  line-height: 32px;
  word-wrap: break-word;
  word-break: keep-all;
}
@media (max-width: 1199px) {
  .main-login--visual .login--visual-desc {
    padding-right: 535px;
  }
  .main-login--visual .login--visual-desc br {
    display: none;
  }
}
.main-login--visual .main-login--ai {
  position: absolute;
  width: 462px;
  height: 426px;
  top: 333px;
  left: 94px;
}
.main-login .main-login--icon {
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  display: block;
  width: 34px;
  height: 34px;
  background-size: contain;
}
.main-login .main-login--icon.is--student {
  background-image: url("../images/main/student.png");
}
.main-login .main-login--icon.is--parents {
  background-image: url("../images/main/parents.png");
}
.main-login .main-login--icon.is--teacher {
  background-image: url("../images/main/teacher.png");
}
.main-login--button {
  position: absolute;
  top: 0;
  right: 0;
  margin-top: 95px;
  z-index: 15;
}
@media (max-width: 1199px) {
  .main-login--button {
    margin-top: 232px;
  }
}
.main-login--button .login--item,
.main-login--form .login--item.onepass {
  /*240503 원패스 로그인 스타일 추가*/
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  width: 475px;
  height: 120px; /*240509 height 추가*/
  padding: 35px 42px 36px 36px;
  background: #ffffff;
  box-shadow: 0px 4px 26px rgba(15, 6, 46, 0.2);
  backdrop-filter: blur(15px);
  border-radius: 20px;
  color: #000000;
  z-index: 5;
}
.main-login--button .login--item:not(:first-child) {
  margin-top: 20px;
}
@media (max-width: 1199px) {
  .main-login--button .login--item {
    width: 435px;
  }
}
.main-login--button .login--item-textbox,
.main-login--form .login--item.onepass .login--item-textbox {
  /*240503 원패스 로그인 스타일 추가*/
  flex-shrink: 1;
  flex-grow: 1;
  overflow: hidden;
  padding-left: 22px;
  text-align: left;
}
.main-login--button .login--item-title {
  font-size: 22px;
  line-height: 25px;
}
.main-login--button .login--item-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 4px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 18px;
  line-height: 20px;
}
.main-login--button .login--item-button,
.main-login--form .login--item.onepass .login--item-button {
  /*240503 원패스 로그인 스타일 추가*/
  display: flex;
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  overflow: hidden;
  color: transparent;
  font-size: 0;
}
.main-login--button .login--item-button::after,
.main-login--form .login--item.onepass .login--item-button::after {
  /*240503 원패스 로그인 스타일 추가*/
  flex-shrink: 0;
  flex-grow: 0;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  background-image: url("../images/ico/next-black.svg");
  background-size: auto 28px;
  border-radius: 40px;
  content: "";
}
.main-login--button .login--item:hover,
.main-login--form .login--item.onepass:hover {
  /*240503 원패스 로그인 스타일 추가*/
  background: #7e44fb;
  box-shadow: 0px 40px 50px rgba(15, 6, 46, 0.6);
  color: #ffffff;
  cursor: pointer;
  z-index: 20;
}
.main-login--button .login--item:hover .login--item-title {
  font-weight: 700;
}
.main-login--button .login--item:hover .login--item-text {
  color: rgba(255, 255, 255, 0.8);
}
.main-login--button .login--item:hover .login--item-button,
.main-login--form .login--item.onepass:hover .login--item-button {
  /*240503 원패스 로그인 스타일 추가*/
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 143px;
  height: 40px;
  padding: 3px 0 0 19px;
  background-color: #ffffff;
  border-radius: 40px;
  color: #8851ff;
  font-size: 18px;
  font-weight: 800;
  white-space: nowrap;
}
.main-login--button .login--item:hover .login--item-button::after,
.main-login--form .login--item.onepass:hover .login--item-button::after {
  /*240503 원패스 로그인 스타일 추가*/
  display: flex;
  width: 28px;
  height: 28px;
  margin-top: -3px;
  border: none;
  background-image: url("../images/ico/next-violet.svg");
}
.main-login--form {
  position: absolute;
  width: 475px;
  top: 0;
  right: 0;
  margin-top: 95px;
  background: #ffffff;
  box-shadow: -30px 40px 50px rgba(15, 6, 46, 0.6);
  backdrop-filter: blur(15px);
  border-radius: 20px;
  z-index: 15;
}
@media (max-width: 1199px) {
  .main-login--form {
    width: 435px;
    margin-top: 232px;
  }
}
.main-login--form > div {
  min-height: 429px;
}
.main-login--form > div .input-box.password + .input-box--required {
  height: 28px;
}
.main-login--form
  > div
  .input-box.password
  + .input-box--required
  + .security--wrap
  + .login--remember {
  margin-top: 30px !important;
}
.main-login--form
  > div
  .input-box.password
  + .input-box--required[style*="display: none"]
  + .security--wrap
  + .login--remember {
  margin-top: 30px !important;
}
.main-login--form
  > div
  .input-box.password
  + .input-box--required[style*="display: none"]
  + .security--wrap[style*="display: none"]
  + .login--remember {
  margin-top: 68px !important;
}
.main-login--form > div .input-box + .input-box--required {
  margin-top: 10px;
}
.main-login--form > div .security--box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-top: 14px;
}
.main-login--form > div .security--box + .input-box--required {
  height: 28px;
  margin-top: 10px;
}
.main-login--form
  > div
  .security--box
  + .input-box--required
  + .login--remember {
  margin-top: 30px !important;
}
.main-login--form > div .security--box + .login--remember {
  margin-top: 39px !important;
}
.main-login--form > div .security--img {
  flex-shrink: 0;
  flex-grow: 0;
  width: 197px;
  height: 44px;
  background-color: #f6f6f6;
}
.main-login--form > div .security--button {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  margin-left: 8px;
  margin-right: 16px;
}
.main-login--form > div .security--button .button-icon {
  width: 18px;
  height: 18px;
  opacity: 0.4;
}
.main-login--form > div.student .login--form-title {
  margin-bottom: 15px;
}
.main-login--form > div.student .is--search {
  position: relative;
}
.main-login--form > div.student .is--search input {
  position: relative;
  z-index: 5;
}
.main-login--form > div.student .is--search button {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: 0 !important;
  top: 0;
  left: 0;
  background: none;
  z-index: 10;
}
.main-login--form > div.student .is--search button::after {
  position: absolute;
  display: block;
  width: 20px;
  height: 20px;
  top: 50%;
  right: 19px;
  margin-top: -10px;
  background-image: url("../images/ico/main-search-black.svg");
  content: "";
}
.main-login--form > div.teacher {
  min-height: 400px;
}
.main-login--form > div.teacher .login--default {
  height: 315px;
}
.main-login--form > div.teacher .login--otp {
  padding-top: 6px;
}
.main-login--form > div.teacher .login--otp .otp-box {
  position: relative;
}
.main-login--form > div.teacher .login--otp .otp-box .time {
  position: absolute;
  top: 13px;
  right: 14px;
  color: #fa4225;
  font-size: 16px;
  line-height: 18px;
}
.main-login--form > div.teacher .login--otp .otp-box .input-box--text {
  padding-right: 65px;
}
.main-login--form > div.teacher .input-box.password + .input-box--required,
.main-login--form > div.parents .input-box.password + .input-box--required {
  height: 28px;
}
.main-login--form
  > div.teacher
  .input-box.password
  + .input-box--required
  + .login--remember,
.main-login--form
  > div.parents
  .input-box.password
  + .input-box--required
  + .login--remember {
  margin-top: 30px !important;
}
.main-login--form
  > div.teacher
  .input-box.password
  + .input-box--required[style*="display: none"]
  + .login--remember,
.main-login--form
  > div.parents
  .input-box.password
  + .input-box--required[style*="display: none"]
  + .login--remember {
  margin-top: 68px !important;
}
.main-login--form > div.teacher .input-box.otp + .input-box--required,
.main-login--form > div.parents .input-box.otp + .input-box--required {
  height: auto;
}
.main-login--form
  > div.teacher
  .input-box.otp
  + .input-box--required
  + .input-box--required,
.main-login--form
  > div.parents
  .input-box.otp
  + .input-box--required
  + .input-box--required {
  height: 28px;
  margin-top: 10px;
}
.main-login--form
  > div.teacher
  .input-box.otp
  + .input-box--required
  + .input-box--required
  + .login--button,
.main-login--form
  > div.parents
  .input-box.otp
  + .input-box--required
  + .input-box--required
  + .login--button {
  margin-top: 46px !important;
}
.main-login--form > div.teacher .input-box + .input-box--required,
.main-login--form > div.parents .input-box + .input-box--required {
  margin-top: 10px;
}
.main-login--form .login--form-title {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  width: 100%;
  padding: 19px 24px;
  margin-bottom: 13px;
  color: #341761;
  font-size: 22px;
  font-weight: 700;
  line-height: 26px;
}
.main-login--form .login--form-title__back {
  display: block;
  width: 26px;
  height: 26px;
  margin-right: 17px;
  background-image: url("../images/ico/arrow-left-black.svg");
  content: "";
}
.main-login--form .login--form-title span {
  margin-right: 8px;
}
.main-login--form .login--form-box {
  padding: 0 24px 29px;
}
.main-login--form .login--form-box .login--sns {
  margin-top: 29px;
}
.main-login--form .login--form-box .login--sns a,
.main-login--form .login--form-box .login--sns button {
  display: block;
  width: 36px;
  height: 36px;
}
.main-login--form .login--form-box .login--sns a img,
.main-login--form .login--form-box .login--sns button img {
  max-width: 100%;
}
.main-login--form .login--form-box input::placeholder {
  color: rgba(0, 0, 0, 0.3);
  font-size: 16px;
}
.main-login--form .login--form-box input::-moz-placeholder {
  color: rgba(0, 0, 0, 0.3);
  font-size: 16px;
}
.main-login--form .login--form-box input::-webkit-input-placeholder {
  color: rgba(0, 0, 0, 0.3);
  font-size: 16px;
}
.main-login--form .input-box,
.main-login--form .dropdown--select {
  height: 44px;
}
.main-login--form .dropdown--box {
  gap: 2px;
  padding: 9px 10px;
  margin-top: 9px;
  border-radius: 16px;
}
.main-login--form .dropdown--box .dropdown--item {
  padding: 12px;
  border-radius: 10px;
  font-size: 16px;
  line-height: 18px;
}
.main-login--form .login--remember {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-top: 39px !important;
}
.main-login--form .login--remember-findbox {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}
.main-login--form .login--remember-findbox .divider {
  width: 1px;
  height: 10px;
  background-color: rgba(102, 102, 102, 0.3);
}
.main-login--form .login--remember-find {
  color: rgba(0, 0, 0, 0.6);
  font-size: 16px;
}
.main-login--form .login--button {
  width: 100%;
  height: 50px;
  margin-top: 18px !important;
}
.main-login--form .login--button.is--double {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
}
.main-login--form .login--button.is--double .button-main {
  height: 50px;
  padding-right: 0;
  padding-left: 0;
}
.main-login--form .login--join {
  margin-top: 34px;
  text-align: center;
}
.main-login--form .login--join a {
  display: inline-block;
  height: 18px;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
  border-bottom: 1px solid #000000;
}
.main-login--scroll {
  position: absolute;
  width: 24px;
  height: 50px;
  right: 50%;
  bottom: -50px;
  background-image: url("../images/main/scroll.svg");
  transform: translateX(-50%);
}

.main-howto {
  margin-top: 188px;
}
.main-howto .main-title {
  margin-bottom: 52px;
}
.main-howto--box {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 24px;
}
.main-howto--item {
  width: 100%;
  min-height: 249px;
  padding: 11px;
  border-radius: 20px;
  color: #ffffff;
  text-align: center;
  /* [이슈리스트 : 230825][2565] 포인터 추가 */
  cursor: pointer;
}
.main-howto--item-icon {
  width: 46px;
  height: 46px;
  margin: 0 auto;
  margin-top: 29px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 42px auto;
}
.main-howto--item-title {
  margin-top: 23px;
  font-size: 24px;
  font-weight: 800;
  line-height: 23px;
}
@media (max-width: 1199px) {
  .main-howto--item-title {
    margin-top: 27px;
    font-size: 20px;
  }
}
.main-howto--item-text {
  font-size: 16px;
  line-height: 24px;
  word-wrap: break-word;
  word-break: keep-all;
}
@media (max-width: 1199px) {
  .main-howto--item-text {
    max-width: 176px;
    margin-right: auto;
    margin-left: auto;
    line-height: 23px;
  }
  .main-howto--item-text br {
    display: none;
  }
}
.main-howto--item.how-01 {
  background-color: #56bf93;
}
.main-howto--item.how-01 .main-howto--item-icon {
  background-image: url("../images/main/howto-01.png");
}
.main-howto--item.how-01 .main-howto--item-text {
  margin-top: 22px;
}
.main-howto--item.how-02 {
  background-color: #5890ff;
}
.main-howto--item.how-02 .main-howto--item-icon {
  background-image: url("../images/main/howto-02.png");
}
.main-howto--item.how-02 .main-howto--item-text {
  margin-top: 10px;
}
@media (max-width: 1199px) {
  .main-howto--item.how-02 .main-howto--item-text br:nth-child(2) {
    display: block;
  }
}
.main-howto--item.how-03 {
  background-color: #7e44fb;
}
.main-howto--item.how-03 .main-howto--item-icon {
  background-image: url("../images/main/howto-03.png");
}
.main-howto--item.how-03 .main-howto--item-text {
  margin-top: 22px;
}
@media (max-width: 1199px) {
  .main-howto--item.how-03 .main-howto--item-text {
    margin-top: 10px;
  }
}
.main-howto--item.how-04 {
  background-color: #405bf4;
}
.main-howto--item.how-04 .main-howto--item-icon {
  background-image: url("../images/main/howto-04.png");
}
.main-howto--item.how-04 .main-howto--item-text {
  margin-top: 10px;
}
@media (max-width: 1199px) {
  .main-howto--item.how-04 .main-howto--item-text {
    margin-top: 22px;
  }
}

.main-howto + .main-notice {
  margin-top: 160px;
}

.main-notice {
  padding-bottom: 98px;
}
.main-notice--box {
  overflow: hidden;
  position: relative;
  padding: 42px 41px;
  margin-top: 45px;
}
.main-notice--box::after {
  position: absolute;
  width: 1px;
  top: 58px;
  right: 50%;
  bottom: 58px;
  background-color: rgba(0, 0, 0, 0.1);
  content: "";
}
.main-notice--inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 34px;
  float: left;
  width: calc(50% - 35px);
}
.main-notice--inner:first-child {
  margin-right: 70px;
}
.main-notice--row {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  overflow: hidden;
  width: 100%;
}
.main-notice .button-tag {
  flex-shrink: 0;
  flex-grow: 0;
  min-width: 50px; /* 250421 수정 */
  padding: 0 10px; /* 250421 수정 */
  font-size: 16px;
  font-weight: 700;
  text-align: center;
}
.main-notice .button-tag.noti {
  background-color: rgba(216, 203, 243, 0.5);
  color: #9265ed;
}
.main-notice .button-tag.service-noti {
  /* 250421 서비스 공지사항 태그 추가 */
  background-color: #ffe4f9;
  color: #ff5adb;
}
.main-notice .button-tag.etc {
  background-color: #eeeeee;
  color: rgba(0, 0, 0, 0.5);
}
.main-notice .button-tag.info {
  background-color: rgba(88, 144, 255, 0.2);
  color: #5890ff;
}
.main-notice .button-tag.data {
  background-color: rgba(0, 185, 19, 0.1);
  color: #3cc0a9;
}
.main-notice--title {
  flex-shrink: 1;
  flex-grow: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  width: calc(100% - 163px);
  margin-left: 8px;
  color: #000000;
}
.main-notice--title strong {
  position: relative;
  font-weight: 700;
  padding-right: 9px;
  margin-right: 8px;
}
.main-notice--title strong::after {
  position: absolute;
  display: block;
  width: 1px;
  height: 12px;
  top: 50%;
  right: 0;
  margin-top: -6px;
  background-color: rgba(0, 0, 0, 0.2);
  content: "";
}
.main-notice--date {
  flex-shrink: 0;
  flex-grow: 0;
  width: 105px;
  color: rgba(0, 0, 0, 0.5);
  text-align: right;
}
.main-notice.is--intro {
  padding-top: 49px;
  padding-bottom: 49px;
  min-height: 278px;
}
.main-notice.is--intro .main-notice--box {
  margin-top: 0;
  padding-top: 0;
  padding-bottom: 0;
}
.main-notice.is--intro .main-notice--box::after {
  top: 0;
  bottom: 0;
}
.main-notice.is--intro .main-notice--title {
  margin-left: 0;
  margin-right: 12px;
  font-size: 16px;
}
.main-notice.is--intro .main-notice--inner {
  width: calc(50% - 44.5px);
  gap: 26px;
}
.main-notice.is--intro .main-notice--inner:first-child {
  margin-right: 89px;
}
@media (max-width: 1199px) {
  .main-notice.is--intro .main-notice--inner {
    width: calc(50% - 18px);
  }
  .main-notice.is--intro .main-notice--inner:first-child {
    margin-right: 36px;
  }
}

.intro-notice--title,
.intro-recommend--title,
.intro-mystat--title,
.intro-lesson--title,
.intro--title {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 7px;
  margin-top: 80px;
  margin-bottom: 22px;
}
.intro-notice--title,
.intro-recommend--title,
.intro-mystat--title,
.intro-lesson--title,
.intro--title,
.intro-notice--title button,
.intro-recommend--title button,
.intro-mystat--title button,
.intro-lesson--title button,
.intro--title button {
  font-size: 28px;
  font-weight: 700;
}
.intro-notice--title::before,
.intro-recommend--title::before,
.intro-mystat--title::before,
.intro-lesson--title::before,
.intro--title::before {
  display: block;
  width: 28px;
  height: 28px;
  content: "";
}

.intro--title {
  padding-left: 0;
}
.intro--title::before {
  display: none;
}
.intro-lesson--title::before {
  background-image: url("../images/main/title-lesson-color.png");
}
.intro-lesson--box,
.contents_slide {
  /* 240610 contents_slide 추가 */
  position: relative;
}
.intro-lesson--box .swiper-button-prev,
.intro-lesson--box .swiper-button-next,
.contents_slide .swiper-button-prev,
.contents_slide .swiper-button-next {
  /* 240610 contents_slide 추가 */
  position: absolute;
  width: 44px;
  height: 44px;
  top: 50%;
  margin-top: -22px;
  background: #ffffff;
  border-radius: 44px;
  box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.21);
  z-index: 15;
}
.intro-lesson--box .swiper-button-prev {
  left: -22px;
  transform: rotate(180deg);
}
.intro-lesson--box .swiper-button-next {
  right: -22px;
}
.intro-lesson--box .swiper-button-disabled,
.contents_slide .swiper-button-disabled {
  /* 240610 contents_slide 추가 */
  display: none;
  visibility: hidden;
}
.intro-lesson--box .swiper-container {
  z-index: 10;
}
.intro-lesson .box--empty {
  min-height: 249px;
  gap: 8px;
  padding-top: 27px;
  padding-bottom: 40px;
}
.intro-lesson .box--empty button {
  padding-right: 67px;
  padding-left: 67px;
  margin-top: 29px;
}
.intro-lesson .box--empty-text p {
  text-align: center;
}
.intro-mystat--title::before {
  background-image: url("../images/main/title-stat-color.png");
}
.intro-mystat .intro-mystat--analysis,
.intro-mystat .intro-mystat--monthly {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  padding: 28px 34px 34px;
  height: 337px;
  color: #000000;
}
@media (max-width: 1199px) {
  .intro-mystat .intro-mystat--analysis,
  .intro-mystat .intro-mystat--monthly {
    width: calc(50% - 12px);
  }
}
.intro-mystat .analysis--title a {
  display: flex;
  flex-direction: row;
  align-items: center;
  color: #000000;
}
.intro-mystat .analysis--box {
  padding-top: 30px;
  height: 249px;
  width: 100%;
}
.intro-mystat .analysis--box .analysis--legend {
  margin-top: -44px;
  font-size: 12px;
  line-height: 14px;
  text-align: right;
}
.intro-mystat .analysis--box .analysis--legend__wrap {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 14px;
  margin-top: -16px;
}
.intro-mystat .analysis--box .analysis--legend__wrap .analysis--legend span {
  margin-top: 3px;
}
.intro-mystat .analysis--box .analysis--legend span {
  vertical-align: top;
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-top: 3.5px;
  margin-right: 5px;
  border-radius: 7px;
  background-color: rgba(0, 0, 0, 0.1);
}
.intro-mystat .analysis--box .analysis--legend span.legend--variable {
  background: linear-gradient(
    138.01deg,
    #ff9960 24.4%,
    #f363ff 43.19%,
    #6aafff 66.58%,
    #19dc89 85.71%
  );
}
.intro-mystat .analysis--box .analysis--graph {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 37px;
  max-width: 490px;
  height: calc(100% - 28px);
  margin: 30px 36px 0 40px;
}
@media (max-width: 1199px) {
  .intro-mystat .analysis--box .analysis--graph {
    gap: 0;
    margin-right: 0;
    margin-left: 0;
  }
}
.intro-mystat .analysis--box .analysis--graph .analysis--graph-column {
  height: 100%;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column
  .graph-label {
  margin-top: 10px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 18px;
  line-height: 20px;
  text-align: center;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column
  .graph-box {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-end;
  gap: 4px;
  position: relative;
  height: 100%;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column
  .graph-box
  > div {
  width: 24px;
  border-radius: 24px 24px 0 0;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column
  .graph-box
  .graph-my {
  position: relative;
  background-color: rgba(0, 0, 0, 0.9);
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column
  .graph-box
  .graph-average {
  background-color: rgba(0, 0, 0, 0.1);
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column
  .graph-box
  .graph-tooltip {
  position: absolute;
  top: 0;
  left: 50%;
  margin-top: -52px;
  transform: translateX(-50%);
  z-index: 15;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column
  .graph-box
  .graph-tooltip--box {
  position: relative;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column
  .graph-box
  .graph-tooltip--box::after,
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column
  .graph-box
  .graph-tooltip--box::before {
  position: absolute;
  width: 7px;
  height: 12px;
  bottom: -12px;
  left: 50%;
  transform: translateX(-50%);
  content: "";
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column
  .graph-box
  .graph-tooltip--box::after {
  border-top-width: 6px;
  border-top-style: solid;
  border-top-color: transparent;
  border-left: 3.5px solid transparent;
  border-right: 3.5px solid transparent;
  z-index: 10;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column
  .graph-box
  .graph-tooltip--box
  span {
  position: relative;
  display: block;
  min-width: 87px;
  padding: 0 8px;
  border-radius: 10px;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
  color: #ffffff;
  font-size: 20px;
  font-weight: 800;
  white-space: nowrap;
  line-height: 36px;
  text-align: center;
  z-index: 7;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.language
  .graph-my {
  background-color: #3dcd90;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.language
  .graph-tooltip--box::after {
  border-top-color: #3dcd90;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.language
  .graph-tooltip--box
  span {
  background-color: #3dcd90;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.english
  .graph-my {
  background-color: #6f97ff;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.english
  .graph-tooltip--box::after {
  border-top-color: #6f97ff;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.english
  .graph-tooltip--box
  span {
  background-color: #6f97ff;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.math
  .graph-my {
  background-color: #7779fa;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.math
  .graph-tooltip--box::after {
  border-top-color: #7779fa;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.math
  .graph-tooltip--box
  span {
  background-color: #7779fa;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.society
  .graph-my {
  background-color: #ff9960;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.society
  .graph-tooltip--box::after {
  border-top-color: #ff9960;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.society
  .graph-tooltip--box
  span {
  background-color: #ff9960;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.science
  .graph-my {
  background-color: #fe87ea;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.science
  .graph-tooltip--box::after {
  border-top-color: #fe87ea;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.science
  .graph-tooltip--box
  span {
  background-color: #fe87ea;
}
.intro-mystat .monthly--title a {
  display: flex;
  flex-direction: row;
  align-items: center;
  color: #000000;
}
.intro-mystat .monthly--box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch;
  gap: 16px;
  width: 100%;
}
.intro-mystat .monthly--box-item {
  flex-shrink: 1;
  flex-grow: 1;
  width: 33.3333%;
  height: 197px;
  padding: 15px 0;
  border-radius: 20px;
  font-size: 0;
  text-align: center;
}
.intro-mystat .monthly--box-item p {
  text-align: center;
}
.intro-mystat .monthly--box-item .title {
  margin-bottom: 14px;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.intro-mystat .monthly--box-item .icon {
  display: block;
  width: 54px;
  height: 54px;
  margin: 0 auto;
}
.intro-mystat .monthly--box-item .number {
  margin-top: 13px;
  font-size: 14px;
  font-weight: 700;
  line-height: 31px;
}
.intro-mystat .monthly--box-item .number strong {
  padding-right: 3px;
  font-size: 28px;
  font-weight: 700;
}
.intro-mystat .monthly--box-item .tag {
  vertical-align: top;
  display: inline-block;
  margin-top: 9px;
  padding: 5px 7px;
  border-width: 1px;
  border-style: solid;
  border-radius: 50px;
  color: rgba(0, 0, 0, 0.8);
  font-size: 12px;
  line-height: 14px;
}
.intro-mystat .monthly--box-item .tag:first-child {
  margin-top: 5px;
  margin-bottom: 22px;
}
.intro-mystat .monthly--box-item .tag:first-child + .icon {
  margin-top: 0;
}
.intro-mystat .monthly--box-item.is--solved {
  background-color: #f2f5ff;
}
.intro-mystat .monthly--box-item.is--solved .icon {
  background-image: url("../images/main/intro-solved-color.svg");
}
.intro-mystat .monthly--box-item.is--solved .tag {
  background-color: rgba(97, 133, 255, 0.1);
  border: 1px solid rgba(49, 45, 255, 0.2);
}
.intro-mystat .monthly--box-item.is--solved2 {
  background-color: #ffefef;
}
.intro-mystat .monthly--box-item.is--solved2 .icon {
  background-image: url("../images/img/solved-color.svg");
}
.intro-mystat .monthly--box-item.is--solved2 .tag {
  background-color: #ffe4e4;
  border: 1px solid #f4b7b7;
}
.intro-mystat .monthly--box-item.is--rate {
  background-color: #eef6f0;
}
.intro-mystat .monthly--box-item.is--rate .icon {
  background-image: url("../images/main/intro-rate-color.svg");
}
.intro-mystat .monthly--box-item.is--rate .tag {
  background-color: #dbf1e1;
  border: 1px solid #98d3a7;
}
.intro-mystat .monthly--box-item.is--rate2 {
  background-color: #f2f5ff;
}
.intro-mystat .monthly--box-item.is--rate2 .icon {
  background-image: url("../images/img/rate-color.svg");
}
.intro-mystat .monthly--box-item.is--rate2 .tag {
  background-color: rgba(97, 133, 255, 0.1);
  border: 1px solid rgba(49, 45, 255, 0.2);
}
.intro-mystat .monthly--box-item.is--solvedtime {
  background-color: #f4efff;
}
.intro-mystat .monthly--box-item.is--solvedtime .icon {
  background-image: url("../images/main/intro-solvedtime-color.svg");
}
.intro-mystat .monthly--box-item.is--solvedtime .tag {
  background-color: #ebe1ff;
  border: 1px solid #c4acf8;
}
.intro-mystat .monthly--box-item.is--solvedtime2 {
  background-color: #ffefef;
}
.intro-mystat .monthly--box-item.is--solvedtime2 .icon {
  background-image: url("../images/main/intro-solvedtime2-color.svg");
}
.intro-mystat .monthly--box-item.is--solvedtime2 .tag {
  background-color: #ffe4e4;
  border: 1px solid #f4b7b7;
}
.intro-mystat .monthly--box-item.is--viewing {
  background-color: #ffefef;
}
.intro-mystat .monthly--box-item.is--viewing .icon {
  background-image: url("../images/main/intro-viewing-color.svg");
}
.intro-mystat .monthly--box-item.is--viewing .tag {
  background-color: #ffe4e4;
  border: 1px solid #f4b7b7;
}
.intro-mystat .intro-noti {
  margin-top: 20px;
}
.intro-mystat .box-grid {
  gap: 24px;
}
.intro-mystat .box--empty {
  position: relative;
  min-height: 0;
  gap: 0;
  padding: 0;
}
.intro-mystat .box--empty button {
  padding-right: 67px;
  padding-left: 67px;
}
.intro-mystat .box--empty-text {
  gap: 80px;
}
@media (max-width: 1199px) {
  .intro-mystat .box--empty-text {
    gap: 40px;
  }
}
.intro-mystat .box--empty .empty--inner {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding-top: 80px;
  padding-bottom: 40px;
  text-align: center;
  z-index: 10;
}
@media (max-width: 1199px) {
  .intro-mystat .box--empty .empty--inner {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
  }
}
.intro-mystat .box--empty .empty--inner .f-20 {
  line-height: 31px;
}
.intro-mystat .box--empty .empty--bg {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 5;
}
.intro-mystat .box--empty .empty--bg img {
  display: block;
  max-width: 100%;
}
.intro-mystat.is--student .monthly--box-item .tag {
  margin-top: 5px;
}
.intro-mystat.is--student .monthly--box-item .icon {
  margin-top: 22px;
}
.intro-mystat.is--student .monthly--box-item .number {
  margin-top: 20px;
}
.intro-mystat.is--student .box--empty {
  height: 100%;
}
.intro-mystat.is--student .box--empty-text {
  gap: 60px;
}
.intro-mystat.is--student .analysis--box .box--empty {
  margin-top: -30px;
}
.intro-mystat.is--student .box--empty {
  height: 275px;
}
.intro-mystat.is--student .box--empty .empty--inner {
  padding-top: 36px;
  padding-bottom: 40px;
}
.intro-mystat.is--student .box--empty .empty--inner .box--empty-text {
  justify-content: center;
  gap: 40px;
}
.intro-mystat.is--parents .monthly--box-item .tag {
  font-size: 14px;
}
.intro-mystat.is--parents .box--empty .empty--inner {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 0;
}
.intro-mystat.is--parents
  .box--empty
  .empty--inner.is--double
  .box--empty-text {
  width: 50%;
}
.intro-mystat.is--parents .box--empty .empty--inner.is--double::after {
  position: absolute;
  width: 1px;
  top: 62px;
  bottom: 28px;
  background-color: rgba(0, 0, 0, 0.1);
  content: "";
}
.intro-mystat > .box-grid {
  position: relative;
  background-color: #ffffff;
  border-radius: 20px;
}
.intro-mystat > .box-grid::after {
  position: absolute;
  width: 1px;
  top: 62px;
  left: 50%;
  bottom: 61px;
  background-color: rgba(0, 0, 0, 0.1);
  content: "";
}
.intro-recommend--title {
  display: inline-flex;
}
.intro-recommend--title::before {
  background-image: url("../images/main/title-recomm-color.png");
}
.intro-recommend--title button {
  line-height: 36px;
}
.intro-recommend--title .tooltip--box-wrap {
  margin-left: -3px;
}
.intro-recommend--title .tooltip--box {
  margin-top: 4px;
}
.intro-recommend--title .desc {
  margin-left: 1px;
}
.intro-recommend .box--empty {
  min-height: 0;
  height: 262px;
  gap: 0;
  padding-bottom: 11px;
}
.intro-recommend .box--empty .box--empty-text {
  margin-top: 8px;
}
.intro-recommend .box--empty button {
  padding-right: 67px;
  padding-left: 67px;
  margin-top: 62px;
}
.intro-notice--title::before {
  background-image: url("../images/main/title-noti-color.png");
}
.intro-notice .tab--wrapper .tab-box .tab--button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.intro-notice .tab--wrapper .tab-box .tab--button .ico-new-violet {
  margin-left: 8px;
}
.intro-notice .box--empty {
  min-height: 292px;
  gap: 10px;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: -46px;
  margin-bottom: -46px;
}
.intro-notice .box--empty button {
  padding-right: 67px;
  padding-left: 67px;
  margin-top: 38px;
}

.today-lesson {
  z-index: 5;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  width: auto;
  height: 249px;
  border-radius: 20px;
  transition: 0.35s ease-out box-shadow;
}
.today-lesson > div {
  position: relative;
  width: 360px;
  height: 100%;
  border-radius: 20px;
}
.today-lesson .box--empty-text,
.today-lesson .box--empty-text p {
  text-align: center;
}
.today-lesson .today-lesson--info {
  padding: 24px; /* 250613 수정 */
  z-index: 10;
  transition: 0.35s ease-out width, 0.35s ease-out border-radius;
  will-change: transform;
  display: flex; /* 250530 추가 */
  flex-direction: column; /* 250530 추가 */
}
.today-lesson .today-lesson--info__tag {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: relative;
  height: 28px; /* 250530 수정 */
  /* margin-top: 3px; 250530 삭제 */
  z-index: 10;
  margin-bottom: 12px; /* 250613 수정 */
}
.today-lesson .today-lesson--info__tag .info-tag__box {
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  /* padding-right: 46px; */
  background-position: right center;
  background-size: auto 16px;
  background-repeat: no-repeat;
}
.today-lesson
  .today-lesson--info__tag
  .info-tag__box
  p:not(.tag-text):not(.info-tag__repeat) {
  overflow: hidden;
  padding: 0 5px;
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 30px;
}
.today-lesson
  .today-lesson--info__tag
  .info-tag__box
  p:not(.tag-text):not(.info-tag__repeat)
  span {
  position: relative;
  float: left;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  line-height: 26px;
}
.today-lesson .today-lesson--info__tag .info-tag__box p.tag-text {
  margin-left: 8px; /* 250613 수정 */
  color: #ffffff;
  font-size: 18px;
  line-height: 20px;
  font-weight: 800;
  display: flex; /* 250530 추가 */
  gap: 16px; /* 250530 추가 */
}
/* 250530 추가 */
.today-lesson .today-lesson--info__tag .info-tag__box p.tag-text span {
  position: relative;
}
.today-lesson
  .today-lesson--info__tag
  .info-tag__box
  p.tag-text
  span
  ~ span::before {
  content: "";
  width: 1px;
  height: 14px;
  background-color: rgba(255, 255, 255, 0.8);
  position: absolute;
  left: -8px;
  top: 50%;
  transform: translateY(-50%);
}
/* //250530 추가 */
.today-lesson .today-lesson--info__tag .info-tag__box .text {
  padding-left: 7px; /* 250530 수정 */
  padding-right: 5px; /* 250530 수정 */
  color: #ffffff;
}
.today-lesson .today-lesson--info__tag .info-tag__box .tag {
  padding-left: 5px; /* 250530 수정 */
  padding-right: 7px; /* 250530 수정 */
  color: #ffffff;
}
.today-lesson .today-lesson--info__tag .info-tag__box .tag::before {
  position: absolute;
  width: 1px;
  height: 9px;
  top: 50%;
  left: 0;
  margin-top: -4.5px;
  background-color: rgba(0, 0, 0, 0.1);
  content: "";
}
.today-lesson .today-lesson--info__tag .info-tag__box .tag:first-child::before {
  display: none;
}
.today-lesson .today-lesson--info__tag .info-tag__repeat {
  margin-left: 10px;
  background-color: transparent;
}
.today-lesson .today-lesson--info__tag .info-tag__menu {
  margin-right: -8px; /* 250530 추가 */
}
.today-lesson .today-lesson--info__tag .info-tag__menu .tab-menu--button {
  background-image: url("../images/ico/more-white.svg");
}
.today-lesson .today-lesson--info__title {
  position: relative;
  /*margin-top: 4px;*/ /* 250613 삭제  */
  z-index: 5;
  padding: 0 4px; /* 250530 추가 */
}
.today-lesson .today-lesson--info__title .tooltip--box-wrap {
  display: block;
  max-width: 100%;
}
.today-lesson .today-lesson--info__title .tooltip--box-wrap .tooltip--box {
  left: 0;
}
.today-lesson .today-lesson--info__title .tooltip--box-wrap .tooltip--box-text {
  white-space: initial;
}
.today-lesson .today-lesson--info__title .tooltip--box-wrap + .text,
.today-lesson
  .today-lesson--info__title
  .tooltip--box-wrap
  + .tooltip--box-wrap {
  height: 40px; /* 250613 롤백 수정 */
  margin-top: 9px; /* 250613 롤백 수정 */
}
.today-lesson .today-lesson--info__title .text {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; /* 250613 롤백 수정 */
  max-height: 40px;
  color: #ffffff;
  font-size: 18px;
  white-space: inherit;
  line-height: 20px;
}
.today-lesson .today-lesson--info__date {
  margin-top: 11px; /* 250613 수정 */
  min-height: 18px;
  color: rgba(255, 255, 255, 0.6);
  font-size: 14px;
  line-height: 18px;
  padding: 0 4px; /* 250530 추가 */
}
.today-lesson .today-lesson--info__buttons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: auto; /* 250530 추가 */
}
.today-lesson .today-lesson--info__buttons .today-lesson--info__button {
  background-color: #ffffff;
}
.today-lesson .today-lesson--info__button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top: 14px; /* 250613 롤백 수정 */
  width: 100%;
  height: 52px;
  border-radius: 10px;
  font-size: 18px;
  font-weight: 700;
  background-color: #ffffff;
  border: 1px solid #ffffff;
}
.today-lesson .today-lesson--info__button.is--dim,
.today-lesson .today-lesson--info__button:disabled {
  background-color: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.6);
}
.today-lesson .today-lesson--data {
  overflow: hidden;
  margin-left: -360px;
  background-color: #ffffff;
  transition: 0.35s ease-out margin-left;
  z-index: 5;
  will-change: transform;
}
.today-lesson .today-lesson--data .tab--wrapper {
  display: flex;
  flex-direction: column;
  position: relative;
  height: 100%;
}
.today-lesson .today-lesson--data .tab--wrapper .today-lesson__close {
  position: absolute;
  top: 18px;
  right: 16px;
}
.today-lesson .today-lesson--data .tab-box {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-shrink: 0;
  flex-grow: 0;
  gap: 0;
  height: 65px;
  padding-right: 55px;
  border-bottom: 1px solid #d9d9d9;
}
.today-lesson .today-lesson--data .tab--button {
  min-width: 0;
  width: 68px;
  margin-top: 0;
  padding: 26px 0 15px;
  background-color: transparent;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  color: rgba(0, 0, 0, 0.4);
  font-size: 18px;
  font-weight: 700;
  line-height: 20px;
  white-space: nowrap;
}
.today-lesson .today-lesson--data .tab--button:first-child {
  width: 104px;
}
.today-lesson .today-lesson--data .tab--button.active {
  border-bottom-color: #7e44fb;
  color: #7e44fb;
  font-weight: 700;
}
.today-lesson .today-lesson--data .tab--contents {
  flex-shrink: 1;
  flex-grow: 1;
  height: calc(100% - 65px);
}
.today-lesson .today-lesson--data .today-lesson--data__list {
  overflow: hidden;
  overflow-y: auto;
  height: 100%;
  padding: 0 3px;
}
.today-lesson .today-lesson--data .today-lesson--data__list .data-list__notice,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-list__box
  li
  .state-box {
  height: 28px;
  padding: 0 12px;
  line-height: 28px;
  font-size: 14px;
  font-weight: 700;
}
.today-lesson .today-lesson--data .today-lesson--data__list .data-list__box {
  height: 100%;
  padding: 0 14px;
}
.today-lesson .today-lesson--data .today-lesson--data__list .data-list__box li {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  padding-right: 10px;
  padding-left: 4px;
  height: 70px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-list__box
  li:not(:first-child) {
  border-top: 1px solid #d9d9d9;
}
.today-lesson .today-lesson--data .today-lesson--data__list .data-list__notice {
  flex-shrink: 0;
  flex-grow: 0;
}
.today-lesson .today-lesson--data .today-lesson--data__list .data-list__ico {
  flex-shrink: 0;
  flex-grow: 0;
}
.today-lesson .today-lesson--data .today-lesson--data__list .data-list__title {
  flex-shrink: 1;
  flex-grow: 1;
  height: 18px;
  margin: 0 12px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-list__title
  span {
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-list__title:first-child {
  margin-left: 0;
}
.today-lesson .today-lesson--data .today-lesson--data__list .data-list__date {
  color: rgba(0, 0, 0, 0.6);
  font-size: 16px;
  line-height: 18px;
}
.today-lesson .today-lesson--data .today-lesson--data__list .data-list__button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 12px;
  padding-left: 12px;
}
.today-lesson .today-lesson--data .today-lesson--data__list .data-list__down {
  flex-shrink: 0;
  flex-grow: 0;
}
.today-lesson .today-lesson--data .today-lesson--data__list .data-diagnosis {
  margin: 0 14px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__title {
  font-size: 16px;
  line-height: 18px;
  color: rgba(0, 0, 0, 0.6);
  margin-bottom: 10px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__title:first-child {
  margin-top: 20px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__box {
  display: flex;
  flex-direction: column;
  overflow-x: auto;
  overflow-y: hidden;
  border: 1px solid rgba(0, 0, 0, 0.16);
  border-radius: 10px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__box:first-child {
  margin-top: 28px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__box
  p {
  font-size: 16px;
  line-height: 18px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__thead {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  background: #f6f6f6;
  border-radius: 10px 10px 0px 0px;
  height: 31px;
  width: max-content;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__thead::after {
  position: absolute;
  width: 31px;
  height: 31px;
  right: -12px;
  background: #f6f6f6;
  content: "";
  z-index: 5;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__thead
  .data-diagnosis__subject {
  padding-left: 47px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__thead
  > * {
  position: relative;
  flex-shrink: 0;
  z-index: 10;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__list {
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 89px;
  padding: 2px 0;
  width: max-content;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__list
  li {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  padding: 6px 0;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__list
  li
  > * {
  flex-shrink: 0;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__subject {
  position: relative;
  width: 163px;
  overflow: hidden;
  height: 18px;
  margin: 0 24px;
  cursor: default;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__times {
  width: 76px;
  text-align: center;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__state {
  width: 90px;
  text-align: center;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__state.ing {
  color: #00ba13;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__level {
  width: 130px;
  text-align: center;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__level
  .state-box {
  height: 30px;
  padding-top: 6px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__button {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  width: 244px;
  gap: 12px;
  padding-right: 12px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__button
  button,
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis__button
  a {
  min-width: 75px;
  padding-left: 11px;
  padding-right: 11px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis
  + .data-list__box {
  height: initial;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis
  + .data-list__box
  li {
  padding-left: 0;
  padding-right: 0;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis
  + .data-list__box
  .data-list__title {
  margin-right: 0;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .data-diagnosis.is--student
  .data-diagnosis__button {
  width: 114px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .button-main.is--lsmall {
  font-size: 14px;
  line-height: 16px;
  height: 28px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list
  .button-main.is--lsmall.gray-line {
  border-color: rgba(0, 0, 0, 0.16);
  padding: 0 11px;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list.is--board
  .data-list__title {
  cursor: pointer;
}
.today-lesson:nth-child(3n-2) .today-lesson--info {
  background-color: #56bf93;
}
.today-lesson:nth-child(3n-2) .today-lesson--info .today-lesson--info__button {
  color: #138957;
}
.today-lesson:nth-child(3n-2)
  .today-lesson--info
  .today-lesson--info__button.is--dim,
.today-lesson:nth-child(3n-2)
  .today-lesson--info
  .today-lesson--info__button:disabled {
  color: rgba(255, 255, 255, 0.7);
}
.today-lesson:nth-child(3n-2).is--live
  .today-lesson--info__tag
  .info-tag__box
  .tag {
  color: #ffffff;
}
.today-lesson:nth-child(3n-1) .today-lesson--info {
  background-color: #5890ff;
}
.today-lesson:nth-child(3n-1) .today-lesson--info .today-lesson--info__button {
  color: #447ceb;
}
.today-lesson:nth-child(3n-1)
  .today-lesson--info
  .today-lesson--info__button.is--dim,
.today-lesson:nth-child(3n-1)
  .today-lesson--info
  .today-lesson--info__button:disabled {
  color: rgba(255, 255, 255, 0.7);
}
.today-lesson:nth-child(3n-1).is--live
  .today-lesson--info__tag
  .info-tag__box
  .tag {
  color: #ffffff;
}
.today-lesson:nth-child(3n-0) .today-lesson--info {
  background-color: #9869fc; /* 250530 색상 변경 */
}
.today-lesson:nth-child(3n-0) .today-lesson--info .today-lesson--info__button {
  color: #7e44fb;
}
.today-lesson:nth-child(3n-0)
  .today-lesson--info
  .today-lesson--info__button.is--dim,
.today-lesson:nth-child(3n-0)
  .today-lesson--info
  .today-lesson--info__button:disabled {
  color: rgba(255, 255, 255, 0.7);
}
.today-lesson:nth-child(3n-0).is--live
  .today-lesson--info__tag
  .info-tag__box
  .tag {
  color: #ffffff;
}
.today-lesson:hover {
  z-index: 20;
}
.today-lesson.is--toggle:hover {
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
.today-lesson.is--toggle.open .today-lesson--info {
  width: 316px; /* 250605 수정 */
  border-radius: 20px 0 0 20px;
}
.today-lesson.is--toggle.open .today-lesson--data {
  width: 462px;
  padding-left: 30px;
  margin-left: -30px;
}
.today-lesson.is--live .today-lesson--info__button {
  background-color: #ffffff;
  border-color: #ffffff;
}
.today-lesson.no--button {
  height: 188px;
}

.intro-today.box-grid,
.intro-today .box-grid > div {
  height: 561px;
}
@media (max-width: 1199px) {
  .intro-today.box-grid.intro-today__info,
  .intro-today .box-grid > div.intro-today__info {
    width: calc(41.6666666667% - 6px);
  }
}
.intro-today .intro-teacher {
  margin-bottom: 38px;
}
.intro-today .intro-teacher .teacher-online {
  flex-shrink: 0;
  flex-grow: 0;
  width: 314px;
}
.intro-today .intro-teacher__time {
  margin-top: 48px;
}
.intro-today .intro-teacher + .box-grid .intro-today__ai,
.intro-today .intro-teacher + .box-grid .intro-today__info {
  margin-top: 0;
}
.intro-today__ai {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 537px;
  padding-top: 23px;
  padding-bottom: 74px;
  margin-top: 84px;
}
.intro-today__ai .today-ai--image {
  flex-shrink: 0;
  flex-grow: 0;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 248px;
  margin: 0 auto;
}
.intro-today__ai .today-ai--image__motion {
  position: relative;
  width: 591px;
  height: 248px;
  left: 50%;
  transform: translateX(-50%);
}
.intro-today__ai .today-ai--image__tooltip {
  position: absolute;
  display: inline-block;
}
.intro-today__ai .today-ai--image__tooltip p {
  position: relative;
}
.intro-today__ai .today-ai--image__tooltip p::after {
  position: absolute;
  width: 33px;
  height: 66px;
  border: 33px solid transparent;
  z-index: 5;
  content: "";
}
.intro-today__ai .today-ai--image__tooltip p span {
  position: relative;
  display: block;
  padding: 9px 10px;
  border-radius: 500px;
  color: #ffffff;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  line-height: 20px;
  white-space: nowrap;
  z-index: 10;
}
.intro-today__ai .today-ai--image__tooltip.is--violet span {
  background-color: #bb50ff;
}
.intro-today__ai .today-ai--image__tooltip.is--violet.is--top p::after {
  border-bottom-color: #bb50ff;
}
.intro-today__ai .today-ai--image__tooltip.is--violet.is--bottom p::after {
  border-top-color: #bb50ff;
}
.intro-today__ai .today-ai--image__tooltip.is--blue span {
  background-color: #1c92ff;
}
.intro-today__ai .today-ai--image__tooltip.is--blue.is--top p::after {
  border-bottom-color: #1c92ff;
}
.intro-today__ai .today-ai--image__tooltip.is--blue.is--bottom p::after {
  border-top-color: #1c92ff;
}
.intro-today__ai .today-ai--image__tooltip.is--top {
  top: 0;
  margin-top: -6px;
}
.intro-today__ai .today-ai--image__tooltip.is--top p::after {
  bottom: 0;
}
.intro-today__ai .today-ai--image__tooltip.is--right {
  right: 0;
  transform: translateX(100%);
  margin-right: 29px;
}
.intro-today__ai .today-ai--image__tooltip.is--right p::after {
  left: 0;
  margin-left: -9px;
}
.intro-today__ai .today-ai--image__tooltip.is--bottom {
  bottom: 0;
  margin-bottom: 16px;
}
.intro-today__ai .today-ai--image__tooltip.is--bottom p::after {
  top: 0;
}
.intro-today__ai .today-ai--image__tooltip.is--left {
  left: 0;
  transform: translateX(-100%);
  margin-left: 29px;
}
.intro-today__ai .today-ai--image__tooltip.is--left p::after {
  right: 0;
  margin-right: -9px;
}
.intro-today__ai .today-ai--image__box {
  width: 100%;
  height: 100%;
  background-image: url("../images/img/today-ai-color.svg");
}
.intro-today__ai .today-ai--text {
  padding: 0 40px;
  margin-top: 23px;
  text-align: center;
  word-wrap: break-word;
  word-break: keep-all;
}
@media (max-width: 1199px) {
  .intro-today__ai .today-ai--text br {
    display: none;
  }
}
.intro-today__ai .today-ai--text__title {
  color: #000000;
  font-size: 26px;
  font-weight: 700;
  line-height: 30px;
}
.intro-today__ai .today-ai--text__text {
  margin-top: 34px;
  color: #000000;
  font-size: 24px;
  line-height: 49px;
}
.intro-today__ai .today-ai--text__text span {
  position: relative;
  color: #7e44fb;
  font-size: 28px;
  font-weight: 800;
  white-space: nowrap;
}
.intro-today__ai .today-ai--text__text span::before {
  position: absolute;
  display: block;
  right: -4px;
  bottom: -4px;
  left: -4px;
  height: 22px;
  background-color: rgba(187, 80, 255, 0.14);
  border-radius: 22px;
  content: "";
}
.intro-today__info {
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  height: 537px;
  margin-top: 84px;
}
.intro-today__info .tab-box {
  flex-shrink: 0;
}
.intro-today__info .today-info__profile {
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  height: 215px;
  padding: 28px 24px 74px;
  background-color: #f8f9fd;
  border-radius: 20px 20px 0 0;
}
.intro-today__info .today-info__profile + .today-info__worklist {
  margin-top: -46px;
}
.intro-today__info .today-info__profile__box {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 24px;
  margin-top: 5px;
}
.intro-today__info .today-info__profile__box .profile-box__image {
  flex-shrink: 0;
  flex-grow: 0;
  width: 80px;
  height: 80px;
  border-radius: 80px;
  background-color: #7e44fb;
  background-image: url("../images/ico/profile-big-white.svg");
  background-size: cover;
}
.intro-today__info .today-info__profile__box .profile-box__text .name {
  font-size: 18px;
  font-weight: 700;
  line-height: 20px;
}
.intro-today__info .today-info__profile__box .profile-box__text .name strong {
  padding-right: 2px;
  font-size: 22px;
  font-weight: 800;
}
.intro-today__info .today-info__profile__box .profile-box__text .school {
  margin-top: 11px;
  font-size: 0;
}
@media (max-width: 1199px) {
  .intro-today__info .today-info__profile__box .profile-box__text .school {
    line-height: 18px;
  }
}
.intro-today__info .today-info__profile__box .profile-box__text .school span {
  display: inline-block;
  color: rgba(0, 0, 0, 0.6);
  font-size: 16px;
  font-weight: 700;
  line-height: 18px;
}
.intro-today__info
  .today-info__profile__box
  .profile-box__text
  .school
  span:not(:first-child) {
  position: relative;
  margin-left: 10px;
  padding-left: 11px;
}
.intro-today__info
  .today-info__profile__box
  .profile-box__text
  .school
  span:not(:first-child)::before {
  position: absolute;
  display: block;
  top: 50%;
  left: 0;
  width: 1px;
  height: 14px;
  margin-top: -7px;
  background-color: #d9d9d9;
  content: "";
}
.intro-today__info .today-info__profile__like {
  font-size: 0;
  text-align: center;
}
.intro-today__info .today-info__profile__like .profile-like__icon {
  width: 60px;
  height: 60px;
  background-image: url("../images/ico/thumbs-up-violet.svg");
}
.intro-today__info .today-info__profile__like .profile-like__number {
  display: inline-block;
  padding: 0 14px;
  margin-top: 8px;
  margin-right: auto;
  margin-left: auto;
  background-color: rgba(180, 93, 215, 0.14);
  border-radius: 22px;
  color: #b45dd7;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  line-height: 22px;
}
.intro-today__info .today-info__worklist {
  flex-shrink: 1;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  overflow: hidden;
}
.intro-today__info .today-info__worklist .tab-box {
  height: 46px;
}
.intro-today__info .today-info__worklist .tab-box .tab--button {
  margin-top: 0;
  background-color: transparent;
  color: rgba(0, 0, 0, 0.6);
  font-size: 16px;
}
.intro-today__info .today-info__worklist .tab-box .tab--button.active {
  font-weight: 700;
  background-color: #ffffff;
  color: #7e44fb;
}
.intro-today__info .today-info__worklist .tab--contents {
  flex-shrink: 1;
  flex-grow: 1;
  overflow: hidden;
  position: relative;
  padding: 28px 24px 0px;
}
.intro-today__info .today-info__worklist .tab--contents .box--empty-icon {
  width: 70px;
  height: 70px;
}
.intro-today__info .today-info__worklist .info-worklist--scroll {
  overflow: hidden;
  overflow-y: auto;
  padding: 28px 24px 0px;
  margin: -21px -24px 0px;
  height: calc(100% - 63px);
}
.intro-today__info .today-info__worklist .info-worklist--row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.intro-today__info .today-info__worklist .info-worklist--row:not(:first-child) {
  margin-top: 20px;
}
.intro-today__info .today-info__worklist .info-worklist--row .row-text {
  display: flex;
  flex-direction: row;
  align-items: center;
  max-width: 260px;
  gap: 8px; /* 250605 수정 */
}
@media (max-width: 1199px) {
  .intro-today__info .today-info__worklist .info-worklist--row .row-text {
    max-width: 200px;
  }
}
.intro-today__info
  .today-info__worklist
  .info-worklist--row
  .row-text
  .state-box {
  flex-shrink: 0;
  flex-grow: 0;
  /*width: 50px;*/
  height: 28px;
  padding: 6px 12px;
  font-size: 14px;
  text-align: center;
  /*line-height: 28px;*/
} /* 250625 수정 */
.intro-today__info .today-info__worklist .info-worklist--row .row-text .title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.intro-today__info .today-info__worklist .info-worklist--row .category {
  color: rgba(0, 0, 0, 0.5);
  font-size: 16px;
  line-height: 18px;
  /* [이슈리스트 : 230804][2144] 메인> 사용자 메뉴 : 과목명 영역 구분 */
  max-width: 130px;
  padding-left: 16px;
  flex-shrink: 0;
  text-align: right;
}
.intro-today__info .today-info__worklist .info-worklist--button {
  position: absolute;
  right: 24px;
  bottom: 24px;
  left: 24px;
}
.intro-today__info .today-info__worklist .info-worklist--button a,
.intro-today__info .today-info__worklist .info-worklist--button button {
  display: block;
  height: 44px;
  background-color: #f5f8fa;
  border: 1px solid #dddddd;
  border-radius: 10px;
  color: #000000;
  font-size: 14px;
  text-align: center;
  line-height: 44px;
}
.intro-today__info .today-info__worklist .box--empty {
  min-height: 0;
  height: 100%;
  gap: 8px;
  padding-top: 0px;
  margin-top: -20px;
}
.intro-today__info .info-class__button {
  flex-shrink: 0;
  flex-grow: 0;
  position: relative;
  overflow: hidden;
  overflow-x: auto;
  max-width: 100%;
  height: auto;
}
.intro-today__info .info-class__button::-webkit-scrollbar-track {
  background-color: #ffffff;
}
.intro-today__info .info-class__button .tab--button {
  min-width: 225px;
  height: 44px;
}
@media (max-width: 1199px) {
  .intro-today__info .info-class__button .tab--button {
    min-width: 170px;
  }
}
.intro-today__info .info-class__button .tab--button.active {
  height: 55px;
}
.intro-today__info .info-class__box {
  flex-shrink: 1;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  overflow: hidden;
  display: none;
}
.intro-today__info .info-class__box.active {
  display: flex;
}
.intro-today__info .info-class__box .today-info__profile {
  height: 176px;
  padding: 24px 24px 59px;
  background-color: transparent;
}
.intro-today__info
  .info-class__box
  .today-info__profile
  + .today-info__worklist {
  margin-top: -59px;
}
.intro-today__info .info-class__box .today-info__worklist .tab--contents {
  padding-top: 20px;
  padding-bottom: 0px;
}
.intro-today__info
  .info-class__box
  .today-info__worklist
  .info-worklist--button {
  margin-top: 21px;
}
.intro-today__info.is--single .info-class__box {
  border-radius: 0 20px 20px 20px;
}

.intro-noti {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  height: 60px;
  padding-right: 17px;
  background-color: rgba(233, 223, 255, 0.8);
  border: 1px solid #ab96ff;
  border-radius: 60px;
  position: relative;
}
.intro-noti--text {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.intro-noti--link {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  border-radius: 60px;
  overflow: hidden;
  padding-right: 52px;
}
.intro-noti--link .ico-28 {
  background: none;
  width: 0;
  overflow: hidden;
}
.intro-noti--link:after {
  content: "";
  position: absolute;
  right: 17px;
  width: 28px;
  height: 28px;
  background-image: url("../images/ico/next-black.svg");
  background-size: 100% 100%;
}
.intro-noti__teacher {
  display: flex;
  flex-direction: row;
  justify-content: stretch;
  align-items: center;
  gap: 14px;
}
.intro-noti__teacher:first-child {
  margin-top: 84px !important;
}
.intro-noti.gray {
  background-color: rgba(247, 247, 247, 0.8);
  border-color: #cfcfcf;
}
.intro-noti.noti-student {
  padding-left: 38px;
}
.intro-noti.teacher-online {
  padding-left: 19px;
}
.intro-noti.teacher-online .intro-noti--text {
  width: 100%;
  justify-content: stretch;
}
.intro-noti.teacher-online .noti-text--icon {
  flex-shrink: 0;
  flex-grow: 0;
  width: 30px;
}
.intro-noti.teacher-online .noti-text--text {
  flex-shrink: 1;
  flex-grow: 1;
  padding-left: 10px;
  text-align: left;
}
.intro-noti.teacher-online .noti-text--number {
  flex-shrink: 0;
  flex-grow: 0;
  width: 45px;
  text-align: right;
}
.intro-noti.teacher-online .tooltip--box {
  padding-top: 22px;
  margin-top: -22px;
}
.intro-noti.teacher-online .tooltip--box-text {
  overflow: hidden;
  overflow-y: auto;
  max-height: 240px;
  padding-top: 18px;
  padding-bottom: 18px;
}
.intro-noti.teacher-online .tooltip--box:hover {
  display: block;
}
.intro-noti.teacher-noti {
  flex-shrink: 1;
  flex-grow: 1;
  padding-left: 16px;
}

.intro-select.workbook--make .intro-select--titlebox {
  margin-top: 145px;
  text-align: center;
}
.intro-select.workbook--make .intro-select--title {
  vertical-align: top;
  position: relative;
  display: inline-block;
  height: 86px;
  padding-top: 30px;
  padding-right: 42px;
  padding-bottom: 10px;
  background-image: url("../images/main/select-class-title.svg");
  background-repeat: no-repeat;
  background-position: right bottom;
  color: #000000;
  font-size: 48px;
  line-height: 54px;
  font-weight: 800;
}
.intro-select.workbook--make .intro-select--title strong {
  position: relative;
  color: #7e44fb;
  font-weight: 800;
}
.intro-select.workbook--make .intro-select--title strong::after {
  position: absolute;
  right: -9px;
  bottom: 0;
  left: -9px;
  height: 22px;
  background-color: rgba(126, 68, 251, 0.14);
  border-radius: 22px;
  content: "";
}
.intro-select.workbook--make .intro-select--desc {
  margin-top: 24px;
  color: #000000;
  font-size: 20px;
  line-height: 32px;
}
.intro-select.workbook--make .box-grid {
  margin-top: 60px;
}
.intro-select.workbook--make .box-grid .cell-06 {
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right bottom;
}
.intro-select.workbook--make .box-grid .cell-06 .arrow .hover {
  display: flex;
  flex-direction: row;
  align-items: center;
  display: none;
  padding-right: 9px;
  padding-left: 19px;
  color: #7e44fb;
  font-size: 18px;
  line-height: 20px;
  font-weight: 800;
}
.intro-select.workbook--make .box-grid .cell-06:hover {
  background-color: #7e44fb;
}
.intro-select.workbook--make .box-grid .cell-06:hover .title {
  color: #ffffff;
}
.intro-select.workbook--make .box-grid .cell-06:hover .arrow {
  width: auto;
  height: 40px;
  background-color: #ffffff;
  border: none;
  border-radius: 40px;
}
.intro-select.workbook--make .box-grid .cell-06:hover .arrow::before {
  display: none;
}
.intro-select.workbook--make .box-grid .cell-06:hover .arrow .hover {
  display: flex;
}
.intro-select.workbook--make .box-grid .cell-06 .icon {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.intro-select.workbook--make .box-grid .cell-06:nth-child(2n-1) {
  background-image: url("../images/main/class01.svg");
}
.intro-select.workbook--make .box-grid .cell-06:nth-child(2n-1):hover {
  background-image: url("../images/main/class01-on.svg");
}
.intro-select.workbook--make .box-grid .cell-06:nth-child(2n) {
  background-image: url("../images/main/class02.svg");
}
.intro-select.workbook--make .box-grid .cell-06:nth-child(2n):hover {
  background-image: url("../images/main/class02-on.svg");
}
@keyframes marquee {
  0% {
    left: 100%;
  }
  100% {
    left: 0;
    transform: translateX(-100%);
  }
}
.online-student--list li {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.online-student--list li:not(:first-child) {
  margin-top: 17px;
}
.online-student--list li span {
  display: block;
  color: #000000;
  font-size: 14px;
  line-height: 20px;
}
.online-student--list li span.name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 700;
  max-width: 300px;
}
.login {
  background-color: #20114f;
}
.login .contents-area {
  width: 800px;
  margin: 92px auto;
}
.login--title {
  color: #7e44fb;
  font-size: 62px;
  font-weight: 800;
  text-align: center;
  line-height: 70px;
}
.login--desc {
  margin-top: 6px;
  color: #ffffff;
  font-size: 24px;
  line-height: 27px;
  text-align: center;
}
.login--box {
  margin-top: 93px;
}
.login--box .tab--button {
  flex-shrink: 1;
  flex-grow: 1;
  min-width: 0;
}
.login--student-info {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 11px;
}
.login--student-info .dropdown--area {
  flex-shrink: 1;
  flex-grow: 1;
  max-width: 135px;
}
.login--student-info .dropdown--area .dropdown--select {
  padding-top: 8px;
  padding-bottom: 8px;
  padding-right: 45px;
  padding-left: 14px;
}
.login--student-info .dropdown--area .dropdown--select::after {
  right: 14px;
}
.login--button {
  width: 100%;
  height: 70px;
}
.login--utill {
  position: relative;
  margin-top: 89px;
  text-align: center;
}
.login--utill__button {
  color: rgba(0, 0, 0, 0.6);
  font-size: 18px;
  line-height: 20px;
  text-align: right;
  line-height: 32px;
}
.login--utill__robot {
  position: absolute;
  top: 0;
  right: 0;
}
.login--utill__robot img {
  display: block;
}

.month__status,
.report-month__badgebox .month__result {
  width: calc((100% - 24px) / 2);
  padding: 30px 24px 36px;
}
.month__status .box--edit-title,
.report-month__badgebox .month__result .box--edit-title {
  margin-top: 0;
  margin-bottom: 0;
}
@media (max-width: 1199px) {
  .month__status .legend,
  .report-month__badgebox .month__result .legend {
    flex-direction: column;
    align-items: end;
    gap: 5px;
  }
}

.report-month__subjects .month-subject__detail .subject-detail__times,
.report-month__subjects .month-subject__detail .subject-detail__result {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 44px;
  padding: 30px 24px 0;
}
.report-month__subjects .month-subject__detail .subject-detail__times .title,
.report-month__subjects .month-subject__detail .subject-detail__result .title {
  color: #000000;
  font-size: 16px;
  line-height: 18px;
  font-weight: 700;
}

.report-month__guide .month-guide--left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 11px;
}
.report-month__guide .month-guide--left .icon {
  width: 70px;
  height: 70px;
  border-radius: 70px;
}
.report-month__guide .month-guide--left .text {
  width: 98px;
  height: 26px;
  border-radius: 26px;
  color: rgba(0, 0, 0, 0.7);
  font-size: 14px;
  line-height: 24px;
  text-align: center;
}

.report-personal .report-total__top3.box--empty,
.report-total__information.box--empty {
  position: relative;
  min-height: 0;
}
.report-personal .report-total__top3.box--empty .empty--inner,
.report-total__information.box--empty .empty--inner {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}
.report-personal .report-total__top3.box--empty .box--empty-text,
.report-total__information.box--empty .box--empty-text {
  text-align: center;
  gap: 48px;
}
.report-personal .report-total__top3.box--empty .box--empty-text p,
.report-total__information.box--empty .box--empty-text p {
  font-size: 20px;
  line-height: 35px;
}
.report-personal .report-total__top3.box--empty .empty--bg,
.report-total__information.box--empty .empty--bg {
  position: relative;
  z-index: 5;
}
.report-personal .report-total__top3.box--empty .empty--bg img,
.report-total__information.box--empty .empty--bg img {
  display: block;
  width: 100%;
}

.report-month .student--card {
  border: none;
}
.report-month > *:first-child {
  margin-top: 84px;
}
.report-month .tab-tags--wrapper:not(:first-child) {
  margin-top: 24px;
}
.report-month .tab-tags--wrapper.is--scroll .tab-tags--box::before,
.report-month .tab-tags--wrapper.is--scroll .tab-tags--box::after {
  background: linear-gradient(
    270deg,
    #edf1fc 56.25%,
    rgba(237, 241, 252, 0) 81.25%
  );
}
.report-month .tab-tags--box:not(.tags-select) .tag--button.myclass {
  background-color: rgba(69, 188, 255, 0.24);
}
.report-month .tab-tags--box:not(.tags-select) .tag--button.myclass.active,
.report-month
  .tab-tags--box:not(.tags-select)
  .tag--button.myclass.active
  .tab-tag--text {
  background-color: #45bcff;
}
.report-month
  .tab-tags--box:not(.tags-select)
  .tag--button.myclass.active
  .ico-cancel-black {
  background-image: url("../images/ico/cancel-white.svg");
}
.report-month .tab-tags--box:not(.tags-select) .tab-action:first-child {
  position: relative;
  right: initial;
}
.report-month__badgebox {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  margin-top: 24px;
  padding: 24px;
  gap: 24px;
}
.report-month__badgebox .month__badge {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  flex-grow: 0;
  overflow: hidden;
  position: relative;
  width: 250px;
}
@media (max-width: 1199px) {
  .report-month__badgebox .month__badge {
    flex-shrink: 1;
    flex-grow: 1;
    width: auto;
  }
}
.report-month__badgebox .month__badge .badge {
  position: relative;
  width: 286px;
  height: 214px;
}
.report-month__badgebox .month__badge .text {
  margin-top: 6px;
  color: #000000;
  font-size: 16px;
  line-height: 29px;
  font-weight: 700;
  text-align: center;
  word-break: keep-all;
}
.report-month__badgebox .month__badge .text strong {
  color: #7e44fb;
  font-weight: 800;
}
.report-month__badgebox .month__badge.is--student {
  flex-shrink: 0;
  flex-grow: 0;
  width: 272px;
  height: 348px;
  margin-left: 0;
}
.report-month__badgebox .month__badge.is--student::after {
  display: none;
}
.report-month__badgebox .month__badge.is--student .text {
  margin-top: 14px;
  color: #000000;
  font-size: 16px;
  line-height: 30px;
  font-weight: 700;
}
.report-month__badgebox .month__badge.is--student .text.teacher {
  margin-top: 6px;
}
.report-month__badgebox .month__badge.is--student + .month__right {
  flex-shrink: 1;
  flex-grow: 1;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  height: 348px;
  border-radius: 20px;
  background-image: url("../images/img/report-month-badgebox.png");
  background-color: rgba(246, 246, 246, 0.7);
  background-size: contain;
  background-repeat: no-repeat;
}
.report-month__badgebox
  .month__badge.is--student
  + .month__right
  .box--empty-text {
  justify-content: space-between;
  height: 100%;
  padding-top: 103px;
  padding-bottom: 40px;
  color: #1a1a1a;
  font-size: 20px;
  line-height: 34px;
  text-align: center;
}
.report-month__badgebox
  .month__badge.is--student
  + .month__right
  .box--empty-text
  .button-main {
  padding-right: 67px;
  padding-left: 67px;
}
.report-month__badgebox
  .month__badge.is--student
  + .month__right
  .box--empty-text.align--middle {
  justify-content: center;
  padding: 0px;
}
.report-month__badgebox .month__badge.is--profile {
  align-self: center;
  padding-bottom: 33px;
}
.report-month__badgebox .month__badge.is--profile .name {
  color: rgba(0, 0, 0, 0.6);
  font-size: 14px;
  line-height: 16px;
}
.report-month__badgebox .month__badge.is--profile .name strong {
  padding-right: 2px;
  color: #000000;
  font-size: 20px;
  line-height: 23px;
  font-weight: 700;
}
.report-month__badgebox .month__badge.is--profile .profile {
  position: relative;
  width: 162px;
  height: 162px;
  margin-top: 21px;
}
.report-month__badgebox .month__badge.is--profile .profile .image {
  position: relative;
  width: 162px;
  height: 162px;
  background: url("../images/ico/profile-big-white.svg"),
    linear-gradient(193.13deg, #d0c1a2 18.84%, #c1af8c 81.28%) no-repeat center
      center;
  background-size: cover;
  border-radius: 162px;
  z-index: 10;
}
.report-month__badgebox .month__badge.is--profile .profile .badge {
  position: absolute;
  width: 108px;
  height: 108px;
  right: -31px;
  bottom: -36px;
  z-index: 10;
}
.report-month__badgebox .month__badge.is--profile .profile .badge.verygood {
  background-image: url("../images/img/badge-01-color.svg");
}
.report-month__badgebox .month__badge.is--profile .profile .badge.great {
  background-image: url("../images/img/badge-02-color.svg");
}
.report-month__badgebox .month__badge.is--profile .profile .badge.normal {
  background-image: url("../images/img/badge-03-color.svg");
}
.report-month__badgebox .month__badge.is--profile .profile .badge.poor {
  background-image: url("../images/img/badge-04-color.svg");
}
.report-month__badgebox .month__badge.is--profile .profile .badge.verypoor {
  background-image: url("../images/img/badge-05-color.svg");
}
.report-month__badgebox .month__badge.is--profile .profile .badge.none {
  background-image: url("../images/img/badge-06-color.svg");
}
.report-month__badgebox .month__badge.is--profile .profile .bg {
  position: absolute;
  width: 266px;
  height: 77px;
  top: 8px;
  left: 50%;
  background-image: url("../images/img/badge-profile-bg.svg");
  transform: translateX(-50%);
  z-index: 5;
}
.report-month__badgebox .month__right {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  flex-grow: 1;
  gap: 24px;
}
.report-month__badgebox .month__right > div {
  min-width: 261px;
}
.report-month__badgebox .month__right .month__status:first-child {
  width: 100%;
}
.report-month__badgebox .month__result {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  top: 0;
}
.report-month__badgebox .month__result .radal-chart {
  flex-grow: 1;
  position: initial;
  width: 100%;
  max-width: 244px;
  height: 272px;
  margin-top: -21px;
  margin-left: auto;
  margin-right: auto;
  top: 0;
}
.report-month__badgebox .month__result .radal-chart .legend {
  top: 30px;
  right: 21px;
}
.report-month__badgebox .month__result .desc {
  margin-top: 30px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 14px;
  line-height: 16px;
  text-align: center;
}
.report-month__badgebox .month__result.report-elementary {
  padding-bottom: 28px;
}
.report-month__badgebox .month__result.report-elementary .box--edit-title {
  position: relative;
  padding-right: 140px;
  z-index: 10;
}
.report-month__badgebox .month__result.report-elementary .elementary-bar {
  margin-top: -29px;
}
.report-month__badgebox
  .month__result.report-elementary
  .elementary-bar
  .legend {
  flex-direction: row;
}
.report-month__badgebox
  .month__result.report-elementary
  .elementary-bar
  .legend
  .text {
  white-space: nowrap;
}
.report-month__badgebox.is--detail {
  padding: 0;
}
.report-month__badgebox.is--detail .month__profile {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
@media (max-width: 1199px) {
  .report-month__badgebox.is--detail .month__profile {
    padding-right: 24px;
    padding-left: 24px;
  }
}
.report-month__badgebox.is--detail .month__right {
  flex-direction: column;
  justify-content: space-between;
  height: 396px;
  padding: 24px;
}
.report-month__badgebox.is--detail .month__right .monthly--box-item {
  padding-right: 10px;
  padding-left: 10px;
}
.report-month__badgebox.is--detail .month__right .monthly--box-item .tag {
  letter-spacing: -0.5px;
}
.report-month__badgebox.subject-teacher {
  gap: 50px;
}
.report-month__badgebox.subject-teacher .month__badge,
.report-month__badgebox.subject-teacher .month__right {
  width: calc(50% - 25px);
}
.report-month__guide {
  padding: 30px 24px 24px;
  margin-top: 24px;
}
.report-month__guide .title {
  color: #000000;
  font-size: 24px;
  line-height: 27px;
  font-weight: 700;
}
.report-month__guide .month-guide {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 30px;
  width: calc((100% - 24px) / 2);
  padding: 27px 54px 30px 34px;
  border-radius: 20px;
}
.report-month__guide .month-guide--box {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 24px;
  margin-top: 24px;
}
.report-month__guide .month-guide--event {
  background-color: #f2f5ff;
}
.report-month__guide .month-guide--pres {
  background-color: #ffefef;
}
.report-month__guide .month-guide--pres .month-guide--left .icon {
  background-image: url("../images/img/report-pres-ai-color.svg");
}
.report-month__guide .month-guide--left .icon {
  background-image: url("../images/img/report-guide-ai-color.svg");
}
.report-month__guide .month-guide--left .text {
  background: rgba(97, 133, 255, 0.1);
  border: 1px solid rgba(49, 45, 255, 0.2);
}
.report-month__guide .month-guide--right .title .ico-28 {
  vertical-align: middle;
}
.report-month__guide .month-guide--right .text {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 13px;
  margin-top: 16px;
  color: #000000;
  font-size: 16px;
  line-height: 24px;
}
.report-month__guide .month-guide--right .text p {
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.report-month__guide .month-guide--right .text p strong {
  display: inline-block;
  width: 117px;
  font-weight: 700;
}
.report-month__guide.box--empty {
  height: 750px;
  padding: 0;
  background-image: url("../images/img/report-month-guide.png");
  background-size: contain;
  background-repeat: no-repeat;
}
.report-month__guide.box--empty .box--empty-text {
  text-align: center;
  gap: 48px;
}
.report-month__guide.box--empty .box--empty-text p {
  font-size: 20px;
  line-height: 35px;
}
.report-month__guide.box--empty .button-main {
  padding-right: 67px;
  padding-left: 67px;
}
.report-month__result {
  overflow: hidden;
  padding: 28px 20px 24px 30px;
  margin-top: 24px;
}
.report-month__result .title {
  margin-right: 10px;
  color: #000000;
  font-size: 24px;
  line-height: 27px;
  font-weight: 700;
}
.report-month__result .desc {
  margin-top: 31px;
  color: #000000;
  font-size: 20px;
  line-height: 23px;
  font-weight: 700;
  text-align: center;
  /* [이슈리스트 : 230901][2696] 내용이 없을 경우에도 기본 높이값 지정 */
  min-height: 36px;
}
.report-month__result .desc span {
  display: inline-block;
  height: 36px;
  padding: 0 16px;
  margin: 0 6px;
  border-width: 2px;
  border-style: solid;
  border-radius: 36px;
  font-size: 24px;
  line-height: 27px;
  font-weight: 800;
  line-height: 32px;
}
.report-month__result .line-chart {
  padding-top: 119px;
  margin-top: -88px;
  margin-bottom: -31px;
}
.report-month__result .line-chart .legend {
  right: 10px;
}
.report-month__result .line-chart .last-data {
  margin-top: 76px;
}
.report-month__result .line-chart.month {
  margin-bottom: -35px;
}
.report-month__result .box--empty {
  min-height: 0;
  gap: 20px;
  margin-top: 27px;
  padding-right: 10px;
  padding-bottom: 16px;
}
.report-month__result .box--empty-icon {
  width: 70px;
  height: 70px;
}
.report-month__result .box--empty-text {
  gap: 82px;
  font-size: 20px;
  line-height: 29px;
}
.report-month__result .box--empty-text .button-main {
  padding-right: 67px;
  padding-left: 67px;
}
.report-month__result + .report-month__subjects {
  margin-top: 24px;
}
.report-month__subjects .tab--contents {
  padding: 0;
}
.report-month__subjects .tab--contents .box--empty .button-main {
  padding-right: 67px;
  padding-left: 67px;
}
.report-month__subjects .month-subject__total {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 24px;
  padding: 30px 24px 40px;
}
.report-month__subjects .month-subject__total .intro-today__ai {
  flex-shrink: 0;
  flex-grow: 0;
  width: 624px;
  height: 348px;
  padding-top: 30px;
  padding-bottom: 32px;
  margin-top: 0;
}
@media (max-width: 1199px) {
  .report-month__subjects .month-subject__total .intro-today__ai {
    width: 474px;
  }
}
.report-month__subjects
  .month-subject__total
  .intro-today__ai
  .today-ai--image__motion {
  height: 251px;
  margin-top: -41px;
  margin-bottom: -4px;
}
.report-month__subjects .month-subject__total .intro-today__ai .today-ai--text {
  margin-top: 0;
}
.report-month__subjects
  .month-subject__total
  .intro-today__ai
  .today-ai--text__text {
  margin-top: 0;
  line-height: 29px;
}
.report-month__subjects
  .month-subject__total
  .intro-today__ai
  .today-ai--text__text,
.report-month__subjects
  .month-subject__total
  .intro-today__ai
  .today-ai--text__text
  strong {
  font-size: 20px;
}
.report-month__subjects
  .month-subject__total
  .intro-today__ai
  .today-ai--text__text
  strong {
  color: #7e44fb;
}
.report-month__subjects .month-subject__total .month__status {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 432px;
}
.report-month__subjects .month-subject__total .month__status .status_rows {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 27px;
}
.report-month__subjects .month-subject__detail {
  padding: 30px 24px;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.report-month__subjects .month-subject__detail:first-child {
  border-top: none;
}
.report-month__subjects .month-subject__detail.box-bg__lightgray {
  background-color: #f8f8f8;
}
.report-month__subjects .month-subject__detail .tab--button {
  color: rgba(21, 21, 21, 0.5);
  font-size: 18px;
  font-weight: 700;
}
.report-month__subjects .month-subject__detail .tab--button span {
  margin-left: 4px;
  font-size: 16px;
}
.report-month__subjects .month-subject__detail .tab--button.active {
  color: #7e44fb;
  font-size: 20px;
  font-weight: 800;
}
.report-month__subjects .month-subject__detail .tab--button.active span {
  color: #000000;
  font-size: 20px;
}
.report-month__subjects .month-subject__detail .tab-text {
  border-bottom: none;
}
.report-month__subjects .month-subject__detail .tab--contents {
  padding: 24px;
  background-color: #f8f8f8;
  border-radius: 20px;
}
.report-month__subjects .month-subject__detail .report-month__result {
  padding: 28px 18px 24px 30px;
  margin-top: 0;
}
.report-month__subjects
  .month-subject__detail
  .report-month__result
  .line-chart {
  padding-top: 50px;
  margin-top: 0;
}
.report-month__subjects
  .month-subject__detail
  .report-month__result
  .last-data {
  margin-top: 10px;
}
.report-month__subjects .month-subject__detail .box--edit-title {
  min-height: 0;
  margin-top: 40px;
  margin-bottom: 24px;
}
.report-month__subjects .month-subject__detail .box-bg__white {
  border-radius: 16px;
}
.report-month__subjects .month-subject__detail .subject-detail__result {
  overflow: hidden;
  padding-bottom: 28px;
}
@media (max-width: 1199px) {
  .report-month__subjects .month-subject__detail .subject-detail__result {
    gap: 24px;
  }
}
.report-month__subjects
  .month-subject__detail
  .subject-detail__result
  .detail-result__chart {
  flex-shrink: 1;
  flex-grow: 1;
  width: calc((100% - 44px) / 2);
}
.report-month__subjects
  .month-subject__detail
  .subject-detail__result
  .detail-result__chart
  .double-bar-chart {
  padding-top: 77px;
  margin-top: -18px;
  margin-left: 12px;
  margin-bottom: -42px;
}
.report-month__subjects
  .month-subject__detail
  .subject-detail__result
  .detail-result__chart
  .double-bar-chart
  .canvas {
  height: 286px;
}
.report-month__subjects
  .month-subject__detail
  .subject-detail__result
  .detail-result__chart
  .double-bar-chart.month {
  margin-bottom: -33px;
}
.report-month__subjects .month-subject__detail .subject-detail__times {
  gap: 24px;
  padding: 0;
}
.report-month__subjects
  .month-subject__detail
  .subject-detail__times
  .detail-times--chart {
  overflow: hidden;
  height: 296px;
  padding-bottom: 24px;
}
.report-month__subjects
  .month-subject__detail
  .subject-detail__times
  .detail-times--chart
  .double-bar-chart {
  padding-top: 50px;
  padding-bottom: 6px;
  margin-top: -13px;
}
.report-month__subjects
  .month-subject__detail
  .subject-detail__times
  .detail-times--chart
  .double-bar-chart.month {
  padding-bottom: 14px;
}
.report-month__subjects .month-subject__detail .subject-detail__ratio {
  overflow: hidden;
  padding: 30px 30px 24px;
}
.report-month__subjects
  .month-subject__detail
  .subject-detail__ratio
  .triple-bar-chart {
  /* padding-top: 35px; 240923 삭제 */
  margin-bottom: -31px;
}
.report-month__subjects
  .month-subject__detail
  .subject-detail__ratio
  .triple-bar-chart.month {
  margin-bottom: -35px;
}
.report-month__subjects .box--empty {
  min-height: 0;
  height: 353px;
  padding: 0;
}
.report-month__subjects .box--empty .box--empty-text {
  text-align: center;
  gap: 48px;
}
.report-month__subjects .box--empty .box--empty-text p {
  font-size: 20px;
  line-height: 35px;
}
.report-month__subjects.is--subject {
  padding: 24px;
}
.report-month__subjects.is--subject .month-subject__detail {
  padding: 24px;
  border-top: none;
}
.report-month__subjects.is--subject
  .month-subject__detail
  .box--edit-title:first-child {
  margin-top: 0;
}
.report-total > *:first-child {
  margin-top: 89px;
}
.report-total
  .report-month__badgebox.is--detail
  .month__badge.is--profile
  .profile {
  width: 210px;
  height: 210px;
}
.report-total
  .report-month__badgebox.is--detail
  .month__badge.is--profile
  .profile
  .image {
  width: 210px;
  height: 210px;
}
.report-total
  .report-month__badgebox.is--detail
  .month__badge.is--profile
  .profile
  .bg {
  top: -23px;
  background-image: url("../images/img/badge-profile-bg2.svg");
}
.report-total
  .report-month__badgebox.is--detail
  .month__badge.is--profile
  .profile
  .badge {
  right: -23px;
  bottom: -29px;
}
.report-total .box--empty .button-main {
  padding-right: 67px;
  padding-left: 67px;
}
.report-total .tab-tags--wrapper + .report-total__information {
  margin-top: 24px;
}
.report-total__information {
  gap: 24px;
}
.report-total__information.box--empty {
  background-color: transparent;
}
.report-total__information + .report-total__information {
  margin-top: 24px;
}
.report-total__information .total-monthly {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  position: relative;
}
.report-total__information .total-monthly--subtitle {
  position: relative;
  padding-right: 24px;
  padding-left: 24px;
  margin-top: 51px;
  color: #000000;
  font-size: 20px;
  line-height: 23px;
  z-index: 10;
}
.report-total__information .total-monthly--subtitle span {
  display: inline-block;
  height: auto;
  padding: 0 17px;
  margin: 3px 10px;
  font-size: 28px;
  font-weight: 800;
  line-height: 38px;
}
.report-total__information .total-monthly--subtitle br {
  display: none;
}
@media (max-width: 1199px) {
  .report-total__information .total-monthly--subtitle br {
    display: block;
  }
}
.report-total__information .total-monthly--subtitle .state-box.line {
  border-width: 2px;
}
@media (max-width: 1199px) {
  .report-total__information .total-monthly--subtitle {
    margin-top: 51px;
  }
}
.report-total__information .total-monthly .tension--button-next,
.report-total__information .total-monthly .tension--button-prev {
  position: absolute;
  width: 28px;
  height: 28px;
  bottom: 28px; /* 240912 수정 */
  right: 187px;
  margin-right: -58px;
  background-color: #ffffff;
  background-image: url("../images/ico/arrow-next-black.svg");
  z-index: 15; /* 240912 수정 */
}
@media (max-width: 1199px) {
  .report-total__information .total-monthly .tension--button-next,
  .report-total__information .total-monthly .tension--button-prev {
    right: 137px;
  }
}
.report-total__information .total-monthly .tension--button-prev {
  transform: rotate(180deg);
  left: 12px;
  margin-right: 0;
}
.report-total__information .total-monthly .tension-line-chart {
  position: relative; /* 240829 변경 */
  overflow: visible;
  height: 302px;
  padding-top: 0;
  padding-right: 167px;
  margin-top: 46px;
  margin-bottom: 4px;
  border-radius: 0 0 20px 20px;
  z-index: 5;
}
@media (max-width: 1199px) {
  .report-total__information .total-monthly .tension-line-chart {
    padding-right: 137px;
  }
}
.report-total__information .total-monthly .tension-line-chart .grid-bottom {
  bottom: 72px;
}
.report-total__information .total-monthly .tension-line-chart .legend {
  top: 36px;
  right: 30px;
}
@media (max-width: 1199px) {
  .report-total__information .total-monthly .tension-line-chart .legend {
    flex-direction: column;
    justify-content: end;
    align-items: end;
    gap: 5px;
  }
}
.report-total__information .total-monthly .monthly__motion {
  position: absolute;
  width: 200px;
  height: 250px;
  right: -5px;
  bottom: 52px;
}
@media (max-width: 1199px) {
  .report-total__information .total-monthly .monthly__motion {
    width: 154px;
    height: 193px;
  }
}
.report-total__information .total-subjects {
  position: relative;
}
.report-total__information .total-subjects .total-subjects--text {
  padding: 0 24px;
  margin-bottom: 42px;
  color: #000000;
  font-size: 20px;
  line-height: 23px;
  font-weight: 700;
  text-align: center;
  word-break: keep-all;
}
.report-total__information .total-subjects .total-subjects--text strong {
  color: #bb50ff;
  font-size: 28px;
  line-height: 32px;
  font-weight: 800;
}
.report-total__information .total-subjects .total-subjects--text p {
  margin-top: 14px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 14px;
  line-height: 16px;
}
.report-total__information .total-subjects .radal-chart {
  position: initial;
  /* height: 360px !important; 240829 삭제 */
  max-width: 280px;
  margin: 35px auto;
  padding: 0 24px;
}
.report-total__information .total-subjects .radal-chart .legend {
  top: 36px;
  right: 36px;
}
@media (max-width: 1199px) {
  .report-total__information .total-subjects .radal-chart .legend {
    flex-direction: column;
    justify-content: end;
    align-items: end;
    gap: 5px;
  }
}
.report-total__top3 {
  padding: 30px 24px;
  margin-top: 24px;
}
.report-total__top3 .report-total--title {
  padding: 0;
}
.report-total__top3 .report-total--title .legend {
  margin-top: 7px;
}
.report-total__top3 .report-total--title + .people-list__list {
  margin-top: 18px;
}
.report-total__top3 .box-grid {
  gap: 24px;
  margin-top: 24px;
}
@media (max-width: 1199px) {
  .report-total__top3 .box-grid {
    gap: 12px;
  }
}
.report-total__top3 .people-list__list li {
  display: flex;
  flex-direction: row;
  justify-content: stretch;
  align-items: stretch;
  overflow: hidden;
}
@media (max-width: 1199px) {
  .report-total__top3 .people-list__list li {
    width: calc((100% - 24px) / 3);
  }
}
.report-total__top3 .people-list__list li > button {
  overflow: hidden;
  display: block;
  width: 100%;
  height: 100%;
}
.report-total__top3 .people-list__list li .top3-student {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 20px;
  position: relative;
  width: 100%;
  padding: 24px 30px;
  padding-right: 46px;
  background-color: #f8f9fd;
  border-bottom: 1px solid #d9d9d9;
  border-radius: 16px 16px 0 0;
}
.report-total__top3 .people-list__list li .top3-student::after {
  position: absolute;
  display: none;
  width: 28px;
  height: 28px;
  top: 50%;
  right: 16px;
  background-image: url("../images/ico/next-black.svg");
  transform: translateY(-50%);
  content: "";
}
.report-total__top3 .people-list__list li .top3-student .people-list__text {
  text-align: left;
}
.report-total__top3
  .people-list__list
  li
  .top3-student
  .people-list__text
  .name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.report-total__top3
  .people-list__list
  li
  .top3-student
  .people-list__text
  .name
  strong {
  padding-right: 2px;
  font-size: 20px;
  line-height: 23px;
  font-weight: 700;
}
.report-total__top3
  .people-list__list
  li
  .top3-student
  .people-list__text
  .class {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 7px;
  color: rgba(0, 0, 0, 0.6);
  font-size: 16px;
  line-height: 18px;
}
.report-total__top3 .people-list__list li .top3-graph .graph-text {
  margin: 28px 27px 30px;
  color: #000000;
  font-size: 20px;
  font-weight: 700;
  text-align: left;
  line-height: 23px;
}
.report-total__top3 .people-list__list li .top3-graph .graph-text strong {
  color: #7e44fb;
  font-weight: 800;
}
.report-total__top3 .people-list__list li .top3-graph .double-average-chart {
  margin-right: -19px;
  margin-bottom: 12px;
  margin-left: 8px;
}
@media (max-width: 1199px) {
  .report-total__top3 .people-list__list li .top3-graph .double-average-chart {
    margin-right: -27px;
    margin-left: 0;
  }
}
.report-total__top3
  .people-list__list
  li
  .top3-graph
  .double-average-chart:first-child {
  margin-top: 35px;
}
.report-total--title {
  display: flex;
  flex-direction: row;
  gap: 6px;
  position: relative;
  padding: 30px 30px 0;
  color: #000000;
  font-size: 24px;
  line-height: 27px;
  font-weight: 700;
  z-index: 10;
}
.report-total--title .tooltip--box-wrap {
  margin-top: -4px;
  margin-left: -11px;
}
.report-total--title .title-ico {
  margin-right: 6px;
}
.report-total--title .legend {
  font-weight: 400;
}
.report-total .report-month__detail {
  margin-top: 40px;
}
.report-total .report-month__detail .detail--button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 4px;
  width: 226px;
  height: 40px;
  margin-right: auto;
  margin-bottom: 16px;
  margin-left: auto;
  background-color: #f0f0f0;
  border: 1.5px solid rgba(166, 166, 166, 0.3);
  border-radius: 20px;
  color: #000000;
  font-size: 18px;
  line-height: 20px;
  font-weight: 700;
}
.report-total .report-month__detail .detail--button::after {
  display: block;
  width: 28px;
  height: 28px;
  background-image: url("../images/ico/up-black.svg");
  transform: rotate(180deg);
  content: "";
}
.report-total .report-month__detail .detail--button.open {
  margin-bottom: 0;
}
.report-total .report-month__detail .detail--button.open::after {
  transform: rotate(0deg);
}
.report-total .report-month__detail .detail--button.open + .detail--box {
  display: block;
}
.report-total .report-month__detail .detail--box {
  display: none;
}
.report-personal
  .report-total__top3
  .people-list__list
  li
  .top3-student::after {
  display: block;
}
.report-personal .report-total__top3.box--empty {
  padding: 0;
}
.report-personal .report-total__top3 + .report-personal__list {
  margin-top: 24px;
}
.report-personal__list {
  padding: 24px 24px 24px;
}
.report-personal__list.mystudent--contents .table--setting {
  margin-bottom: 34px;
}
.report-personal__list + .report-personal__list {
  margin-top: 24px;
}
.report-personal__list .personal--list .table--list thead tr th,
.report-personal__list .personal--list .table--list thead tr td {
  padding-right: 0;
  padding-left: 0;
}
.report-personal__list .personal--list .table--list thead tr th {
  font-weight: 400;
}
.report-personal__list .personal--list .table--list thead tr th br {
  display: none;
}
@media (max-width: 1199px) {
  .report-personal__list .personal--list .table--list thead tr th br {
    display: block;
  }
}
.report-personal__list .personal--list .table--list tbody tr th,
.report-personal__list .personal--list .table--list tbody tr td {
  padding-right: 0;
  padding-left: 0;
}
.report-personal__list .personal--list .table--list .name {
  color: #000000;
}
.report-personal__list .personal--list .pagenavi--box {
  margin-bottom: 30px;
}
.report-personal__list .personal--card .mystudent--card__box {
  display: flex;
  flex-direction: row;
  gap: 24px;
}
.report-personal__list .personal--card .student--card {
  background-color: #f8f9fd;
  border: none;
}
.report-personal__list .personal--card .student--card__top {
  padding: 31px 0 26px;
  margin: 0 24px;
  gap: 18px;
}
.report-personal__list
  .personal--card
  .student--card__top
  + .student--card__bottom {
  border-top: 1px solid #d9d9d9;
}
.report-personal__list
  .personal--card
  .student--card__top
  .card-top__left
  .user-name {
  margin-bottom: 13px;
}
@media (max-width: 1199px) {
  .report-personal__list .personal--card .student--card__top .card-top__left {
    width: 60px;
  }
  .report-personal__list
    .personal--card
    .student--card__top
    .card-top__left
    .user-profile {
    width: 60px;
    height: 60px;
  }
}
.report-personal__list .personal--card .student--card__top .card-top__right {
  flex-shrink: 1;
  flex-grow: 1;
}
.report-personal__list
  .personal--card
  .student--card__top
  .card-top__right
  a
  + .text-bullet,
.report-personal__list
  .personal--card
  .student--card__top
  .card-top__right
  button
  + .text-bullet {
  margin-top: 16px;
}
.report-personal__list
  .personal--card
  .student--card__top
  .card-top__right
  .text-bullet {
  display: flex;
  flex-direction: row;
  gap: 5px;
  padding-left: 9px;
  margin-top: 10px;
}
.report-personal__list
  .personal--card
  .student--card__top
  .card-top__right
  .text-bullet
  span {
  flex-shrink: 0;
  flex-grow: 0;
  width: 124px;
}
@media (max-width: 1199px) {
  .report-personal__list
    .personal--card
    .student--card__top
    .card-top__right
    .text-bullet
    span {
    width: 61px;
  }
}
.report-personal__list
  .personal--card
  .student--card__top
  .card-top__right
  .text-bullet
  strong {
  flex-shrink: 1;
  flex-grow: 1;
  text-align: right;
}
.report-personal__list .personal--card .student--card__bottom {
  padding: 24px 0 28px;
  margin: 0 24px -6px;
}
.report-personal__list .personal--card .student--card__bottom .radal-person {
  width: 100%;
  height: 263px;
  margin-top: -16px;
}
.report-personal__list
  .personal--card
  .student--card__bottom
  .radal-person
  .legend {
  display: flex;
  flex-direction: row-reverse;
}
@media (max-width: 1199px) {
  .report-personal__list
    .personal--card
    .student--card__bottom
    .radal-person
    .legend {
    flex-direction: column;
    align-items: end;
    gap: 6px;
  }
}
.report-personal__list .box--empty {
  min-height: 0;
  height: 189px;
  margin-bottom: 46px;
}
.report-personal .intro-mystat {
  padding: 30px 24px;
}
.report-personal .intro-mystat + .month-subject__detail {
  padding-top: 0;
  margin-top: -11px;
  border-top: none;
}
.report-personal .intro-mystat .monthly--box-item {
  height: 226px;
}
.report-personal .intro-mystat .monthly--box-item .tag {
  padding-right: 8px;
  padding-left: 8px;
  font-size: 14px;
}
.report-personal .intro-mystat .monthly--box-item .icon {
  margin-top: 23px;
}
.report-personal .intro-mystat .monthly--box-item .number {
  margin-top: 20px;
}
.report-personal .intro-mystat .monthly--box-item .desc {
  margin-top: 5px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 14px;
  line-height: 16px;
}
.report-personal .report-month__badgebox {
  overflow: visible;
  align-self: center;
}
.report-personal .report-month__badgebox .month__badge {
  overflow: visible;
  width: 266px;
  margin-top: 20px;
}
@media (max-width: 1199px) {
  .report-personal .report-month__badgebox .month__badge {
    margin-right: -12px;
    margin-left: -12px;
  }
}
.report-personal .report-month__badgebox .month__badge.is--profile .name {
  text-align: center;
}
.report-personal
  .report-month__badgebox
  .month__badge.is--profile
  .name
  strong {
  padding-right: 6px;
  font-size: 24px;
}
.report-personal .report-month__badgebox .month__badge.is--profile .name span {
  display: block;
  margin-top: 10px;
  color: rgba(0, 0, 0, 0.6);
  font-size: 16px;
  line-height: 20px;
}
.report-personal .report-month__result {
  overflow: hidden;
  padding-bottom: 24px;
}
.report-personal .report-month__result .line-chart {
  padding-top: 129px;
  height: 423px;
  margin-bottom: -31px;
}
.report-personal .report-month__result .line-chart.month {
  margin-bottom: -35px;
}

.month__status {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 30px;
}
.month__status .status_rows {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 27px;
}
.month__status .status-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.month__status .status-row.blue .status--title::before {
  border-color: #7199ff;
}
.month__status .status-row.green .status--title::before {
  border-color: #4fcf82;
}
.month__status .status-row.violet .status--title::before {
  border-color: #a889ff;
}
.month__status .status-row.orange .status--title::before {
  border-color: #ff9960;
}
.month__status .status--title {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 18px;
  font-size: 18px;
}
@media (max-width: 1199px) {
  .month__status .status--title {
    gap: 10px;
  }
}
.month__status .status--title > p > span {
  white-space: nowrap;
}
.month__status .status--title::before {
  flex-shrink: 0;
  flex-grow: 0;
  display: block;
  width: 14px;
  height: 14px;
  margin-top: -4px;
  background-color: #ffffff;
  border-radius: 14px;
  border-width: 4px;
  border-style: solid;
  content: "";
}
.month__status .status--number {
  flex-shrink: 0;
  flex-grow: 0;
  color: rgba(0, 0, 0, 0.5);
  font-size: 16px;
  line-height: 18px;
}
.month__status .status--number strong {
  color: #000000;
  font-size: 20px;
  line-height: 23px;
  font-weight: 700;
}

.detail-times--table table {
  height: 100%;
}
.detail-times--table table th,
.detail-times--table table td {
  vertical-align: middle;
  padding: 14px;
  text-align: center;
}
.detail-times--table table thead th {
  height: 59px;
  color: #203ea7;
  font-size: 16px;
  line-height: 18px;
  font-weight: 700;
}
.detail-times--table table tbody th,
.detail-times--table table tbody td {
  border-top: 1px solid rgba(196, 196, 196, 0.7);
  font-weight: 400;
}
.detail-times--table table tbody th:not(:first-child),
.detail-times--table table tbody td:not(:first-child) {
  border-left: 1px solid rgba(196, 196, 196, 0.7);
}
.detail-times--table table tbody td {
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.detail-times--table table tbody td:nth-child(3) {
  color: #072fff;
}
.detail-times--table table tbody td:nth-child(4) {
  color: #6f16ff;
}
.detail-times--chart {
  padding: 20px 30px 0 20px;
}
.detail-times--chart .title {
  margin-left: 8px;
}
.detail-times--chart .double-bar-chart {
  padding-top: 65px;
  margin-top: -17px;
}

.myclass__index .index__mylesson-complete .box--empty,
.myclass__index .index__myclass-info .box--empty {
  position: relative;
  min-height: 0;
  gap: 0;
  padding: 0;
}
.myclass__index .index__mylesson-complete .box--empty button,
.myclass__index .index__myclass-info .box--empty button {
  padding-right: 67px;
  padding-left: 67px;
}
.myclass__index .index__mylesson-complete .box--empty .empty--inner,
.myclass__index .index__myclass-info .box--empty .empty--inner {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  padding: 0;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
  z-index: 10;
}
.myclass__index .index__mylesson-complete .box--empty .empty--inner .f-20,
.myclass__index .index__myclass-info .box--empty .empty--inner .f-20 {
  line-height: 31px;
}
.myclass__index .index__mylesson-complete .box--empty .empty--bg,
.myclass__index .index__myclass-info .box--empty .empty--bg {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 5;
}
.myclass__index .index__mylesson-complete .box--empty .empty--bg img,
.myclass__index .index__myclass-info .box--empty .empty--bg img {
  display: block;
  max-width: 100%;
}

.myclass .input-group-box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.myclass .input-group-box .button-main {
  flex-shrink: 0;
}
.myclass .input-group-box .dropdown--area {
  flex-shrink: 0;
}
.myclass .input-group-box .dropdown--area + .input-box {
  margin-left: 12px;
}
.myclass .input-group-box .dropdown--area + .input-box + .button-main {
  margin-left: 12px;
}
.myclass .input-group-box.search-bar .dropdown--area {
  width: 168px;
}
.myclass .input-group-box.search-bar .button-main {
  width: 98px;
}
.myclass .tab--button {
  width: 100%;
  white-space: nowrap;
}
.myclass__parents--top {
  padding-top: 87px;
}
.myclass__parents--top .intro-noti {
  margin-bottom: 38px;
}
.myclass__parents--top .info-box__detail {
  display: flex;
  flex-direction: row;
  align-items: stretch;
}
.myclass__parents--top .info-box__detail .student-profile {
  padding-top: 24px;
  padding-bottom: 24px;
  background-color: #ffffff;
  border-radius: 20px 0 0 20px;
}
.myclass__parents--top .info-box__detail .student-profile .profile-image,
.myclass__parents--top
  .info-box__detail
  .student-profile
  .profile-image
  .image {
  width: 79px;
  height: 79px;
}
.myclass__parents--top .info-box__detail .student-profile .profile-name {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 18px;
}
.myclass__parents--top .info-box__detail .student-profile .profile-name strong {
  font-size: 24px;
  line-height: 27px;
}
.myclass__parents--top .info-box__detail .student-profile .profile-desc,
.myclass__parents--top .info-box__detail .student-profile .profile-desc span {
  gap: 8px;
  font-weight: 400;
}
.myclass__parents--top .info-box__detail .student-attendance {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  padding: 28px 34px;
}
@media (max-width: 1199px) {
  .myclass__parents--top .info-box__detail .student-attendance {
    padding: 28px 26px;
  }
}
.myclass__parents--top .info-box__detail .student-attendance::after {
  position: absolute;
  width: 1px;
  top: 30px;
  bottom: 30px;
  left: 0;
  background-color: #d9d9d9;
  content: "";
}
.myclass__parents--top .info-box__detail .student-attendance--bar .title {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  padding-left: 14px;
  margin-bottom: 15px;
  gap: 9px;
}
@media (max-width: 1199px) {
  .myclass__parents--top .info-box__detail .student-attendance--bar .title {
    margin-bottom: 10px;
  }
}
.myclass__parents--top .info-box__detail .student-attendance--bar .title span {
  color: #000000;
  font-size: 18px;
  line-height: 20px;
}
.myclass__parents--top
  .info-box__detail
  .student-attendance--bar
  .title
  strong {
  font-size: 20px;
  font-weight: 700;
  line-height: 22px;
}
.myclass__parents--top
  .info-box__detail
  .student-attendance--bar
  .title.is--rate {
  margin-right: auto;
}
.myclass__parents--top
  .info-box__detail
  .student-attendance--bar
  .title.is--day
  span {
  font-size: 16px;
}
.myclass__parents--top
  .info-box__detail
  .student-attendance--bar
  .title.is--day
  strong {
  font-size: 16px;
  font-weight: 400;
}
.myclass__parents--top
  .info-box__detail
  .student-attendance--bar
  .title.is--day
  + .is--day {
  margin-left: 14px;
}
@media (max-width: 1199px) {
  .myclass__parents--top
    .info-box__detail
    .student-attendance--bar
    .title.is--day
    + .is--day {
    margin-left: 0;
  }
}
.myclass__parents--top
  .info-box__detail
  .student-attendance--bar
  .title::before {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 1px;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background-color: #7e44fb;
}
.myclass__parents--top
  .info-box__detail
  .student-attendance--bar
  .title:nth-child(2)::before {
  background-color: #7199ff;
}
.myclass__parents--top
  .info-box__detail
  .student-attendance--bar
  .title:nth-child(3)::before {
  background-color: #ff9960;
}
.myclass__parents--top .info-box__detail .student-attendance--bar .bar {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  overflow: hidden;
  height: 12px;
  background-color: #e5dafe;
  border-radius: 20px;
}
.myclass__parents--top .info-box__detail .student-attendance--bar .bar span {
  background-color: #7e44fb;
}
.myclass__parents--top .info-box__detail .student-attendance--legend {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
}
@media (max-width: 1199px) {
  .myclass__parents--top .info-box__detail .student-attendance--legend {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
  }
}
.myclass__parents--top .info-box__detail .student-attendance--tbl {
  margin: 0 -29px;
}
@media (max-width: 1199px) {
  .myclass__parents--top .info-box__detail .student-attendance--tbl {
    margin: 0 -10px;
  }
}
.myclass__parents--top .info-box__detail .student-attendance--tbl table {
  margin-top: 28px;
}
@media (max-width: 1199px) {
  .myclass__parents--top .info-box__detail .student-attendance--tbl table {
    margin-top: 20px;
  }
}
.myclass__parents--top .info-box__detail .student-attendance--tbl table tr th,
.myclass__parents--top .info-box__detail .student-attendance--tbl table tr td {
  text-align: center;
}
.myclass__parents--top .info-box__detail .student-attendance--tbl table tr th {
  color: rgba(0, 0, 0, 0.5);
  font-size: 14px;
  line-height: 16px;
}
.myclass__parents--top .info-box__detail .student-attendance--tbl table tr td {
  padding-top: 16px;
  color: #000000;
  font-size: 16px;
  font-weight: 700;
  line-height: 18px;
}
.myclass__parents--top
  .info-box__detail
  .student-attendance--tbl
  table
  tr
  td.is--pass {
  color: #00ba13;
}
.myclass__parents--top
  .info-box__detail
  .student-attendance--tbl
  table
  tr
  td.is--none {
  color: rgba(0, 0, 0, 0.8);
}
.myclass__parents--top
  .info-box__detail
  .student-attendance--tbl
  table
  tr
  td.is--pass {
  color: #ff3a3a;
}
.myclass__index > div:first-child .myclass-index--title {
  margin-top: 84px;
}
.myclass__index .myclass-index--title {
  margin-top: 80px;
  margin-bottom: 22px;
}
.myclass__index .myclass-index--title,
.myclass__index .myclass-index--title a {
  display: block;
  color: #000000;
  font-size: 28px;
  line-height: 32px;
  font-weight: 700;
}
.myclass__index .myclass-index--title .tooltip--box-wrap {
  margin-left: -4px;
}
.myclass__index .index__myclass-info .myclass-info--my {
  position: relative;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box {
  position: relative;
  display: block;
  padding: 24px;
  height: 191px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box::before,
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box::after {
  position: absolute;
  content: "";
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box::before {
  display: block;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box::after {
  display: none;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box
  .title {
  display: flex;
  flex-direction: row;
  gap: 7px;
  color: #000000;
  font-size: 18px;
  line-height: 22px;
  font-weight: 700;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box
  .title::after {
  display: none;
  width: 22px;
  height: 22px;
  background-image: url("../images/ico/next-black.svg");
  content: "";
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box
  .number {
  margin-top: 10px;
  color: #000000;
  font-size: 22px;
  line-height: 61px;
  font-weight: 700;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box
  .number
  strong {
  margin-right: 6px;
  font-size: 54px;
  font-weight: 800;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box:hover,
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box:focus {
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box:hover::after,
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box:focus::after {
  display: block;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box:hover
  .title::after,
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box:focus
  .title::after {
  display: block;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box.blue::before {
  width: 94px;
  height: 69px;
  bottom: 24px;
  right: 24px;
  background-image: url("../images/img/myclass-bg-blue.svg");
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box.blue::after {
  width: 29.2px;
  height: 42.1px;
  top: 51px;
  right: 43.8px;
  background-image: url("../images/img/myclass-particle-blue.svg");
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box.blue:hover:not(.disabled) {
  background-color: #b2e3ff;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box.violet::before {
  width: 91.73px;
  height: 72.69px;
  top: 88px;
  right: 24.54px;
  background-image: url("../images/img/myclass-bg-violet.svg");
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box.violet::after {
  width: 38.12px;
  height: 29.21px;
  top: 71px;
  right: 64.88px;
  background-image: url("../images/img/myclass-particle-violet.svg");
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box.violet:hover:not(.disabled) {
  background-color: #cfb9ff;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box.green::before {
  width: 84.7px;
  height: 74.92px;
  top: 96px;
  right: 24.3px;
  background-image: url("../images/img/myclass-bg-green.svg");
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box.green::after {
  width: 27.12px;
  height: 37.3px;
  top: 77px;
  right: 20.88px;
  background-image: url("../images/img/myclass-particle-green.svg");
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box.green:hover:not(.disabled) {
  background-color: #92f1c9;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box.disabled {
  opacity: 0.4;
  box-shadow: none;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box.disabled::after,
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class
  .myclass-info--box.disabled
  .title::after {
  display: none;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class:not(.swiper-container-initialized) {
  width: calc(100% + 48px);
  padding: 0 24px;
  margin-left: -24px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class:not(.swiper-container-initialized)
  .swiper-wrapper {
  display: flex;
  flex-direction: row;
  gap: 24px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myclass-info--class:not(.swiper-container-initialized)
  .swiper-wrapper
  .swiper-slide {
  width: calc((100% - 48px) / 3);
}
.myclass__index .index__myclass-info .myclass-info--my .swiper-pagination {
  position: absolute;
  top: 0;
  right: 0;
  margin-top: 20px;
}
.myclass__index .index__myclass-info .myclass-info--my .myinfo__summary {
  gap: 24px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__left {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__left--item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 150px;
  padding: 28px 30px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__left--item
  .title {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 20px;
  line-height: 23px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__left--item
  .title::before {
  display: block;
  width: 8px;
  height: 8px;
  border-width: 3px;
  border-style: solid;
  border-radius: 8px;
  content: "";
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__left--item
  .text {
  color: #000000;
  font-size: 30px;
  font-weight: 800;
  text-align: right;
  line-height: 34px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__left--item
  .link {
  color: #000000;
  font-size: 18px;
  font-weight: 800;
  text-align: right;
  line-height: 20px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__left--item
  .link
  span {
  vertical-align: bottom;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__left--item:nth-child(1)
  .title::before {
  border-color: #ab09d3;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__left--item:nth-child(2)
  .title::before {
  border-color: #09d3a3;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__left--item:nth-child(3)
  .title::before {
  border-color: #67adff;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__left--item:not(:first-child) {
  position: relative;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__left--item:not(:first-child)::before {
  position: absolute;
  width: 1px;
  height: 82px;
  top: 50%;
  left: 0;
  margin-top: -41px;
  background-color: rgba(0, 0, 0, 0.2);
  content: "";
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__right {
  position: relative;
  height: 150px;
  background-color: #c5d8fc;
  border-radius: 20px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--my
  .myinfo__summary
  .summary__right--item {
  position: absolute;
  width: 314px;
  height: 212px;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  background-image: url("../images/img/myclass-index-color.svg");
}
.myclass__index .index__myclass-info .myclass-info--status {
  align-items: stretch;
  gap: 24px;
  margin-top: 24px;
}
.myclass__index .index__myclass-info .myclass-info--status > div {
  padding: 28px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--status
  .info-status--attendance {
  padding-bottom: 0;
}
.myclass__index
  .index__myclass-info
  .myclass-info--status
  .info-status--attendance
  .status-attendance--title {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.myclass__index
  .index__myclass-info
  .myclass-info--status
  .info-status--attendance
  .status-attendance--title
  .ico-40 {
  width: 28px;
  height: 28px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--status
  .info-status--attendance
  .stacked-bar-chart {
  margin-top: 3px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--status
  .info-status--attendance
  .stacked-bar-chart
  .legend-html
  .legend {
  flex-direction: row-reverse;
}
.myclass__index
  .index__myclass-info
  .myclass-info--status
  .info-status--amount
  .status-amount--title {
  padding-right: 75px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--status
  .info-status--amount
  .legend {
  top: 39px;
  right: 30px;
}
.myclass__index
  .index__myclass-info
  .myclass-info--status
  .info-status--amount
  .month__status {
  gap: 28px;
  width: 100%;
  min-width: 0;
  padding: 0;
  margin-top: 81px;
}
.myclass__index .index__mylesson-info {
  margin-bottom: 50px;
}
.myclass__index .index__mylesson-info .mylesson-info--box {
  align-items: stretch;
  min-height: 200px;
  gap: 24px;
}
.myclass__index .index__mylesson-info .mylesson-info--box .info-box__ing {
  position: relative;
  padding: 24px;
  background-color: #cfd4ff;
  /* [이슈리스트 : 0821][2424] 진행중수업 포인터 추가 */
  cursor: pointer;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__ing::after {
  position: absolute;
  width: 86px;
  height: 78px;
  bottom: 26px;
  right: 26px;
  background-image: url("../images/img/myclass-index-mylesson.svg");
  content: "";
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__ing
  .title {
  margin-top: 2px;
  color: #000000;
  font-size: 18px;
  line-height: 20px;
  font-weight: 700;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__ing
  .number {
  margin-top: 10px;
  color: #000000;
  font-size: 22px;
  line-height: 61px;
  font-weight: 700;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__ing
  .number
  strong {
  padding-right: 6px;
  font-weight: 800;
  font-size: 54px;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch;
  padding-top: 34px;
  padding-right: 30px;
  padding-bottom: 60px;
  padding-left: 36px;
}
@media (max-width: 1199px) {
  .myclass__index
    .index__mylesson-info
    .mylesson-info--box
    .info-box__detail
    .info-swiper--item
    .box-detail__left {
    width: 45%;
  }
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__left
  .title {
  color: #000000;
  font-size: 20px;
  line-height: 23px;
  font-weight: 800;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__left
  .date {
  margin-top: 8px;
  color: rgba(0, 0, 0, 0.6);
  font-size: 14px;
  line-height: 16px;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__left
  .members {
  display: flex;
  flex-direction: row;
  gap: 8px;
  margin-top: 29px;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__left
  .members
  p {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;
  padding: 5px 13px;
  border-radius: 500px;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
  white-space: nowrap;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__left
  .members
  p::before {
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 6px;
  content: "";
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__left
  .members
  p
  strong {
  margin-left: 2px;
  font-weight: 800;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__left
  .members
  p.member {
  background-color: rgba(0, 186, 19, 0.1);
  border: 1px solid rgba(0, 186, 19, 0.2);
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__left
  .members
  p.member::before {
  background-color: #00ba13;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__left
  .members
  p.ready {
  background-color: rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(0, 0, 0, 0.2);
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__left
  .members
  p.ready::before {
  background-color: #7d7d7d;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__right {
  display: flex;
  flex-direction: row;
  align-items: start;
  flex-wrap: wrap;
  padding-left: 44px;
  margin-left: 44px;
  border-left: 1px solid #d9d9d9;
}
@media (max-width: 1199px) {
  .myclass__index
    .index__mylesson-info
    .mylesson-info--box
    .info-box__detail
    .info-swiper--item
    .box-detail__right {
    width: 55%;
  }
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__right
  ul {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 24px;
  width: 100%;
}
@media (max-width: 1199px) {
  .myclass__index
    .index__mylesson-info
    .mylesson-info--box
    .info-box__detail
    .info-swiper--item
    .box-detail__right
    ul {
    flex-direction: column;
  }
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__right
  ul
  li {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: relative;
  gap: 12px;
  width: calc((100% - 48px) / 2);
  height: 18px;
  padding-left: 18px;
}
@media (max-width: 1199px) {
  .myclass__index
    .index__mylesson-info
    .mylesson-info--box
    .info-box__detail
    .info-swiper--item
    .box-detail__right
    ul
    li {
    width: auto;
  }
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__right
  ul
  li::before {
  position: absolute;
  display: block;
  width: 6px;
  height: 6px;
  top: 50%;
  left: 0;
  margin-top: -3px;
  border-radius: 1px;
  content: "";
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__right
  ul
  li
  .text {
  color: #000000;
  font-size: 16px;
  font-weight: 700;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__right
  ul
  li
  .number {
  min-width: 40px;
  color: #000000;
  font-size: 16px;
  text-align: right;
}
@media (max-width: 1199px) {
  .myclass__index
    .index__mylesson-info
    .mylesson-info--box
    .info-box__detail
    .info-swiper--item
    .box-detail__right
    ul
    li
    .number {
    justify-self: end;
  }
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__right
  ul
  li.blue::before {
  background-color: #7199ff;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__right
  ul
  li.violet::before {
  background-color: #a889ff;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__right
  ul
  li.orange::before {
  background-color: #ff9960;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .swiper-pagination {
  position: absolute;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  gap: 8px;
  /*  [디자인요청 : 230804] 인디케이터 크기 디자인 정리 */
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .swiper-pagination-bullet-active {
  width: 50px;
  margin-top: 0px;
}
.myclass__index .index__mylesson-week .myclass-index--title {
  margin-bottom: 10px;
}
.myclass__index .index__mylesson-week .intro-lesson--box {
  margin-top: 24px;
}
.myclass__index .index__mylesson-week .box--empty {
  gap: 8px;
  min-height: 249px;
  padding-bottom: 16px;
  margin-top: 24px;
}
.myclass__index .index__mylesson-week .box--empty .box--empty-text {
  gap: 40px;
}
.myclass__index .index__mylesson-activity:last-child {
  margin-bottom: 104px;
}
.myclass__index
  .index__mylesson-activity
  .myclass-index--title
  + .mylesson-activity--list {
  margin-top: 22px;
}
.myclass__index .index__mylesson-activity .mylesson-activity--list {
  padding: 28px 24px 40px;
}
.myclass__index
  .index__mylesson-activity
  .mylesson-activity--list
  .table--list {
  min-height: 484px;
}
.myclass__index
  .index__mylesson-activity
  .mylesson-activity--list
  .table--list
  th,
.myclass__index
  .index__mylesson-activity
  .mylesson-activity--list
  .table--list
  td {
  padding-right: 12px; /* 250530 수정 */
  padding-left: 12px; /* 250530 수정 */
}
@media (max-width: 1199px) {
  .myclass__index
    .index__mylesson-activity
    .mylesson-activity--list
    .table--list
    th,
  .myclass__index
    .index__mylesson-activity
    .mylesson-activity--list
    .table--list
    td {
    padding-right: 10px; /* 250715 수정 */
    padding-left: 10px; /* 250715 수정 */
  }
  .myclass__index
    .index__mylesson-activity
    .mylesson-activity--list
    .table--list
    td
    * {
    font-size: 16px; /* 250715 추가 */
  }
}
.myclass__index
  .index__mylesson-activity
  .mylesson-activity--list
  .table--list
  th:nth-child(7),
.myclass__index
  .index__mylesson-activity
  .mylesson-activity--list
  .table--list
  td:nth-child(7) {
  min-width: 70px;
  padding-right: 0;
  padding-left: 0;
}
.myclass__index
  .index__mylesson-activity
  .mylesson-activity--list
  .table--list
  th:first-child {
  padding-right: 0;
  padding-left: 14px;
}
.myclass__index
  .index__mylesson-activity
  .mylesson-activity--list
  .table--list
  th:last-child {
  padding-right: 14px;
  padding-left: 0;
}
.myclass__index
  .index__mylesson-activity
  .mylesson-activity--list
  .table--list
  td {
  word-break: keep-all;
}
@media (max-width: 1199px) {
  .myclass__index
    .index__mylesson-activity
    .mylesson-activity--list
    .table--list
    td:nth-child(6)
    p {
    width: 80px;
    word-break: break-all;
    margin: 0 auto; /* 250715 추가 */
  }
}
.myclass__index
  .index__mylesson-activity
  .mylesson-activity--list
  .table--list
  td:last-child {
  padding-right: 14px;
  padding-left: 0;
}
.myclass__index
  .index__mylesson-activity
  .mylesson-activity--list
  .pagenavi--box {
  margin-top: 48px;
}
.myclass__index .index__mylesson-activity .box--empty {
  min-height: 248px; /* 250530 수정 */
  /* padding-bottom: 30px; */
}
.myclass__index .index__mylesson-activity .box--empty .box--empty-text {
  gap: 48px;
}
.myclass__index .index__mylesson-activity .box--empty .box--empty-text .f-20 {
  text-align: center;
  line-height: 35px;
}
.myclass__index .index__mylesson-complete {
  overflow: hidden;
}
.myclass__index .index__mylesson-complete .mylesson-complete--summary > div {
  height: 88px;
  padding: 18px;
  padding-left: 84px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--summary
  > div::before {
  top: 18px;
  right: 18px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--summary
  .detail-analysis__total::before {
  background-image: url("../images/ico/lesson-box-blue.svg");
}
.myclass__index .index__mylesson-complete .mylesson-complete--graphs {
  gap: 24px;
  margin-top: 24px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week {
  padding: 28px 28px 22px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .status-attendance--title {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: calc(100% + 7px);
  margin-right: -7px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .status-attendance--title
  .button {
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body {
  width: 136px;
  height: 136px;
  margin: 0;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body--circle {
  width: 130px;
  height: 130px;
  border-width: 6px;
  border-color: rgba(126, 68, 251, 0.2);
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body
  .clock-active {
  width: 136px;
  height: 136px;
  top: -8px;
  left: -8px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body
  .clock-active--inner {
  width: 100%;
  height: 100%;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body
  .clock-active--inner
  #clockActiveProgress {
  stroke-width: 10px;
  stroke-dasharray: 408.40696px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body
  .clock-timepad {
  flex-direction: column;
  gap: 8px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body
  .title {
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body
  .text {
  color: #000000;
  font-size: 22px;
  line-height: 32px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body
  .text
  strong {
  font-weight: 800;
  font-size: 28px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 36px;
  margin-top: 27px;
}
@media (max-width: 1199px) {
  .myclass__index
    .index__mylesson-complete
    .mylesson-complete--graphs
    .complete-graphs--week
    .graphs-week--chart {
    gap: 20px;
    margin-top: 17px;
  }
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend
  p {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}
@media (max-width: 1199px) {
  .myclass__index
    .index__mylesson-complete
    .mylesson-complete--graphs
    .complete-graphs--week
    .graphs-week--chart
    .legend
    p {
    flex-direction: column;
    white-space: nowrap;
  }
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend
  p
  span {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  color: #000000;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend
  p
  .title {
  font-size: 16px;
  line-height: 18px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend
  p
  .title::before {
  flex: 0 0 6px;
  display: block;
  width: 6px;
  height: 6px;
  margin-right: 2px;
  border-radius: 1px;
  content: "";
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend
  p
  .text {
  font-size: 18px;
  line-height: 20px;
  font-weight: 700;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend
  p:first-child
  .title:before {
  background-color: #7199ff;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend
  p:last-child
  .title:before {
  background-color: #ff9960;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list
  .graphs-list--day {
  text-align: center;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list
  .graphs-list--day
  .date {
  color: rgba(0, 0, 0, 0.5);
  font-size: 14px;
  line-height: 16px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list
  .graphs-list--day
  .text {
  margin-top: 16px;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
  font-weight: 700;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list
  .graphs-list--day
  .text.late-end {
  color: rgba(0, 0, 0, 0.8);
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list
  .graphs-list--day
  .text.yes-end {
  color: #00ba13;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list
  .graphs-list--day
  .text.no-end {
  color: #fa4225;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--stack {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 30px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--stack
  .monthly--box-item {
  height: 226px;
  padding-top: 20px;
  padding-bottom: 0;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--stack
  .monthly--box-item
  .tag {
  margin-top: 0;
  padding-right: 13px;
  padding-left: 13px;
  letter-spacing: -0.5px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--stack
  .monthly--box-item
  .number {
  margin-top: 21px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--stack
  .monthly--box-item
  .desc {
  margin-top: 6px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 14px;
  line-height: 16px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--stack
  .monthly--box-item:nth-child(1)
  .tag,
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--stack
  .monthly--box-item:nth-child(2)
  .tag {
  padding-right: 20px;
  padding-left: 20px;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs:first-child {
  margin-top: 87px;
}
.myclass__index .index__mylesson-complete .box--empty .button-main {
  margin-top: 40px;
}
.myclass__index
  .index__mylesson-complete
  + .index__mylesson-week
  .myclass-index--title:first-child {
  margin-top: 87px;
}
.myclass__index.is--student .myclass-index--title {
  margin-bottom: 0;
}
.myclass__index.is--student
  .myclass-index--title
  + .mylesson-complete--summary
  > div {
  margin-top: 21px;
  background-color: #ffffff;
}
.myclass__index.is--student .myclass-index--title + .tab-week {
  margin-top: 11px;
}
.myclass__notice-write .box--edit-items .dropdown--area:not([class*="width"]) {
  width: 205px;
}
.myclass__notice-write
  .box--edit-items
  .dropdown--area:not([class*="width"])
  .dropdown--box
  .input-check {
  width: 100%;
  padding: 6px 10px;
  border-radius: 4px;
}
.myclass__notice-write
  .box--edit-items
  .dropdown--area:not([class*="width"])
  .dropdown--box
  .input-check:hover {
  background-color: rgba(126, 68, 251, 0.1);
}
.myclass__notice-write
  .box--edit-items
  .dropdown--area:not([class*="width"])
  .dropdown--box
  .input-check
  .input--text {
  font-size: 14px;
  line-height: 16px;
}
.myclass__notice-write + .page__button {
  margin-top: 56px;
  margin-bottom: 73px;
}
.myclass__notice-write + .page__button a,
.myclass__notice-write + .page__button button {
  width: 164px;
  min-width: 164px;
}
.myclass__notice-write .input-box--text .f-14 {
  font-size: 16px;
}
.myclass__notice-write
  .tooltip--box-wrap
  .tooltip--button.button-icon:hover:not(.dim):not(:disabled) {
  background-color: #d9d9d9;
}
.myclass__notice-detail .box--edit-title {
  min-height: auto;
}
.myclass__notice-detail .box--detail-indicator {
  margin-right: 10px;
  margin-left: 10px;
}
.myclass__notice-detail .box--detail-indicator .detail-indicator--prev,
.myclass__notice-detail .box--detail-indicator .detail-indicator--next {
  width: calc(50% - 235px); /* 241008 수정 */
}
@media (max-width: 1199px) {
  .myclass__notice-detail .box--detail-indicator .detail-indicator--prev .arrow,
  .myclass__notice-detail
    .box--detail-indicator
    .detail-indicator--next
    .arrow {
    flex-shrink: 0;
  }
  .myclass__notice-detail .box--detail-indicator .detail-indicator--prev .title,
  .myclass__notice-detail
    .box--detail-indicator
    .detail-indicator--next
    .title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
.myclass__notice-detail + .page__button {
  margin-bottom: 82px;
}
.myclass__classes {
  margin-top: 84px;
  margin-bottom: 133px;
}
.myclass__classes .tab--contents {
  padding: 36px 24px 40px;
}
.myclass__classes .classes--wrapper {
  background-color: #ffffff;
  border-radius: 0 0 20px 20px;
}
.myclass__classes .classes--wrapper .box--search {
  padding: 36px 24px 0;
}
.myclass__classes .classes--wrapper .box--search + .tab--contents {
  padding-top: 0;
}
.myclass__classes .classes--wrapper .tab-menu--box a {
  text-align: center;
}
.myclass__classes .box--empty {
  height: 634px;
  padding-top: 40px;
}
.myclass__classes .classes--filter {
  display: flex;
  flex-direction: row;
  gap: 20px;
  margin-top: 34px;
}
.myclass__classes .classes--filter + .classes--list {
  margin-top: 24px;
}
.myclass__classes .classes--list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 24px;
}
.myclass__classes .classes--list .recommend--item {
  width: calc((100% - 48px) / 3);
}
.myclass__classes .classes--list .recommend--info .date {
  opacity: 0.3;
  text-align: right;
}
.myclass__classes .classes--list + .pagenavi--box {
  margin-top: 48px;
}
.myclass__guide {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
  transform: translate3d(0, 0, 0);
  -webkit-transform: translateZ(0);
  -webkit-overflow-scrolling: touch;
  z-index: 500;
}
.myclass__result-detail .workbook-detail--info {
  margin-top: 84px;
}
.myclass__result-detail .workbook-detail--info .contents-info__sub {
  width: 236px;
  padding-left: 0;
}
.myclass__result-detail .workbook-detail--info .contents-info__sub p strong {
  width: 93px;
}
.myclass__result-detail .intro-mystat {
  gap: 24px;
}
.myclass__result-detail .intro-mystat .cell-06 {
  padding: 20px 24px 24px;
}
.myclass__result-detail .intro-mystat .cell-06 .title {
  margin-bottom: 24px;
  color: #000000;
  font-size: 16px;
  font-weight: 700;
  line-height: 18px;
}
.myclass__result-detail .intro-mystat .cell-06 .title span {
  padding-left: 10px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 14px;
  line-height: 16px;
}
.myclass__result-detail .intro-mystat .cell-06 .monthly--box {
  gap: 24px;
}
.myclass__result-detail .intro-mystat .cell-06 .monthly--box-item {
  padding-top: 20px;
}
.myclass__result-detail .intro-mystat .cell-06 .monthly--box-item .tag {
  padding: 4px 9px;
  margin-top: 0;
  margin-bottom: 21px;
  font-size: 14px;
}
.myclass__result-detail .intro-mystat .cell-06 .monthly--box-item .number {
  margin-top: 21px;
}
.myclass__result-detail .intro-mystat,
.myclass__result-detail .intro-mystat + .box-bg__white {
  margin-top: 24px;
}
.myclass__result-detail .detail__table {
  gap: 24px;
  padding: 28px 24px 24px;
}
.myclass__result-detail
  .detail__table
  .table--list
  table
  thead
  tr
  th:first-child {
  padding-left: 20px;
}
.myclass__result-detail
  .detail__table
  .table--list
  table
  thead
  tr
  th:last-child {
  padding-right: 20px;
}
.myclass__result-detail
  .detail__table
  .table--list
  table
  tbody
  tr
  td:first-child {
  padding-left: 6px;
}
.myclass__result-detail
  .detail__table
  .table--list
  table
  tbody
  tr
  td:last-child {
  padding-right: 6px;
}
.myclass__result-detail
  .detail__table
  .table--list
  table
  tbody
  tr:last-child
  td {
  border-bottom: none;
}

.guide-clone {
  position: absolute;
  width: 100%;
  min-width: 1024px;
  height: 86px;
  margin-top: 99px;
  -webkit-overflow-scrolling: touch;
  z-index: 501;
}
.guide-clone--wrapper {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  flex-shrink: 0;
  position: relative;
  height: 86px;
  padding: 19px 36px;
  margin: 0 auto;
}
.guide-clone--wrapper .tooltip--box {
  display: block;
  margin-top: 15px;
}
.guide-clone--box {
  position: relative;
}
.guide-clone--box .tooltip--box.arrow--right {
  right: 0;
}

.teacher-mylesson {
  display: flex;
  flex-direction: row;
  align-items: stretch;
}
.teacher-mylesson > div,
.teacher-mylesson > a,
.teacher-mylesson > button {
  display: flex;
  flex-direction: row;
  align-items: start;
  position: relative;
  gap: 18px;
  padding: 18px;
  background-color: rgba(0, 0, 0, 0.04);
  border-radius: 16px;
}
.teacher-mylesson--icon {
  flex-shrink: 0;
  flex-grow: 0;
  width: 52px;
  height: 52px;
}
.teacher-mylesson--icon.is--ready {
  background-image: url("../images/img/lesson-today-color.png");
}
.teacher-mylesson--icon.is--make {
  background-image: url("../images/img/lesson-make-color.png");
}
.teacher-mylesson--icon.is--new {
  background-image: url("../images/img/lesson-notice-color.png");
}
.teacher-mylesson--box {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: start;
  gap: 7px;
}
.teacher-mylesson .active {
  background-color: rgba(126, 68, 251, 0.1);
  border: 1px solid #7e44fb;
  border-radius: 16px;
}

.teacher-makelesson .makelesson--people {
  display: none;
}
.teacher-makelesson .makelesson--people-control {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin: 4px 0 -19px 0;
}
.teacher-makelesson .makelesson--people-control .active {
  transform: rotate(180deg);
}
.teacher-makelesson .makelesson--people .box--edit-title {
  margin-top: 38px;
}
.teacher-makelesson .makelesson--option {
  display: none;
  margin-bottom: -16px;
}
.teacher-makelesson .makelesson--option-control {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  background: #8d58ff;
  border-radius: 10px;
  height: 44px;
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  color: #ffffff;
  padding: 0 18px 0 25px;
  margin-top: 40px;
}
.teacher-makelesson .makelesson--option-control .button-icon {
  width: 24px;
  height: 24px;
  background: #ffffff;
  border: 1px solid #d6d6d6;
  backdrop-filter: blur(2px);
}
.teacher-makelesson .makelesson--option-control .button-icon:hover {
  background: #ffffff;
}
.teacher-makelesson .makelesson--option-control .button-icon.active {
  transform: rotate(180deg);
}
.teacher-makelesson .makelesson--option .box--edit:first-child {
  margin-top: 20px;
}
.teacher-makelesson .makelesson--option .is--tags {
  height: 40px;
}
.teacher-makelesson .makelesson--button {
  padding: 48px 24px;
  margin-top: 40px;
}
.teacher-makelesson .makelesson--howto .box--edit-info {
  margin-left: 8px;
}
@media (max-width: 1199px) {
  .teacher-makelesson .makelesson--howto {
    flex-wrap: wrap;
  }
  .teacher-makelesson .makelesson--howto .box--edit-info {
    margin-left: 0;
  }
  .teacher-makelesson .makelesson--howto .box--edit-info .no--device {
    display: none;
  }
}
.teacher-makelesson .box--edit-items .input-check {
  width: 115px;
}
.teacher-makelesson .box--edit-items + .box--edit-title {
  margin-top: 38px;
}
.teacher-makelesson .box--edit-title.set--middle {
  margin-top: 0px;
}
.teacher-makelesson .box--edit-double + .box--edit-title {
  margin-top: 38px;
}
@media (max-width: 1199px) {
  .teacher-makelesson .box--edit-file {
    margin-bottom: 10px;
  }
}
.teacher-makelesson .check-attendance--box {
  flex-wrap: nowrap;
  flex-grow: 1;
}
@media (max-width: 1199px) {
  .teacher-makelesson .check-attendance__title {
    width: 115px;
  }
}
.teacher-makelesson .check-attendance .box--edit-double__cont {
  flex-grow: 1;
}
@media (max-width: 1199px) {
  .teacher-makelesson .check-attendance {
    width: 100%;
  }
  .teacher-makelesson .check-attendance .dropdown--area {
    flex-grow: 1;
  }
}

.teacher-noticewrite {
  padding-top: 86px;
  gap: 6px;
}
.teacher-noticewrite .page__button {
  padding: 32px 0 32px;
}

.teacher-makeclass .dropdown--area:not(.width-full):not([class*="width"]) {
  width: 205px;
}
.teacher-makeclass .page__button {
  margin-top: 56px;
  padding-bottom: 95px;
}
.teacher-makeclass
  .makelesson--howto
  .dropdown--area:not(.width-full):not([class*="width"]) {
  width: calc((100% - 48px) / 5);
}
@media (max-width: 1199px) {
  .teacher-makeclass .makeclass__date.cell-06.cell-xs-06 {
    width: calc(50% - 8px);
  }
}
@media (max-width: 1199px) {
  .teacher-makeclass .makeclass__time.cell-06.cell-xs-06 {
    width: calc(50% - 8px);
  }
}
.teacher-makeclass .makeclass__time dl dt {
  width: 110px;
  line-height: 40px;
}
.teacher-makeclass .makeclass__time dl dd .box-flex.gap-16 {
  width: 100%;
}
.teacher-makeclass .makeclass__time dl dd .dropdown--area {
  width: calc((100% - 42px) / 2);
}
@media (max-width: 1199px) {
  .teacher-makeclass .makeclass__time dl dd.repeat .dropdown--area {
    width: 158px;
  }
}
@media (max-width: 1199px) {
  .teacher-makeclass .makeclass__time dl {
    align-items: flex-start;
  }
  .teacher-makeclass .makeclass__time dl dd {
    align-items: flex-start;
  }
  .teacher-makeclass .makeclass__time dl dd p {
    line-height: 40px;
  }
  .teacher-makeclass .makeclass__time dl dd .box-flex {
    flex-wrap: wrap;
  }
}
.teacher-makeclass .teacher-makeclass__data .makeclass-edit {
  padding-top: 24px;
  margin-top: 30px;
  border-top: 2px solid #d9d9d9;
}
.teacher-makeclass .teacher-makeclass__data .makeclass-edit .box--edit-group {
  margin-top: 34px;
}
.teacher-makeclass .teacher-makeclass__data .makeclass-edit--datalist {
  overflow: hidden;
  overflow-y: auto;
  height: 58px;
}
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit--datalist
  .button-tag
  [class^="ico-"]:first-child {
  margin-left: 0;
  margin-right: 6px;
}
.teacher-makeclass .teacher-makeclass__data .makeclass-edit--datalist > .f-16 {
  margin: 5px 8px 0;
}
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  > .box--edit-group
  .box--edit-title {
  height: 40px;
}
.teacher-makeclass .teacher-makeclass__data .makeclass-edit .is--list {
  display: flex;
  flex-direction: row;
  gap: 24px;
}
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .is--list
  .recommend--item {
  width: 25%;
}
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--document
  .is--list
  .recommend--item
  .recommend--thum,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--workbook
  .is--list
  .recommend--item
  .recommend--thum {
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 17px;
}
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--lesson
  .input-box.no-input,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--workbook
  .input-box.no-input,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--document
  .input-box.no-input,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--video
  .input-box.no-input {
  overflow: hidden;
  overflow-y: auto;
  height: 53px;
  padding: 5px;
  justify-content: start;
  align-items: start;
}
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--lesson
  .input-box.no-input
  [class^="ico-"]:first-child,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--workbook
  .input-box.no-input
  [class^="ico-"]:first-child,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--document
  .input-box.no-input
  [class^="ico-"]:first-child,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--video
  .input-box.no-input
  [class^="ico-"]:first-child {
  margin-left: 0;
  margin-right: 6px;
}
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--lesson
  .input-box.no-input
  > .f-14,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--workbook
  .input-box.no-input
  > .f-14,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--document
  .input-box.no-input
  > .f-14,
.teacher-makeclass
  .teacher-makeclass__data
  .makeclass-edit
  .makeclass--video
  .input-box.no-input
  > .f-14 {
  margin: 5px 8px 0;
}
.teacher-makelessons {
  max-width: 576px;
  margin: 80px auto 0;
}
.teacher-makelessons .table--info {
  overflow: hidden;
  width: calc(100% + 128px);
  margin-left: -128px;
  margin-bottom: 60px;
  background-color: #ffffff;
}
.teacher-makelessons .table--info,
.teacher-makelessons .table--info th,
.teacher-makelessons .table--info td {
  border-color: rgba(0, 0, 0, 0.1);
}
.teacher-makelessons .table--info th,
.teacher-makelessons .table--info td {
  padding: 23px;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.teacher-makelessons__infos {
  text-align: center;
  margin-bottom: 70px;
}
.teacher-makelessons__title {
  font-weight: 800;
  font-size: 36px;
  line-height: 41px;
}
.teacher-makelessons__title em {
  font-style: normal;
  color: #7e44fb;
}
.teacher-makelessons__ment {
  font-size: 20px;
  line-height: 32px;
  margin-top: 14px;
}

.teacher-makeclasses {
  margin: 84px auto 0;
  max-width: 744px;
}
.teacher-makeclasses .page__button {
  padding: 48px 0;
}

.timetable--box {
  position: relative;
  padding: 40px 32px 42px;
}
.timetable--box.is--scroll {
  padding: 40px 0 30px;
}
.timetable--box.is--scroll .timetable--legend {
  margin-right: 32px;
  margin-left: 32px;
}
.timetable--box.is--scroll .timetable--table {
  overflow: hidden;
  overflow-x: auto;
  padding: 0 32px 12px 0;
}
.timetable--box.is--scroll .timetable--table table {
  width: auto;
  min-width: 100%;
  margin-left: 32px;
  table-layout: auto;
}
.timetable--box.is--scroll .timetable--table table th:first-child {
  width: 62px;
  min-width: 62px;
}
.timetable--box.is--scroll .timetable--table table td {
  min-width: 141px;
  width: auto;
  white-space: nowrap;
}
.timetable--box.is--scroll .lesson--item-inner p {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
.timetable--box.is--scroll .lesson--item-inner .tooltip--box-text {
  text-align: left;
}
.timetable--box.is--scroll .lesson--item-inner .tooltip--box-text p {
  overflow: initial;
  text-align: left;
  text-overflow: inherit;
  white-space: initial;
}
.timetable--box.is--scroll .lesson--item-inner .tooltip--box-text p + p {
  margin-top: 2px;
}
.timetable--box.is--scroll .lesson--item.item--1 {
  display: block;
  width: 136px;
}
.timetable--box.is--scroll .lesson--item.item--2 {
  width: 66px;
}
.timetable--box.is--scroll .lesson--item.item--3 {
  width: 42.6px;
}
.timetable--box.is--scroll .lesson--item.item--3 .timetable-icon {
  bottom: 4px;
  right: 4px;
}
.timetable--box.is--scroll .lesson--item.item--1 .timetable-icon,
.timetable--box.is--scroll .lesson--item.item--2 .timetable-icon {
  bottom: 6px;
  right: 6px;
}
.timetable--box.is--scroll .lesson--item.item--1.small .timetable-time,
.timetable--box.is--scroll .lesson--item.item--2.small .timetable-time {
  display: none;
}
.timetable--button {
  display: flex;
  flex-direction: row;
  position: absolute;
  top: 24px;
  right: 32px;
  box-shadow: 0 2px 11px rgba(0, 0, 0, 0.08);
  border: 1px solid #d9d9d9;
  border-radius: 6px;
}
.timetable--button button {
  width: 48px;
  height: 48px;
  background-image: url("../images/ico/next-black.svg");
  background-size: 28px;
}
.timetable--button button:disabled {
  background-color: #eeeeee;
  opacity: 0.5;
}
.timetable--button > p {
  width: 1px;
  height: 48px;
  background-color: #d9d9d9;
}
.timetable--button__up {
  transform: rotate(-90deg);
}
.timetable--button__down {
  transform: rotate(90deg);
}
.timetable--legend {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 30px;
  height: 20px;
}
.timetable--legend p {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  color: #000000;
  font-size: 18px;
  line-height: 20px;
}
.timetable--legend p span {
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 10px;
  border-width: 1.5px;
  border-style: solid;
}
.timetable--legend p.is--vod span {
  background-color: rgba(0, 195, 199, 0.4);
  border-color: #00c3c7;
}
.timetable--legend p.is--live span {
  background-color: rgba(255, 105, 231, 0.4);
  border-color: #ff69e7;
}
.timetable--legend p.is--school span {
  background-color: rgba(255, 189, 89, 0.4);
  border-color: #ffbd59;
}
.timetable--legend p.is--notype span {
  background-color: rgba(124, 124, 124, 0.2);
  border-color: #7c7c7c;
}
.timetable--table {
  margin-top: 36px;
}
.timetable--table table thead th {
  position: relative;
  padding-bottom: 7px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.timetable--table table thead th .timetable--table-day {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  width: 74px;
  height: 71px;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}
.timetable--table table thead th .timetable--table-day strong,
.timetable--table table thead th .timetable--table-day span {
  display: block;
  text-align: center;
}
.timetable--table table thead th .timetable--table-day strong {
  color: #000000;
  font-size: 22px;
  font-weight: 700;
  line-height: 25px;
}
.timetable--table table thead th .timetable--table-day span {
  margin-top: 8px;
  color: #ababab;
  font-size: 16px;
  font-weight: 400;
  line-height: 18px;
}
.timetable--table table thead th .timetable--table-day.today {
  background-color: #7e44fb;
  border-radius: 10px;
}
.timetable--table table thead th .timetable--table-day.today strong,
.timetable--table table thead th .timetable--table-day.today span {
  color: #ffffff;
}
.timetable--table table thead th .timetable--table-arrow {
  position: absolute;
  display: block;
  width: 7px;
  height: 14px;
  top: 50%;
  right: 12px;
  margin-top: -10px;
  background-image: url("../images/ico/left-black.svg");
  opacity: 0.6;
  transform: rotate(180deg);
  content: "";
}
.timetable--table table tbody tr {
  position: relative;
}
.timetable--table table tbody tr th,
.timetable--table table tbody tr td {
  z-index: 5;
}
.timetable--table table tbody tr th:hover,
.timetable--table table tbody tr th.tooltip-open,
.timetable--table table tbody tr td:hover,
.timetable--table table tbody tr td.tooltip-open {
  z-index: 15;
}
.timetable--table table tbody tr.is-allday th:first-child:not(.empty) p,
.timetable--table table tbody tr.is-allday td:first-child:not(.empty) p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 100%;
  top: 1px;
  margin: 0;
  color: rgba(0, 0, 0, 0.6);
  font-size: 14px;
  font-weight: 700;
}
.timetable--table table tbody tr.is-allday th:first-child:not(.empty)::before,
.timetable--table table tbody tr.is-allday td:first-child:not(.empty)::before {
  height: 100%;
  top: 1px;
  bottom: 9px;
}
.timetable--table table tbody tr.is-allday td {
  vertical-align: top;
  padding-top: 16px;
  padding-bottom: 16px;
  border-top: none;
}
.timetable--table table tbody tr.is-allday td .lesson--item {
  position: initial;
}
.timetable--table table tbody tr.is-allday td .lesson--item + .lesson--item {
  margin-top: 8px;
  margin-left: 0;
}
.timetable--table table tbody tr.is-hour td {
  border-top: 1px solid rgba(0, 0, 0, 0.2);
}
.timetable--table table tbody tr.is-minute td {
  border-top: 1px dashed rgba(0, 0, 0, 0.2);
}
.timetable--table table tbody tr.is-last th,
.timetable--table table tbody tr.is-last td {
  height: 0;
  padding: 0;
  border-right: none;
}
.timetable--table table tbody tr.is-last th:first-child:not(.empty)::before,
.timetable--table table tbody tr.is-last td:first-child:not(.empty)::before {
  height: 88px;
}
.timetable--table
  table
  tbody
  tr.is-last
  th:nth-child(2)
  .lesson--item
  .tooltip--box,
.timetable--table
  table
  tbody
  tr.is-last
  td:nth-child(2)
  .lesson--item
  .tooltip--box {
  left: 75px;
}
.timetable--table
  table
  tbody
  tr.is-last
  th:nth-child(2)
  .lesson--item
  .tooltip--box-inner::after,
.timetable--table
  table
  tbody
  tr.is-last
  th:nth-child(2)
  .lesson--item
  .tooltip--box-inner::before,
.timetable--table
  table
  tbody
  tr.is-last
  td:nth-child(2)
  .lesson--item
  .tooltip--box-inner::after,
.timetable--table
  table
  tbody
  tr.is-last
  td:nth-child(2)
  .lesson--item
  .tooltip--box-inner::before {
  margin-left: -50px;
}
.timetable--table table tbody tr.is-last th p {
  margin-top: -9px;
}
.timetable--table table tbody th,
.timetable--table table tbody td {
  height: 40px;
}
/* 240117 시간표 ui css 삭제 */
/* .timetable--table table tbody th:first-child:not(.empty),
.timetable--table table tbody td:first-child:not(.empty) {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  position: fixed;
  height: 39px;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 35;
}
.timetable--table table tbody th:first-child:not(.empty)::before,
.timetable--table table tbody td:first-child:not(.empty)::before {
  position: absolute;
  height: 44px;
  top: -19.5px;
  left: -200%;
  right: 0;
  background-color: #ffffff;
  z-index: 10;
  content: "";
}
.timetable--table table tbody th:nth-child(2) .lesson--item .tooltip--box,
.timetable--table table tbody td:nth-child(2) .lesson--item .tooltip--box {
  left: 71px;
} */
.timetable--table
  table
  tbody
  th:nth-child(2)
  .lesson--item
  .tooltip--box-inner::after,
.timetable--table
  table
  tbody
  th:nth-child(2)
  .lesson--item
  .tooltip--box-inner::before,
.timetable--table
  table
  tbody
  td:nth-child(2)
  .lesson--item
  .tooltip--box-inner::after,
.timetable--table
  table
  tbody
  td:nth-child(2)
  .lesson--item
  .tooltip--box-inner::before {
  margin-left: -46px;
}
.timetable--table table tbody th p {
  position: relative;
  width: 100%;
  margin-top: -9px;
  background-color: #ffffff;
  color: #ababab;
  font-size: 16px;
  font-weight: 400;
  line-height: 18px;
  z-index: 15;
}
.timetable--table table tbody td {
  padding-right: 4px;
  padding-left: 4px;
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  font-size: 0;
}
.timetable--table table tbody td:last-child {
  border-right: none;
}
.timetable--table table tbody td .lesson--item + .lesson--item {
  margin-left: 4px;
}
.timetable--table table tbody.timetable {
  display: none;
}
.timetable--table table tbody.timetable.show {
  display: table-row-group;
}

.lesson--item {
  position: relative;
  vertical-align: top;
  display: inline-block;
  height: 39px;
  top: 0;
  cursor: pointer;
  z-index: 10;
}
.lesson--item-inner {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 16px;
  border-radius: 4px;
}
.lesson--item-inner::before {
  position: absolute;
  display: none;
  width: 2px;
  top: 0;
  bottom: 0;
  left: 0;
  content: "";
}
.lesson--item-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}
.lesson--item-time {
  margin-top: 8px;
  color: rgba(0, 0, 0, 0.6);
  font-size: 12px;
  font-weight: 700;
  line-height: 14px;
}
.lesson--item-icon {
  position: absolute;
  width: 36px;
  height: 36px;
  background-size: 16px;
}
.lesson--item .tooltip--box {
  top: 100%;
  left: 20px;
}
.lesson--item .tooltip--box-inner {
  max-width: 296px;
}
.lesson--item .tooltip--box-text {
  padding: 15px 23px;
  white-space: initial;
}
.lesson--item .tooltip--box-text p {
  overflow: initial;
  text-overflow: inherit;
  white-space: initial;
}
.lesson--item:hover {
  z-index: 15;
}
.lesson--item:hover .tooltip--box {
  display: block;
}
.lesson--item.bg--allday .lesson--item-inner {
  height: 52px !important;
  background-color: rgba(126, 68, 251, 0.2);
}
.lesson--item.bg--allday .lesson--item-inner::before {
  background-color: #7e44fb;
}
.lesson--item.bg--allday .lesson--item-icon {
  top: 50% !important;
  bottom: auto !important;
  margin-top: -18px;
}
.lesson--item.bg--vod .lesson--item-inner {
  background-color: rgba(0, 195, 199, 0.2);
}
.lesson--item.bg--vod .lesson--item-inner::before {
  background-color: #00c3c7;
}
.lesson--item.bg--live .lesson--item-inner {
  background-color: rgba(255, 105, 231, 0.2);
}
.lesson--item.bg--live .lesson--item-inner::before {
  background-color: #ff69e7;
}
.lesson--item.bg--school .lesson--item-inner {
  background-color: rgba(255, 189, 89, 0.2);
}
.lesson--item.bg--school .lesson--item-inner::before {
  background-color: #ffbd59;
}
.lesson--item.bg--notype .lesson--item-inner {
  background-color: rgba(124, 124, 124, 0.2);
}
.lesson--item.bg--notype .lesson--item-inner::before {
  background-color: #7c7c7c;
}
.lesson--item.edit .lesson--item-icon {
  background-image: url("../images/ico/plug-black.svg");
}
.lesson--item.modify .lesson--item-inner::before {
  display: block;
}
.lesson--item.modify .lesson--item-icon {
  background-image: url("../images/ico/share-black.svg");
}
.lesson--item.item--1 {
  width: 100%;
}
.lesson--item.item--1 .lesson--item-icon {
  bottom: 6px;
  right: 6px;
}
.lesson--item.item--1.small .lesson--item-time {
  display: none;
}
.lesson--item.item--2 {
  width: calc((100% - 4px) / 2);
}
.lesson--item.item--2 .lesson--item-icon {
  bottom: 6px;
  right: 6px;
}
.lesson--item.item--2.small .lesson--item-time {
  display: none;
}
.lesson--item.item--3 {
  width: calc((100% - 8px) / 3);
}
.lesson--item.item--3 .lesson--item-icon {
  bottom: 4px;
  left: 50%;
  right: auto;
  margin: 0;
  transform: translateX(-50%);
}
.lesson--item.minimum .lesson--item-inner {
  display: flex;
  flex-direction: row;
  justify-content: start;
  align-items: center;
  height: 39px !important;
  padding-top: 0;
  padding-right: 36px;
  padding-bottom: 0;
}
.lesson--item.minimum .lesson--item-time {
  display: none;
}
.lesson--item.minimum .lesson--item-icon {
  top: 50% !important;
  bottom: auto !important;
  margin-top: -18px;
}
.lesson--item.minimum.item--2 .lesson--item-time {
  display: none;
}
.lesson--item.minimum.item--3 .lesson--item-inner {
  padding-right: initial;
}
.lesson--item.minimum.item--3 .lesson--item-text,
.lesson--item.minimum.item--3 .lesson--item-time {
  display: none;
}

.attendancelist--box {
  padding: 23px 32px 32px;
}
.attendancelist--box .table--list thead th {
  font-weight: 400;
}
.attendancelist--box .table--list thead th .f-14 {
  display: block;
}
.attendancelist--box .table--list thead th[tabindex] {
  position: relative;
  cursor: pointer;
}
.attendancelist--box .table--list thead th[tabindex] > * {
  position: relative;
  z-index: 10;
}
.attendancelist--box .table--list thead th[tabindex]:hover::after {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(126, 68, 251, 0.05);
  border: 1px solid #7e44fb;
  border-radius: 4px;
  z-index: 5;
  content: "";
}
.attendancelist--box
  .table--list
  tr:last-child
  .table-attendance__cell
  .tooltip--box {
  top: initial;
  bottom: 100%;
  margin-bottom: 4px;
}
.attendancelist--box
  .table--list
  tr:last-child
  .table-attendance__cell
  .tooltip--box-inner::before,
.attendancelist--box
  .table--list
  tr:last-child
  .table-attendance__cell
  .tooltip--box-inner::after {
  top: auto;
  left: 50%;
  bottom: 0;
  margin-top: 0;
  margin-bottom: 1px;
  transform: translate(-50%, 100%);
}
.attendancelist--box
  .table--list
  tr:last-child
  .table-attendance__cell
  .tooltip--box-inner::before {
  margin-left: 0;
}
.attendancelist--box .table--list + .pagenavi--box {
  margin-top: 48px;
  margin-bottom: 32px;
}
.attendancelist--box.is--scroll {
  padding-right: 0;
  padding-bottom: 20px;
  padding-left: 0;
}
.attendancelist--box.is--scroll .table--setting {
  padding-right: 32px;
  padding-left: 32px;
}
.attendancelist--box.is--scroll .table--list {
  position: relative;
  padding-right: 32px;
  padding-bottom: 5px;
  padding-left: 32px;
}
.attendancelist--box.is--scroll .table--list .tbl--fixed {
  position: absolute;
  width: 173px;
  top: 0;
  z-index: 10;
}
.attendancelist--box.is--scroll .table--list .tbl--fixed th {
  padding: 0;
  line-height: 79px;
}
.attendancelist--box.is--scroll .table--list .tbl--fixed td {
  height: 55px;
  background-color: #ffffff;
}
.attendancelist--box.is--scroll .table--list .tbl--scroll {
  overflow-x: auto;
  max-width: 100%;
  position: relative;
  padding-left: 173px;
  z-index: 5;
}
.attendancelist--box.is--scroll .table--list + .pagenavi--box {
  margin-top: 10px;
  margin-bottom: 12px;
}
.attendancelist--box.is--student {
  padding: 10px 3px 0;
}
.attendancelist--box.is--student .table-attendance__cell {
  height: 118px;
  padding-top: 14px;
  padding-bottom: 16px;
}
.attendancelist--box.is--student .table-attendance__cell:nth-child(2n-1) {
  background: #ffffff;
}
.attendancelist--box.is--student .table-attendance__cell:nth-child(2n) {
  background: #f8faff;
}
.attendancelist--box.is--student .table-attendance__cell .tooltip--box-wrap {
  display: block;
}
.attendancelist--box.is--student .table-attendance__cell .tooltip--button {
  height: 44px;
  margin: 0 30px 12px;
}
.attendancelist--box.is--student .table-attendance__cell .state-box {
  min-width: 58px;
}
.attendancelist--box.is--student .table--list__thead {
  margin-right: 29px;
  margin-left: 29px;
}
.attendancelist--box.is--student .table--list__tbody {
  margin-right: 0;
  margin-left: 0;
  padding-right: 29px;
  padding-left: 29px;
}

.table-attendance__cell {
  position: relative;
  height: 55px;
}
.table-attendance__cell[class*="bg--"] {
  cursor: pointer;
}
.table-attendance__cell .tooltip--box {
  display: none;
  top: 100%;
  margin-top: 4px;
}
.table-attendance__cell:hover.bg--pass {
  background-color: rgba(0, 186, 19, 0.2);
}
.table-attendance__cell:hover.bg--fail {
  background-color: rgba(250, 103, 41, 0.2);
}
.table-attendance__cell:hover .tooltip--box {
  display: block;
}
.table-attendance__cell:nth-child(2n-1) {
  background: #f8faff;
}
.table-attendance__circle {
  display: block;
  width: 18px;
  height: 18px;
  margin: 0 auto;
  border-radius: 18px;
  color: transparent;
  font-size: 0;
}
.table-attendance__circle.bg--pass {
  background-color: #00ba13;
}
.table-attendance__circle.bg--fail {
  background-color: #fa6729;
}
.table-attendance__circle.bg--none {
  background-color: rgba(0, 0, 0, 0.1);
}

.people-list {
  position: relative;
}
.people-list__list {
  position: relative;
}
.people-list__list.size-144 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  gap: 50px;
}
.people-list__list.size-144 .people-list__profile {
  width: 144px;
  height: 144px;
}
.people-list__list.size-144 .people-list__text {
  margin-top: 20px;
  font-size: 24px;
  line-height: 26px;
}
.people-list__list.size-144 li.random .people-list__profile {
  line-height: 144px;
}
.people-list__list.size-100 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  gap: 40px;
}
.people-list__list.size-100 .people-list__profile {
  width: 100px;
  height: 100px;
}
.people-list__list.size-100 .people-list__text {
  margin-top: 12px;
  font-size: 18px;
  line-height: 26px;
}
.people-list__list.size-86 .people-list__profile {
  width: 86px;
  height: 86px;
}
.people-list__list.size-86 .people-list__text {
  margin-top: 17px;
  font-weight: 700;
  font-size: 20px;
  line-height: 26px;
}
.people-list__list.size-76 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
}
.people-list__list.size-76 .people-list__profile {
  width: 76px;
  height: 76px;
}
.people-list__list.size-76 .people-list__text {
  margin-top: 8px;
  font-size: 18px;
  line-height: 26px;
}
.people-list__list.size-70 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
}
.people-list__list.size-70 .people-list__profile {
  width: 70px;
  height: 70px;
}
.people-list__list.size-60 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.people-list__list.size-60 .people-list__profile {
  width: 60px;
  height: 60px;
}
.people-list__list.size-60 .people-list__text {
  margin-top: 6px;
  font-size: 16px;
  line-height: 26px;
}
.people-list__list.size-32 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.people-list__list.size-32 li {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.people-list__list.size-32 .people-list__profile {
  width: 32px;
  height: 32px;
}
.people-list__list.size-32 .people-list__text {
  font-size: 12px;
  margin-left: 6px;
}
.people-list__list.size-40 {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
}
.people-list__list.size-40 li {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.people-list__list.size-40 .people-list__profile {
  width: 40px;
  height: 40px;
}
.people-list__list.size-40 .people-list__text {
  font-size: 18px;
  margin-left: 14px;
}
.people-list__list li {
  flex-shrink: 0;
}
.people-list__list li.add .btn-add {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  border-radius: 100%;
}
.people-list__list li.add .people-list__text {
  opacity: 0.3;
}
.people-list__list li.random:nth-child(1n) .people-list__profile {
  background-color: #f2ecff;
  background-image: none;
  color: #7e44fb;
  font-size: 64px;
  font-weight: 800;
  text-align: center;
}
.people-list__list li:nth-child(1n) .people-list__profile {
  background-color: #ddddfa;
}
.people-list__list li:nth-child(2n) .people-list__profile {
  background-color: #d7e6d2;
}
.people-list__list li:nth-child(3n) .people-list__profile {
  background-color: #f6e3c5;
}
.people-list__list li:nth-child(4n) .people-list__profile {
  background-color: #d3e0fa;
}
.people-list__list li:nth-child(5n) .people-list__profile {
  background-color: #ddddfa;
}
.people-list__list li:nth-child(6n) .people-list__profile {
  background-color: #ebdce7;
}
.people-list__list li:nth-child(7n) .people-list__profile {
  background-color: #d1d7e3;
}
.people-list__profile {
  position: relative;
  display: inline-block;
  width: 100px;
  height: 100px;
  border-radius: 100%;
  background-image: url("../images/ico/profile-big-white.svg");
  background-size: 100% 100%;
  flex-shrink: 0;
}
.people-list__profile .btn-delete {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 0px;
  bottom: 0px;
  width: 30px;
  height: 30px;
  border: 1px #ababab solid;
  border-radius: 100%;
  background-color: #ecf0f3;
}
.people-list__profile .btn-delete span {
  opacity: 0.4;
}
.people-list__text {
  color: #000000;
  text-align: center;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
[class$="-slider"] .people-list__text {
  margin-top: 12px;
}
.people-list__number {
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  line-height: 18px;
  margin-bottom: 14px;
  color: rgba(0, 0, 0, 0.4);
  width: 100%;
}
.people-list.is--normal {
  padding: 0 136px;
}
.people-list.is--card {
  padding: 0 136px;
}
@media (max-width: 1199px) {
  .people-list.is--card {
    padding: 0 85px;
  }
}
.people-list.is--card .people-list__list {
  gap: 20px;
}
.people-list.is--card li {
  position: relative;
  transform: rotateY(0deg);
  transition: transform 0.3s;
  transform-style: preserve-3d;
  width: 144px;
  height: 180px;
}
.people-list.is--card li > div,
.people-list.is--card li > button {
  border-radius: 16px;
  text-align: center;
  border-radius: 16px;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}
.people-list.is--card li.is--flip {
  transform: rotateY(180deg);
}
.people-list.is--card li.one-card {
  width: 172px;
  height: 206px;
  margin-right: auto;
  margin-left: auto;
}
.people-list.is--card li.one-card .card-front {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-flow: column;
}
.people-list.is--card .card-back {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  font-weight: 800;
  font-size: 84px;
  line-height: 95px;
  color: #7e44fb;
  background: #f2ecff;
}
.people-list.is--card .card-front {
  padding: 20px 0 18px;
  background: #f6f6f6;
  transform: rotateY(180deg);
}

.game--option,
.people--option {
  margin-top: 105px;
  margin-bottom: 125px;
}
.game--option__control,
.people--option__control {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.game--option__control [class^="btn-"],
.people--option__control [class^="btn-"] {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 100%;
}
.game--option__control [class^="btn-"]:disabled p,
.people--option__control [class^="btn-"]:disabled p {
  opacity: 0.3;
}
.game--option__control input[type="text"],
.people--option__control input[type="text"] {
  width: 200px;
  font-weight: 800;
  font-size: 120px;
  color: #7e44fb;
  text-align: center;
}
.game--option__title,
.people--option__title {
  margin-top: 10px;
  text-align: center;
  font-size: 40px;
  line-height: 45px;
  color: #000000;
}
.game--participate,
.people--participate {
  position: absolute;
  right: 28px;
  top: 48px;
  width: 96px;
  z-index: 20;
}
.game--participate + .roulette--wheel,
.people--participate + .roulette--wheel {
  margin-top: 57px;
}
.game--participate.left-bottom,
.people--participate.left-bottom {
  left: 28px;
  bottom: 29px;
  top: inherit;
  right: inherit;
}
.game--participate.left-bottom .people-list,
.people--participate.left-bottom .people-list {
  bottom: 34px;
}
.game--participate.left-bottom .onoff-box:last-child,
.people--participate.left-bottom .onoff-box:last-child {
  z-index: 3;
}
.game--participate .onoff-box,
.people--participate .onoff-box {
  position: relative;
  margin-bottom: 11px;
  z-index: 1;
}
.game--participate .onoff-box:first-child,
.people--participate .onoff-box:first-child {
  z-index: 2;
}
.game--participate .onoff-box button,
.people--participate .onoff-box button {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: relative;
  width: 100%;
  border-radius: 35px;
  height: 30px;
  font-weight: 700;
  font-size: 16px;
  line-height: 18px;
  padding-left: 28px;
  padding-right: 6px;
}
.game--participate .onoff-box button::before,
.people--participate .onoff-box button::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 100%;
  top: 50%;
  left: 16px;
  margin-top: -4px;
}
.game--participate .onoff-box button p,
.people--participate .onoff-box button p {
  opacity: 0.6;
}
.game--participate .onoff-box button.btn-on,
.people--participate .onoff-box button.btn-on {
  background: rgba(0, 186, 19, 0.1);
  color: #00ba13;
}
.game--participate .onoff-box button.btn-on::before,
.people--participate .onoff-box button.btn-on::before {
  background: #00ba13;
}
.game--participate .onoff-box button.btn-off,
.people--participate .onoff-box button.btn-off {
  background: rgba(0, 0, 0, 0.1);
  color: rgba(0, 0, 0, 0.5);
}
.game--participate .onoff-box button.btn-off::before,
.people--participate .onoff-box button.btn-off::before {
  background: rgba(0, 0, 0, 0.5);
}
.game--participate .onoff-box button.active p,
.people--participate .onoff-box button.active p {
  transform: rotate(180deg);
}
.game--participate .onoff-box button.people-list__again,
.people--participate .onoff-box button.people-list__again {
  flex-shrink: 0;
  flex-grow: 0;
  width: 75px;
  height: 28px;
  padding: 0;
  background: #ffffff;
  border-radius: 4px;
  color: #7e44fb;
  font-size: 14px;
  text-align: center;
  line-height: 28px;
}
.game--participate .button-action,
.people--participate .button-action {
  position: relative;
  flex-shrink: 0;
}
.game--participate .button-action button,
.people--participate .button-action button {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: relative;
  font-weight: 700;
  font-size: 16px;
  line-height: 18px;
  flex-shrink: 0;
}
.game--participate .people-list,
.people--participate .people-list {
  display: none;
  position: absolute;
  z-index: 2;
  right: 0;
  margin-top: 5px;
  width: 130px;
  padding: 2px 0;
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  background-color: #ffffff;
  border-radius: 10px;
}
.game--participate .people-list .people-list__list,
.people--participate .people-list .people-list__list {
  padding: 10px 12px;
  overflow-y: auto;
  /* [이슈리스트 : 230807][2079] 참여학생 리스트 최대높이 조절 */
  max-height: 424px;
}
.game--participate .people-list .people-list__text,
.people--participate .people-list .people-list__text {
  text-align: left;
  text-overflow: inherit;
  white-space: normal;
}
.game--participate .people-list.mode-center,
.people--participate .people-list.mode-center {
  right: 50%;
  transform: translateX(50%);
}
.game--participate .people-list.mode-center::before,
.people--participate .people-list.mode-center::before {
  position: absolute;
  width: 11px;
  height: 11px;
  bottom: -9px;
  left: 50%;
  background-color: #ffffff;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  transform: translateX(-50%);
  margin-left: 1px;
  content: "";
  z-index: 2;
}
.game--participate .people-list.mode-center::after,
.people--participate .people-list.mode-center::after {
  position: absolute;
  width: 12px;
  height: 10px;
  bottom: -10px;
  left: 50%;
  background-color: #d9d9d9;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  transform: translateX(-50%);
  margin-left: 1px;
  content: "";
  z-index: 1;
}
.game--participate .people-list.mode-left,
.people--participate .people-list.mode-left {
  left: 0;
}
.game--participate .people-list.has-again,
.people--participate .people-list.has-again {
  max-width: none;
  width: 194px;
}
.game--participate .people-list.has-again .people-list__text,
.people--participate .people-list.has-again .people-list__text {
  font-size: 14px;
}
.game--participate .people-list.has-again .people-list__list li,
.people--participate .people-list.has-again .people-list__list li {
  padding: 2px 4px;
}
.game--participate .people-list.has-again .people-list__list li:hover,
.people--participate .people-list.has-again .people-list__list li:hover {
  background-color: rgba(126, 68, 251, 0.1);
  border-radius: 4px;
}
.game--participate
  .people-list.has-again
  .people-list__list
  li:hover
  .people-list__again,
.people--participate
  .people-list.has-again
  .people-list__list
  li:hover
  .people-list__again {
  display: block;
}
.game--participate .people-list.has-again .people-list__text,
.people--participate .people-list.has-again .people-list__text {
  text-align: left;
}
.game--participate .people-list.has-again .people-list__again,
.people--participate .people-list.has-again .people-list__again {
  display: none;
}
.game--share,
.people--share {
  position: absolute;
  right: 28px;
  bottom: 38px;
}
.game--share .btn-share-stop,
.people--share .btn-share-stop {
  width: 54px;
  height: 54px;
  font-size: 0;
  background-image: url("../images/img/btn-share-stop.svg");
  background-size: 100%;
}

.tool-box {
  display: flex;
  flex-direction: row;
  justify-content: center;
  position: relative;
  margin-top: 64px;
  height: 92px;
  background-color: #ffffff;
  border-radius: 20px;
  text-align: center;
  font-size: 0;
  z-index: 11;
}
.tool-box__list {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 12px;
}
.tool-box li {
  position: relative;
  display: inline-block;
  padding: 0 15px;
}
.tool-box li.active button {
  border-width: 2px;
  border-style: solid;
  opacity: 1;
}
.tool-box li span.ico {
  display: block;
  width: 44px;
  height: 44px;
  margin-top: 12px;
  background-position: 50% 50%;
}
.tool-box li span.text {
  display: none;
  width: 34px;
  font-weight: 800;
  font-size: 20px;
  line-height: 23px;
  padding-top: 10px;
  padding-bottom: 20px;
}
.tool-box li.sticker .ico {
  background-image: url("../images/tool/sticker-color.svg");
}
.tool-box li.sticker:hover button {
  background-color: #f3eefa;
}
.tool-box li.sticker.active button {
  background-color: #f3eefa;
}
.tool-box li.timer .ico {
  background-image: url("../images/tool/timer-color.svg");
}
.tool-box li.timer:hover button {
  background-color: #e9f2fe;
}
.tool-box li.timer.active button {
  background-color: #e9f2fe;
}
.tool-box li.alarm .ico {
  background-image: url("../images/tool/alarm-color.svg");
}
.tool-box li.alarm:hover button {
  background-color: #fbe9e9;
}
.tool-box li.alarm.active button {
  background-color: #fbe9e9;
}
.tool-box li.stopwatch .ico {
  background-image: url("../images/tool/stopwatch-color.svg");
}
.tool-box li.stopwatch:hover button {
  background-color: #e9f7f0;
}
.tool-box li.stopwatch.active button {
  background-color: #e9f7f0;
}
.tool-box li.bell .ico {
  background-image: url("../images/tool/bell-color.svg");
}
.tool-box li.bell:hover button {
  background-color: #fff7dc;
}
.tool-box li.bell.active button {
  background-color: #fff7dc;
}
.tool-box li.drawing .ico {
  background-image: url("../images/tool/drawing-color.svg");
}
.tool-box li.drawing:hover button {
  background-color: #f5efec;
}
.tool-box li.drawing.active button {
  background-color: #f5efec;
}
.tool-box li.mix .ico {
  background-image: url("../images/tool/mix-color.svg");
}
.tool-box li.mix:hover button {
  background-color: #e6f2ed;
}
.tool-box li.mix.active button {
  background-color: #e6f2ed;
}
.tool-box li.roulette .ico {
  background-image: url("../images/tool/roulette-color.svg");
}
.tool-box li.roulette:hover button {
  background-color: #f2ecff;
}
.tool-box li.roulette.active button {
  background-color: #f2ecff;
}
.tool-box li.ladder .ico {
  background-image: url("../images/tool/ladder-color.svg");
}
.tool-box li.ladder:hover button {
  background-color: #fff1ec;
}
.tool-box li.ladder.active button {
  background-color: #fff1ec;
}
.tool-box li.seating .ico {
  background-image: url("../images/tool/seating-color.svg");
}
.tool-box li.seating:hover button {
  background-color: #ebeffa;
}
.tool-box li.seating.active button {
  background-color: #ebeffa;
}
.tool-box li.sticker.active button {
  border-color: #7e44fb;
}
.tool-box li.sticker.active button .ico {
  margin-top: 10px;
}
.tool-box li.timer.active button {
  border-color: #207af0;
}
.tool-box li.timer.active button .ico {
  margin-top: 10px;
}
.tool-box li.alarm.active button {
  border-color: #db2222;
}
.tool-box li.alarm.active button .ico {
  margin-top: 10px;
}
.tool-box li.stopwatch.active button {
  border-color: #21ae6b;
}
.tool-box li.stopwatch.active button .ico {
  margin-top: 10px;
}
.tool-box li.bell.active button {
  border-color: #ffca0e;
}
.tool-box li.bell.active button .ico {
  margin-top: 10px;
}
.tool-box li.drawing.active button {
  border-color: #986041;
}
.tool-box li.drawing.active button .ico {
  margin-top: 10px;
}
.tool-box li.mix.active button {
  border-color: #007a47;
}
.tool-box li.mix.active button .ico {
  margin-top: 10px;
}
.tool-box li.roulette.active button {
  border-color: #7e44fb;
}
.tool-box li.roulette.active button .ico {
  margin-top: 10px;
}
.tool-box li.ladder.active button {
  border-color: #fa6e42;
}
.tool-box li.ladder.active button .ico {
  margin-top: 10px;
}
.tool-box li.seating.active button {
  border-color: #3661d1;
}
.tool-box li.seating.active button .ico {
  margin-top: 10px;
}
.tool-box li.sticker,
.tool-box li.stopwatch,
.tool-box li.bell {
  padding-right: 31px;
}
.tool-box li.sticker::after,
.tool-box li.stopwatch::after,
.tool-box li.bell::after {
  content: "";
  position: absolute;
  width: 1px;
  height: 68px;
  background-color: #d9d9d9;
  right: 0;
  top: 0;
}
.tool-box li.timer,
.tool-box li.drawing,
.tool-box li.bell {
  margin-left: 15px;
}
@media (max-width: 1199px) {
  .tool-box li {
    padding: 0 8px;
  }
  .tool-box li.sticker,
  .tool-box li.stopwatch,
  .tool-box li.bell {
    padding-right: 8px;
  }
  .tool-box li.sticker::after,
  .tool-box li.stopwatch::after,
  .tool-box li.bell::after {
    content: "";
    position: absolute;
    width: 1px;
    height: 68px;
    background-color: #d9d9d9;
    right: 0;
    top: 0;
  }
  .tool-box li.timer,
  .tool-box li.drawing,
  .tool-box li.bell {
    margin-left: 0;
  }
}
.tool-box button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  position: relative;
  flex-wrap: wrap;
  width: 68px;
  height: 68px;
  border-radius: 20px;
  line-height: 23px;
  background-color: #f6f6f6;
  opacity: 0.5;
}
.tool-box button:hover {
  opacity: 1;
  height: auto;
  background-position: center top 10px;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}
.tool-box button:hover span {
  display: inline-block;
}
.tool-box button:hover span.text {
  display: block;
}

.sticker--box {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  flex-wrap: wrap;
  gap: 12px;
  padding: 40px;
  height: 710px;
}
.tool-box + .sticker--box {
  margin-top: 24px;
}

.sticker--box .list--box {
  width: 218px;
}
@media (max-width: 1199px) {
  .sticker--box .list--box {
    width: 27%;
  }
}
.sticker--box .list--box .list__thead {
  justify-content: space-between;
}
.sticker--box .list--box .list__thead .sticker-type__count {
  color: rgba(0, 0, 0, 0.5);
  font-size: 16px;
  line-height: 18px;
}
.sticker--box.is--student {
  flex-wrap: nowrap;
  height: auto;
  padding: 84px 0 50px;
}
.sticker-slider {
  width: 100%;
  padding: 0 26px 82px;
  text-align: center;
}
@media (max-width: 1199px) {
  .sticker-slider {
    padding: 0 11px 82px;
  }
}
.sticker-slider__control {
  position: relative;
  display: inline-block;
  width: 786px;
  margin-bottom: 68px;
}
.sticker-slider__control button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  background: #ffffff;
  box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.21);
  border-radius: 100%;
}
.sticker-slider__control button [class^="ico-"] {
  vertical-align: middle;
}
.sticker-slider__control button:disabled {
  opacity: 0.5;
  box-shadow: none;
}
.sticker-slider__control button.btn-prev {
  left: 0;
}
.sticker-slider__control button.btn-next {
  right: 0;
}
.sticker-slider__control button.btn-next [class^="ico-"] {
  transform: rotate(180deg);
}
.sticker-slider__control strong {
  font-weight: 800;
  font-size: 48px;
  line-height: 54px;
  color: #7e44fb;
}
.sticker-slider__control p {
  font-size: 20px;
  line-height: 32px;
  margin-top: 18px;
}
.sticker-slider__wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;
}
.sticker-box {
  position: relative;
  width: 588px;
}
@media (max-width: 1199px) {
  .sticker-box {
    width: calc(46% - 24px);
  }
}
.sticker-box .list--box {
  width: 100%;
}
.sticker-box .list--box:not(.is--option) .list__tbody {
  padding-bottom: 32px;
}
.sticker-box .list--box.is--option {
  position: absolute;
  bottom: 0;
  left: 0;
  border-color: #7e44fb;
  overflow: visible;
}
.sticker-box .list--box.is--option .list__thead {
  background: #f2ecff;
  height: 32px;
  justify-content: center;
  border-width: 0;
  border-radius: 7px;
  cursor: pointer;
}
.sticker-box .list--box.is--option .list__thead strong {
  line-height: 16px;
  color: #7e44fb;
}
.sticker-box .list--box.is--option .list__thead .handle {
  position: absolute;
  top: -20px;
  width: 64px;
  height: 20px;
  text-align: center;
  border: 1px solid #7e44fb;
  background: #f2ecff;
  border-bottom-width: 0;
  border-radius: 8px 8px 0 0;
}
.sticker-box .list--box.is--option .list__thead .handle span {
  margin-top: -2px;
  transform: rotate(180deg);
}
.sticker-box .list--box.is--option .list__tbody {
  height: 0;
}
.sticker-box .list--box.is--option .list__li li:hover {
  background-color: rgba(126, 68, 251, 0.04);
}
.sticker-box .list--box.is--option .list__button {
  display: none;
}
.sticker-box .list--box.is--option.open .list__thead {
  border-radius: 7px 7px 0 0;
  border-color: #7e44fb;
  border-width: 1px;
}
.sticker-box .list--box.is--option.open .handle span {
  transform: rotate(0deg);
}
.sticker-box .list--box.is--option.open .list__tbody {
  height: 455px;
}
.sticker-box .list--box.is--option.open .list__button {
  display: flex;
}
.sticker-box .input--box {
  gap: 14px;
  min-height: 65px;
}
.sticker-box .input--text {
  font-weight: 700;
}
.sticker-box .input--stext {
  font-size: 16px;
  line-height: 18px;
  padding-right: 24px;
  color: #000000;
}
.sticker-box .list__li li {
  min-height: 65px;
}
.sticker-box .list__li li.empty {
  height: auto;
  border-bottom-width: 0;
}
.sticker-box .list__li li.empty:hover {
  background-color: transparent;
}
.sticker-box .list__li li.empty .box--empty {
  width: 100%;
}
.sticker-box .list__li li.empty .box--empty-icon {
  display: none;
}
.sticker-box .vary--option {
  margin-right: 23px;
}
.sticker-box .ico {
  display: inline-block;
  width: 46px;
  height: 46px;
  flex-shrink: 0;
  background-size: 100%;
}
.sticker-have__list {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}
@media (max-width: 1199px) {
  .sticker-have__list {
    width: 842px;
  }
}
.sticker-have__list li {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100px;
}
.sticker-have__list .ico {
  display: inline-block;
  vertical-align: middle;
  width: 100px;
  height: 100px;
  flex-shrink: 0;
  background-size: 100%;
  font-size: 0;
}
.sticker-have__list .ico.empty {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 64px;
  height: 64px;
  background: #ffffff;
  border-radius: 100%;
  font-weight: 700;
  font-size: 16px;
  line-height: 18px;
}
.sticker-type--box {
  width: 744px;
  background-color: #ffffff;
  border-radius: 20px;
  padding: 24px 24px 0;
}
@media (max-width: 1199px) {
  .sticker-type--box {
    width: 100%;
  }
}
.sticker-type--box .list--box {
  width: 100%;
  border-width: 0;
}
.sticker-type--box .list--box .input--box {
  padding-left: 26px;
  gap: 21px;
  min-height: 72px;
}
.sticker-type--box .list--box .input--text {
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
}
.sticker-type--box .list__thead {
  background-color: #f4f4f4;
  border-radius: 10px;
  border-bottom-width: 0;
  justify-content: space-between;
  padding: 0 20px;
}
.sticker-type--box .list__thead strong {
  font-weight: 400;
}
.sticker-type--box .list__thead .sticker-type__number {
  font-weight: 400;
  padding-right: 28px;
}
.sticker-type--box .list__tbody {
  height: 359px;
}
.sticker-type--box .list__tbody .list__li {
  position: relative;
}
.sticker-type--box .list__tbody .list__li::after,
.sticker-type--box .list__tbody .list__li::before {
  content: "";
  position: absolute;
  top: 0;
  width: 12px;
  height: 100%;
  background-color: #ffffff;
}
.sticker-type--box .list__tbody .list__li::after {
  right: 0;
}
.sticker-type--box .list__tbody .list__li li {
  min-height: 72px;
  border-bottom-color: rgba(0, 0, 0, 0.16);
}
.sticker-type--box .list__tbody .list__li li:hover {
  background-color: #ffffff;
}
.sticker-type--box .list__tbody .list__li li.empty {
  height: auto;
  border-bottom-width: 0;
}
.sticker-type--box .list__tbody .list__li li.empty:hover {
  background-color: transparent;
}
.sticker-type--box .list__tbody .list__li li.empty .box--empty {
  width: 100%;
  min-height: 359px;
}
.sticker-type--box .list__tbody .list__li li.empty .box--empty-icon {
  display: none;
}
.sticker-type--box .list__tbody .ico {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  background-size: 100%;
  border-radius: 100%;
  font-size: 0;
}
.sticker-type__number {
  flex-shrink: 0;
  font-weight: 800;
  font-size: 16px;
  line-height: 18px;
  padding-right: 50px;
}
.sticker-class--wrap {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  gap: 8px;
}
.sticker-class--box {
  position: relative;
  width: 374px;
  flex-shrink: 0;
}
@media (max-width: 1199px) {
  .sticker-class--box {
    width: 300px;
  }
}
.sticker-class--box:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: -80px;
  height: 360px;
  background: linear-gradient(
    270deg,
    #edf1fc 32.18%,
    rgba(237, 241, 252, 0) 87.36%
  );
  width: 80px;
  transform: rotate(90deg);
  transform-origin: 100% 100%;
  z-index: 2;
}
@media (max-width: 1199px) {
  .sticker-class--box:after {
    height: 286px;
  }
}
.sticker-class--box ul {
  position: relative;
  overflow-y: auto;
  overflow: overlay;
  height: 434px;
  z-index: 1;
}
.sticker-class--box li + li {
  margin-top: 24px;
}
.sticker-class--box label {
  display: block;
  width: calc(100% - 14px);
  height: 67px;
}
.sticker-class--box label .input--box .input--text {
  font-size: 20px;
  line-height: 23px;
}
.sticker-class--box .input-radio {
  margin: 0;
}
.sticker-class--box .input--box {
  width: 100%;
  height: 100%;
  align-items: center;
  background: rgba(126, 68, 251, 0.1);
  border-radius: 16px;
  gap: 16px;
}
.sticker-class--box .input--box::before {
  display: none;
}
.sticker-class--box .input--number {
  font-size: 24px;
  line-height: 27px;
}
.sticker-class--box input:checked + .input--box {
  background: #7e44fb;
}
.sticker-class--box input:checked + .input--box .input--text {
  font-weight: 700;
  color: #ffffff;
}
.sticker-class--box input:checked + .input--box .input--number {
  font-weight: 800;
  color: #ffffff;
}

.participate__empty {
  height: 618px;
  padding-bottom: 40px;
  margin-top: 24px;
}
.participate__empty .box--empty {
  min-height: 534px;
  padding-top: 37px;
}
.tab--contents > .participate__empty {
  height: 563px;
}
.tab--contents > .participate__empty .box--empty {
  min-height: 483px;
}

.vary--option__control {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.vary--option__control [class^="btn-"] {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 100%;
  background-color: #ffffff;
}
.vary--option__control [class^="btn-"]:disabled {
  opacity: 0.3;
}
.vary--option__control input[type="text"] {
  width: 42px;
  text-align: center;
  background-color: transparent;
  font-size: 16px;
  line-height: 18px;
}

.sticker-1 {
  background-image: url("../images/tool/sticker-1.png");
}

.sticker-2 {
  background-image: url("../images/tool/sticker-2.png");
}

.sticker-3 {
  background-image: url("../images/tool/sticker-3.png");
}

.sticker-4 {
  background-image: url("../images/tool/sticker-4.png");
}

.sticker-5 {
  background-image: url("../images/tool/sticker-5.png");
}

.sticker-6 {
  background-image: url("../images/tool/sticker-6.png");
}

.sticker-7 {
  background-image: url("../images/tool/sticker-7.png");
}

.sticker-8 {
  background-image: url("../images/tool/sticker-8.png");
}

.sticker-9 {
  background-image: url("../images/tool/sticker-9.png");
}

.sticker-10 {
  background-image: url("../images/tool/sticker-10.png");
}

.sticker-11 {
  background-image: url("../images/tool/sticker-11.png");
}

.sticker-12 {
  background-image: url("../images/tool/sticker-12.png");
}

.managetool--mix-animation {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 998;
}

.roulette--box {
  position: relative;
  margin-top: 24px;
  min-height: 734px;
  padding: 78px 28px 40px;
}
.roulette--box:first-child {
  margin-top: 64px;
}
.tool-box + .roulette--box {
  min-height: 618px;
  padding-top: 40px;
}
.tool-box + .roulette--box .game--option {
  margin-top: 67px;
  margin-bottom: 89px;
}
.roulette--win {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.roulette--win__text {
  width: 360px;
  height: 67px;
  padding: 18px;
  border-radius: 16px;
  background-color: rgba(126, 68, 251, 0.1);
  font-weight: 800;
  font-size: 28px;
  line-height: 32px;
  text-align: center;
  color: #7e44fb;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.roulette--wheel {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.roulette--wheel__wrap {
  position: relative;
  width: 416px;
  height: 416px;
  border: 12px solid #1f107e;
  border-radius: 100%;
  box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.3);
}
.roulette--wheel__wrap.option-02 .roulette--wheel__box {
  transform: rotate(-225deg);
}
.roulette--wheel__wrap.option-02 .roulette--wheel__texts {
  transform: rotate(90deg);
}
.roulette--wheel__wrap.option-02 .roulette--wheel__text {
  position: relative;
  width: 100%;
}
.roulette--wheel__wrap.option-02 .roulette--wheel__text p {
  height: auto;
}
.roulette--wheel__wrap.option-02 .roulette--wheel__item {
  clip-path: polygon(100% 0%, 50% 50%, 0% 100%, 0% 0%);
}
.roulette--wheel__wrap.option-02 .roulette--wheel__item:nth-child(2) {
  transform: rotate(180deg);
}
.roulette--wheel__wrap.option-02 .roulette--wheel__item::before {
  transform: rotate(225deg);
}
.roulette--wheel__wrap.option-03 .roulette--wheel__box {
  transform: rotate(-225deg);
}
.roulette--wheel__wrap.option-03 .roulette--wheel__texts {
  transform: rotate(60deg);
}
.roulette--wheel__wrap.option-03 .roulette--wheel__text {
  position: absolute;
  width: 100%;
}
.roulette--wheel__wrap.option-03 .roulette--wheel__text:nth-child(1) {
  transform: rotate(0deg);
}
.roulette--wheel__wrap.option-03 .roulette--wheel__text:nth-child(2) {
  transform: rotate(120deg);
}
.roulette--wheel__wrap.option-03 .roulette--wheel__text:nth-child(3) {
  transform: rotate(240deg);
}
.roulette--wheel__wrap.option-03 .roulette--wheel__text p {
  margin-top: -120px;
  width: 110px;
}
.roulette--wheel__wrap.option-03 .roulette--wheel__item {
  clip-path: polygon(36.5% 0%, 50% 50%, 0% 100%, 0% 0%);
}
.roulette--wheel__wrap.option-03 .roulette--wheel__item:nth-child(1) {
  transform: rotate(0deg);
}
.roulette--wheel__wrap.option-03 .roulette--wheel__item:nth-child(2) {
  transform: rotate(120deg);
}
.roulette--wheel__wrap.option-03 .roulette--wheel__item:nth-child(3) {
  transform: rotate(240deg);
}
.roulette--wheel__wrap.option-03 .roulette--wheel__item:nth-child(4) {
  transform: rotate(360deg);
}
.roulette--wheel__wrap.option-03 .roulette--wheel__item::before {
  transform: rotate(225deg);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__box {
  transform: rotate(-225deg);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__texts {
  transform: rotate(45deg);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__text {
  position: absolute;
  width: 100%;
}
.roulette--wheel__wrap.option-04 .roulette--wheel__text:nth-child(1) {
  transform: rotate(0deg);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__text:nth-child(2) {
  transform: rotate(90deg);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__text:nth-child(3) {
  transform: rotate(180deg);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__text:nth-child(4) {
  transform: rotate(270deg);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__text p {
  margin-top: -120px;
  width: 110px;
}
.roulette--wheel__wrap.option-04 .roulette--wheel__item {
  clip-path: polygon(0% 0%, 50% 50%, 0% 100%, 0% 0%);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__item:nth-child(1) {
  transform: rotate(0deg);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__item:nth-child(2) {
  transform: rotate(90deg);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__item:nth-child(3) {
  transform: rotate(180deg);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__item:nth-child(4) {
  transform: rotate(270deg);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__item:nth-child(5) {
  transform: rotate(360deg);
}
.roulette--wheel__wrap.option-04 .roulette--wheel__item::before {
  transform: rotate(225deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__box {
  transform: rotate(-225deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__texts {
  transform: rotate(36deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__text {
  position: absolute;
  width: 100%;
}
.roulette--wheel__wrap.option-05 .roulette--wheel__text:nth-child(1) {
  transform: rotate(0deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__text:nth-child(2) {
  transform: rotate(72deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__text:nth-child(3) {
  transform: rotate(144deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__text:nth-child(4) {
  transform: rotate(216deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__text:nth-child(5) {
  transform: rotate(288deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__text p {
  margin-top: -120px;
  width: 110px;
}
.roulette--wheel__wrap.option-05 .roulette--wheel__item {
  clip-path: polygon(0% 24.5%, 50% 50%, 0% 100%, 0% 0%);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__item:nth-child(1) {
  transform: rotate(0deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__item:nth-child(2) {
  transform: rotate(72deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__item:nth-child(3) {
  transform: rotate(144deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__item:nth-child(4) {
  transform: rotate(216deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__item:nth-child(5) {
  transform: rotate(288deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__item:nth-child(6) {
  transform: rotate(360deg);
}
.roulette--wheel__wrap.option-05 .roulette--wheel__item::before {
  transform: rotate(225deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__box {
  transform: rotate(-226.2deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__texts {
  transform: rotate(28.5deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__text {
  position: absolute;
  width: 100%;
}
.roulette--wheel__wrap.option-06 .roulette--wheel__text:nth-child(1) {
  transform: rotate(0deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__text:nth-child(2) {
  transform: rotate(60deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__text:nth-child(3) {
  transform: rotate(120deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__text:nth-child(4) {
  transform: rotate(180deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__text:nth-child(5) {
  transform: rotate(240deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__text:nth-child(6) {
  transform: rotate(300deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__text p {
  margin-top: -120px;
  width: 110px;
}
.roulette--wheel__wrap.option-06 .roulette--wheel__item {
  clip-path: polygon(0% 35.5%, 50% 50%, 0% 100%, 0% 0%);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__item:nth-child(1) {
  transform: rotate(0deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__item:nth-child(2) {
  transform: rotate(60deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__item:nth-child(3) {
  transform: rotate(120deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__item:nth-child(4) {
  transform: rotate(180deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__item:nth-child(5) {
  transform: rotate(240deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__item:nth-child(6) {
  transform: rotate(300deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__item:nth-child(7) {
  transform: rotate(360deg);
}
.roulette--wheel__wrap.option-06 .roulette--wheel__item::before {
  transform: rotate(225deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__box {
  transform: rotate(-225.8deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__texts {
  transform: rotate(23.5deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__text {
  position: absolute;
  width: 100%;
}
.roulette--wheel__wrap.option-07 .roulette--wheel__text:nth-child(1) {
  transform: rotate(0deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__text:nth-child(2) {
  transform: rotate(51deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__text:nth-child(3) {
  transform: rotate(102deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__text:nth-child(4) {
  transform: rotate(153deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__text:nth-child(5) {
  transform: rotate(204deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__text:nth-child(6) {
  transform: rotate(255deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__text:nth-child(7) {
  transform: rotate(306deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__text p {
  margin-top: -120px;
  width: 110px;
}
.roulette--wheel__wrap.option-07 .roulette--wheel__item {
  clip-path: polygon(0% 41.5%, 50% 50%, 0% 100%, 0% 0%);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__item:nth-child(1) {
  transform: rotate(0deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__item:nth-child(2) {
  transform: rotate(51deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__item:nth-child(3) {
  transform: rotate(102deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__item:nth-child(4) {
  transform: rotate(153deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__item:nth-child(5) {
  transform: rotate(204deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__item:nth-child(6) {
  transform: rotate(255deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__item:nth-child(7) {
  transform: rotate(306deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__item:nth-child(8) {
  transform: rotate(357deg);
}
.roulette--wheel__wrap.option-07 .roulette--wheel__item::before {
  transform: rotate(225deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__box {
  transform: rotate(-270deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__texts {
  transform: rotate(22deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__text {
  position: absolute;
  width: 100%;
}
.roulette--wheel__wrap.option-08 .roulette--wheel__text:nth-child(1) {
  transform: rotate(0deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__text:nth-child(2) {
  transform: rotate(45deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__text:nth-child(3) {
  transform: rotate(90deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__text:nth-child(4) {
  transform: rotate(135deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__text:nth-child(5) {
  transform: rotate(180deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__text:nth-child(6) {
  transform: rotate(225deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__text:nth-child(7) {
  transform: rotate(270deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__text:nth-child(8) {
  transform: rotate(315deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__text p {
  margin-top: -120px;
  width: 90px;
}
.roulette--wheel__wrap.option-08 .roulette--wheel__item {
  clip-path: polygon(0% 0%, 50% 50%, 0% 50%, 0% 0%);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__item:nth-child(1) {
  transform: rotate(0deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__item:nth-child(2) {
  transform: rotate(45deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__item:nth-child(3) {
  transform: rotate(90deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__item:nth-child(4) {
  transform: rotate(135deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__item:nth-child(5) {
  transform: rotate(180deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__item:nth-child(6) {
  transform: rotate(225deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__item:nth-child(7) {
  transform: rotate(270deg);
}
.roulette--wheel__wrap.option-08 .roulette--wheel__item:nth-child(8) {
  transform: rotate(315deg);
}
.roulette--wheel__box {
  position: relative;
  width: 392px;
  height: 392px;
  overflow: hidden;
  border-radius: 100%;
}
.roulette--wheel__box div:nth-child(1n) {
  background-color: rgba(174, 33, 224, 0.2);
}
.roulette--wheel__box div:nth-child(2n) {
  background-color: #ffffff;
}
.roulette--wheel__box div:nth-child(3n) {
  background-color: rgba(88, 144, 255, 0.3);
}
.roulette--wheel__box div:nth-child(4n) {
  background-color: #ffffff;
}
.roulette--wheel__box div:nth-child(5n) {
  background-color: rgba(86, 191, 147, 0.3);
}
.roulette--wheel__box div:nth-child(6n) {
  background-color: #ffffff;
}
.roulette--wheel__box div:nth-child(7n) {
  background-color: #ffe0cf;
}
.roulette--wheel__box div:nth-child(8n) {
  background-color: #ffffff;
}
.roulette--wheel__item {
  position: absolute;
  width: 392px;
  height: 392px;
  clip-path: polygon(100% 0%, 50% 50%, 0% 100%, 0% 0%);
}
.roulette--wheel__item::before {
  content: "";
  position: absolute;
  left: 50%;
  background-color: #d9d9d9;
  width: 1px;
  height: 100%;
  transform: rotate(90deg);
}
.roulette--wheel .roulette--wheel__texts {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  position: absolute;
  width: 392px;
  height: 392px;
  top: 0;
  left: 0;
}
.roulette--wheel .roulette--wheel__texts p {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  width: 100px;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  color: #000000;
  height: 59px;
  word-break: break-word;
}
.roulette--wheel__base {
  position: absolute;
  width: 416px;
  height: 416px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}
.roulette--wheel__base .pin {
  position: absolute;
  top: -23px;
  left: 50%;
  transform: translateX(-50%);
  width: 44px;
  height: 72px;
  background-image: url("../images/img/roulette-pin-color.svg");
  background-position: 0 0;
}
.roulette--wheel__base .btn-start {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 114px;
  height: 114px;
  color: #ffffff;
  border-radius: 100%;
  font-weight: 800;
  font-size: 18px;
  line-height: 20px;
  border: 12px solid rgba(126, 68, 251, 0.1);
  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
}
.roulette--wheel__base .btn-start p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 90px;
  height: 90px;
  background-color: #7e44fb;
  border-radius: 100%;
}

.people-slider {
  padding: 0 66px;
}
.people-slider .people-list__list {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.people-slider .people-list__list li {
  width: 100px;
}
.people-slider .people-list__list.size-60 li {
  width: 60px;
}
.people-slider__wrap {
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.people-slider__control {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  height: 100px;
  width: 100%;
}
.people-slider__control button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  margin-top: -22px;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 100%;
  font-size: 0;
}
.people-slider__control button[class$="-disabled"] {
  background-color: rgba(0, 0, 0, 0.1);
  opacity: 0.3;
}
.people-slider__control .btn-prev {
  left: 0;
}
.people-slider__control .btn-next {
  right: 0;
  transform: rotate(180deg);
}
.people-slider .people-list__text {
  margin-top: 12px;
  font-size: 18px;
  line-height: 26px;
}
.people-slider.drawing--result {
  margin: 0 248px;
}
.people-slider.drawing--result .people-slider__control button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  margin-top: -12px;
  width: 24px;
  height: 24px;
  border-width: 0;
  border-radius: 100%;
  font-size: 0;
}
.people-slider.drawing--result
  .people-slider__control
  button[class$="-disabled"] {
  background-color: rgba(0, 0, 0, 0.1);
  opacity: 0.3;
}

.manage-clock {
  position: relative;
  height: 618px;
  padding: 40px 48px 36px;
}
@media (max-width: 1199px) {
  .manage-clock {
    padding-top: 20px;
  }
}
.manage-clock__now {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 13px;
  position: absolute;
  top: 20px;
  left: 24px;
}
.manage-clock__now span {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 13px;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.manage-clock__now span:first-child::after {
  display: block;
  width: 1px;
  height: 11px;
  background-color: rgba(0, 0, 0, 0.1);
  content: "";
}
.manage-clock.stopwatch {
  padding-right: 40px;
  padding-left: 40px;
}
@media (max-width: 1199px) {
  .manage-clock.stopwatch {
    padding-top: 40px;
  }
}
.tool-box + .manage-clock {
  margin-top: 24px;
  height: 618px;
}

.clock-timepad {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 10;
  gap: 12px;
}
.clock-timepad--number {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.clock-timepad--number--item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 50%;
  gap: 18px;
}
.clock-timepad--divider {
  color: rgba(0, 0, 0, 0.3);
  font-size: 72px;
  font-weight: 300;
}
.clock-timepad--noon {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.clock-timepad--noon > button,
.clock-timepad--noon > a {
  margin-right: 28px;
}
.clock-timepad--ms {
  margin-right: -10px;
  margin-bottom: 30px;
  margin-left: -10px;
  color: rgba(0, 0, 0, 0.4);
  font-size: 30px;
  font-weight: 700;
  line-height: 34px;
}

.timepad-number--text {
  font-size: 72px;
  font-weight: 800;
}
.timepad-number--text:is(input) {
  width: 90px;
}
.timepad-number--button {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 28px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px;
}
.timepad-number--button.is--up {
  transform: rotate(180deg);
}
.timepad-noon--button {
  width: 90px;
  height: 64px;
  border-radius: 14px;
  color: rgba(0, 0, 0, 0.3);
  font-size: 32px;
  font-weight: 700;
  text-align: center;
  line-height: 64px;
}
.timepad-noon--button.active {
  background: #f5f0ff;
  color: #7e44fb;
}
.timepad-noon--button:not(:first-child) {
  margin-top: 8px;
}
.timepad-noon--text {
  font-size: 32px;
  font-weight: 700;
}

.clock-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 538px;
  margin-bottom: -40px;
}
@media (max-width: 1199px) {
  .clock-body {
    height: 578px;
    margin-bottom: -60px;
  }
}
.clock-body--circle {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 476px;
  height: 476px;
  margin: 0 auto;
  border: 8px solid rgba(0, 0, 0, 0.08);
  border-radius: 476px;
}
.clock-body--time {
  margin-top: 24px;
}
@media (max-width: 1199px) {
  .clock-body--time {
    max-width: 400px;
  }
}
.clock-body .clock-active {
  position: absolute;
  width: 484px;
  height: 484px;
  top: -12px;
  left: -12px;
  z-index: 1;
}
.clock-body .clock-active--inner {
  width: 484px;
  height: 484px;
  transform: rotate(-90deg);
}
.clock-body .clock-active--inner #clockActiveProgress {
  fill: transparent;
  stroke: #7e44fb;
  stroke-width: 16px;
  stroke-dasharray: 1520.530528px;
  stroke-linecap: round;
}
.clock-body .clock-noti {
  position: relative;
  margin-bottom: 23px;
  font-size: 24px;
  font-weight: 700;
  z-index: 10;
}
.clock-body .clock-noti span {
  position: relative;
  color: #7e44fb;
}
.clock-body .clock-noti span::after {
  position: absolute;
  height: 22px;
  bottom: -5px;
  right: -4px;
  left: -4px;
  background-color: rgba(187, 80, 255, 0.14);
  border-radius: 22px;
  z-index: 0;
  content: "";
}
.clock-body .clock-noti span strong {
  position: relative;
  z-index: 5;
}
.clock-body .clock-noti.end {
  font-size: 34px;
}
.clock-body .clock-noti.end span::after {
  bottom: 1px;
}
.clock-body .button-main {
  min-width: 0;
}
.clock-body.alarm-body {
  justify-content: flex-start;
  margin-top: 24px;
  margin-bottom: -64px;
}
@media (max-width: 1199px) {
  .clock-body.alarm-body {
    height: 558px;
  }
}
.clock-body.alarm-body .clock-body--circle {
  flex-direction: column;
}

@media (max-width: 1199px) {
  .box--edit .box-grid.clock-body--time {
    row-gap: 8px;
  }
}

.stopwatch-body > div {
  height: 498px;
}
.stopwatch-body > .clock-timepad {
  gap: 42px;
  padding-top: 16px;
}
.stopwatch-body > .clock-timepad .timepad-number--text,
.stopwatch-body > .clock-timepad .clock-timepad--divider {
  font-size: 120px;
}
@media (max-width: 1199px) {
  .stopwatch-body > .clock-timepad {
    padding-top: 0;
  }
}
.stopwatch-body.start {
  display: flex;
  flex-direction: row;
  gap: 40px;
}
@media (max-width: 1199px) {
  .stopwatch-body.start {
    gap: 20px;
  }
}
.stopwatch-body.start .clock-timepad {
  flex-shrink: 0;
  flex-grow: 0;
  width: 592px;
  height: 454px;
  gap: 24px;
  background-color: #fafafa;
  border-radius: 30px;
}
@media (max-width: 1199px) {
  .stopwatch-body.start .clock-timepad {
    width: 522px;
  }
}
.stopwatch-body.start .clock-timepad .timepad-number--text,
.stopwatch-body.start .clock-timepad .clock-timepad--divider {
  font-size: 84px;
}
.stopwatch-body.start .stopwatch-record {
  flex-shrink: 1;
  flex-grow: 1;
}
.stopwatch-body.start .stopwatch-record--item {
  display: flex;
  flex-direction: row;
  justify-content: stretch;
  align-items: center;
  position: relative;
  padding: 13px 10px;
  background-color: #fafafa;
  border-radius: 100px;
}
.stopwatch-body.start .stopwatch-record--item:not(:first-child) {
  margin-top: 16px;
}
.stopwatch-body.start .stopwatch-record--item::before {
  position: absolute;
  width: 1px;
  top: 16px;
  left: 50%;
  bottom: 16px;
  background-color: rgba(0, 0, 0, 0.16);
  content: "";
}
.stopwatch-body.start .stopwatch-record--item p {
  width: 50%;
  text-align: center;
}
.stopwatch-body.start .stopwatch-record--item:first-child {
  background-color: #f9f7ff;
}
.stopwatch-body.start .stopwatch-record--item:first-child::before {
  background-color: rgba(126, 68, 251, 0.16);
}
.stopwatch-body.start
  .stopwatch-record--item:first-child
  .stopwatch-record--name,
.stopwatch-body.start
  .stopwatch-record--item:first-child
  .stopwatch-record--time {
  color: #7e44fb;
}
.stopwatch-body.start .stopwatch-record--name {
  font-size: 18px;
  line-height: 20px;
}
.stopwatch-body.start .stopwatch-record--time {
  font-size: 22px;
  font-weight: 700;
  line-height: 25px;
}
.stopwatch-button {
  gap: 16px;
}
.stopwatch-button button,
.stopwatch-button a {
  width: 197px;
}

.seating--box {
  margin-top: 84px;
}
.tool-box + .seating--box {
  margin-top: 24px;
}

.seating--box .tab--contents {
  height: auto;
  min-height: 563px;
}
.seating--box .button-main {
  padding: 0 20px;
}
.seating--button {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 40px;
}
.seating--button.is--set {
  display: flex;
  flex-direction: row;
  justify-content: center;
}
.seating--button.is--edit {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.seating--button .button--center {
  flex-shrink: 1;
  flex-grow: 1;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 16px;
}
.seating--button .button--center button,
.seating--button .button--center a {
  width: 197px;
}
.seating--button .button--center button.is--single,
.seating--button .button--center a.is--single {
  width: 240px;
}
.seating--button .button--right {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 24px;
}
.seating--button .button--right.is--icon {
  gap: 12px;
}
.seating__student {
  position: relative;
  padding-right: 43px;
  padding-left: 43px;
}
.seating__student .swiper-button-prev,
.seating__student .swiper-button-next {
  flex-shrink: 0;
  flex-grow: 0;
  position: absolute;
  width: 32px;
  height: 32px;
  top: 50%;
  margin-top: -16px;
  background-size: contain;
  background-image: url("../images/ico/swiper-next-black.svg");
  background-position: center;
}
.seating__student .swiper-button-prev {
  left: 0;
}
.seating__student .swiper-button-next {
  right: 0;
  transform: rotate(180deg);
}
.seating__student .swiper-button-disabled {
  opacity: 0.3;
}
.seating__student .swiper-slide {
  width: auto;
  background-color: #fafafa;
  border-radius: 8px;
}
.seating__student .swiper-slide.ghost--student {
  opacity: 0 !important;
}
.seating__student .swiper-slide.sortable-chosen {
  background-color: #ffffff;
}
.seating__student .swiper-slide .student-namebox {
  width: 100%;
}
.seating__student .swiper-slide .namebox--remove {
  display: none;
}
.seating__layout {
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: auto;
  height: 454px;
  margin-top: 12px;
  background-color: #fafafa;
  border-radius: 8px;
}
.seating__layout::-webkit-scrollbar-thumb {
  border-color: #fafafa;
}
.seating-old {
  padding: 24px 40px 40px;
}
.seating-old .seating-old__setting {
  display: flex;
  flex-direction: row;
  gap: 24px;
}
.seating-old .seating-old__setting .seating__layout {
  flex-shrink: 1;
  flex-grow: 1;
  justify-content: inherit;
  height: 415px;
  margin-top: 0;
}
.seating-old
  .seating-old__setting
  .seating__layout
  .student-namebox
  .namebox--sortable,
.seating-old
  .seating-old__setting
  .seating__layout
  .student-namebox
  .namebox--remove {
  display: none;
}
.seating-old .seating-old__setting .seating__layout.is--empty {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.seating-old .seating-old__setting .seating__layout.is--empty .student__layout {
  width: 100%;
}
.seating-old .seating-old__setting .seating__layout--title {
  margin-top: 45px;
  margin-bottom: 8px;
}
.seating-old .seating-old__setting .setting__history {
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  overflow-y: auto;
  width: 224px;
  height: 415px;
}
.seating-old .seating-old__setting .setting__history--box {
  position: relative;
  padding: 12px 14px;
  margin-top: 8px;
  background: #f6f6f6;
  border-radius: 8px;
}
.seating-old .seating-old__setting .setting__history--box .date {
  color: #2d2d2d;
  font-size: 14px;
  font-weight: 700;
}
.seating-old .seating-old__setting .setting__history--box .text {
  color: #2d2d2d;
  margin-top: 4px;
  font-size: 14px;
}
.seating-old .seating-old__setting .setting__history--box .delete {
  position: absolute;
  width: 18px;
  height: 18px;
  top: 8px;
  right: 8px;
}
.seating-old .seating-old__setting .setting__history--box .delete p {
  display: block;
}
.seating-old .seating-old__setting .setting__history--box:hover {
  background-color: #f7f3ff;
}
.seating-old .seating-old__setting .setting__history--box:hover .date,
.seating-old .seating-old__setting .setting__history--box:hover .text {
  color: #8e5afb;
}
.seating-old .seating-old__setting .setting__history--empty {
  flex-shrink: 1;
  flex-grow: 1;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top: 8px;
  background-color: #f6f6f6;
  border-radius: 8px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 14px;
  line-height: 20px;
}
.seating-old .seating-old__edit .seating__layout {
  justify-content: inherit;
  height: 462px;
  padding-top: 24px;
  padding-bottom: 24px;
}
.seating-old .seating-old__edit .seating__layout .student__layout {
  flex: 1 1 auto;
}
.seating-old .seating-old__edit .seating__layout--title {
  margin-top: 21px;
  margin-bottom: 8px;
}
.seating-new {
  padding: 24px 48px 40px;
}
.seating-new .seating-new__setting .clock-timepad {
  gap: 20px;
  height: 455px;
  padding-top: 12px;
}
.seating-new .seating-new__setting .clock-timepad .clock-timepad--number {
  flex-direction: column;
  gap: 30px;
}
.seating-new
  .seating-new__setting
  .clock-timepad
  .clock-timepad--number
  .timepad-number--button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  padding-bottom: 1px;
  background-image: none;
  background-color: #ffffff;
}
.seating-new
  .seating-new__setting
  .clock-timepad
  .clock-timepad--number
  .timepad-number--button::after {
  flex-shrink: 0;
  flex-grow: 0;
  display: block;
  width: 28px;
  height: 28px;
  margin-top: 1px;
  background-image: url("../images/ico/down-black.svg");
  content: "";
}
.seating-new
  .seating-new__setting
  .clock-timepad
  .clock-timepad--number
  .timepad-number--button:disabled {
  border-color: rgba(0, 0, 0, 0.1);
}
.seating-new
  .seating-new__setting
  .clock-timepad
  .clock-timepad--number
  .timepad-number--button:disabled::after {
  opacity: 0.3;
}
.seating-new
  .seating-new__setting
  .clock-timepad
  .clock-timepad--number
  .timepad-number--text {
  color: #7e44fb;
  font-size: 80px;
}
.seating-new
  .seating-new__setting
  .clock-timepad
  .clock-timepad--number
  .timepad-number--text:is(input) {
  width: 50px;
}
.seating-new .seating-new__setting .clock-timepad .clock-timepad--divider {
  margin-right: 52px;
  color: #000000;
  font-size: 40px;
  font-weight: 400;
}
.seating-new
  .seating-new__setting
  .clock-timepad
  .clock-timepad--divider:last-child {
  margin-right: 0;
}
.seating-new .seating-new__setting .seating--button {
  margin-top: 0;
}
.seating-new .seating-new__edit {
  height: 602px;
}
.seating-new .seating-new__edit .seating__layout {
  justify-content: inherit;
  height: 462px;
  padding-top: 24px;
  padding-bottom: 24px;
}
.seating-new .seating-new__edit .seating__layout .student__layout {
  flex: 1 1 auto;
}

.student-namebox {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: relative;
  gap: 8px;
  min-width: 98px;
  padding: 10px;
  padding-right: 12px;
  border-radius: 8px;
  border-radius: 8px;
  cursor: default;
}
.student-namebox .namebox--sortable {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 5;
}
.student-namebox .namebox--thum {
  flex-shrink: 0;
  flex-grow: 0;
  width: 24px;
  height: 24px;
  background-color: #d7e5d2;
  background-image: url("../images/ico/profile-white.svg");
  background-size: 12px;
  background-position: center;
  border-radius: 24px;
}
.student-namebox .namebox--name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 16px;
  font-weight: 700;
}
.student-namebox .namebox--remove {
  position: absolute;
  width: 18px;
  height: 18px;
  top: 4px;
  right: 4px;
  background-image: url("../images/ico/close-gray.svg");
  background-size: 18px;
  background-position: center;
  z-index: 15;
  opacity: 0.5;
}

.student__layout {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-width: -moz-fit-content;
  min-width: fit-content;
  padding: 0 24px;
}
.student__layout .student-namebox {
  width: 100%;
  height: 100%;
  padding: 0 10px;
}
.student__layout .sortable-chosen {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.25);
}
.student__layout .sortable-chosen .namebox--thum {
  display: none;
}
.student__layout .layout--row {
  font-size: 0;
  white-space: nowrap;
}
.student__layout .layout--row:not(:first-child) {
  margin-top: 12px;
}
.student__layout .layout--row .namebox--thum {
  display: none;
}
.student__layout .layout--row .desk--wrap {
  position: relative;
  vertical-align: top;
  display: inline-block;
  margin-left: 20px;
}
.student__layout .layout--row .desk--wrap:first-child {
  margin-left: 0;
}
.student__layout .layout--row .desk--wrap .layout--desk:not(.active) {
  border-left: 1px solid #d6d6d6;
}
.student__layout
  .layout--row
  .desk--wrap
  .layout--desk:not(.active):last-child {
  border-right: 1px solid #d6d6d6;
}
.student__layout .layout--row .desk--wrap .layout--desk:first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.student__layout .layout--row .desk--wrap .layout--desk:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}
.student__layout .layout--desk {
  position: relative;
  vertical-align: top;
  display: inline-block;
  width: 112px;
  height: 48px;
  background-color: #f6f6f6;
  border-top: 1px solid #d6d6d6;
  border-bottom: 1px solid #d6d6d6;
  z-index: 5;
}
.student__layout .layout--desk > div {
  position: relative;
  width: 100% !important;
  height: 100%;
}
.student__layout .layout--desk.is--teacher {
  margin-top: 20px;
  margin-right: auto;
  margin-left: auto;
  border: 1px solid #d6d6d6;
  border-radius: 6px;
}
.student__layout .layout--desk.is--teacher .namebox--name {
  opacity: 0.3;
}
.student__layout .layout--desk.active {
  position: relative;
  border: 1px solid #7e44fb;
  background-color: rgba(126, 68, 251, 0.2);
  color: #7e44fb;
  z-index: 10;
}
.student__layout .layout--desk.active + .layout--desk,
.student__layout .layout--desk.active + .layout--desk:last-child {
  border-left: 0;
}

.sortable-chosen {
  overflow: visible;
  border-radius: 8px;
  background-color: #ffffff;
}
.sortable-chosen .namebox--thum {
  display: block;
}

.ladder--box {
  position: relative;
  margin-top: 64px;
  min-height: 734px;
  padding: 40px 28px 40px;
}
.tool-box + .ladder--box {
  min-height: 618px;
  margin-top: 24px;
}
.tool-box + .ladder--box .game--option {
  margin-top: 72px;
  margin-bottom: 88px;
}

.ladder__result {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background-color: #f6f6f6;
  border-radius: 8px;
  width: 120px;
  min-height: 42px;
  font-size: 18px;
  line-height: 26px;
}
.ladder__result.win {
  background-color: rgba(126, 68, 251, 0.1);
}
.ladder__result.win input,
.ladder__result.win p {
  color: #7e44fb;
  font-weight: 700;
}
.ladder__result input {
  width: 120px;
  height: 40px;
  background-color: transparent;
  text-align: center;
  font-size: 18px;
  line-height: 26px;
  border-radius: 8px;
  padding: 0 10px;
  color: #000000;
}
.ladder__result input:focus {
  border: 1px solid #7e44fb;
  background-color: #ffffff;
}
.ladder__result p {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  max-width: 120px;
  text-align: center;
  font-size: 16px;
  line-height: 18px;
  padding: 0 4px;
  color: #000000;
  white-space: normal;
}
.ladder-result__title {
  margin-top: 56px;
}
.ladder-result__list {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top: 64px;
  margin-bottom: 115px;
}
.ladder-result__list .ico-arrow {
  margin: 0 16px 0 0px;
}
.ladder-result__list ul {
  gap: 30px 78px;
  width: 654px;
}
@media (max-width: 1199px) {
  .ladder-result__list ul {
    justify-content: center;
  }
}
.ladder-result__list .people-list__text {
  width: 63px;
  text-align: left;
}

.ladder-slider {
  position: relative;
  padding: 0 45px;
  margin-bottom: 66px;
}
.ladder-slider__info {
  position: absolute;
  top: 263px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 30px;
  line-height: 34px;
  color: rgba(0, 0, 0, 0.4);
  white-space: nowrap;
}
@media (max-width: 1199px) {
  .ladder-slider__info {
    font-size: 24px;
  }
}
.ladder-slider__list {
  display: flex;
  flex-direction: row;
  white-space: nowrap;
}
.ladder-slider__list li {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 140px;
  height: 543px;
  text-align: center;
  flex-shrink: 0;
}
.ladder-slider__people {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.ladder-slider__line {
  position: relative;
  margin-top: 22px;
  margin-bottom: 22px;
  height: 270px;
}
.ladder-slider__line .line {
  position: absolute;
  width: 8px;
  height: 270px;
  border-radius: 4px;
  background-color: rgba(182, 182, 182, 0.3);
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.ladder-slider__line .horizontal_line {
  position: absolute;
  width: 132px;
  height: 8px;
  z-index: 3;
  left: 8px;
  background-color: rgba(182, 182, 182, 0.3);
  transform-origin: 0 0;
}
.ladder-slider__line .horizontal_line.active {
  background-color: #7e44fb;
  z-index: 4;
  width: 146px;
  left: 0px;
  border-radius: 4px;
}
.ladder-slider__line .vertical_line {
  left: 0;
  width: 8px;
  position: absolute;
  background-color: #7e44fb;
  z-index: 4;
  border-radius: 8px;
}
.ladder-slider__control {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 258px;
  width: 100%;
}
.ladder-slider__control button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 100%;
  font-size: 0;
}
.ladder-slider__control button[class$="-disabled"] {
  background-color: rgba(0, 0, 0, 0.1);
  opacity: 0.3;
}
.ladder-slider__control .btn-prev {
  left: 0;
}
.ladder-slider__control .btn-next {
  right: 0;
  transform: rotate(180deg);
}

.mixcard--box {
  position: relative;
  margin-top: 86px;
  min-height: 734px;
  padding: 68px 28px 40px;
}
.mixcard--box .is--normal {
  max-width: 800px;
  margin-bottom: 65px;
  margin-right: auto;
  margin-left: auto;
  padding-right: 0;
  padding-left: 0;
}
.mixcard--box .is--card {
  max-width: 800px;
  margin-bottom: 100px;
  margin-right: auto;
  margin-left: auto;
  padding-right: 0;
  padding-left: 0;
}
.mixcard--box__title {
  margin-bottom: 48px;
  font-weight: 400;
}
.mixcard--titlement {
  margin-top: 20px;
  font-size: 30px;
  line-height: 34px;
  text-align: center;
  color: rgba(0, 0, 0, 0.4);
  margin-bottom: 48px;
}
.tool-box + .mixcard--box {
  min-height: 618px;
  margin-bottom: 49px;
  margin-top: 24px;
}

.drawing--box .tab--contents {
  height: auto;
}
.drawing--box .tab--contents > div {
  min-height: 563px;
  padding: 0 28px 40px;
}
.drawing--box .tab--contents > div.drawing__set-member .roulette--box {
  min-height: 0;
  padding: 24px 0 0;
  margin-top: 0;
}
.drawing--box
  .tab--contents
  > div.drawing__set-member
  .roulette--box
  .game--option {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 313px;
  margin-top: 0;
  margin-bottom: 0;
}
.drawing--box
  .tab--contents
  > div.drawing__set-member
  .roulette--box
  .game--option__control
  input[type="text"] {
  line-height: 136px;
}
.drawing--box .tab--contents > div.drawing__start-person {
  overflow: hidden;
  position: relative;
}
.drawing--box .tab--contents > div.drawing__group-drawing {
  position: relative;
  padding-top: 34px;
}
.drawing--box .tab--contents > div.drawing__group-drawing .seating__wrap {
  margin-bottom: 40px;
}
.drawing--box .tab--contents > div.drawing__group-drawing .seating__layout {
  height: auto;
  min-height: 405px;
  margin-top: 0;
}
.drawing--box
  .tab--contents
  > div.drawing__group-drawing
  .seating__layout
  .student__layout {
  padding: 40px;
}
.drawing--box
  .tab--contents
  > div.drawing__group-drawing
  .layout--row:not(:first-child) {
  margin-top: 30px;
}
.drawing--box
  .tab--contents
  > div.drawing__group-drawing
  .layout--desk-group:not(:first-child) {
  margin-left: 40px;
}
.drawing--box .start-person__random.people-list {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  min-height: 480px;
  margin: 0 68px;
  padding: 50px 0;
}
@media (max-width: 1199px) {
  .drawing--box .start-person__random.people-list {
    margin-right: 0;
    margin-left: 0;
  }
}
.drawing--box .start-person__random.people-list .people-list__list {
  overflow-y: auto;
  overflow: overlay;
  min-height: 190px;
  max-height: 379px;
  justify-content: center; /* 240829 수정 */
  align-items: flex-start;
  gap: 70px 50px;
  padding-bottom: 50px;
  width: 100%;
}
.drawing--box .start-person__random.people-list .people-list__list li {
  position: relative;
}
.drawing--box .start-person__random.people-list .people-list__text {
  position: absolute;
}
.drawing--box .game--participate .people-list__list {
  padding-right: 10px;
  padding-left: 10px;
}
.drawing--box.is--student {
  height: 716px;
}
.drawing--box.is--student:first-child {
  margin-top: 84px;
}
.drawing--box.is--student + .is--student {
  margin-top: 30px;
}
.drawing--box.is--student .box--empty {
  height: 714px;
}
.drawing--box.is--student .start-person__random.people-list {
  height: auto;
  padding: 157px 0 88px;
}
.drawing__result {
  padding-top: 87px;
  margin: 0px auto 78px;
  width: 424px;
}
.drawing__result p {
  width: 424px;
  height: 282px;
  background-repeat: no-repeat;
  background-position: 0% 0;
  background-size: 100% auto;
  background-image: url("../images/tool/drawing-result_fail.png");
  font-size: 0;
}
.drawing__result.is--win p {
  background-image: url("../images/tool/drawing-result_win.png");
}

.alert-bell--box {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 734px;
  padding: 80px 0 70px;
  gap: 80px;
}
@media (max-width: 1199px) {
  .alert-bell--box {
    gap: 60px;
  }
}
.tool-box + .alert-bell--box {
  height: 618px;
  margin-top: 24px;
}

.alert-bell--box .bell--box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 32px;
}
.alert-bell--box .bell--image {
  overflow: hidden;
  width: 396px;
  height: 396px;
  background-color: #f6f6f6;
  border-radius: 396px;
}
.alert-bell--box .bell--image.is--image::before {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  content: "";
}
@media (max-width: 1199px) {
  .alert-bell--box .bell--image {
    width: 340px;
    height: 340px;
    border-radius: 340px;
  }
}
.alert-bell--box .bell--image.is--bell.is--image::before {
  background-image: url("../images/img/bell-color.png");
  background-size: 175px auto;
}
.alert-bell--box .bell--image.is--knock.is--image::before {
  background-image: url("../images/img/knock-color.png");
  background-size: 179px auto;
}
.alert-bell--box .bell--text {
  display: inline-block;
  padding: 0px 32px;
  background-color: #7e44fb;
  border-radius: 22px;
  color: #ffffff;
  font-size: 18px;
  font-weight: 700;
  line-height: 40px;
}

.class-info--box {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  min-height: 336px;
  margin-top: 84px;
  background: #ffffff;
  border-radius: 20px;
}
.class-info--thumnail {
  position: relative;
  flex-shrink: 0;
  width: 426px;
  background-size: cover;
  border-radius: 20px 0 0 20px;
}
.class-info--thumnail.empty {
  background: #2c0271;
}
.class-info--thumnail.empty::after {
  position: absolute;
  display: block;
  width: 241px;
  height: 98px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-image: url("../images/img/class-thumb-logo-color.svg");
  content: "";
}
.class-info--contents {
  position: relative;
  width: 100%;
}
.class-info--textbox {
  padding: 31px 34px;
}
.class-info--title .title {
  padding-right: 24px;
  font-weight: 700;
  font-size: 22px;
  line-height: 25px;
  color: #000000;
  min-height: 32px;
}
.class-info--title .title .state-box {
  vertical-align: top;
  margin-top: -3px;
  margin-left: 8px;
}
.class-info--title .sub {
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  color: rgba(0, 0, 0, 0.6);
  margin-top: 11px;
}
.class-info--title .info-title--button {
  position: absolute;
  top: 28px;
  right: 24px;
}
.class-info--title.has--button .title {
  padding-right: 100px;
}
.class-info--data {
  margin-top: 34px;
}
.class-info--data ul {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
}
.class-info--data ul > * {
  flex-shrink: 0;
  flex-grow: 0;
}
@media (max-width: 1199px) {
  .class-info--data ul {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
}
.class-info--data li {
  display: flex;
  flex-direction: row;
  align-items: center;
  font-size: 16px;
  line-height: 18px;
  color: #000000;
  width: 346px;
  min-height: 38px;
}
.class-info--data li:nth-child(2n) {
  width: 274px;
}
.class-info--data li:nth-child(2n) strong {
  width: 85px;
}
@media (max-width: 1199px) {
  .class-info--data li,
  .class-info--data li:nth-child(2n) {
    width: auto;
  }
  .class-info--data li strong,
  .class-info--data li:nth-child(2n) strong {
    width: 100px;
  }
}
.class-info--data strong {
  display: inline-block;
  vertical-align: middle;
  font-weight: 700;
  font-size: 16px;
  line-height: 18px;
  width: 99px;
  flex-shrink: 0;
}
.class-info--data.type--student ul {
  flex-direction: column;
  align-items: start;
}
.class-info--link {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  padding: 18px 34px;
  border-top: 1px solid #d9d9d9;
  gap: 12px;
}
@media (max-width: 1199px) {
  .class-info--link button,
  .class-info--link a {
    height: auto;
    padding-right: 10px;
    padding-left: 10px;
    word-wrap: break-word;
    word-break: keep-all;
  }
  .class-info--link p {
    font-size: 16px;
  }
  .class-info--link p.ico-arrow-next-black {
    margin-left: 4px !important;
  }
}

.class-related--box.tab--wrapper {
  margin-top: 48px;
}
.class-related--box.tab--wrapper .tab--button .state-bbs {
  margin-left: 4px;
}
.class-related--box > .tab--contents {
  background-color: #ffffff;
  padding: 33px 24px;
}
.class-related--box .setting-box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 32px;
}
@media (max-width: 1199px) {
  .class-related--box .setting-box {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
  }
}
.class-related--box .setting-box .divide {
  display: flex;
  flex-direction: row;
  align-items: center;
}
@media (max-width: 1199px) {
  .class-related--box .setting-box .divide--sort {
    flex-shrink: 1;
    flex-grow: 1;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 -10px;
  }
  .class-related--box .setting-box .divide--sort .input-check,
  .class-related--box .setting-box .divide--sort .input-radio {
    margin: 0 10px;
  }
}
.class-related--box .setting-box .divide--date {
  flex-shrink: 0;
  flex-grow: 0;
}
.class-related--box .setting-box .week-filter {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.class-related--box .setting-box .week-filter strong {
  display: inline-block;
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  padding: 0 6px;
  white-space: nowrap;
}
.class-related--box .setting-box .week-filter button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  flex-grow: 0;
  width: 18px;
  height: 18px;
  opacity: 0.83;
  margin-top: -2px;
}
.class-related--box .lesson-item {
  display: flex;
  flex-direction: row;
  border: 1px solid #d9d9d9;
  border-radius: 16px;
}
.class-related--box .lesson-item--info {
  position: relative;
  width: 400px;
  min-height: 348px;
  border-right: 1px solid #d9d9d9;
  background-color: rgba(126, 68, 251, 0.06);
  flex-shrink: 0;
  padding: 32px 34px 30px;
}
.class-related--box .lesson-item--title {
  position: relative;
}
.class-related--box .lesson-item--title strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  padding-right: 20px;
  font-weight: 800;
  font-size: 24px;
  line-height: 27px;
  color: #7e44fb;
}
.class-related--box .lesson-item--title .option-area {
  position: absolute;
  right: -10px;
  top: -5px;
}
.class-related--box .lesson-item--scontent .title-area {
  min-height: 32px;
  margin: 12px 0 13px;
}
.class-related--box .lesson-item--scontent .title-area strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  vertical-align: middle;
  max-width: 90%;
  font-weight: 700;
  font-size: 22px;
  line-height: 25px;
  color: #000000;
  margin-right: 12px;
}
.class-related--box .lesson-item--scontent .date-text {
  font-size: 18px;
  line-height: 20px;
}
.class-related--box .lesson-item--scontent .subject-area {
  margin-top: 40px;
}
.class-related--box .lesson-item--scontent .subject-area em {
  font-size: 14px;
  line-height: 16px;
  font-style: normal;
  color: rgba(0, 0, 0, 0.6);
}
.class-related--box .lesson-item--scontent .subject-area p {
  font-size: 18px;
  line-height: 20px;
  margin-top: 6px;
}
.class-related--box .lesson-item--button {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: absolute;
  bottom: 30px;
  left: 29px;
  right: 29px;
}
.class-related--box .lesson-item--button button {
  padding: 0 10px;
}
.class-related--box .lesson-item--data {
  width: 100%;
}
.class-related--box .tab-studylist {
  margin-bottom: 91px;
}
.class-related--box .tab-studylist .studylist-category {
  padding: 33px 24px 28px;
  background-color: #ffffff;
}
.class-related--box .tab-studylist > .box--empty {
  min-height: 304px;
}
.class-related--box .tab-activity {
  margin-bottom: 91px;
  padding: 0;
  background-color: transparent;
}
.class-related--box .tab-activity .activity-category {
  padding: 33px 24px 28px;
  background-color: #ffffff;
}
.class-related--box .tab-activity .tab-activity-list {
  padding: 0 24px 32px;
  background-color: #ffffff;
  border-radius: 0 0 20px 20px;
}
.class-related--box
  .tab-activity
  .tab-activity-list
  .table--list
  tbody
  tr
  td.empty {
  padding-top: 0;
  padding-bottom: 0;
}
.class-related--box
  .tab-activity
  .tab-activity-list
  .table--list
  tbody
  tr
  td.empty
  .box--empty {
  height: 387px;
  padding-top: 40px;
  min-height: initial;
}
.class-related--box .tab-activity .tab-activity-list + .tab-activity-detail {
  margin-top: 50px;
}
.class-related--box
  .tab-activity
  .tab-activity-list
  + .tab-activity-detail
  .box-bg__white:first-child {
  border-radius: 20px;
}
.class-related--box .tab-activity .tab-activity-detail {
  background-color: transparent;
  padding: 0;
}
.class-related--box .tab-board {
  margin-bottom: 91px;
  background-color: transparent;
  padding: 0;
}
.class-related--box .tab-board .board-category {
  padding: 33px 24px 28px;
  background-color: #ffffff;
}
.class-related--box .tab-board-list {
  background-color: #ffffff;
  padding: 33px 24px;
  border-radius: 0 0 20px 20px;
}
.class-related--box .tab-board-list .table--list tbody tr td.empty {
  padding-top: 0;
  padding-bottom: 0;
}
.class-related--box .tab-board-list .table--list tbody tr td.empty .box--empty {
  height: 387px;
  padding-top: 40px;
  min-height: initial;
}
.class-related--box .tab-board-detail .box--detail {
  background-color: #ffffff;
  padding: 33px 24px;
  margin-top: 0;
  border-radius: 0 0 20px 20px;
}
.class-related--box
  .tab-board-detail
  .box--detail
  .reply--box
  + .pagenavi--box {
  margin-top: 44px;
  margin-bottom: 20px;
}
.class-related--box .tab-board-detail + .page__button {
  margin-top: 56px;
  margin-bottom: 87px;
}
.class-related--box .tab-board-detail + .page__button {
  margin-top: 56px;
  margin-bottom: 87px;
}
.class-related--box .tab-board-detail .page__button {
  padding: 15px 0;
}
.class-related--box .tab-board-detail + .page__button,
.class-related--box .tab-board-detail .box--detail + .page__button {
  margin-top: 56px;
  margin-bottom: 87px;
}
.class-related--box .tab-question {
  margin-bottom: 91px;
}
.class-related--box .tab-question .question-category {
  padding: 33px 24px 28px;
  background-color: #ffffff;
}
.class-related--box .tab-question-list th:nth-child(1),
.class-related--box .tab-question-list td:nth-child(1) {
  width: 84px;
  padding-left: 17px;
}
.class-related--box .tab-question-list th:nth-child(2),
.class-related--box .tab-question-list td:nth-child(2) {
  width: 68px;
}
.class-related--box .tab-question-list th:nth-child(3),
.class-related--box .tab-question-list td:nth-child(3) {
  width: 87px;
}
.class-related--box .tab-question-list th:nth-child(4),
.class-related--box .tab-question-list td:nth-child(4) {
  width: auto;
}
.class-related--box .tab-question-list th:nth-child(5),
.class-related--box .tab-question-list td:nth-child(5) {
  width: 208px;
}
.class-related--box .tab-question-list th:nth-child(6),
.class-related--box .tab-question-list td:nth-child(6) {
  width: 116px;
}
.class-related--box .tab-question-list th:nth-child(7),
.class-related--box .tab-question-list td:nth-child(7) {
  width: 155px;
}
.class-related--box .tab-question-list td.empty {
  padding-top: 0;
  padding-bottom: 0;
}
.class-related--box .tab-question-list td.empty .box--empty {
  height: 387px;
  padding-top: 40px;
  min-height: initial;
}
@media (max-width: 1199px) {
  .class-related--box .tab-question-list th:nth-child(2),
  .class-related--box .tab-question-list td:nth-child(2) {
    width: 58px;
  }
  .class-related--box .tab-question-list th:nth-child(3),
  .class-related--box .tab-question-list td:nth-child(3) {
    width: 77px;
  }
  .class-related--box .tab-question-list th:nth-child(4),
  .class-related--box .tab-question-list td:nth-child(4) {
    width: auto;
  }
  .class-related--box .tab-question-list th:nth-child(5),
  .class-related--box .tab-question-list td:nth-child(5) {
    width: 148px;
  }
  .class-related--box .tab-question-list th:nth-child(6),
  .class-related--box .tab-question-list td:nth-child(6) {
    width: 86px;
  }
  .class-related--box .tab-question-list th:nth-child(7),
  .class-related--box .tab-question-list td:nth-child(7) {
    width: 115px;
  }
}
.class-related--box .tab-question-detail .box--detail {
  margin-top: 0;
}
.class-related--box .tab-question-detail .page__button {
  padding: 48px 0 15px;
}
.class-related--box .tab-attendance {
  margin-bottom: 91px;
}
.class-related--box .tab-attendance .attendance-category {
  padding: 33px 24px 28px;
  background-color: #ffffff;
}
.class-related--box .tab-attendance-list .box--edit-title:first-child {
  margin-top: -9px;
  margin-bottom: 17px;
  color: #000000;
}
.class-related--box .tab-attendance-list .box--search + .lesson---list {
  margin-top: 16px;
}
.class-related--box .tab-attendance-list .table--list tbody tr td.empty {
  padding-top: 0;
  padding-bottom: 0;
}
.class-related--box
  .tab-attendance-list
  .table--list
  tbody
  tr
  td.empty
  .box--empty {
  height: 387px;
  padding-top: 40px;
  min-height: initial;
}
.class-related--box .tab-studentmanage {
  margin-bottom: 91px;
}
.class-related--box .tab-studentmanage .studentmanage-category {
  padding: 33px 24px 28px;
  background-color: #ffffff;
}
.class-related--box .tab-studentmanage .studentmanage-category {
  padding: 28px 0;
}
.class-related--box .tab-studentmanage .table--list tr td.empty {
  padding-top: 0;
  padding-bottom: 0;
}
.class-related--box .tab-studentmanage .table--list tr td.empty .box--empty {
  height: 387px;
  padding-top: 40px;
  min-height: initial;
}
.class-related--box .tab-studentmanage .table--list th br {
  display: none;
}
@media (max-width: 1199px) {
  .class-related--box .tab-studentmanage .table--list th br {
    display: block;
  }
}
.class-related--box .tab-studentmanage .table--list .ico--arrow-right {
  position: relative;
  padding-right: 0;
  padding-left: 11px;
  justify-content: flex-start;
  white-space: nowrap;
}
.class-related--box .tab-studentmanage .table--list .ico--arrow-right::after {
  width: 28px;
  height: 28px;
  background-image: url("../images/ico/next-black.svg");
  background-size: auto 100%;
  content: "";
}
.today-lesson.type--myclass {
  overflow: hidden;
  width: 100%;
  height: 348px;
  border: 1px solid #d9d9d9;
  border-radius: 16px;
}
@media (max-width: 1199px) {
  .today-lesson.type--myclass {
    height: 386px;
  }
}
.today-lesson.type--myclass .today-lesson--info {
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: column;
  position: relative;
  flex-shrink: 0;
  width: 400px;
  height: 100%;
  padding: 32px 34px 30px;
  background-color: rgba(126, 68, 251, 0.06);
  border-right: 1px solid #d9d9d9;
  border-radius: 0;
}
@media (max-width: 1199px) {
  .today-lesson.type--myclass .today-lesson--info {
    width: 314px;
  }
}
.today-lesson.type--myclass .today-lesson--info__title {
  margin-top: 0px;
}
.today-lesson.type--myclass .today-lesson--info__title .tooltip--box-wrap {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding-right: 15px;
}
.today-lesson.type--myclass
  .today-lesson--info__title
  .tooltip--box-wrap
  button {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-left: 3px;
}
.today-lesson.type--myclass .today-lesson--info__title .tooltip--button {
  font-weight: 800;
  font-size: 24px;
  line-height: 27px;
  color: #7e44fb;
}
.today-lesson.type--myclass
  .today-lesson--info__title
  .tooltip--button.type--hover:hover
  + .today-lesson__repeat
  + .tooltip--box {
  display: block;
}
.today-lesson.type--myclass .today-lesson--info__title .tooltip--box-text {
  max-width: 330px;
  white-space: initial;
}
.today-lesson.type--myclass .today-lesson--info__title .title-area {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  margin-top: 12px;
}
.today-lesson.type--myclass .today-lesson--info__title .title-area .text {
  max-width: 90%;
  margin-right: 12px;
}
.today-lesson.type--myclass .today-lesson--info__title .title-area .text span {
  vertical-align: top;
}
.today-lesson.type--myclass .today-lesson--info__title .title-area .text,
.today-lesson.type--myclass .today-lesson--info__title .title-area .text span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  height: 25px;
  color: #000000;
  font-weight: 700;
  font-size: 22px;
  line-height: 25px;
}
.today-lesson.type--myclass
  .today-lesson--info__title
  .title-area
  .text.animate {
  text-overflow: inherit;
  width: 100%;
}
.today-lesson.type--myclass
  .today-lesson--info__title
  .title-area
  .text.animate
  span {
  text-overflow: inherit;
  min-width: 100%;
  max-width: none;
  width: auto;
}
.today-lesson.type--myclass .today-lesson--info__tag {
  position: absolute;
  width: 28px;
  height: 28px;
  right: 19px;
  top: 18px;
}
.today-lesson.type--myclass
  .today-lesson--info__tag
  .info-tag__menu
  .tab-menu--button {
  background-image: url("../images/ico/more-black.svg");
}
.today-lesson.type--myclass .today-lesson--info__date {
  margin-top: 12px;
  font-size: 18px;
  line-height: 20px;
  color: #000000;
}
.today-lesson.type--myclass
  .today-lesson--info__date
  + .today-lesson--info__btns {
  margin: auto -4px 0;
}
.today-lesson.type--myclass .today-lesson--info__bottom {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.today-lesson.type--myclass
  .today-lesson--info__bottom
  .today-lesson--info__subject {
  margin-top: 0;
}
.today-lesson.type--myclass .today-lesson--info__subject {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  height: 88px;
  margin-top: auto;
}
.today-lesson.type--myclass .today-lesson--info__subject em {
  font-size: 14px;
  line-height: 16px;
  font-style: normal;
  color: rgba(0, 0, 0, 0.6);
}
.today-lesson.type--myclass .today-lesson--info__subject p {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  max-height: 66px;
  margin-top: 6px;
  font-size: 18px;
  word-break: break-word;
  line-height: 22px;
}
.today-lesson.type--myclass .today-lesson--info__btns {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin: 30px -4px 0;
}
.today-lesson.type--myclass .today-lesson--info__btns a,
.today-lesson.type--myclass .today-lesson--info__btns button {
  flex-shrink: 1;
  flex-grow: 1;
  width: 50%;
  min-width: 0;
  padding: 0;
}
.today-lesson.type--myclass .today-lesson--data {
  width: 100%;
  margin-left: 0;
}
.today-lesson.type--myclass .today-lesson--data .tab-box {
  padding-right: 115px;
}
.today-lesson.type--myclass .today-lesson--data__btns {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: absolute;
  top: 15px;
  right: 26px;
  gap: 5px;
}
.today-lesson.type--myclass .today-lesson--data__list {
  padding: 0 1px;
}
.today-lesson.type--myclass .today-lesson--data .data-list__box {
  padding: 0 17px;
}
.today-lesson.type--myclass .today-lesson--data .data-list__box li {
  height: 71px;
}
.today-lesson.type--myclass.repeat {
  min-height: 350px;
}
.today-lesson.type--myclass.repeat .today-lesson--info__title .title-area,
.today-lesson.type--myclass.repeat .today-lesson--info__date {
  margin-top: 16px;
}
.today-lesson.type--myclass.noset:not(.planned):not(.end),
.today-lesson.type--myclass.planned:not(.planned):not(.end) {
  min-height: 240px;
  height: 240px;
}
@media (max-width: 1199px) {
  .today-lesson.type--myclass.noset:not(.planned):not(.end),
  .today-lesson.type--myclass.planned:not(.planned):not(.end) {
    height: 261px;
  }
}
.today-lesson.type--myclass.noset .today-lesson--info,
.today-lesson.type--myclass.planned .today-lesson--info {
  background-color: rgba(67, 165, 255, 0.06);
}
.today-lesson.type--myclass.noset .today-lesson--info__title .tooltip--button,
.today-lesson.type--myclass.planned
  .today-lesson--info__title
  .tooltip--button {
  color: #43a5ff;
}
.today-lesson.type--myclass.noset .today-lesson--info__btns .button-main.violet,
.today-lesson.type--myclass.planned
  .today-lesson--info__btns
  .button-main.violet {
  background-color: #43a5ff;
  border-color: #43a5ff;
}
.today-lesson.type--myclass.noset .today-lesson--info__btns .button-main.line,
.today-lesson.type--myclass.planned
  .today-lesson--info__btns
  .button-main.line {
  border-color: #43a5ff;
  color: #43a5ff;
}
.today-lesson.type--myclass.noset .today-lesson--data .nodata,
.today-lesson.type--myclass.planned .today-lesson--data .nodata {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 100%;
  color: rgba(0, 0, 0, 0.5);
  font-size: 16px;
  line-height: 18px;
}
.today-lesson.type--myclass.end:not(.planned):not(.end) {
  min-height: 240px;
}
@media (max-width: 1199px) {
  .today-lesson.type--myclass.end:not(.planned):not(.end) {
    height: 261px;
  }
}
.today-lesson.type--myclass.end .today-lesson--info {
  background-color: rgba(132, 132, 132, 0.06);
}
.today-lesson.type--myclass.end .today-lesson--info__title .tooltip--button {
  color: #848484;
}
.today-lesson.type--myclass.end .today-lesson--info__btns .button-main.violet {
  background-color: #43a5ff;
  border-color: #43a5ff;
}
.today-lesson.type--myclass.end .today-lesson--info__btns .button-main.line {
  border-color: #43a5ff;
  color: #43a5ff;
}
/* .today-lesson.type--myclass.end .today-lesson--info__btns .button-main.gray {
  background-color: rgba(0, 0, 0, 0.5);
  border-color: rgba(0, 0, 0, 0.5);
  opacity: 1;
} */
.today-lesson.type--myclass.end .today-lesson--data .nodata {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 100%;
  color: rgba(0, 0, 0, 0.5);
  font-size: 16px;
  line-height: 18px;
}
.today-lesson.type--myclass + .type--myclass {
  margin-top: 36px;
}
@media (max-width: 1199px) {
  .today-lesson.type--student {
    min-height: 0;
    height: 380px;
  }
}

.state-bbs {
  display: inline-block;
  vertical-align: middle;
  margin-left: 2px;
  width: 20px;
  height: 20px;
  font-weight: 800;
  font-size: 14px;
  text-align: center;
  padding: 3px 0;
  color: #7e44fb;
  border-radius: 100%;
  line-height: 1;
  background-color: rgba(126, 68, 251, 0.1);
}

.option-area {
  position: relative;
}
.option-area .btn-more {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
}
.option-area .option-list {
  position: absolute;
  right: 0;
  display: none;
  background-color: #ffffff;
  border: 1px solid #ddd;
  padding: 10px;
}
.option-area .option-list li {
  padding: 10px;
  white-space: nowrap;
}
.option-area.active .option-list {
  display: block;
}

.open-box {
  position: relative;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 16px;
  background: #f6f6f6;
}
.open-box--thead {
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 58px;
  padding: 16px 24px 16px 24px;
  border-radius: 16px 16px 0 0;
}
.open-box--thead.open + .open-box--contents {
  display: block;
}
.open-box--thead.open .open-box--btn {
  transform: rotate(180deg);
}
.open-box--thead.header {
  background: #fafafa;
  border-radius: 10px;
  height: 46px;
  margin-bottom: 19px;
  margin-top: 24px;
}
.open-box--thead.header .open-box--th {
  font-size: 16px;
}
.open-box--th {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
  font-size: 18px;
  line-height: 20px;
  text-align: center;
}
.open-box--btn {
  position: absolute;
  right: 20px;
  top: 12px;
}
@media (max-width: 1199px) {
  .open-box--btn {
    right: 10px;
  }
}
.open-box--title {
  position: relative;
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  padding-left: 11px;
  color: #341761;
}
.open-box--title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 2px;
  height: 18px;
  background: #341761;
}
.open-box--title.no--bullet {
  padding-left: 0px;
  color: #341761;
}
.open-box--title.no--bullet::before {
  display: none;
}
.open-box--contents {
  overflow: hidden;
  overflow-y: auto;
  padding: 40px 32px 32px;
  border-top: 1px solid #d9d9d9;
  max-height: 400px;
  display: none;
}
.open-box--contents.height-auto {
  max-height: max-content;
  overflow: visible;
}
.open-box--contents.is--texts {
  border-radius: 0 0 16px 16px;
  padding: 20px 32px;
  background-color: #ffffff;
}
.open-box--contents.is--texts .box--edit-items {
  background-color: #ffffff;
}
.open-box--contents.is--texts .box-grid + .box--edit-items {
  margin-top: 8px;
}
.open-box--contents .box-grid {
  gap: 40px;
}
.open-box--contents .box-grid .cell-06 {
  width: calc(50% - 20px);
}
.open-box--contents .box-grid .cell-06.cell-xs-06 {
  width: calc(50% - 20px);
}
.open-box.box .open-box--thead {
  justify-content: space-between;
}
.open-box.box .open-box--contents {
  display: block;
  max-height: inherit;
  overflow: visible;
}
.open-box.box .open-box--contents::-webkit-scrollbar-thumb {
  border-color: #f6f6f6;
}
.open-box.question .open-box--contents::-webkit-scrollbar-thumb {
  border-color: #f6f6f6;
}
.open-box.answer {
  border-color: #d9d9d9;
}
.open-box.answer .open-box--contents {
  background: #ffffff;
  border-radius: 0 0 16px 16px;
}
.open-box + .open-box {
  margin-top: 16px;
}
.open-box + .box--edit-items {
  margin-top: 19px;
}
.open-box .label-title {
  flex-shrink: 0;
  flex-grow: 0;
  display: inline-flex;
  height: 30px;
  background-color: rgba(0, 0, 0, 0.06);
  border-radius: 27px;
  font-weight: 700;
  font-size: 14px;
  line-height: 16px;
  color: rgba(0, 0, 0, 0.5);
  padding: 7px 20px;
}
.open-box .label-num {
  min-width: 70px;
  text-align: right;
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
}
.open-box .label-num em {
  font-style: normal;
}
.open-box .label-ox {
  min-width: 40px;
  text-align: center;
}
.open-box .label-ox em {
  display: inline-flex;
  vertical-align: top;
  width: 34px;
  height: 34px;
  font-size: 0;
}
.open-box .label-ox .is--correct {
  background-image: url("../images/ico/correct-green.svg");
}
.open-box .label-ox .is--incorrect {
  background-image: url("../images/ico/incorrect-red.svg");
}

.question-item--title {
  font-weight: 700;
  font-size: 20px;
  line-height: 23px;
  text-align: center;
  margin-right: 6px;
  word-break: break-word; /* 241023 추가 */
}
.question-item--box {
  margin-top: 38px;
}
.question-item--box + .question-item--feedback {
  margin-top: 32px;
}
.question-item--feedback {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding: 27px 24px 25px;
  background: #f6f6f6;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 16px;
  margin-top: 24px;
}
.question-item--feedback .feedback--title {
  flex-shrink: 0;
  flex-grow: 0;
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  color: #341761;
}
.question-item--feedback .feedback--contents {
  position: relative;
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  padding-left: 19px;
  margin-left: 20px;
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
}
.question-item--feedback .feedback--contents::before {
  content: "";
  position: absolute;
  width: 1px;
  height: 30px;
  left: 0;
  top: -5px;
  background-color: rgba(0, 0, 0, 0.3);
}
.question-item--answer {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding-top: 12px;
}
.question-item--answer .state-box {
  width: 66px;
  height: 30px;
  color: #00ba13;
  background-color: rgba(0, 186, 19, 0.1);
  margin-right: 12px;
}
.question-item--answer strong {
  font-size: 18px;
  line-height: 20px;
}
.question-item--submit {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 25px;
}
.question-item:not(.result) .input-radio .input--text {
  margin-right: 48px;
}
.question-item.survey .input--box {
  z-index: auto;
}
.question-item.survey .input-radio .percent-area {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  overflow: hidden;
}
.question-item.survey .input-radio .percent-bar {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.08);
}
.question-item.survey .input-radio input:checked + .input--box::before {
  width: 20px;
  height: 20px;
  background-image: url("../images/ico/check-thin-violet.svg");
  border: none;
  background-color: transparent;
}
.question-item.survey .input-radio input:checked + .input--box .percent-bar {
  background-color: rgba(126, 68, 251, 0.2);
}
.question-item.survey .people--participate {
  display: none;
}
.question-item.survey.result .percent-area {
  display: block;
}
.question-item.survey.result .input-radio .input--text {
  padding-right: 40px;
}
.question-item.survey.result .input-radio input + .input--box::before {
  display: none;
}
.question-item.survey.result .input-radio:checked + .input--box {
  gap: 9px;
}
.question-item.survey.result .input-radio:checked + .input--box::after {
  overflow: hidden;
  display: none;
  width: 20px;
  height: 20px;
  background-image: url("../images/ico/check-thin-violet.svg");
  background-size: 100% 100%;
  content: "";
}
.question-item.survey.result
  .input-radio:checked
  + .input--box
  .button-action
  button {
  color: #7e44fb;
  opacity: 1;
}
.question-item.survey.result
  .input-radio:checked
  + .input--box
  .button-action
  .ico-profile-black {
  background-image: url("../images/ico/profile-violet.svg");
}
.question-item.survey.result .people--participate {
  display: flex;
  flex-direction: row;
  align-items: center;
  right: 0;
  top: 0;
  width: auto;
  height: 100%;
  z-index: 16;
}
.question-item.survey.result .people--participate .button-action button {
  min-width: 34px;
  height: 34px;
  color: #000000;
  margin-right: 20px;
  margin-left: -4px;
  opacity: 0.4;
}
.question-item.survey.result
  .people--participate
  .button-action
  button
  [class^="ico-"] {
  margin-top: -4px;
  margin-right: 2px;
}
.question-item.survey.result .people--participate .people-list {
  bottom: 38px;
  border-radius: 8px;
  border-color: #d9d9d9;
}
.question-item.survey.result .people--participate .people-list__list {
  max-height: 220px;
  padding: 10px;
}
.question-item .question-item--score {
  display: flex;
  flex-direction: row;
  justify-content: end;
  align-items: center;
  margin-top: 8px;
}
.question-item .question-item--score .input-box--text:not(input) input {
  padding: 14px;
}
.question-item .question-item--score .button-main {
  margin-right: 7px;
}
.question-item .question-item--score .item-score--total {
  margin-left: 8px;
  color: #000000;
  font-size: 18px;
  line-height: 20px;
}
.question-item + .question-item {
  margin-top: 40px;
}
.question-item .input-radio-group.col-02 {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 0;
}
.question-item .input-radio-group.col-02 .input-radio {
  width: calc(50% - 6px);
}
.question-item .input-radio-group.col-02 .input-radio + .input-radio {
  margin-top: 0px;
}
.question-item .input-radio-group.col-02 .input-radio:nth-child(2n) {
  margin-left: 12px;
}
.question-item .input-box--text {
  height: 50px;
}
.question-item .input-box--text:is(input),
.question-item .input-box--text:not(input) input {
  padding: 14px 23px;
  font-size: 18px;
  line-height: 20px;
}
.question-item .input-box--text.no-input {
  padding: 14px 23px;
}
.question-item .input-box--text.no-input.is--tags {
  padding: 13px 23px;
}
.question-item .input-box--text.input-file {
  height: 56px;
}
.question-item .input-box--text.input-file .f-18 {
  margin-top: 5px !important;
}
.question-item .input-box--text .input-box--text {
  border-width: 0;
  height: 100%;
}
.question-item .input-box--text .button--file {
  margin-right: 8px;
}
.question-item .input-box--textarea textarea {
  padding: 14px 23px;
  height: 110px;
  font-size: 18px;
  line-height: 26px;
}
.question-item .input-info-text {
  flex-shrink: 0;
  white-space: nowrap;
  font-size: 18px;
  line-height: 20px;
}
.question-item .input-info-text + .input-box--text {
  margin-left: 12px;
}
.question-item .input-radio {
  width: 100%;
  justify-content: flex-start;
  margin-top: 0;
  margin-bottom: 0;
}
.question-item .input-radio + .input-radio {
  margin-top: 8px;
}
.question-item .input-radio .input--text {
  font-size: 18px;
  line-height: 20px;
  padding-top: 15px;
  padding-bottom: 15px;
}
.question-item .input-radio input:checked + .input--box {
  border-color: #7e44fb;
  background-color: #f2ecff;
}
.question-item
  .input-radio:not(.is--incorrect, .is--correct)
  input:disabled:checked
  + .input--box:before {
  background-image: url("../images/form/radio-color.svg");
}
.question-item
  .input-radio:not(.is--incorrect, .is--correct)
  input:disabled
  + .input--box:before {
  background-image: url("../images/ico/radio-gray.svg");
}
.question-item .input-radio .input--box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  border: 1px solid #d6d6d6;
  border-radius: 8px;
  min-height: 50px;
  padding: 0 23px;
  width: 100%;
  background-color: #ffffff;
}
.question-item .input-radio .input--box::before {
  position: absolute;
  right: 23px;
  top: 50%;
  transform: translateY(-50%);
}
.question-item .input-radio .input--box-box--text {
  padding: 14px 23px;
  font-size: 18px;
  line-height: 20px;
}
.question-item .input-radio.is--incorrect input:checked + .input--box,
.question-item .input-radio.is--incorrect .input--box {
  position: relative;
  border-color: #ff3a3a;
  background: rgba(255, 58, 58, 0.1);
}
.question-item .input-radio.is--correct input:checked + .input--box,
.question-item .input-radio.is--correct .input--box {
  position: relative;
  border-color: #00ba13;
  background: rgba(0, 186, 19, 0.1);
}
.question-item .input-radio.is--correct input:checked + .input--box::before,
.question-item .input-radio.is--correct .input--box::before {
  border-color: #00ba13;
  background-image: url("../images/ico/radio-green.svg");
}

.tab-activity--info {
  padding-bottom: 44px;
  border-bottom: 1px solid #d9d9d9;
  margin-bottom: 24px;
}
.tab-activity--row {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
}
.tab-activity--row + .tab-activity--row {
  margin-top: 15px;
}
.tab-activity--row strong {
  display: block;
  font-weight: 700;
  font-size: 16px;
  line-height: 18px;
  margin: 7px 0;
  /* [이슈리스트 : 230825][2561] 텍스트 간격유지 처리 */
  flex-shrink: 0;
}
.tab-activity--row strong span {
  display: inline-block;
  vertical-align: top;
  font-weight: 400;
  margin-left: 34px;
}
.tab-activity--row .box--detail-file {
  padding: 0;
  border: none;
  margin-top: -2px;
}
.tab-activity--row .box--detail-file .detail-file--item {
  gap: 4px;
}
.tab-activity--row .box--detail-file .file-item--name {
  font-weight: 700;
}
.tab-activity--divide {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.tab-activity--titles {
  display: flex;
  flex-direction: row;
  align-items: center;
  max-width: calc(100% - 30px);
}
.tab-activity--titles .state-box {
  margin: -2px 10px 0 0;
  min-width: 70px;
}
.tab-activity--title {
  display: inline-block;
  font-weight: 800;
  font-size: 24px;
  line-height: 26px;
  word-break: break-word; /* 241023 추가 */
  padding-right: 10px;
}
.tab-activity--stitle {
  font-size: 18px;
  font-weight: 700;
  line-height: 20px;
}
.tab-activity--subinfo {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
}
.tab-activity--date {
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  opacity: 0.6;
}
.tab-activity--counter {
  position: relative;
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  padding-left: 19px;
  margin-left: 18px;
}
.tab-activity--counter::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -6px;
  width: 1px;
  height: 12px;
  background: #000000;
  opacity: 0.3;
}
.tab-activity--subment {
  white-space: nowrap;
  margin: 7px 0;
}
@media (max-width: 1199px) {
  .tab-activity--subment {
    display: block;
  }
}
.tab-activity-detail .tab--wrapper .tab-box {
  background: #ffffff;
  padding: 34px 25px 25px;
}
.tab-activity-detail .box--edit-title {
  margin-top: -10px;
}
.tab-activity-detail .box-bg__white {
  padding: 24px 22px;
}
.tab-activity-detail .box-bg__white .page__button {
  padding: 48px 0 24px;
}
.tab-activity-detail .box-bg__white:first-child {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.tab-activity-detail .box-bg__white + .box-bg__white {
  margin-top: 24px;
}
.tab-activity-detail .box-bg__white + .page__button {
  padding-top: 56px;
}
.tab-activity-detail .question-item input[type="text"]:disabled,
.tab-activity-detail .question-item textarea:disabled {
  border-width: 0;
}

.file-item {
  display: flex;
  flex-direction: row;
  gap: 10px;
  color: #000000;
}
.file-item--icon {
  flex-shrink: 0;
  flex-grow: 0;
}
.file-item--name {
  padding: 3px 0;
  font-size: 16px;
  line-height: 18px;
  text-decoration: underline;
  cursor: pointer;
}
.file-item--sub {
  padding: 3px 0;
  font-size: 16px;
  line-height: 18px;
  margin-left: -7px;
}
.file-item.only {
  width: 100%;
}
.file-item.only .ico-cancel-black {
  cursor: pointer;
}
.file-item.only > :last-child.file-item--icon {
  margin-left: auto;
}
.input-box--text .file-item.only > :last-child {
  margin-right: 8px;
}

.mystudent-area {
  margin-top: 76px;
}
.mystudent-area .mystudent--list .table--list tbody td .tooltip--box {
  width: 400px;
  padding-top: 14px;
  margin-top: -14px;
}
.mystudent-area
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box-wrap:hover
  .tooltip--box {
  display: block;
}
.mystudent-area .mystudent--list .table--list tbody td .tooltip--box-text {
  overflow: hidden;
  overflow-y: auto;
  max-height: 60px;
}
.mystudent--title {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.mystudent--title__right {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}
.mystudent--title__right button,
.mystudent--title__right a {
  font-size: 18px;
  line-height: 20px;
}
.mystudent--title + .mystudent--contents {
  padding: 23px 24px 32px;
  margin-top: 22px;
}
.mystudent--contents .table--setting {
  margin-bottom: 34px;
}
.mystudent--contents .table--setting .setting__right {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.mystudent--contents .table--setting .setting__right .input-box.is--search {
  width: 260px;
}
.mystudent--contents
  .table--setting
  .setting__right
  .input-box.is--search
  input {
  font-size: 16px;
  line-height: 1.4;
}
.mystudent--contents
  .table--setting
  .setting__right
  .input-box.is--search
  input::placeholder {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.35);
}
.mystudent--contents
  .table--setting
  .setting__right
  .input-box.is--search
  input::-moz-placeholder {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.35);
}
.mystudent--contents
  .table--setting
  .setting__right
  .input-box.is--search
  input::-webkit-input-placeholder {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.35);
}
.mystudent--contents .table--setting .setting__right--viewtype {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  gap: 6px;
  padding-left: 19px;
  margin-left: 10px;
}
.mystudent--contents .table--setting .setting__right--viewtype::before {
  position: absolute;
  width: 1px;
  height: 20px;
  top: 50%;
  left: 0;
  margin-top: -10px;
  background-color: rgba(0, 0, 0, 0.1);
  content: "";
}
.mystudent--contents .table--setting .setting__right--viewtype button,
.mystudent--contents .table--setting .setting__right--viewtype a {
  color: transparent;
  font-size: 0;
  opacity: 0.3;
}
.mystudent--contents .table--setting .setting__right--viewtype .active {
  opacity: 1;
}
.mystudent--contents .mystudent--list {
  background-attachment: fixed;
}
.mystudent--contents .mystudent--list .table--list th:nth-child(1),
.mystudent--contents .mystudent--list .table--list td:nth-child(1) {
  vertical-align: middle;
  padding-left: 17px;
}
.mystudent--contents .mystudent--list .table--list th:nth-child(3),
.mystudent--contents .mystudent--list .table--list td:nth-child(3) {
  padding-left: 13px;
}
.mystudent--contents .mystudent--list .table--list th:nth-child(7),
.mystudent--contents .mystudent--list .table--list td:nth-child(7) {
  /* padding-left: 23px; 250530 삭제 */
}
.mystudent--contents .mystudent--list .table--list th:nth-child(12),
.mystudent--contents .mystudent--list .table--list td:nth-child(12) {
  padding-right: 9px;
}
.mystudent--contents .mystudent--list .table--list th .input-check,
.mystudent--contents .mystudent--list .table--list td .input-check {
  vertical-align: top;
}
.mystudent--contents .mystudent--list .table--list th .profile,
.mystudent--contents .mystudent--list .table--list td .profile {
  width: 28px;
  height: 28px;
  border-radius: 28px;
  background-image: url("../images/ico/profile-big-white.svg");
}
.mystudent--contents .mystudent--list .table--list th .tooltip--button,
.mystudent--contents .mystudent--list .table--list td .tooltip--button {
  border-bottom: 1px solid #000000;
}
.mystudent--contents .mystudent--list .table--list th .tooltip--box-text p,
.mystudent--contents .mystudent--list .table--list td .tooltip--box-text p {
  display: block;
  width: 346px;
  word-break: break-all; /* 240829 수정 */
  white-space: normal;
}
.mystudent--contents .mystudent--list .table--list th .name,
.mystudent--contents .mystudent--list .table--list td .name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
  display: inline-block;
  max-width: 100%;
  color: #000000;
  font-weight: 700;
  line-height: 24px;
  background-size: auto 18px;
  background-image: url(../images/ico/arrow-next-black.svg);
  background-repeat: no-repeat;
  padding-right: 18px;
  padding-left: 8px;
  background-position-x: 100%;
  background-position-y: calc(100% - 3px);
  text-align: left;
}
.mystudent--contents .mystudent--list .table--list tr:nth-child(7n-6) .profile {
  background-color: #d1d7e3;
}
.mystudent--contents .mystudent--list .table--list tr:nth-child(7n-5) .profile {
  background-color: #ebdce7;
}
.mystudent--contents .mystudent--list .table--list tr:nth-child(7n-4) .profile {
  background-color: #d7e5d2;
}
.mystudent--contents .mystudent--list .table--list tr:nth-child(7n-3) .profile {
  background-color: #d1d7e3;
}
.mystudent--contents .mystudent--list .table--list tr:nth-child(7n-2) .profile {
  background-color: #ddddfa;
}
.mystudent--contents .mystudent--list .table--list tr:nth-child(7n-1) .profile {
  background-color: #d3e0fa;
}
.mystudent--contents .mystudent--list .table--list tr:nth-child(7n-0) .profile {
  background-color: #d7e5d2;
}
.mystudent--contents .mystudent--list .table--list + .page__button {
  margin-top: 40px;
}
.mystudent--contents .mystudent--card__box {
  display: flex;
  flex-direction: row;
  justify-content: stretch;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 24px;
}
.mystudent--contents .mystudent--card__box .student--card {
  border-color: #b5b5b5;
}
.mystudent--contents .mystudent--card__box + .page__button {
  margin-top: 48px;
  margin-bottom: 16px;
}
.mystudent-detail {
  padding-bottom: 92px;
}
.mystudent-detail > div:not(:first-child) {
  margin-top: 24px;
}
.mystudent-detail__info {
  display: flex;
  flex-direction: row;
  justify-content: stretch;
  align-items: stretch;
  gap: 24px;
  margin-top: 84px;
}
.mystudent-detail__info .detail-info__profile {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  flex-grow: 0;
  width: 264px;
  padding-top: 34px;
  padding-bottom: 35px;
}
.mystudent-detail__info .detail-info__profile .user-profile {
  width: 132px;
  height: 132px;
  border-radius: 132px;
}
.mystudent-detail__info .detail-info__profile .user-name {
  margin-top: 10px;
  color: #000000;
  font-size: 24px;
  font-weight: 700;
  line-height: 27px;
}
.mystudent-detail__info .detail-info__profile .user-name .star {
  color: #ff1c0e;
}
.mystudent-detail__info .detail-info__profile .user-class {
  margin-top: 8px;
  color: rgba(0, 0, 0, 0.8);
  font-size: 16px;
  line-height: 18px;
}
.mystudent-detail__info .detail-info__text {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 0 60px;
}
.mystudent-detail__info .detail-info__text--box {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 30px;
  padding-bottom: 5px;
  font-size: 0;
}
.mystudent-detail__info .detail-info__text p {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  width: calc((100% - 40px) / 2);
}
.mystudent-detail__info .detail-info__text p span {
  flex-shrink: 0;
  flex-grow: 0;
  display: block;
  color: rgba(0, 0, 0, 0.6);
  font-size: 16px;
  line-height: 18px;
}
.mystudent-detail__info .detail-info__text p strong {
  color: #000000;
  font-size: 18px;
  font-weight: 700;
  line-height: 20px;
}
.mystudent-detail__info .detail-info__text p strong.is__button {
  cursor: pointer;
}
.mystudent-detail__info .detail-info__text p strong.is__button i {
  vertical-align: middle;
  margin: -3px 0 0 -4px;
}
.mystudent-detail__info .detail-info__text p .star {
  color: #ff1c0e;
}
.mystudent-detail__info .detail-info__text p:nth-child(1) span,
.mystudent-detail__info .detail-info__text p:nth-child(3) span,
.mystudent-detail__info .detail-info__text p:nth-child(5) span {
  width: 113px;
}
.mystudent-detail__info .detail-info__text p:nth-child(2) span,
.mystudent-detail__info .detail-info__text p:nth-child(4) span,
.mystudent-detail__info .detail-info__text p:nth-child(6) span {
  width: 133px;
}
.mystudent-detail__contacts {
  padding-bottom: 0;
}
.mystudent-detail__contacts .box--edit-title {
  margin-top: 0;
  margin-bottom: 20px;
}
.mystudent-detail__completion .box--edit-title {
  margin-top: 0;
  margin-bottom: 17px;
}
.mystudent-detail__completion .detail-completion {
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch;
  /* width: 21% */
  flex: 1; /* 250530 추가 */
}
.mystudent-detail__completion .detail-completion:first-child,
.mystudent-detail__completion .detail-completion:last-child {
  /* width: 18.5%; 250530 삭제 */
}
.mystudent-detail__completion .detail-completion:not(:first-child)::before {
  display: block;
  width: 1px;
  margin-top: 9px;
  background-color: #d9d9d9;
  content: "";
}
.mystudent-detail__completion .detail-completion--box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch;
  height: 142px;
  padding: 24px 4px; /* 250530 수정 */
  border-radius: 10px;
}
.mystudent-detail__completion .detail-completion .textbox {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  padding-right: 20px; /* 250530 수정 */
  padding-left: 20px; /* 250530 수정 */
}
.mystudent-detail__completion .detail-completion .title {
  display: flex;
  flex-direction: row;
  align-items: flex-start; /* 250530 수정 */
  gap: 8px; /* 250530 수정 */
  color: rgba(0, 0, 0, 0.6);
  font-size: 14px;
  font-weight: 700;
  line-height: 16px;
  margin: 0 -2px;
}
.mystudent-detail__completion .detail-completion .title::before {
  flex-shrink: 0;
  flex-grow: 0;
  display: block;
  width: 11px;
  height: 11px;
  border-width: 3px;
  border-style: solid;
  border-radius: 11px;
  content: "";
  margin-top: 3px; /* 250530 추가 */
}
.mystudent-detail__completion .detail-completion .number {
  color: #000000;
  font-size: 16px;
  text-align: right;
  line-height: 18px;
}
.mystudent-detail__completion .detail-completion .number strong {
  padding-right: 4px;
  font-size: 32px; /* 250530 수정 */
  font-weight: 400;
  line-height: 32px;
}
/* 250530 추가 */
.mystudent-detail__completion .detail-completion.level .number strong {
  font-size: 28px;
}
@media screen and (max-width: 1199px) {
  .mystudent-detail__completion .detail-completion.level .number strong,
  .mystudent-detail__completion .detail-completion.grade .number strong {
    font-size: 24px;
  }
}
/* //250530 추가 */
.mystudent-detail__completion .detail-completion.class .title::before {
  border-color: #09d3a3;
}
.mystudent-detail__completion .detail-completion.attendance .title::before {
  border-color: #7199ff;
}
.mystudent-detail__completion .detail-completion.submission .title::before {
  border-color: #ab09d3;
}
.mystudent-detail__completion .detail-completion.rate .title::before {
  border-color: #ff4872;
}
.mystudent-detail__completion .detail-completion.level .title::before {
  border-color: #ff9960;
}
/* 250530 추가 */
.mystudent-detail__completion .detail-completion.grade .title::before {
  border-color: #fe87ea;
}
/* //250530 추가 */
.mystudent-detail .table--list .tbody th,
.mystudent-detail .table--list .tbody td {
  padding-top: 33px;
}
.mystudent-detail .table--list .tbody tr:last-child th,
.mystudent-detail .table--list .tbody tr:last-child td {
  border-bottom: 0;
}

.student--card {
  overflow: hidden;
  position: relative;
  width: calc((100% - 48px) / 3);
  border: 1px solid rgba(0, 0, 0, 0.16);
  border-radius: 16px;
}
.student--card:nth-child(7n-6) .user-profile {
  background-color: #d1d7e3;
}
.student--card:nth-child(7n-5) .user-profile {
  background-color: #ebdce7;
}
.student--card:nth-child(7n-4) .user-profile {
  background-color: #d7e5d2;
}
.student--card:nth-child(7n-3) .user-profile {
  background-color: #d1d7e3;
}
.student--card:nth-child(7n-2) .user-profile {
  background-color: #ddddfa;
}
.student--card:nth-child(7n-1) .user-profile {
  background-color: #d3e0fa;
}
.student--card:nth-child(7n-0) .user-profile {
  background-color: #d7e5d2;
}
.student--card__top {
  display: flex;
  flex-direction: row;
  flex-shrink: 0;
  flex-grow: 0;
  gap: 25px;
  padding: 15px 15px 11px 27px;
  background-color: #f8f9fd;
}
@media (max-width: 1199px) {
  .student--card__top {
    padding-left: 17px;
    gap: 10px;
  }
}
.student--card__top .input-check {
  position: absolute;
  top: 15px;
  right: 15px;
  z-index: 15;
}
.student--card__top .card-top__left {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: center;
  flex-shrink: 0;
  flex-grow: 0;
  width: 78px;
}
.student--card__top .card-top__left .user-name {
  margin-bottom: 9px;
  color: #000000;
  font-size: 20px;
  line-height: 23px;
  font-weight: 700;
}
.student--card__top .card-top__left .user-profile {
  width: 78px;
  height: 78px;
  border-radius: 78px;
  background-image: url("../images/ico/profile-big-white.svg");
}
.student--card__top .card-top__left .state-box {
  height: auto;
  padding: 3px 10px;
  margin-top: -12px;
  font-size: 14px;
  line-height: 16px;
}
.student--card__top .card-top__right {
  overflow: hidden;
}
.student--card__top .card-top__right button,
.student--card__top .card-top__right a {
  position: relative;
  z-index: 15;
}
.student--card__top .card-top__right button + .text-bullet,
.student--card__top .card-top__right a + .text-bullet {
  margin-top: 20px;
}
.student--card__top .card-top__right .text-bullet {
  margin-top: 11px;
  font-size: 14px;
}
.student--card__top .card-top__right .text-bullet span,
.student--card__top .card-top__right .text-bullet strong {
  vertical-align: top;
  display: inline-block;
}
.student--card__top .card-top__right .text-bullet span {
  width: 75px;
  color: rgba(0, 0, 0, 0.5);
}
@media (max-width: 1199px) {
  .student--card__top .card-top__right .text-bullet span {
    width: 61px;
  }
}
.student--card__bottom {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  flex-wrap: wrap;
  padding: 19px 25px 18px;
}
.student--card__bottom .text-bullet {
  width: 50%;
  margin-top: 15px;
  font-size: 14px;
}
.student--card__bottom .text-bullet:nth-child(1),
.student--card__bottom .text-bullet:nth-child(2) {
  margin-top: 0;
}
@media (max-width: 1199px) {
  .student--card__bottom .text-bullet {
    width: 100%;
    margin-top: 11px;
  }
  .student--card__bottom .text-bullet:nth-child(2) {
    margin-top: 11px;
  }
}
.student--card__bottom .text-bullet span,
.student--card__bottom .text-bullet strong {
  vertical-align: top;
  display: inline-block;
}
.student--card__bottom .text-bullet span {
  width: 81px;
  color: rgba(0, 0, 0, 0.6);
}
.student--card__bottom .text-bullet strong {
  color: rgba(0, 0, 0, 0.8);
  font-weight: 700;
}
.student--card__detail {
  position: absolute;
  display: none;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  font-size: 0;
  color: transparent;
}

.textbook--area {
  padding-top: 84px;
}
.textbook--area.is--list {
  margin-bottom: 95px;
}
.textbook--area.is--list .tab--contents {
  padding: 24px 24px 40px;
}
.textbook--area.is--list .tab--contents.is--share .textbook--total-number {
  font-size: 18px;
}
.textbook--area.is--list .classes--list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 24px;
}
.textbook--area.is--list .classes--list .recommend--item {
  width: calc((100% - 72px) / 4);
}
@media (max-width: 1199px) {
  .textbook--area.is--list .classes--list .recommend--item {
    width: calc((100% - 48px) / 3);
  }
}
.textbook--area.is--list
  .classes--list
  .recommend--item
  .recommend--thum::before {
  /* [KT요청 : 231011] 썸네일 리스트 그라데이션 수정 */
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.48) 3.21%,
    rgba(0, 0, 0, 0) 54.63%
  );
  border-radius: 16px;
  z-index: 6;
  content: "";
}
.textbook--area.is--list .classes--list .recommend--item .recommend--desc {
  flex-shrink: 1;
  flex-grow: 1;
}
.textbook--area.is--list .classes--list + .pagenavi--box {
  margin-top: 48px;
}
.textbook--area.is--my {
  padding: 44px 24px 40px;
  margin-top: 84px;
}
.textbook--filter {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  flex-wrap: wrap;
  gap: 10px;
  z-index: 35;
}
.textbook--filter .filter1 {
  width: 145px;
}
.textbook--filter .filter1 .dropdown--select {
  padding: 6px 32px 6px 12px;
}
.textbook--filter .filter2 {
  width: 126px;
}
.textbook--filter .filter3 {
  width: 136px;
}
.textbook--filter .filter4 {
  width: 136px;
}
.textbook--filter .filter5 {
  width: 136px;
}
.textbook--filter .filter6 {
  width: 76px;
}
.textbook--filter .filter7 {
  width: 164px;
}
.textbook--filter .filter8 {
  width: 91px;
  /* [KT요청 : 230816] 드랍박스 텍스트 다 보이게 */
}
.textbook--filter .filter8 .dropdown--box {
  width: fit-content;
}
.textbook--filter .filter8 .dropdown--box > .dropdown--item {
  white-space: nowrap;
}
.textbook--filter .box--search {
  width: 100%;
}
.textbook--total-number {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: relative;
  overflow: hidden;
  height: 40px;
  margin-top: 20px;
  margin-bottom: 14px;
  line-height: 20px;
  z-index: 5;
  font-size: 18px;
}
.textbook--total-number p {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 14px;
}
.textbook--total-number span {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 14px;
  font-size: 18px;
  line-height: 20px;
}
.textbook--total-number span::before,
.textbook--total-number span::after {
  display: block;
  width: 1px;
  height: 12px;
  background-color: rgba(0, 0, 0, 0.7);
  content: "";
}
.textbook--total-number span:first-child::before,
.textbook--total-number span::after {
  display: none;
}
.textbook--total-number .range-toggle {
  margin-right: 20px;
  color: #000000;
  font-size: 18px;
  line-height: 20px;
  font-weight: 400;
}
@media (max-width: 1199px) {
  .textbook--total-number .range-toggle {
    margin-right: 10px;
    font-size: 14px;
    line-height: 16px;
  }
}
.textbook--total-number .button-text {
  float: right;
  font-size: 18px;
  line-height: 20px;
}
.textbook--total-number .button-main.line {
  padding-right: 11px;
  padding-left: 11px;
}
@media (max-width: 1199px) {
  .textbook--total-number {
    align-items: flex-start;
    height: auto;
    min-height: 40px;
  }
  .textbook--total-number .total-number--text {
    overflow: hidden;
    display: block;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 0;
  }
  .textbook--total-number .total-number--text span {
    float: left;
    margin-right: 14px;
    font-size: 14px;
    line-height: 20px;
  }
  .textbook--total-number
    .total-number--text
    span:nth-child(3):not(:last-child) {
    clear: left;
  }
  .textbook--total-number .total-number--text span::before,
  .textbook--total-number .total-number--text span:nth-child(2)::after,
  .textbook--total-number .total-number--text span:last-child::after {
    display: none;
  }
  .textbook--total-number
    .total-number--text
    span:nth-child(3):last-child::before,
  .textbook--total-number .total-number--text span::after {
    display: block;
  }
}
.textbook--list {
  display: flex;
  flex-direction: row;
  position: relative;
  flex-wrap: wrap;
  gap: 24px;
  z-index: 5;
}
.textbook--list + .pagenavi--box {
  margin-top: 48px;
}

.textbook--item {
  position: relative;
  width: calc((100% - 72px) / 4);
  border: 1px solid #d9d9d9;
  border-radius: 16px;
  /* [KT요청 : 230809] 교재 카드 전체에 커서 주기 */
  cursor: pointer;
}
@media (max-width: 1199px) {
  .textbook--item {
    width: calc((100% - 48px) / 3);
  }
}
.textbook--item[tabindex="0"] {
  cursor: pointer;
}
.textbook--item .item--top-box {
  position: relative;
  height: 259px;
  padding: 27px 24px 20px;
  border-radius: 16px 16px 0 0;
}
.textbook--item .item--top-box > * {
  position: relative;
  z-index: 10;
}
.textbook--item .item--top-box::before {
  position: absolute;
  width: 100px;
  height: 100px;
  right: 24px;
  bottom: 68px;
  content: "";
  z-index: 5;
}
.textbook--item .item--bottom-box {
  position: relative;
  padding: 20px;
  border-radius: 0 0 16px 16px;
}
.textbook--item .top-box--sub {
  color: #000000;
  font-size: 22px;
  line-height: 25px;
}
.textbook--item .top-box--sub + .top-box--title {
  margin-top: 14px;
}
.textbook--item .top-box--title {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  max-height: 64px;
  padding-right: 24px;
  color: #000000;
  font-size: 28px;
  font-weight: 700;
}
.textbook--item .top-box--subcategory {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #000000;
  font-size: 14px;
  line-height: 16px;
  margin-top: 20px;
  padding-right: 20px;
}
.textbook--item .top-box--subcategory + .top-box--title {
  margin-top: 8px;
}
.textbook--item .top-box--share {
  margin-top: 6px;
  color: #000000;
  font-size: 14px;
  line-height: 16px;
  font-weight: 700;
}
.textbook--item .top-box--menu {
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 32;
}
.textbook--item .top-box--menu .tab-menu--box {
  width: 145px;
  left: auto;
  right: 0;
}
.textbook--item .top-box--menu .tab-menu--box a,
.textbook--item .top-box--menu .tab-menu--box button {
  padding: 0;
  text-align: center;
}
.textbook--item .top-box--check {
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 25;
}
.textbook--item .top-box--download {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 32px;
  height: 32px;
  left: 24px;
  bottom: 68px;
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 50px;
  color: transparent;
  font-size: 0;
  z-index: 10;
}
.textbook--item .top-box--download::after {
  display: block;
  width: 28px;
  height: 28px;
  background-image: url("../images/ico/download-white.svg");
  content: "";
}
.textbook--item .top-box--like {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: absolute;
  bottom: 20px;
  left: 24px;
  gap: 5px;
  padding: 5px 12px;
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 50px;
  color: #ffffff;
  font-size: 16px;
  line-height: 18px;
  font-weight: 700;
}
.textbook--item .top-box--like::before {
  display: block;
  width: 14px;
  height: 14px;
  background-image: url("../images/ico/heart-off-white.svg");
  content: "";
}
.textbook--item .top-box--like.on::before {
  background-image: url("../images/ico/heart-on-white.svg");
}
.textbook--item .top-box--like + .top-box--copy {
  margin-left: 8px;
  padding-left: 5px;
}
.textbook--item .top-box--like + .top-box--copy::before {
  content: "";
  position: absolute;
  width: 1px;
  height: 12px;
  background-color: #fff;
  opacity: 0.2;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.textbook--item .top-box--bundle {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: absolute;
  width: auto;
  left: 24px;
  bottom: 20px;
  padding: 5px 10px;
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 20px;
  z-index: 10;
}
.textbook--item .top-box--bundle .top-box--like {
  position: relative;
  left: auto;
  bottom: auto;
  padding: 0;
  background-color: transparent;
}
.textbook--item .top-box--copy {
  font-size: 0;
}
.textbook--item .top-box--copy .ico-copy {
  width: 20px;
  height: 20px;
  font-size: 0;
  background-image: url("../images/ico/copy-white.svg");
}
.textbook--item .top-box--grade {
  position: absolute;
  bottom: 20px;
  right: 24px;
  color: #000000;
  font-size: 30px;
  line-height: 34px;
  font-weight: 800;
}
.textbook--item .top-box--box {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  gap: 4px;
}
.textbook--item .bottom-box--publish {
  position: absolute;
  top: 20px;
  right: 20px;
  color: #7e44fb;
  font-size: 14px;
  line-height: 16px;
  font-weight: 700;
}
.textbook--item .bottom-box--publish + .bottom-box--sub {
  padding-right: 45px;
}
.textbook--item .bottom-box--sub {
  color: #000000;
  font-size: 14px;
  line-height: 16px;
}
.textbook--item .bottom-box--title {
  /*  [이슈리스트 : 230803][1420] 1줄 말줄임 추가 */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 12px;
  color: #000000;
  font-size: 18px;
  line-height: 20px;
  font-weight: 700;
}
.textbook--item .bottom-box--desc {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  margin-top: 9px;
}
.textbook--item .bottom-box--desc span {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  color: rgba(0, 0, 0, 0.7);
  font-size: 14px;
  line-height: 16px;
}
.textbook--item .bottom-box--desc span:not(:first-child)::before {
  display: block;
  width: 1px;
  height: 11px;
  background-color: rgba(0, 0, 0, 0.2);
  content: "";
}
.textbook--item.green .item--top-box {
  background-color: #c3eacb;
}
.textbook--item.green .item--top-box::before {
  background-image: url("../images/ico/book-01-color.svg");
}
.textbook--item.green.disabled .item--top-box {
  background-color: rgba(195, 234, 203, 0.5);
}
.textbook--item.blue .item--top-box {
  background-color: #b3dfed;
}
.textbook--item.blue .item--top-box::before {
  background-image: url("../images/ico/book-02-color.svg");
}
.textbook--item.blue.disabled .item--top-box {
  background-color: rgba(179, 223, 237, 0.5);
}
.textbook--item.skyblue .item--top-box {
  background-color: #c8d4ff;
}
.textbook--item.skyblue .item--top-box::before {
  background-image: url("../images/ico/book-03-color.svg");
}
.textbook--item.skyblue.disabled .item--top-box {
  background-color: rgba(200, 212, 255, 0.5);
}
.textbook--item.violet .item--top-box {
  background-color: #afb7ff;
}
.textbook--item.violet .item--top-box::before {
  background-image: url("../images/ico/book-04-color.svg");
}
.textbook--item.violet.disabled .item--top-box {
  background-color: rgba(175, 183, 255, 0.5);
}
.textbook--item.workbook {
  border: none;
}
.textbook--item.workbook.selected
  .item--top-box
  .top-box--check
  input:checked
  + .input--box::before,
.textbook--item.workbook.made
  .item--top-box
  .top-box--check
  input:checked
  + .input--box::before {
  border-color: rgba(255, 255, 255, 0.5);
}
.textbook--item.workbook .item--top-box {
  position: relative;
  height: 259px;
  padding: 20px 20px 20px;
  border-radius: 16px 16px 0 0;
}
.textbook--item.workbook .item--top-box .top-box--enddate {
  padding-top: 19px;
}
.textbook--item.workbook .item--top-box .top-box--subcategory {
  margin-top: 15px;
}
.textbook--item.workbook .item--top-box .top-box--info {
  row-gap: 0;
  flex-wrap: wrap;
  margin-top: 6px;
}
.textbook--item.workbook .item--top-box .top-box--info span {
  white-space: nowrap;
}
.textbook--item.workbook .item--bottom-box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: relative;
  height: 100px;
  padding: 20px 1px;
  border: 1px solid #d9d9d9;
  border-radius: 0 0 16px 16px;
}
.textbook--item.workbook .item--bottom-box p {
  display: flex;
  flex-direction: column;
  align-items: top;
  vertical-align: top;
  position: relative;
  width: calc((100% - 2px) / 3);
  height: 49px;
  gap: 10px;
  text-align: center;
}
.textbook--item.workbook .item--bottom-box p span {
  display: block;
  color: rgba(0, 0, 0, 0.6);
  font-size: 14px;
  line-height: 16px;
}
.textbook--item.workbook .item--bottom-box p span strong {
  display: block;
  color: #000000;
  font-size: 20px;
  line-height: 23px;
  font-weight: 700;
}
.textbook--item.workbook .item--bottom-box .divide {
  display: block;
  width: 1px;
  height: 60px;
  background-color: #d9d9d9;
}
.textbook--item.workbook .top-box--enddate {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  position: absolute;
  height: 100%;
  top: 0;
  right: 0;
  left: 0;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.68) 7.6%,
    rgba(0, 0, 0, 0) 100%
  );
  border-radius: 16px 16px 0 0;
  color: #ffffff;
  font-size: 16px;
  line-height: 18px;
  font-weight: 700;
  padding: 24px 0 0 20px;
  z-index: 30;
}
.textbook--item.workbook .top-box--enddate span {
  padding: 5px 12px;
  border-radius: 6px;
  background-color: rgba(0, 0, 0, 0.8);
}
.textbook--item.workbook .top-box--category {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  display: inline-flex;
  height: 26px;
  padding: 0 16px;
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 26px;
  color: rgba(255, 255, 255, 0.7);
}
.textbook--item.workbook .top-box--category span {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  line-height: 16px;
  font-weight: 700;
}
.textbook--item.workbook .top-box--category span:not(:first-child)::before {
  display: block;
  width: 1px;
  height: 9px;
  background-color: rgba(0, 0, 0, 0.1);
  content: "";
}
.textbook--item.workbook .top-box--category span strong {
  color: #ffffff;
}
.textbook--item.workbook .top-box--subcategory {
  position: relative;
  color: #ffffff;
  z-index: 31;
}
.textbook--item.workbook .top-box--subcategory + .top-box--title {
  margin-top: 8px;
}
.textbook--item.workbook .top-box--title {
  position: relative;
  margin-top: 20px;
  color: #ffffff;
  font-size: 18px;
  line-height: 24px;
  font-weight: 700;
  z-index: 31;
}
.textbook--item.workbook .top-box--info {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  gap: 8px;
  display: inline-flex;
  margin-top: 12px;
  z-index: 31;
}
.textbook--item.workbook .top-box--info span {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  color: rgba(255, 255, 255, 0.4);
  font-size: 14px;
  line-height: 18px;
}
.textbook--item.workbook .top-box--info span:not(:first-child)::before {
  display: block;
  width: 1px;
  height: 10px;
  background-color: rgba(255, 255, 255, 0.4);
  content: "";
}
.textbook--item.workbook .top-box--share {
  position: relative;
  margin-top: 6px;
  color: #ffffff;
  font-size: 14px;
  line-height: 16px;
  font-weight: 700;
  z-index: 31;
}
.textbook--item.workbook .top-box--bundle {
  left: 20px;
  bottom: 20px;
  z-index: 31;
}
.textbook--item.workbook .top-box--tag {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 46px;
  height: 46px;
  right: 20px;
  bottom: 20px;
  background-color: rgba(0, 0, 0, 0.2);
  border: 0.9px solid #ffffff;
  color: transparent;
  font-size: 0;
  text-align: center;
  border-radius: 46px;
  z-index: 31;
}
.textbook--item.workbook .top-box--tag::before {
  color: #ffffff;
  font-size: 14px;
  line-height: 16px;
  font-weight: 700;
}
.textbook--item.workbook .top-box--check {
  z-index: 31;
}
.textbook--item.workbook.ai .item--top-box {
  background-color: #56bf93;
}
.textbook--item.workbook.ai .top-box--tag::before {
  white-space: pre;
  content: "AI\a추천";
}
/* .textbook--item.workbook.ai.disabled .item--top-box {
  background-color: rgba(86, 191, 147, 0.5);
} 250325 삭제 */
.textbook--item.workbook.random .item--top-box {
  background-color: #5890ff;
}
.textbook--item.workbook.random .top-box--tag::before {
  content: "랜덤";
}
/* .textbook--item.workbook.random.disabled .item--top-box {
  background-color: rgba(88, 144, 255, 0.5);
} 250325 삭제 */
.textbook--item.workbook.made .item--top-box {
  background-color: #7e44fb;
}
.textbook--item.workbook.made .top-box--tag::before {
  content: "직접";
}
/* .textbook--item.workbook.made.disabled .item--top-box {
  background-color: rgba(126, 68, 251, 0.5);
} 250325 삭제 */
.textbook--item.workbook.selected .item--top-box {
  background-color: #405bf4;
}
.textbook--item.workbook.selected .top-box--tag::before {
  content: "선택";
}
.textbook--item.workbook.selected.disabled .item--top-box {
  background-color: rgba(64, 91, 244, 0.5);
}
.textbook--item.workbook.checked .item--bottom-box {
  padding: 20px 0 18px 0;
  border-width: 2px;
  border-top: none;
}
.textbook--item.workbook.checked.ai .item--bottom-box {
  border-color: #56bf93;
}
.textbook--item.workbook.checked.random .item--bottom-box {
  border-color: #5890ff;
}
.textbook--item.workbook.checked.made .item--bottom-box {
  border-color: #7e44fb;
}
.textbook--item.workbook.checked.selected .item--bottom-box {
  border-color: #405bf4;
}

.workbook--list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 24px;
}
.workbook--list + .pagenavi--box {
  margin-top: 48px;
}
.workbook--detail .workbook-detail--title {
  margin-top: 84px;
  color: #000000;
  font-size: 28px;
  line-height: 32px;
  font-weight: 700;
}
.workbook--detail .workbook-detail--guide:first-child {
  margin-top: 50px;
}
.workbook--detail .workbook-detail--info {
  min-height: 270px;
  margin-top: 16px;
}
.workbook--detail .workbook-detail--info:first-child {
  margin-top: 84px;
}
.workbook--detail .workbook-detail--info .contents-info-box {
  position: relative;
  padding: 26px 34px 29px;
}
.workbook--detail .workbook-detail--info .contents-info__sub {
  padding: 54px 0px 0 65px;
}
.workbook--detail .workbook-detail--info .contents-info__sub > p {
  gap: 20px;
}
.workbook--detail .workbook-detail--info .info-tag__menu {
  position: absolute;
  right: 20px;
  top: 20px;
}
.workbook--detail .workbook-detail--info .info-tag__menu .tab-menu--box {
  width: 145px;
  text-align: center;
  right: inherit;
}
.workbook--detail .workbook-detail--info .info-tag__menu .tab-menu--box a {
  padding: 0;
}
@media (max-width: 1199px) {
  .workbook--detail .workbook-detail--info .contents-info__sub {
    padding: 54px 0px 0 25px;
  }
  .workbook--detail .workbook-detail--info .contents-info__sub > p {
    font-size: 14px;
    line-height: 16px;
    gap: 10px;
  }
  .workbook--detail .workbook-detail--info .contents-info__sub > p strong {
    width: 75px;
  }
}
.workbook--detail .workbook-detail--analysis {
  padding: 30px 24px;
  margin-top: 24px;
}
.workbook--detail .workbook-detail--analysis + .tab--wrapper {
  margin-top: 48px;
}
.workbook--detail .workbook-detail--question .table--list table th,
.workbook--detail .workbook-detail--question .table--list table td,
.workbook--detail .workbook-detail--taker .table--list table th,
.workbook--detail .workbook-detail--taker .table--list table td {
  padding-right: 5px;
  padding-left: 5px;
}
.workbook--detail
  .workbook-detail--question
  .table--list
  table
  thead
  th:first-child,
.workbook--detail
  .workbook-detail--taker
  .table--list
  table
  thead
  th:first-child {
  padding-left: 19px;
}
.workbook--detail
  .workbook-detail--question
  .table--list
  table
  thead
  th:last-child,
.workbook--detail
  .workbook-detail--taker
  .table--list
  table
  thead
  th:last-child {
  padding-right: 19px;
}
.workbook--detail .workbook-detail--question .table--list table tbody td,
.workbook--detail .workbook-detail--taker .table--list table tbody td {
  color: #000000;
  font-size: 18px;
  line-height: 20px;
}
.workbook--detail .workbook-detail--question .table--list table tbody td strong,
.workbook--detail .workbook-detail--taker .table--list table tbody td strong {
  font-weight: 700;
}
.workbook--detail .workbook-detail--question .table--list + .pagenavi--box,
.workbook--detail .workbook-detail--taker .table--list + .pagenavi--box {
  margin-top: 48px;
}
.workbook--detail .workbook-detail--question {
  padding: 24px 24px 40px;
}
.workbook--detail .workbook-detail--taker {
  background-color: transparent;
}
.workbook--detail .workbook-detail--taker .detail-taker__list {
  padding: 24px 24px 40px;
  background-color: #ffffff;
  border-radius: 0 0 20px 20px;
}
.workbook--detail
  .workbook-detail--taker
  .detail-taker__list
  .table--list
  table
  tbody
  td.date
  strong {
  display: block;
  color: #848484;
  font-weight: 400;
  text-align: center;
}
.workbook--detail
  .workbook-detail--taker
  .detail-taker__list
  .table--list
  table
  tbody
  td.term {
  text-align: left;
  padding-left: 18px;
}
.workbook--detail
  .workbook-detail--taker
  .detail-taker__list
  .table--list
  table
  tbody
  td.result
  button,
.workbook--detail
  .workbook-detail--taker
  .detail-taker__list
  .table--list
  table
  tbody
  td.result
  a {
  width: 83px;
  background-color: rgba(126, 68, 251, 0.1);
  color: #000000;
}
.workbook--detail .workbook-detail--taker .detail-taker__list .box--search {
  margin-bottom: 33px;
}
.workbook--detail .workbook-detail--taker .detail-taker__analysis {
  padding: 30px 24px 24px;
  margin-top: 48px;
  background-color: #ffffff;
  border-radius: 20px;
}
.workbook--detail .workbook-detail--taker .detail-taker__analysis .box-grid {
  gap: 24px;
  margin-top: 24px;
}
.workbook--detail
  .workbook-detail--taker
  .detail-taker__analysis
  .box-grid
  .cell-06
  p.title {
  color: #000000;
  font-size: 16px;
  line-height: 18px;
  font-weight: 700;
}
.workbook--detail
  .workbook-detail--taker
  .detail-taker__analysis
  .box-grid
  .graph-status {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 24px 0 54px 24px;
}
@media (max-width: 1199px) {
  .workbook--detail
    .workbook-detail--taker
    .detail-taker__analysis
    .box-grid
    .graph-status {
    padding-bottom: 40px;
  }
}
.workbook--detail
  .workbook-detail--taker
  .detail-taker__analysis
  .box-grid
  .graph-status
  .doughnut-chart {
  width: 233px;
  height: 233px;
}
.workbook--detail
  .workbook-detail--taker
  .detail-taker__analysis
  .box-grid
  .graph-status
  .doughnut-chart__wrapper {
  margin-left: 16px;
}
@media (max-width: 1199px) {
  .workbook--detail
    .workbook-detail--taker
    .detail-taker__analysis
    .box-grid
    .graph-status
    .doughnut-chart__wrapper {
    margin-left: 0;
  }
}
.workbook--detail
  .workbook-detail--taker
  .detail-taker__analysis
  .box-grid
  .graph-status
  .legend {
  right: 40px;
}
.workbook--detail
  .workbook-detail--taker
  .detail-taker__analysis
  .box-grid
  .graph-status
  .chart-total {
  width: 233px;
  height: 233px;
}
@media (max-width: 1199px) {
  .workbook--detail
    .workbook-detail--taker
    .detail-taker__analysis
    .box-grid
    .graph-status
    .doughnut-chart {
    width: 203px;
    height: 203px;
  }
  .workbook--detail
    .workbook-detail--taker
    .detail-taker__analysis
    .box-grid
    .graph-status
    .chart-total {
    width: 203px;
    height: 203px;
  }
  .workbook--detail
    .workbook-detail--taker
    .detail-taker__analysis
    .box-grid
    .graph-status
    .row {
    width: 117px;
  }
  .workbook--detail
    .workbook-detail--taker
    .detail-taker__analysis
    .box-grid
    .graph-status
    .row
    .text {
    font-size: 16px;
  }
  .workbook--detail
    .workbook-detail--taker
    .detail-taker__analysis
    .box-grid
    .graph-status
    .row
    .number {
    font-size: 14px;
  }
  .workbook--detail
    .workbook-detail--taker
    .detail-taker__analysis
    .box-grid
    .graph-status
    .legend {
    right: 24px;
  }
}
.workbook--detail
  .workbook-detail--taker
  .detail-taker__analysis
  .box-grid
  .graph-ratio {
  overflow: hidden;
  position: relative;
  padding: 24px 38px 13px 24px;
}
.workbook--detail
  .workbook-detail--taker
  .detail-taker__analysis
  .box-grid
  .graph-ratio
  .title {
  margin-bottom: 45px;
}
.workbook--detail
  .workbook-detail--taker
  .detail-taker__analysis
  .box-grid
  .graph-ratio
  .answer-raio-bar {
  height: 306px;
  margin-bottom: -52px;
}
.workbook--make {
  margin-bottom: 207px;
}
.workbook--make__title {
  margin-top: 72px;
  margin-bottom: 36px;
  color: #000000;
  font-size: 32px;
  line-height: 36px;
  text-align: center;
  font-weight: 700;
}
.workbook--make .box-grid {
  gap: 24px;
  width: 744px;
  margin-right: auto;
  margin-left: auto;
}
.workbook--make .box-grid .cell-06 {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
  position: relative;
  width: 360px;
  height: 280px; /* 240826 수정 */
  padding: 30px;
  text-align: left;
}
.workbook--make .box-grid .cell-06 .title {
  color: #000000;
  font-size: 26px;
  line-height: 30px;
  font-weight: 700;
}
.workbook--make .box-grid .cell-06 .text {
  margin-top: 16px;
  color: rgba(0, 0, 0, 0.3);
  font-size: 16px;
  line-height: 18px;
}
.workbook--make .box-grid .cell-06 .icon,
.workbook--make .box-grid .cell-06 .arrow {
  position: absolute;
  bottom: 30px;
}
.workbook--make .box-grid .cell-06 .icon {
  position: absolute;
  width: 77px;
  height: 77px;
  left: 30px;
  background-size: contain;
  background-position: left bottom;
}
.workbook--make .box-grid .cell-06 .arrow {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 30px;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 40px;
}
.workbook--make .box-grid .cell-06 .arrow::before {
  display: block;
  width: 28px;
  height: 28px;
  background-image: url("../images/ico/next-black.svg");
  content: "";
}
.workbook--make .box-grid .cell-06.type-01 .icon {
  background-image: url("../images/img/workbook-make-01.svg");
}
.workbook--make .box-grid .cell-06.type-02 .icon {
  background-image: url("../images/img/workbook-make-02.svg");
}
.workbook--make .box-grid .cell-06.type-03 .icon {
  background-image: url("../images/img/workbook-make-03.svg");
}
.workbook--make .box-grid .cell-06.type-04 .icon {
  background-image: url("../images/img/workbook-make-04.svg");
}
.workbook--make.is--student .workbook--make__title {
  margin-top: 144px;
}
.workbook--intro .recommend--thum::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(
    360deg,
    rgba(0, 0, 0, 0.6) 0%,
    rgba(0, 0, 0, 0) 50%
  );
  z-index: 10;
  content: "";
}
.workbook--intro .recommend--thum .step,
.workbook--intro .recommend--thum .like,
.workbook--intro .recommend--thum .sharing-box {
  z-index: 15;
}
.workbook--intro .recommend--thum .thum-menu {
  z-index: 30;
}
.workbook--intro .workbook--intro__recommend .box--empty {
  min-height: 0;
  height: 366px;
}
.workbook--intro.is--teacher .intro--title {
  margin-top: 80px;
  margin-bottom: 22px;
}
.workbook--intro.is--teacher .intro--title button,
.workbook--intro .intro--title .tooltip_title {
  /*240604 tooltip_title 추가, 240610 is--teacher 삭제*/
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  position: relative;
}
.workbook--intro.is--teacher .intro--title button::after,
.workbook--intro .intro--title .tooltip_title::after {
  /*240604 tooltip_title 추가, 240610 is--teacher 삭제*/
  position: absolute;
  height: 22px;
  right: 39px;
  bottom: 2px;
  left: -3px;
  background-color: rgba(126, 68, 251, 0.14);
  border-radius: 22px;
  z-index: 5;
  content: "";
}
.workbook--intro.is--teacher .intro--title .text {
  position: relative;
  color: #000000;
  font-size: 28px;
  line-height: 32px;
  font-weight: 700;
  z-index: 10;
}
.workbook--intro.is--teacher .intro--title .text strong {
  color: #7e44fb;
}
.workbook--intro.is--teacher .intro__summary {
  gap: 24px;
  margin-top: 84px;
}
.workbook--intro.is--teacher .intro__summary .summary--box {
  overflow: hidden;
}
.workbook--intro.is--teacher
  .intro__summary
  .summary--box.cell-03
  .summary--textbox
  div {
  width: 50%;
}
.workbook--intro.is--teacher
  .intro__summary
  .summary--box.cell-06
  .summary--textbox
  div {
  width: 25%;
}
.workbook--intro.is--teacher .intro__summary .summary--title {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  height: 58px;
  padding: 0 24px;
  background-color: #f8f9fd;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
  font-weight: 700;
}
.workbook--intro.is--teacher .intro__summary .summary--textbox {
  display: flex;
  flex-direction: row;
  justify-content: stretch;
  align-items: center;
}
.workbook--intro.is--teacher .intro__summary .summary--textbox .text {
  flex-shrink: 1;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
  position: relative;
  height: 104px;
}
.workbook--intro.is--teacher
  .intro__summary
  .summary--textbox
  .text:not(:first-child)::after {
  position: absolute;
  width: 1px;
  height: 40px;
  top: 50%;
  left: 0;
  background-color: #d9d9d9;
  transform: translateY(-50%);
  content: "";
}
.workbook--intro.is--teacher .intro__summary .summary--textbox .text .title {
  color: rgba(0, 0, 0, 0.6);
  font-size: 14px;
  line-height: 16px;
  font-weight: 700;
}
.workbook--intro.is--teacher .intro__summary .summary--textbox .text .number {
  color: #000000;
  font-size: 32px;
  line-height: 36px;
}
.workbook--intro.is--teacher
  .intro__summary
  .summary--textbox
  .text:first-child
  .number {
  color: #7e44fb;
  font-weight: 800;
}
.workbook--intro.is--teacher .intro__item--list {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 24px;
}
.workbook--intro.is--teacher .intro__item--list > div {
  flex-shrink: 0;
  flex-grow: 0;
  width: calc((100% - 72px) / 4);
}
@media (max-width: 1199px) {
  .workbook--intro.is--teacher .intro__item--list > div {
    width: calc((100% - 48px) / 3);
  }
  .workbook--intro.is--teacher .intro__item--list > div:nth-child(4) {
    display: none;
  }
}
.workbook--intro.is--teacher .intro__class .recommend--thum,
.workbook--intro.is--teacher .intro__class .recommend--thum .image {
  border-radius: 16px;
}
.workbook--intro.is--teacher .intro__class .recommend--thum::after {
  border-radius: 16px;
}
.workbook--intro.is--teacher .intro__class .recommend--contents {
  padding: 0;
  margin-top: 16px;
  border: none;
}
.workbook--intro.is--teacher .intro__class .recommend--title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  height: auto;
  margin-top: 12px;
}
.workbook--intro.is--teacher .intro__class .recommend--desc {
  margin-top: 9px;
}
.workbook--intro.is--teacher .intro__class.box--empty {
  min-height: 253px;
}
.workbook--intro.is--teacher .intro__workbook .item--top-box {
  height: 228px;
  border-radius: 20px 20px 0 0;
}
.workbook--intro.is--teacher .intro__workbook .item--bottom-box {
  background-color: #ffffff;
  border: none;
  border-radius: 0 0 20px 20px;
}
.workbook--intro.is--teacher .intro__workbook.box--empty {
  min-height: 328px;
}
.workbook--intro.is--teacher .intro__textbook {
  margin-bottom: 213px;
}
.workbook--intro.is--teacher .intro__textbook .textbook--item {
  border: none;
}
.workbook--intro.is--teacher .intro__textbook .item--top-box {
  height: 300px;
  border-radius: 20px;
}
.workbook--intro.is--teacher .intro__textbook .item--bottom-box {
  padding: 0;
  padding-top: 16px;
}
.workbook--intro.is--teacher
  .intro__textbook
  .item--bottom-box
  .bottom-box--title {
  margin-top: 0;
}
.workbook--intro.is--teacher
  .intro__textbook
  .item--bottom-box
  .bottom-box--desc {
  margin-top: 8px;
}
.workbook--intro.is--teacher .intro__textbook.box--empty {
  min-height: 360px;
}
.workbook--intro.is--student .intro-noti__teacher {
  margin-top: 84px;
  /* [이슈리스트 : 230807][1986] 자세히 보기와 텍스트 겹침 처리 */
}
.workbook--intro.is--student .intro-noti__teacher + .intro--title {
  margin-top: 60px;
}
.workbook--intro.is--student .intro-noti__teacher .intro-noti {
  padding-right: 170px;
}
.workbook--intro.is--student .intro-noti__teacher .intro-noti--text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: -4px;
}
.workbook--intro.is--student .intro-noti__teacher .img-write-emoji {
  vertical-align: bottom;
}
.workbook--intro.is--student .week__summary {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 50px;
  padding: 24px 44px;
  margin-bottom: 24px;
}
.workbook--intro.is--student .week__summary .icon {
  flex-shrink: 0;
  flex-grow: 0;
  width: 130px;
  height: 130px;
  background-image: url("../images/img/contents-student-illust.svg");
}
.workbook--intro.is--student .week__summary .text {
  color: #000000;
  font-size: 24px;
  line-height: 37px;
}
.workbook--intro.is--student .week__summary .text strong {
  color: #7e44fb;
  font-weight: 700;
}
@media (max-width: 1199px) {
  .workbook--intro.is--student .week__summary .text br {
    display: none;
  }
}
.workbook--intro.is--student .week__top3 {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 24px;
}
.workbook--intro.is--student .week__top3 .week-top3__rank {
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  gap: 24px;
}
.workbook--intro.is--student .week__top3 .week-top3__rank .top3-rank {
  flex-shrink: 1;
  flex-grow: 1;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 24px;
  background-color: #e3e4f8;
  border-radius: 16px;
}
.workbook--intro.is--student .week__top3 .week-top3__rank .top3-rank .number {
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 52px;
  height: 52px;
  border-radius: 10px;
  color: #ffffff;
  font-size: 18px;
  line-height: 20px;
  font-weight: 700;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__rank
  .top3-rank
  .number
  strong {
  font-size: 24px;
  line-height: 27px;
}
.workbook--intro.is--student .week__top3 .week-top3__rank .top3-rank .textbox {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-left: 14px;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__rank
  .top3-rank
  .textbox
  .category {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__rank
  .top3-rank
  .textbox
  .category
  span {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  color: rgba(0, 0, 0, 0.6);
  font-size: 16px;
  line-height: 18px;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__rank
  .top3-rank
  .textbox
  .category
  span:not(:first-child)::before {
  display: block;
  width: 1px;
  height: 10px;
  background-color: rgba(0, 0, 0, 0.3);
  content: "";
}
.workbook--intro.is--student
  .week__top3
  .week-top3__rank
  .top3-rank
  .textbox
  .title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 7px;
  color: #000000;
  font-size: 24px;
  line-height: 27px;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__rank
  .top3-rank.rank1
  .number {
  background-color: #628fff;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__rank
  .top3-rank.rank2
  .number {
  background-color: #41c676;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__rank
  .top3-rank.rank3
  .number {
  background-color: #ff8c4c;
}
.workbook--intro.is--student .week__top3 .week-top3__rank .top3-rank.active {
  background-color: #ffffff;
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
}
.workbook--intro.is--student
  .week__top3
  .week-top3__rank
  .top3-rank.active
  .textbox
  .category {
  font-weight: 700;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__rank
  .top3-rank.active
  .textbox
  .title {
  font-weight: 700;
}
.workbook--intro.is--student .week__top3 .week-top3__relation {
  gap: 24px;
  padding: 24px;
}
.workbook--intro.is--student .week__top3 .week-top3__relation .title {
  margin: 0 6px 16px;
  color: #000000;
  font-size: 24px;
  line-height: 27px;
  font-weight: 700;
}
.workbook--intro.is--student .week__top3 .week-top3__relation .recommend--thum {
  padding-top: 154px;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__relation
  .recommend--thum
  .image {
  padding-top: 154px;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__relation
  .recommend--contents {
  padding: 14px 18px;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__relation
  .recommend--contents
  .grade-left {
  height: 16px;
  font-weight: 700;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__relation
  .recommend--title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  height: 20px;
  margin-top: 12px;
}
.workbook--intro.is--student .week__top3 .week-top3__relation .recommend--desc {
  margin-top: 8px;
}
.workbook--intro.is--student .week__top3 .week-top3__relation .textbook--item {
  width: 100%;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__relation
  .textbook--item
  .item--top-box {
  height: 154px;
  padding: 16px;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__relation
  .textbook--item
  .item--top-box
  .top-box--subcategory {
  padding-right: 0;
  margin-top: 8px;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__relation
  .textbook--item
  .item--top-box
  .top-box--title {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  max-height: 48px;
  padding-right: 0;
  margin-top: 4px;
  white-space: initial;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__relation
  .textbook--item
  .item--top-box
  .top-box--info {
  margin-top: 5px;
}
@media (max-width: 1199px) {
  .workbook--intro.is--student
    .week__top3
    .week-top3__relation
    .textbook--item
    .item--top-box
    .top-box--info,
  .workbook--intro.is--student
    .week__top3
    .week-top3__relation
    .textbook--item
    .item--top-box
    .top-box--info
    span {
    gap: 6px;
  }
  .workbook--intro.is--student
    .week__top3
    .week-top3__relation
    .textbook--item
    .item--top-box
    .top-box--info
    span {
    font-size: 13px;
  }
}
.workbook--intro.is--student
  .week__top3
  .week-top3__relation
  .textbook--item
  .top-box--title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}
.workbook--intro.is--student
  .week__top3
  .week-top3__relation
  .textbook--item
  .item--bottom-box {
  height: 103px;
}
.workbook--intro.is--student .tab--wrapper .tab--contents {
  padding: 10px 24px 24px;
}
.workbook--intro.is--student .tab--wrapper .tab--contents .box--edit-title {
  display: flex;
  flex-direction: row;
  align-items: center;
  min-height: auto;
  margin-top: 40px;
  margin-bottom: 24px;
  gap: 6px;
}
.workbook--intro.is--student
  .tab--wrapper
  .tab--contents
  .box--edit-title
  .icon-20,
.workbook--intro.is--student
  .tab--wrapper
  .tab--contents
  .box--edit-title
  .icon-24 {
  display: block;
}
.workbook--intro.is--student
  .tab--wrapper
  .tab--contents
  .box--edit-title.align-top {
  display: flex;
  flex-direction: row;
  align-items: start;
}
.workbook--intro.is--student .workbook--intro__recommend .row {
  display: flex;
  flex-direction: row;
  align-items: start;
  flex-wrap: wrap;
  gap: 24px;
}
.workbook--intro.is--student .workbook--intro__recommend .row > div {
  width: calc((100% - 72px) / 4);
}
@media (max-width: 1199px) {
  .workbook--intro.is--student .workbook--intro__recommend .row > div {
    width: calc((100% - 48px) / 3);
  }
}
.workbook--intro.is--student .workbook--intro__recommend .row .recommend--thum {
  padding-top: 204px;
}
.workbook--intro.is--student
  .workbook--intro__recommend
  .row
  .recommend--thum
  .step,
.workbook--intro.is--student
  .workbook--intro__recommend
  .row
  .recommend--thum
  .like,
.workbook--intro.is--student
  .workbook--intro__recommend
  .row
  .recommend--thum
  .thum-menu {
  z-index: 15;
}
.workbook--intro.is--student
  .workbook--intro__recommend
  .row
  .recommend--thum
  .image {
  padding-top: 204px;
}
@media (max-width: 1199px) {
  .workbook--intro.is--student
    .workbook--intro__recommend
    .row
    .recommend--item
    + .recommend--item {
    display: none;
  }
}
.workbook--intro.is--student
  .workbook--intro__recommend
  .row
  .textbook--item
  .item--top-box {
  height: 250px;
}
.workbook--intro.is--student
  .workbook--intro__recommend
  .row
  .textbook--item
  .item--bottom-box {
  padding: 12px 20px 13px;
}
.workbook--intro.is--student
  .workbook--intro__recommend
  .row
  .textbook--item.workbook
  .item--bottom-box {
  padding: 20px;
}
.workbook--intro.is--student .workbook--intro__recommend.box--empty {
  min-height: 400px;
}

.detail-analysis--title {
  color: #000000;
  font-size: 24px;
  line-height: 27px;
  font-weight: 700;
}
.detail-analysis--box {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch;
}
.detail-analysis--box > div {
  position: relative;
  width: calc((100% - 48px) / 3);
  height: 100px;
  padding: 24px 22px 24px 94px; /* 241128 추가 */
  margin-top: 24px;
  border-radius: 20px;
}
.detail-analysis--box > div::before {
  position: absolute;
  width: 52px;
  height: 52px;
  top: 24px;
  left: 24px;
  content: "";
}
.detail-analysis--box > div .title {
  color: rgba(0, 0, 0, 0.6);
  font-size: 16px;
  line-height: 18px;
  font-weight: 700;
}
.detail-analysis--box > div .text {
  margin-top: 7px;
  color: #000000;
  font-size: 24px;
  line-height: 27px;
  font-weight: 700;
}
.detail-analysis--box.box--double > div {
  width: calc((100% - 24px) / 2);
}
.detail-analysis__ratio {
  background-color: #f2f5ff;
}
.detail-analysis__ratio::before {
  background-image: url("../images/ico/ratio-box-blue.svg");
}
.detail-analysis__time {
  background-color: #eef6f0;
}
.detail-analysis__time::before {
  background-image: url("../images/ico/time-box-green.svg");
}
.detail-analysis__member {
  background-color: #ffefef;
}
.detail-analysis__member::before {
  background-image: url("../images/ico/member-box-orange.svg");
}
.detail-analysis__today {
  background-color: #ffffff;
}
.detail-analysis__today::before {
  background-image: url("../images/ico/time-box-orange.svg");
}
.detail-analysis__ing {
  background-color: #ffffff;
}
.detail-analysis__ing::before {
  background-image: url("../images/ico/lesson-box-blue.svg");
}
.detail-analysis__member-total {
  background-color: #f2f5ff;
}
.detail-analysis__member-total::before {
  background-image: url("../images/ico/total-member-blue.svg");
}
.detail-analysis__member-check {
  background-color: #eef6f0;
}
.detail-analysis__member-check::before {
  background-image: url("../images/ico/check-member-green.svg");
}
.detail-analysis__member-not {
  background-color: #ffefef;
}
.detail-analysis__member-not::before {
  background-image: url("../images/ico/not-member-orange.svg");
}

.workbook-make {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: start;
  gap: 25px;
}
.workbook-make.type--select {
  flex-direction: column;
  gap: 0px;
  padding-top: 64px;
}
.workbook-make.type--select .workbook-make__preview {
  margin: 0;
}
.workbook-make.type--select .box--edit:first-child {
  margin-top: 0px;
}
.workbook-make__tags {
  width: 100%;
}
.workbook-make__tags .input-box--text:not(input).no-input {
  padding: 16px 20px;
}
.workbook-make__tags .button-add-scope {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  background: #7e44fb;
  border-radius: 100%;
  cursor: pointer;
  font-size: 0;
}
.workbook-make__contents {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: start;
  gap: 25px;
}
.workbook-make__contents .workbook-make__content {
  padding: 20px 24px 24px;
}
.workbook-make__navi {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
@media (max-width: 1199px) {
  .workbook-make__navi .button-text {
    padding: 0 5px;
  }
  .workbook-make__navi .button-text [class^="ico-"]:first-child {
    margin-right: 0;
  }
  .workbook-make__navi .button-text .f-18 {
    font-size: 14px;
  }
}
.workbook-make__content {
  flex-shrink: 1;
  flex-grow: 1;
}
.workbook-make__content .open-box {
  margin-bottom: 28px;
}
.workbook-make__content .open-box--contents {
  padding: 24px 24px 32px;
}
.workbook-make__content .open-box--title {
  color: #341761;
}
@media (max-width: 1199px) {
  .workbook-make__content .open-box--thead .dropdown--area {
    width: 200px;
  }
}
.workbook-make__content .workbook-passage__contents {
  margin: 20px 0;
  border-width: 0;
  padding: 0;
  min-height: 0;
}
.workbook-make__content .page__button.is--small {
  padding: 30px 0 6px;
  margin: 0 -24px 0;
  box-shadow: 0px -8px 20px rgba(0, 0, 0, 0.06);
}
.workbook-make__content .page__button.is--small button:not(.width-240) {
  width: 25%;
  max-width: 240px;
  min-width: 180px;
}
@media (max-width: 1199px) {
  .workbook-make__content .page__button.is--small button:not(.width-240) {
    min-width: 140px;
  }
}
.workbook-make__content .label-text {
  font-weight: 700;
  font-size: 14px;
  line-height: 16px;
  color: #000000;
  opacity: 0.5;
  flex-shrink: 0;
  margin-right: 4px;
}
.workbook-make__content .button-box-delete {
  margin-right: -4px;
}
.workbook-make__content .table--list {
  position: relative;
}
.workbook-make__content .table--list .scroll-x {
  overflow: hidden;
  scroll-behavior: smooth;
}
.workbook-make__content .table--list .button-table-next {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: absolute;
  right: 0px;
  top: 0px;
  height: 46px;
  background: linear-gradient(
    270deg,
    #fafafa 50%,
    rgba(255, 255, 255, 0.2) 89.47%
  );
  z-index: 2;
}
.workbook-make__content .table--list .button-table-prev {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: absolute;
  left: 0px;
  top: 0px;
  height: 46px;
  background: linear-gradient(
    270deg,
    #fafafa 50%,
    rgba(255, 255, 255, 0.2) 89.47%
  );
  transform: rotate(180deg);
  display: none;
  z-index: 2;
}
.workbook-make__content .table--list .td-title--box {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  height: auto;
  background-color: #f9f6ff;
  border-top: 2px solid #ddd1ed;
  font-weight: 700;
  font-size: 16px;
  line-height: 18px;
  text-align: left;
  padding: 14px 13px;
  color: #7e44fb;
  margin-top: -1px;
}
.workbook-make__content .table--list.scroll-next::after,
.workbook-make__content .table--list.scroll-prev::after {
  content: "";
  position: absolute;
  width: 54px;
  height: 100%;
  top: 0;
  background: linear-gradient(
    270deg,
    #ffffff 50%,
    rgba(255, 255, 255, 0.2) 89.47%
  );
  opacity: 0.8;
  z-index: 1;
}
.workbook-make__content
  .table--list.scroll-next
  table
  thead
  tr
  th:nth-child(5) {
  padding-right: 5%;
}
.workbook-make__content
  .table--list.scroll-next
  table
  tbody
  tr
  td:nth-child(5)
  > p {
  padding-right: 40%;
}
.workbook-make__content .table--list.scroll-next::after {
  right: 0;
}
.workbook-make__content .table--list.scroll-prev .button-table-prev {
  display: flex;
}
.workbook-make__content .table--list.scroll-prev .button-table-next {
  display: none;
}
.workbook-make__content
  .table--list.scroll-prev
  table
  thead
  tr
  th:nth-child(6) {
  padding-left: 5%;
}
.workbook-make__content
  .table--list.scroll-prev
  table
  tbody
  tr
  td:nth-child(6)
  > p {
  padding-left: 40%;
}
.workbook-make__content .table--list.scroll-prev::after {
  left: 0;
  transform: rotate(180deg);
}
.workbook-make__content .show-wrap {
  width: 100%;
}
.workbook-make__content .ico-add-black {
  background-image: url("../images/ico/add-28-black.svg");
}
.workbook-make__content .box--edit-title.set--middle {
  margin-top: 0px;
}
.workbook-make__content .box--edit-items dl.align--top {
  margin-bottom: 5px;
}
@media (max-width: 1199px) {
  .workbook-make__content .input-box.width-70 {
    width: 70px;
    flex-shrink: 0;
    flex-grow: 0;
  }
}
.workbook-make__scroll {
  overflow: hidden;
  overflow-y: auto;
  max-height: 1264px;
  padding: 0 20px 36px;
  margin: 0 -20px;
}
.workbook-make__type {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 20px;
  width: 100%;
  margin: 26px 0 30px;
  padding: 30px 0;
  border-bottom: 1px solid #d9d9d9;
  border-top: 1px solid #d9d9d9;
}
.workbook-make__question {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px;
  width: 100%;
  margin-bottom: 19px;
  border-bottom: 1px solid #d9d9d9;
  padding-bottom: 30px;
}
.workbook-make__answer {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  margin: 25px 0 19px;
  padding-top: 30px;
  border-top: 1px solid #d9d9d9;
}
.workbook-make__answer .answer-text {
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
}
.workbook-make__answer .answer-correct {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px;
}
.workbook-make__answer .answer-explain {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
}
.workbook-make__options {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
  gap: 7px;
  width: 100%;
  min-height: 42px;
}
.workbook-make__options .input-radio {
  width: 100%;
}
.workbook-make__options .input-radio input,
.workbook-make__options .input-radio .input--box::before,
.workbook-make__options .input-radio .btn-add,
.workbook-make__options .input-radio .btn-minus {
  width: 24px;
  height: 24px;
  margin-top: 10px;
}
.workbook-make__options .input-radio .btn-add {
  width: 24px;
  height: 24px;
  opacity: 0.3;
}
.workbook-make__options .input-radio .btn-minus {
  opacity: 0.3;
}
.workbook-make__options .input-radio .input--box,
.workbook-make__options .input-radio .input--text {
  width: 100%;
}
.workbook-make__options .input-radio .input--box {
  gap: 8px;
}
.workbook-make__options .input-radio .input--box:first-child::before {
  display: none;
}
.workbook-make__options
  .input-radio
  .input--box:first-child
  .input--text
  textarea {
  padding-right: 13px;
}
.workbook-make__options .input-radio .input--box:first-child .input--number {
  opacity: 0.15;
}
.workbook-make__options .input-radio .input-box--textarea {
  flex-shrink: 1;
  flex-grow: 1;
  position: relative;
  background-color: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.16);
  border-radius: 8px;
}
.workbook-make__options .input-radio .input-box--textarea textarea {
  height: 40px;
  padding: 7px 40px 7px 13px;
  background-color: transparent;
  border: none;
  font-size: 16px;
  line-height: 24px;
  outline: none;
}
.workbook-make__options .input-radio .input-box--textarea .btn-remove {
  position: absolute;
  width: 24px;
  height: 24px;
  top: 8px;
  right: 14px;
  opacity: 0.15;
}
.workbook-make__options .input-radio .input--text {
  display: flex;
  flex-direction: row;
  align-items: start;
  gap: 10px;
}
.workbook-make__options .input-radio .input--number {
  margin-top: 9px;
  color: #000000;
  font-size: 20px;
  line-height: 23px;
  font-weight: 800;
  text-align: center;
  min-width: 18px;
}
.workbook-make__options
  .input-radio
  input:checked
  + .input--box
  .input-box--textarea {
  background-color: #f2ecff;
  border-color: #7e44fb;
}
.workbook-make__options
  .input-radio
  input:checked
  + .input--box
  .input-box--textarea
  textarea {
  color: #000000;
  font-weight: 400;
}
.workbook-make__preview {
  width: 454px;
  background: #ffffff;
  border: 1px solid rgba(204, 204, 204, 0.7);
  border-radius: 20px;
  margin-top: 86px;
  flex-shrink: 0;
}
@media (max-width: 1199px) {
  .workbook-make__preview {
    width: 320px;
  }
}
.workbook-make__preview .layer__container {
  box-shadow: none;
  max-width: 100%;
}
.workbook-make__preview .layer__title {
  padding: 22px 23px;
  border-bottom: 1px solid #cccccc;
  height: 75px;
  background-color: #f8f9fd;
}
.workbook-make__preview .layer__contents {
  padding: 0;
}
.workbook-make__preview .pagenavi--step {
  position: absolute;
  width: 130px;
  left: 50%;
  transform: translateX(-50%);
}
@media (max-width: 1199px) {
  .workbook-make__preview .pagenavi--step {
    width: 110px;
    margin-left: 20px;
  }
}
.workbook-make__preview .pagenavi--arrow {
  position: absolute;
}
.workbook-make__preview .pagenavi--arrow.is--prev {
  left: 0;
}
.workbook-make__preview .pagenavi--arrow.is--next {
  right: 0;
}
.workbook-make__subjects .input-radio-group {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: start;
  flex-wrap: wrap;
  gap: 18px 40px;
  margin-top: -3px;
}
.workbook-make__subjects .input-radio-group .input-radio {
  width: 146px;
}
.workbook-make__subjects .input-radio-group .input-radio + .input-radio {
  margin-left: 0;
}
.workbook-make .workbook-preview__body {
  overflow: overlay;
  overflow-y: auto;
  padding: 23px 27px;
  height: 526px;
}
.workbook-make .workbook-preview__body .workbook-passage__contents {
  margin: 0px 0 27px;
}
.workbook-make .workbook-preview__body .workbook-passage__titles {
  margin-bottom: 15px;
}
.workbook-make .workbook-preview__question ~ .open-box {
  overflow: hidden;
  margin-top: 40px;
}
.workbook-make .workbook-preview__question ~ .open-box .open-box--contents {
  background-color: #ffffff;
}
.workbook-make .workbook-preview__question ~ .open-box .open-box--title {
  flex-shrink: 0;
  flex-grow: 0;
}
.workbook-make .workbook-preview__question ~ .open-box.is--recommend div,
.workbook-make .workbook-preview__question ~ .open-box.is--recommend p,
.workbook-make .workbook-preview__question ~ .open-box.is--recommend span,
.workbook-make .workbook-preview__question ~ .open-box.is--recommend img,
.workbook-make .workbook-preview__question ~ .open-box.is--recommend iframe {
  max-width: 100%;
}
.workbook-make
  .workbook-preview__question
  ~ .open-box.is--recommend
  .open-box--contents {
  background-color: #ffffff;
}
.workbook-make
  .workbook-preview__question
  ~ .open-box.is--recommend
  .recommend--item.is--contents
  .recommend--contents {
  flex-direction: column;
}
.workbook-make
  .workbook-preview__question
  ~ .open-box.is--recommend
  .recommend--item.is--contents
  .recommend--grade {
  flex-direction: column;
  align-items: flex-start;
}
.workbook-make
  .workbook-preview__question
  ~ .open-box.is--recommend
  .recommend--item.is--contents
  .recommend--title {
  margin-top: 5px;
}
.workbook-make
  .workbook-preview__question
  ~ .open-box.is--recommend
  .recommend--item.is--contents
  .recommend--button {
  margin-top: 12px;
}
.workbook-make .type--essay {
  flex-direction: row;
  gap: 15px;
}
.workbook-make .type--essay .make-options--box {
  display: flex;
  flex-direction: row;
  align-items: start;
  flex-wrap: wrap;
  margin-top: -7px;
  gap: 7px;
}
.workbook-make .type--essay .input-radio .input--box::before {
  display: none;
}
.workbook-make .type--essay .input-radio .input--number {
  margin-left: 0;
}
.workbook-make .type--essay .workbook-make__answer {
  border-top-width: 0;
  margin: 11px 0 0;
  padding: 0;
}

.workbook-preview--box {
  padding: 0 0 15px;
  min-height: 744px;
}
.workbook-preview--box .preview-loading {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 744px;
}
.workbook-preview--box .preview-loading .loading--img {
  width: 258px;
  height: 100px;
}
.workbook-preview--box .workbook-preview__question {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  padding: 38px 40px 56px 60px;
  min-height: 526px;
}
.workbook-preview--box .workbook-preview__question .workbook-passage--box {
  width: 100%;
}
.workbook-preview--box
  .workbook-preview__question
  .workbook-passage--box
  .workbook-passage__titles {
  margin-bottom: 20px;
}
/* 240424 문제집 뷰어 넓이 고정 삭제 */
/* @media (max-width: 1199px) {
  .workbook-preview--box .workbook-preview__question .workbook-passage--box {
    width: 360px;
  }
  .workbook-preview--box .workbook-preview__question .workbook-passage__contents {
    width: 360px;
  }
} */
.workbook-preview--box .open-box {
  margin: 0 40px;
  margin-bottom: 40px;
  border-color: #d9d9d9;
}
.workbook-preview--box .open-box--contents {
  padding: 24px;
}
.workbook-preview--box .open-box--contents.has--graph {
  padding: 0;
}
.workbook-preview--box .open-box--contents.has--graph > div {
  padding: 24px 24px;
}
.workbook-preview--box .open-box .label-text {
  display: inline-flex;
  font-size: 18px;
  line-height: 20px;
}
.workbook-preview--box .open-box .label-text .text + .text {
  position: relative;
  padding-left: 17px;
  margin-left: 16px;
}
.workbook-preview--box .open-box .label-text .text + .text::before {
  position: absolute;
  width: 1px;
  height: 14px;
  top: 50%;
  left: 0;
  margin-top: -7px;
  background-color: rgba(0, 0, 0, 0.2);
  content: "";
}
.workbook-preview--box .open-box .label-text .text + .text strong {
  margin-left: 8px;
}
.workbook-preview--box .open-box .label-text .text em {
  font-style: normal;
  font-weight: 800;
}
.workbook-preview--box .open-box .label-level {
  font-weight: 800;
  margin-left: 8px;
}
.workbook-preview--box .open-box .label-level.top {
  color: #fa4225;
}
.workbook-preview--box .open-box .label-level.middle {
  color: #7e44fb;
}
.workbook-preview--box .open-box .label-level.bottom {
  color: #2697ff;
}
.workbook-preview--box .open-box.is--recommend {
  border: none;
}
.workbook-preview--box .open-box.is--recommend .open-box--thead {
  border: 1px solid #d9d9d9;
  border-bottom-width: 0.5px;
}
.workbook-preview--box .open-box.is--recommend .open-box--contents {
  padding: 0;
  background-color: #ffffff;
  border: none;
}
.workbook-preview--box .open-box.is--recommend .recommend--item {
  display: flex;
  flex-direction: row;
  justify-content: stretch;
  overflow: hidden;
  border: 1px solid #d9d9d9;
  border-top: none;
  border-radius: 0 0 16px 16px;
}
.workbook-preview--box
  .open-box.is--recommend
  .recommend--item
  .recommend--thum,
.workbook-preview--box
  .open-box.is--recommend
  .recommend--item
  .recommend--thum
  .image,
.workbook-preview--box
  .open-box.is--recommend
  .recommend--item
  .recommend--contents,
.workbook-preview--box
  .open-box.is--recommend
  .recommend--item
  .recommend--contents
  .image {
  border-radius: 0;
  border: none;
}
.workbook-preview--box
  .open-box.is--recommend
  .recommend--item
  .recommend--thum,
.workbook-preview--box
  .open-box.is--recommend
  .recommend--item
  .recommend--thum
  .image {
  position: relative;
  width: 300px;
  height: 153px;
  padding: 0;
  flex-shrink: 0;
}
.workbook-preview--box
  .open-box.is--recommend
  .recommend--item
  .recommend--thum
  .image {
  width: 100%;
  height: 100%;
}
.workbook-preview--box
  .open-box.is--recommend
  .recommend--item
  .recommend--contents {
  flex-shrink: 1;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: start;
  position: relative;
  padding: 24px;
  padding-right: 215px;
}
.workbook-preview--box
  .open-box.is--recommend
  .recommend--item
  .recommend--grade {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
}
.workbook-preview--box
  .open-box.is--recommend
  .recommend--item
  .recommend--title {
  margin-top: 10px;
}
.workbook-preview--box
  .open-box.is--recommend
  .recommend--item
  .recommend--button {
  position: absolute;
  width: 180px;
  padding: 0;
  right: 24px;
  bottom: 24px;
}
.workbook-preview--box .open-box.is--recommend + .pagenavi--step {
  margin-top: 100px;
}
.workbook-preview--box .open-box + .pagenavi--step {
  margin-top: 62px;
}
.workbook-preview--box .pagenavi--step {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  justify-content: flex-start;
  width: 370px;
}
.workbook-preview--box .pagenavi--arrow {
  font-size: 18px;
  color: #000000;
}
.workbook-preview--box .pagenavi--arrow.is--prev {
  left: 0;
}
.workbook-preview--box .pagenavi--arrow.is--prev:disabled {
  opacity: 0.3;
}
.workbook-preview--box .pagenavi--arrow.is--next {
  right: 0;
}
.workbook-preview--box .pagenavi--arrow.is--next:disabled {
  opacity: 0.3;
}
.workbook-preview--box .page__button {
  padding-bottom: 40px;
  margin-bottom: -15px;
  margin-top: 20px;
  justify-content: flex-start;
  height: 84px;
  gap: 0;
}
.workbook-preview--box .page__button .select__button {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 20px;
}
.workbook-preview--box .page__button .select__button button {
  min-width: 48px;
  width: 48px;
  height: 48px;
  padding: 0;
  font-weight: 700;
  font-size: 20px;
  line-height: 1;
  border: 1px solid rgba(0, 0, 0, 0.3);
  border-radius: 10px;
}
.workbook-preview--box .page__button .select__button button.active {
  font-weight: 800;
  color: #7e44fb;
  border-color: #7e44fb;
  background-color: rgba(126, 68, 251, 0.1);
}
.workbook-preview--box .page__button .left__button {
  min-width: 150px;
}
.workbook-preview--box .page__button .left__button button {
  padding: 0;
  min-width: 150px;
}
.workbook-preview--box .page__button > .right__button {
  min-width: 150px;
  margin-left: auto;
  margin-right: 40px;
}
.workbook-preview--box .page__button > .right__button button {
  padding: 0;
  min-width: 150px;
}
.workbook-preview--box .page__button .pagenavi--step .right__button {
  min-width: 150px;
}
.workbook-preview--box .page__button .pagenavi--step .right__button button {
  padding: 0;
  min-width: 150px;
}
.workbook-preview--box
  .page__button
  .pagenavi--step
  .right__button.last-step
  button {
  min-width: 240px;
}
.workbook-preview--box.is--result .page__button .select__button a:disabled,
.workbook-preview--box.is--result
  .page__button
  .select__button
  button:disabled {
  border: none;
  background-color: #efefef;
  color: rgba(0, 0, 0, 0.5);
  opacity: 1;
}
.workbook-preview--box.is--result
  .page__button
  .select__button
  a:disabled.active,
.workbook-preview--box.is--result
  .page__button
  .select__button
  button:disabled.active {
  background-color: rgba(126, 68, 251, 0.1);
  color: #7e44fb;
}
.workbook-preview__titles {
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 82px;
  border-bottom: 1px solid #cccccc;
  padding: 0 24px;
  flex-shrink: 0;
}
.workbook-preview__titles .label-num {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background: rgba(126, 68, 251, 0.1);
  border: 1px solid #7e44fb;
  border-radius: 30px;
  min-width: 65px;
  height: 33px;
  padding: 0 16px;
  font-weight: 700;
  font-size: 20px;
  line-height: 23px;
  color: #7e44fb;
  margin-right: 20px;
  flex-shrink: 0;
}
.workbook-preview__titles .title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
  color: rgba(0, 0, 0, 0.6);
}
.workbook-preview__titles .tooltip-title {
  width: 350px;
}
.workbook-preview__titles .tooltip-title .tooltip--button {
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
  color: rgba(0, 0, 0, 0.6);
}
.workbook-preview__titles .tooltip-title .tooltip--box-text {
  font-weight: 400;
  font-size: 16px;
  line-height: 18px;
  color: #000000;
}
.workbook-preview__titles .button {
  flex-shrink: 0;
}
.workbook-preview__titles .button-magnify {
  margin-left: auto;
}
.workbook-preview__titles .button-notify {
  margin-left: auto;
  border-radius: 8px;
}
.workbook-preview__titles .button-notify [class^="ico-"] {
  margin-right: 4px;
}
.workbook-preview__question .workbook-passage__titles {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 32px;
}
.workbook-preview__question .workbook-passage__titles .title {
  display: inline-block;
  font-weight: 700;
  font-size: 20px;
  line-height: 23px;
}
.workbook-preview__question .workbook-passage__titles .label-title {
  display: inline-flex;
  height: 28px;
  background-color: #f1f1f1;
  border-radius: 20px;
  font-size: 14px;
  line-height: 16px;
  padding: 6px 14px;
  flex-shrink: 0;
  margin-left: 5px;
}
.workbook-preview__explain {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 30px;
  width: 100%;
  flex-wrap: wrap;
}
.workbook-preview__explain > .contents {
  width: calc(100% - 96px);
}
.workbook-preview__explain .workbook-explain__row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 30px;
  width: 100%;
}
.workbook-preview__explain .workbook-explain__row div,
.workbook-preview__explain .workbook-explain__row p,
.workbook-preview__explain .workbook-explain__row span,
.workbook-preview__explain .workbook-explain__row strong,
.workbook-preview__explain .workbook-explain__row img {
  max-width: 100%;
}
.workbook-preview__explain .workbook-explain__row + .workbook-explain__row {
  margin-top: -18px;
}
.workbook-preview__explain .contents {
  font-size: 18px;
  line-height: 24px;
  /* [이슈리스트 : 0829][2606] 텍스트 줄바꿈 처리 */
  word-break: break-all;
}
.workbook-preview__explain .contents_title {
  font-weight: 700;
  margin-bottom: 10px;
  padding-top: 5px;
}
.workbook-preview__explain .contents fieldset {
  overflow: hidden;
  overflow-x: auto;
  display: inline-block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  box-sizing: border-box;
}
.workbook-preview__graph {
  position: relative;
  border-top: 1px solid #d9d9d9;
}
.workbook-preview__graph.box-grid {
  gap: 68px;
}
.workbook-preview__graph.box-grid .cell-06 {
  width: calc((100% - 68px) / 2);
}
.workbook-preview__graph::after {
  position: absolute;
  width: 1px;
  top: 36px;
  left: 50%;
  bottom: 36px;
  background-color: #d9d9d9;
  content: "";
}
.workbook-preview__graph .preview-graph--box .title {
  color: #000000;
  font-size: 24px;
  line-height: 27px;
  font-weight: 700;
}
.workbook-preview__graph .preview-graph--box .text {
  margin-top: 12px;
  color: rgba(0, 0, 0, 0.6);
  font-size: 18px;
  line-height: 20px;
}
.workbook-preview__graph .preview-graph--box .doughnut-chart__wrapper {
  margin-top: 3px;
}
.workbook-preview__graph
  .preview-graph--box
  .doughnut-chart__wrapper
  .doughnut-chart,
.workbook-preview__graph
  .preview-graph--box
  .doughnut-chart__wrapper
  .doughnut-chart
  .chart-total {
  width: 198px;
  height: 198px;
}
.workbook-preview__graph
  .preview-graph--box
  .doughnut-chart__wrapper
  .doughnut-chart
  .legend {
  width: 157px;
  gap: 14px;
  top: 27px;
  transform: none;
}
@media (max-width: 1199px) {
  .workbook-preview__graph
    .preview-graph--box
    .doughnut-chart__wrapper
    .doughnut-chart
    .legend {
    width: auto;
  }
}
@media (max-width: 1199px) {
  .workbook-preview__graph
    .preview-graph--box
    .doughnut-chart__wrapper
    .doughnut-chart
    .legend
    .row {
    width: 110px;
  }
}
.workbook-preview__graph
  .preview-graph--box
  .doughnut-chart__wrapper
  .doughnut-chart
  .legend
  .row
  .chip {
  top: 50%;
  transform: translateY(-50%);
}
.workbook-preview__graph
  .preview-graph--box
  .doughnut-chart__wrapper
  .doughnut-chart
  .legend
  .row
  .text {
  margin-top: 0;
}
.workbook-preview__graph .preview-graph--box .double-bar-chart {
  position: initial;
  width: 220px;
  height: 198px !important;
  margin-top: 4px;
}
.workbook-preview__graph .preview-graph--box .double-bar-chart__wrapper {
  display: flex;
  flex-direction: row;
  justify-content: end;
  position: relative;
}
.workbook-preview__graph .preview-graph--box .double-bar-chart .legend {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 14px;
  top: 28px;
  right: auto;
  left: 0;
}
.workbook-preview__graph .preview-graph--box .double-bar-chart .legend .row {
  display: flex;
  flex-direction: row;
  justify-content: start;
  align-items: center;
  gap: 11px;
}
.workbook-preview__graph
  .preview-graph--box
  .double-bar-chart
  .legend
  .row
  .chip {
  width: 10px;
  height: 10px;
  border-radius: 0;
}
.workbook-preview__graph
  .preview-graph--box
  .double-bar-chart
  .legend
  .row
  .text {
  margin-top: 0;
}
.workbook-preview__body {
  position: relative;
  padding-bottom: 40px;
}
.workbook-preview__body .preview-check {
  position: absolute;
  z-index: 30;
}
.workbook-preview__body .preview-check.correct {
  width: 124px;
  height: 137px;
  top: 20px;
  left: 39px;
  background-image: url("../images/img/preview-correct.svg");
}
.workbook-preview__body .preview-check.incorrect {
  width: 134px;
  height: 88px;
  top: 20px;
  left: 24px;
  background-image: url("../images/img/preview-incorrect.svg");
}

.workbook-passage__contents {
  overflow: hidden;
  overflow-y: auto;
  max-height: 342px;
  min-height: 285px;
  padding: 10px;
  border: 1px solid rgba(0, 0, 0, 0.2);
}
.workbook-passage__contents img {
  max-width: 100%;
}
.workbook-passage__contents .is--texts {
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
  border: 1px solid #000000;
  padding: 8px;
}
.workbook-passage__contents .is--texts + .is--images {
  margin-top: 10px;
}
.workbook-passage__contents .is--images {
  border: 1px solid #000000;
  padding: 8px;
}
.workbook-passage__player {
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 50px;
  border: 1px solid #ececec;
  border-radius: 33px;
  padding: 0 20px;
  gap: 20px;
  margin-bottom: 20px;
}
.workbook-passage__player .player-button {
  flex-shrink: 0;
  flex-grow: 0;
  width: 20px;
  height: 20px;
  font-size: 0;
}
.workbook-passage__player .player-button.play {
  background-image: url("../images/ico/play-violet.svg");
}
.workbook-passage__player .player-button.stop {
  background-image: url("../images/ico/stop-violet.svg");
}
.workbook-passage__player .player-button.volume {
  background-image: url("../images/ico/volume-violet.svg");
}
.workbook-passage__player .player-bar {
  display: block;
  height: 100%;
  background: #7e44fb;
  border-radius: 10px;
}
.workbook-passage__player .player-bar-wrap {
  position: relative;
  width: 262px;
  height: 4px;
  overflow: hidden;
  background: rgba(126, 68, 251, 0.2);
  border-radius: 10px;
}
.workbook-passage__player .player-time {
  flex-shrink: 0;
  font-size: 14px;
  line-height: 17px;
  color: rgba(0, 0, 0, 0.6);
}

.slectlist-box {
  display: flex;
  flex-direction: row;
  align-items: start;
  flex-direction: column;
  width: 100%;
  font-weight: 400;
  font-size: 18px;
  line-height: 20px;
  position: relative;
}
.slectlist-box.type--essay .slectlist-number {
  width: 26px;
  font-weight: 800;
  font-size: 20px;
  line-height: 23px;
}
.slectlist-box.type--essay .slectlist-item {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.slectlist-box.type--essay .slectlist-contents.box {
  height: 68px;
  line-height: 22px;
}
.slectlist-title {
  font-weight: 700;
  font-size: 20px;
  line-height: 23px;
  margin-bottom: 24px;
}
.slectlist-item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 4px;
  width: 100%;
}
.slectlist-item + .slectlist-item {
  margin-top: 22px;
}
.slectlist-item * {
  /* [이슈리스트 : 230818][2406] 답안 선지 내용 줄바꿈 처리 */
  word-break: break-word;
}
.is--student .slectlist-item,
.is--multiy .slectlist-item {
  border: 1px solid #d9d9d9;
  border-radius: 10px;
  padding: 16px;
  text-align: left;
}
.is--student .slectlist-item.selected,
.is--multiy .slectlist-item.selected {
  border-color: #7e44fb;
  border-width: 1.5px;
  background-color: rgba(126, 68, 251, 0.1);
}
.is--student .slectlist-item + .slectlist-item,
.is--multiy .slectlist-item + .slectlist-item {
  margin-top: 16px;
}
.slectlist-number {
  margin-top: 1px;
}
.slectlist-contents.box {
  font-size: 18px;
  line-height: 24px;
  border: 1px solid #cccccc;
  border-radius: 10px;
  padding: 21px 24px;
  flex-grow: 1;
  flex-shrink: 1;
  height: 68px;
}
.input-box--textarea .slectlist-contents.box {
  font-size: 18px;
  line-height: 22px;
}
.slectlist-contents.box + .box {
  margin-top: 18px;
}

.legend-html {
  position: relative;
  padding-top: 31px;
}
.legend-html .legend {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  right: 0;
  gap: 15px;
}
.legend-html .legend > div {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 15px;
}
.legend-html .legend .row {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 5px;
}
.legend-html .legend .row:nth-child(2) .chip {
  border-style: dashed;
}
.legend-html .legend .chip {
  width: 8px;
  height: 8px;
  border-width: 1px;
  border-color: transparent;
  border-style: solid;
  border-radius: 8px;
}
.legend-html .legend .text {
  color: #000000;
  font-size: 14px;
  line-height: 16px;
}

.last-data {
  position: absolute;
  display: none;
  margin-top: -13px;
  transform: translate(-50%, -50%);
}
.last-data__box {
  overflow: hidden;
  position: relative;
  padding-bottom: 9px;
}
.last-data__box::before,
.last-data__box::after {
  position: absolute;
  width: 10px;
  height: 18px;
  left: 50%;
  bottom: -9px;
  transform: rotate(180deg);
  content: "";
}
.last-data__box::before {
  width: 6px;
  height: 8px;
  margin-bottom: 3.5px;
  margin-left: -5px;
  border-right: 5px solid transparent;
  border-top: 9px solid transparent;
  border-left: 5px solid transparent;
  border-bottom: 9px solid #ecf8ff;
  z-index: 15;
}
.last-data__box::after {
  margin-left: -5px;
  border-right: 5px solid transparent;
  border-top: 9px solid transparent;
  border-left: 5px solid transparent;
  border-bottom: 9px solid #45bcff;
  z-index: 10;
}
.last-data__box .text {
  position: relative;
  display: block;
  background: #ecf8ff;
  padding: 7px 21px;
  border: 2px solid #45bcff;
  border-radius: 10px;
  color: #45bcff;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
  line-height: 16px;
  white-space: nowrap;
  z-index: 7;
}
.last-data.is--visible {
  display: block;
}

.ai-data {
  position: absolute;
  display: none;
  margin-top: 5px;
  transform: translate(-50%, 0);
  z-index: 5;
}
.ai-data__box {
  overflow: hidden;
  position: relative;
  padding-bottom: 9px;
  margin-top: -2px;
}
.ai-data__box::before,
.ai-data__box::after {
  position: absolute;
  width: 10px;
  height: 18px;
  left: 50%;
  bottom: -9px;
  transform: rotate(180deg);
  content: "";
}
.ai-data__box::before {
  width: 6px;
  height: 8px;
  margin-bottom: 3px;
  margin-left: -5px;
  border-right: 5px solid transparent;
  border-top: 9px solid transparent;
  border-left: 5px solid transparent;
  border-bottom: 9px solid #ffffff;
  z-index: 15;
}
.ai-data__box::after {
  margin-left: -5px;
  border-right: 5px solid transparent;
  border-top: 9px solid transparent;
  border-left: 5px solid transparent;
  border-bottom: 9px solid #d0d0d0;
  z-index: 10;
}
.ai-data__inner {
  position: relative;
  display: block;
  background: #ffffff;
  padding: 9px 23px;
  border: 1.5px solid #d0d0d0;
  border-radius: 10px;
  color: #000000;
  text-align: center;
  white-space: nowrap;
  z-index: 7;
}
.ai-data__inner span {
  display: block;
}
.ai-data__inner .tooltip-title {
  font-size: 14px;
  line-height: 18px;
  font-weight: 800;
}
.ai-data__inner .tooltip-text {
  margin-top: 2px;
  font-size: 14px;
  line-height: 18px;
}
.ai-data__inner .button-main {
  width: 100%;
  height: 28px;
  margin-top: 8px;
  font-size: 14px;
}
.ai-data::after {
  position: absolute;
  width: 0;
  top: 65px;
  left: 50%;
  height: 187px;
  border-right: 1px dashed #323232;
  z-index: 5;
  content: "";
}
.ai-data.is--long .ai-data__box {
  margin-top: -46px;
}
.ai-data.is--visible {
  display: block;
}

.doublebar-tooltip__wrap {
  position: absolute;
  margin-top: -13px;
  transform: translate(-50%, -50%);
}
.doublebar-tooltip__row {
  position: absolute;
  transform: translate(-50%, -50%);
  margin-top: -22px;
}
.doublebar-tooltip__box {
  overflow: hidden;
  position: relative;
  padding-bottom: 7px;
}
.doublebar-tooltip__box::before,
.doublebar-tooltip__box::after {
  position: absolute;
  width: 10px;
  height: 14px;
  left: 50%;
  bottom: -7px;
  transform: rotate(180deg);
  content: "";
}
.doublebar-tooltip__box::before {
  width: 6px;
  height: 8px;
  margin-bottom: 2.5px;
  margin-left: -5px;
  border-right: 5px solid transparent;
  border-top: 7px solid transparent;
  border-left: 5px solid transparent;
  border-bottom: 7px solid #ffffff;
  z-index: 15;
}
.doublebar-tooltip__box::after {
  margin-left: -5px;
  border-right: 5px solid transparent;
  border-top: 7px solid transparent;
  border-left: 5px solid transparent;
  border-bottom: 7px solid #d9d9d9;
  z-index: 10;
}
.doublebar-tooltip__box .text {
  position: relative;
  display: block;
  background: #ffffff;
  padding: 7px 21px;
  border: 1px solid #d9d9d9;
  border-radius: 10px;
  color: #232323;
  font-size: 14px;
  text-align: center;
  line-height: 16px;
  white-space: nowrap;
  z-index: 7;
}
.doublebar-tooltip.is--visible {
  display: block;
}

.line-tooltip {
  position: absolute;
  position: absolute;
  max-width: 240px;
  background-color: transparent !important;
  transform: translateX(-50%);
  filter: drop-shadow(0px 4px 4px #000000);
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.2));
  z-index: 15;
}
.line-tooltip__inner {
  position: relative;
  min-width: 146px;
  margin-top: 20px;
}
.line-tooltip__inner::after,
.line-tooltip__inner::before {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  margin-top: 1px;
  top: 0;
  left: 50%;
  transform: translate(-50%, -100%) rotate(180deg);
  content: "";
}
.line-tooltip__inner::after {
  border-width: 11px 7px 0 7px;
  border-color: #ffffff transparent transparent transparent;
  border-style: solid;
  z-index: 15;
}
.line-tooltip__inner::before {
  margin-left: 0;
  border-width: 12.68px 8.68px 0 8.68px;
  border-color: #cccccc transparent transparent transparent;
  border-style: solid;
  z-index: 10;
}
.line-tooltip__textbox {
  position: relative;
  background: #ffffff;
  padding: 11px 24px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  color: #000000;
  font-size: 14px;
  text-align: center;
  line-height: 20px;
  font-weight: 700;
  z-index: 7;
}
.line-tooltip.is--up .line-tooltip__inner::before,
.line-tooltip.is--up .line-tooltip__inner::after {
  top: auto;
  bottom: 0;
  margin-top: 0;
  margin-bottom: 1px;
  transform: translate(-50%, 100%);
}

.stacked-tooltip {
  position: absolute;
  margin-top: 12px;
  margin-left: 4px;
}
.stacked-tooltip--inner {
  position: relative;
  padding-left: 5px;
}
.stacked-tooltip--inner::after,
.stacked-tooltip--inner::before {
  position: absolute;
  width: 0;
  height: 0;
  bottom: 17px;
  left: -1px;
  border: 7px solid transparent;
  border-top-color: #ffffff;
  border-left-color: #ffffff;
  border-radius: 3px 0 0 0;
  content: "";
  transform: rotate(-45deg);
}
.stacked-tooltip--inner::after {
  bottom: 16px;
  left: 0;
  z-index: 5;
}
.stacked-tooltip--inner::before {
  width: 12px;
  height: 12px;
  margin-top: -0.5px;
  margin-right: 1px;
  background-color: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-filter: none;
  filter: none;
  clip-path: polygon(0% 0%, 0% 103%, 106% -4%, 100% 0%);
  -webkit-clip-path: polygon(0% 0%, 0% 103%, 106% -4%, 100% 0%);
  z-index: 15;
}
.stacked-tooltip--textbox {
  position: relative;
  background: #ffffff;
  padding: 12px 9px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 8px;
}
.stacked-tooltip--textbox .stacked-row span {
  color: #000000;
  font-size: 14px;
  line-height: 16px;
}
.stacked-tooltip--textbox .stacked-row .text {
  padding-left: 6px;
  font-weight: 700;
}
.stacked-tooltip--textbox .stacked-row + .stacked-row {
  margin-top: 6px;
}

.elementary-tooltip__wrap {
  left: auto;
  display: inherit;
  margin-top: -24px;
  transform: translate(-50%, -100%);
}
.elementary-tooltip__wrap .tooltip--box-inner {
  min-width: auto;
}
.elementary-tooltip.is--visible {
  display: block;
}

.tension-line-chart {
  position: relative;
  overflow: hidden;
}
.tension-line-chart .grid-bottom {
  position: absolute;
  right: 0;
  left: 0;
  bottom: 58px;
  border-bottom: 1px dashed #cccccc;
}
.tension-line-chart .chart {
  margin-left: 15px;
}

.doughnut-chart {
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
  align-items: center;
  position: initial;
  padding-top: 0;
}
.doughnut-chart__wrapper {
  position: relative;
}
.doughnut-chart__wrapper.legend-right {
  display: flex;
  flex-direction: row;
  justify-content: end;
}
.doughnut-chart__wrapper.legend-right .doughnut-chart .chart-total {
  right: 0;
  left: auto;
}
.doughnut-chart__wrapper.legend-right .doughnut-chart .legend {
  right: auto;
  left: 0;
}
.doughnut-chart__wrapper.legend-right .doughnut-chart .legend .row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  position: relative;
  width: 132px;
  padding-left: 22px;
}
.doughnut-chart__wrapper.legend-right .doughnut-chart .legend .row .chip {
  width: 10px;
  height: 10px;
}
.doughnut-chart__wrapper.legend-right .doughnut-chart .legend .row .text {
  font-size: 16px;
  line-height: 18px;
}
.doughnut-chart .legend {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 18px;
  top: 50%;
  transform: translateY(-50%);
}
.doughnut-chart .legend .row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  position: relative;
  width: 132px;
  padding-left: 22px;
}
.doughnut-chart .legend .row .chip {
  position: absolute;
  top: 4px;
  left: 0;
  width: 12px;
  height: 12px;
  border: none;
  border-radius: 0;
  border-width: 0;
}
.doughnut-chart .legend .row .text {
  color: #000000;
  font-size: 18px;
  line-height: 20px;
}
.doughnut-chart .legend .row .number {
  color: rgba(0, 0, 0, 0.5);
  font-size: 16px;
  line-height: 18px;
}
.doughnut-chart .chart {
  flex-shrink: 0;
  flex-grow: 0;
  width: 233px;
}
.doughnut-chart .chart-total {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
}
.doughnut-chart .chart-total .title {
  color: #56525e;
  font-size: 14px;
  line-height: 16px;
  opacity: 0.8;
}
.doughnut-chart .chart-total .text {
  margin-top: 5px;
  color: #000000;
  font-size: 18px;
  line-height: 20px;
  font-weight: 700;
}
.doughnut-chart .chart-total .text strong {
  font-size: 30px;
  line-height: 34px;
  font-weight: 700;
}

.radal-chart .legend,
.tension-line-chart .legend {
  display: flex;
  flex-direction: row-reverse;
}

.aitest-bar-chart canvas,
.aitest-student-bar canvas {
  position: relative;
  z-index: 10;
}

.elementary-bar {
  position: relative;
  height: 288px;
  padding-top: 59px;
}
.elementary-bar-chart {
  position: initial;
  width: 174px;
  height: 231px;
  padding-top: 0;
  margin-right: auto;
  margin-left: auto;
}

.datepickers-container {
  z-index: 1000;
}
.datepicker,
.datepicker-inline {
  width: 374px;
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 10px;
  box-shadow: none;
}
.datepicker div,
.datepicker p,
.datepicker-inline div,
.datepicker-inline p {
  box-sizing: border-box;
}
.datepicker .datepicker--nav,
.datepicker-inline .datepicker--nav {
  width: 100%;
  padding: 28px 13px;
  border: none;
}
.datepicker .datepicker--nav-action,
.datepicker-inline .datepicker--nav-action {
  width: auto;
}
.datepicker .datepicker--nav .datepicker_left,
.datepicker .datepicker--nav .datepicker_right,
.datepicker-inline .datepicker--nav .datepicker_left,
.datepicker-inline .datepicker--nav .datepicker_right {
  width: 18px;
  height: 18px;
  background-size: 24px auto;
}
.datepicker .datepicker--nav .datepicker_left,
.datepicker-inline .datepicker--nav .datepicker_left {
  background-image: url("../images/ico/arrow-next-black.svg");
  transform: rotate(180deg);
}
.datepicker .datepicker--nav .datepicker_right,
.datepicker-inline .datepicker--nav .datepicker_right {
  background-image: url("../images/ico/arrow-next-black.svg");
}
.datepicker .datepicker--nav-title,
.datepicker-inline .datepicker--nav-title {
  color: #000000;
  font-size: 16px;
  line-height: 18px;
}
.datepicker .datepicker--content,
.datepicker-inline .datepicker--content {
  width: 372px;
  margin: 3px 0 0;
  padding: 0 25px 23px;
}
.datepicker .datepicker--day-name,
.datepicker-inline .datepicker--day-name {
  flex-shrink: 0;
  flex-grow: 0;
  color: rgba(0, 0, 0, 0.5);
  width: 32px;
  font-size: 14px;
  font-weight: 700;
  line-height: 16px;
  word-break: normal; /* 241202 추가 */
}
.datepicker .datepicker--days-names,
.datepicker-inline .datepicker--days-names {
  justify-content: space-between;
  padding: 0 3px 25px;
  margin-bottom: 0;
}
.dropdown--box .datepicker .datepicker--cells,
.dropdown--box .datepicker-inline .datepicker--cells,
.datepicker .datepicker--cells,
.datepicker-inline .datepicker--cells {
  gap: 16px;
}
/* 250227 추가 */
@media (max-width: 1024px) {
  .datepicker .datepicker--cells,
  .datepicker-inline .datepicker--cells {
    gap: 10px;
  }
  .datepicker,
  .datepicker-inline {
    width: 315px;
  }
  .datepicker .datepicker--content,
  .datepicker-inline .datepicker--content {
    width: 313px;
    padding: 0 14px 23px;
  }
}
.datepicker .datepicker--cell.-range-to-,
.datepicker .datepicker--cell.-in-range-,
.datepicker-inline .datepicker--cell.-range-to-,
.datepicker-inline .datepicker--cell.-in-range- {
  position: relative;
  background-color: transparent;
}
.datepicker .datepicker--cell.-range-to-::after,
.datepicker .datepicker--cell.-in-range-::after,
.datepicker-inline .datepicker--cell.-range-to-::after,
.datepicker-inline .datepicker--cell.-in-range-::after {
  position: absolute;
  top: 0;
  right: -8px;
  bottom: 0;
  left: -8px;
  background-color: rgba(126, 68, 251, 0.14);
  content: "";
}
.datepicker .-weekend-.datepicker--cell.-range-to-::after,
.datepicker .-weekend-.datepicker--cell.-in-range-::after,
.datepicker-inline .-weekend-.datepicker--cell.-range-to-::after,
.datepicker-inline .-weekend-.datepicker--cell.-in-range-::after {
  border-radius: 0 6px 6px 0;
}
.datepicker .-weekend-.datepicker--cell.-range-to- .-weekend- + .-weekend-,
.datepicker .-weekend-.datepicker--cell.-in-range- .-weekend- + .-weekend-,
.datepicker-inline
  .-weekend-.datepicker--cell.-range-to-
  .-weekend-
  + .-weekend-,
.datepicker-inline
  .-weekend-.datepicker--cell.-in-range-
  .-weekend-
  + .-weekend- {
  border-radius: 6px 0 0 6px;
}
.datepicker .datepicker--cell,
.datepicker-inline .datepicker--cell {
  width: 32px;
  height: 32px;
  margin: 2px 0;
  border-radius: 4px;
  color: #000000;
  font-size: 14px;
  line-height: 16px;
}
.datepicker .datepicker--cell.-current-,
.datepicker-inline .datepicker--cell.-current- {
  background-color: #7e44fb;
  box-shadow: 0px 2px 6px rgba(126, 68, 251, 0.5);
  border-radius: 6px;
}
.datepicker .datepicker--cell.-current-.-focus-,
.datepicker-inline .datepicker--cell.-current-.-focus- {
  background-color: #7e44fb;
  box-shadow: 0px 2px 6px rgba(126, 68, 251, 0.5);
  border-radius: 6px;
  color: #ffffff !important;
}
.datepicker .datepicker--cell.-current-.-selected-,
.datepicker-inline .datepicker--cell.-current-.-selected- {
  color: #ffffff !important;
}
.datepicker .datepicker--cell.-focus-,
.datepicker-inline .datepicker--cell.-focus- {
  background-color: #f6f6f6;
}
.datepicker .datepicker--cell.-current-,
.datepicker-inline .datepicker--cell.-current- {
  background-color: transparent;
  box-shadow: none;
  border: none;
  color: #000000 !important;
  font-size: 14px;
  line-height: 16px;
}
.datepicker .datepicker--cell.-selected-,
.datepicker .datepicker--cell.-range-to-,
.datepicker .datepicker--cell.-range-from-,
.datepicker-inline .datepicker--cell.-selected-,
.datepicker-inline .datepicker--cell.-range-to-,
.datepicker-inline .datepicker--cell.-range-from- {
  background-color: #7e44fb;
  box-shadow: 0px 2px 6px rgba(126, 68, 251, 0.5);
  border: none;
  border-radius: 6px;
  color: #ffffff;
}
.datepicker .datepicker--cell.-in-range-.-weekend-,
.datepicker-inline .datepicker--cell.-in-range-.-weekend- {
  right: 0;
  border-radius: 0 6px 6px 0;
}
.datepicker .datepicker--cell.-in-range-.-weekend- + .-weekend-::after,
.datepicker-inline .datepicker--cell.-in-range-.-weekend- + .-weekend-::after {
  left: 0;
  border-radius: 6px 0 0 6px;
}
.datepicker .datepicker--cell.-in-range-:first-child::after,
.datepicker-inline .datepicker--cell.-in-range-:first-child::after {
  border-radius: 6px 0 0 6px;
}
.datepicker .datepicker--cell.-in-range-.-selected-,
.datepicker-inline .datepicker--cell.-in-range-.-selected- {
  color: #ffffff;
}
.datepicker .datepicker--cell.-weekend- + .-weekend-,
.datepicker-inline .datepicker--cell.-weekend- + .-weekend- {
  color: #ff0000;
}
.datepicker .datepicker--cell.-weekend- + .-weekend-.-selected-,
.datepicker-inline .datepicker--cell.-weekend- + .-weekend-.-selected- {
  color: #ffffff;
}
.datepicker .datepicker--cell.-weekend-.-other-month-,
.datepicker-inline .datepicker--cell.-weekend-.-other-month- {
  color: rgba(0, 0, 0, 0.2);
}
.datepicker .datepicker--cell.-weekend-.-selected-,
.datepicker-inline .datepicker--cell.-weekend-.-selected- {
  color: #ffffff;
}
.datepicker .datepicker--cell.-other-month-,
.datepicker-inline .datepicker--cell.-other-month- {
  color: rgba(0, 0, 0, 0.2);
}
.datepicker .datepicker--cell.-range-to-::after,
.datepicker-inline .datepicker--cell.-range-to-::after {
  left: -8px;
  right: 6px;
}
.datepicker .datepicker--cell.-range-from- + .-in-range-::after,
.datepicker-inline .datepicker--cell.-range-from- + .-in-range-::after {
  left: -22px;
}
.datepicker .datepicker--cell.-selected-,
.datepicker-inline .datepicker--cell.-selected- {
  color: #ffffff;
}

.mypage--area {
  display: flex;
  flex-direction: row;
  justify-content: start;
  align-items: start;
  gap: 24px;
  padding-top: 84px;
}
.mypage--area .mypage--left,
.mypage--area .mypage--right {
  background-color: #ffffff;
}
.mypage--area .mypage--left {
  flex-shrink: 0;
  flex-grow: 0;
  overflow: hidden;
  width: 360px;
  min-height: 1140px;
  border-radius: 20px;
}
@media (max-width: 1199px) {
  .mypage--area .mypage--left {
    width: 250px;
  }
}
.mypage--area .mypage--right {
  flex-shrink: 0;
  flex-grow: 0;
  width: calc(100% - 384px);
  border-radius: 20px;
  min-height: 600px; /* 250108 추가*/
}
@media (max-width: 1199px) {
  .mypage--area .mypage--right {
    width: calc(100% - 274px);
  }
}

.mypage--left__profile {
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 40px 24px;
  background-color: #f8f9fd;
}
.mypage--left__profile .profile-tag {
  padding: 6px 14px;
  margin-bottom: 22px;
  background-color: rgba(0, 0, 0, 0.04);
  border-radius: 50px;
  color: rgba(0, 0, 0, 0.4);
  font-size: 14px;
  line-height: 16px;
}
.mypage--left__profile .profile-image {
  position: relative;
  width: 136px;
  height: 136px;
}
.mypage--left__profile .profile-image .image {
  position: relative;
  width: 136px;
  height: 136px;
  margin-bottom: 22px;
  border-radius: 136px;
  z-index: 5;
}
.mypage--left__profile .profile-image .button-icon {
  position: absolute;
  bottom: 4px;
  right: 0;
  background-color: #f6f6f6;
  border: 1px solid #e0e0e0;
  z-index: 10;
}
.mypage--left__profile .profile-name {
  margin-top: 22px;
  margin-bottom: 11px;
  color: #000000;
  font-size: 18px;
  line-height: 20px;
  font-weight: 700;
}
.mypage--left__profile .profile-name strong {
  padding-left: 2px;
  font-size: 22px;
  line-height: 25px;
  font-weight: 800;
}
.mypage--left__profile .profile-desc {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
@media (max-width: 1199px) {
  .mypage--left__profile .profile-desc {
    gap: 7px;
  }
}
.mypage--left__profile .profile-desc span {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 9px;
  color: rgba(0, 0, 0, 0.6);
  font-size: 16px;
  line-height: 18px;
  font-weight: 700;
}
.mypage--left__profile .profile-desc span:not(:first-child)::before {
  display: block;
  width: 1px;
  height: 14px;
  background-color: #d9d9d9;
  content: "";
}
@media (max-width: 1199px) {
  .mypage--left__profile .profile-desc span {
    gap: 6px;
  }
}
.mypage--left__menubox {
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 24px 34px;
}
.mypage--left__menubox .menubox--area {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.mypage--left__menubox .menubox--area:not(:first-child) {
  padding-top: 18px;
  border-top: 1px solid #ebebeb;
}
.mypage--left__menubox .menubox--area .title {
  margin-top: 18px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 14px;
  line-height: 16px;
  font-weight: 700;
}
.mypage--left__menubox .menubox--list {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.mypage--left__menubox .menubox--list a {
  display: block;
  color: #000000;
  font-size: 18px;
  line-height: 24px;
}
.mypage--left__menubox .menubox--list a.active {
  color: #7e44fb;
  font-weight: 800;
}

.mypage-service {
  padding: 30px 24px 40px;
}
.mypage-service .box--edit {
  padding: 0;
}
.mypage-service .box--edit-title:first-child {
  margin-top: 0px;
}
.mypage-service .box--edit-title.set--middle {
  margin-top: -5px;
}
.mypage-service .board-write .box--edit-title .f-gray-84 {
  font-weight: 400;
}
.mypage-service .board-write .page__button {
  padding-top: 24px;
}
.mypage-service .board-detail .box--detail-indicator + .page__button {
  padding-top: 0px;
  margin-top: -9px;
}
.mypage-service .board-detail .page__button {
  padding-top: 48px;
}
.mypage-service .board-list .td-title--text {
  vertical-align: middle;
}
.mypage-service .board-list .td-content {
  padding: 0;
  height: auto;
  border-bottom-width: 0;
}
.mypage-service .board-list .td-content--box {
  position: relative;
  background: rgba(126, 68, 251, 0.03);
  height: 0;
  overflow: hidden;
}
.mypage-service .board-list .td-content--box:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: #d9d9d9;
}
.mypage-service .board-list .td-content--box.open {
  height: auto;
}
.mypage-service .board-list .td-content--box .contents {
  font-size: 14px;
  line-height: 22px;
  padding: 24px 42px;
  text-align: left;
}
.mypage-service .box--detail-title .button-icon {
  margin-right: -2px;
}
.mypage-service .box--detail-file {
  padding: 18px 20px;
}
.mypage-service .box--detail-editor {
  padding: 24px 20px;
}

.mypage-guide {
  padding: 0px;
}
@media (max-width: 1199px) {
  .mypage-guide .xs-br {
    display: none;
  }
}
.mypage-guide .tab-text {
  margin-top: 14px;
}
.mypage-guide .tab-text .tab--button {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.6);
}
.mypage-guide .tab-text .tab--button.active {
  font-size: 18px;
  color: #7e44fb;
  font-weight: 800;
}
.mypage-guide .guide-list {
  padding: 60px 24px 40px;
}
.mypage-guide .guide-list__title {
  font-weight: 700;
  font-size: 18px;
  line-height: 30px;
  margin-bottom: 30px;
  text-align: center;
}
.mypage-guide .guide-list ul {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 24px;
}
@media (max-width: 1199px) {
  .mypage-guide .guide-list ul {
    gap: 20px;
  }
}
.mypage-guide .guide-list ul + .guide-list__title {
  margin-top: 50px;
}
.mypage-guide .guide-list li {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 33.3%;
  border-radius: 20px;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  padding: 0 21px;
  background-color: #f8f9fd;
}
@media (max-width: 1199px) {
  .mypage-guide .guide-list li {
    padding: 0 18px 15px;
    font-size: 14px;
    line-height: 22px;
  }
}
.mypage-guide .guide-list li .ico-guide {
  width: 100%;
  height: 120px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}
.mypage-guide .guide-list li p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  min-height: 72px;
}
.mypage-guide .guide-list__button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin-top: 60px;
}
.mypage-guide .guide-list__button button {
  gap: 8px;
}
.mypage-guide .tab-guide__info {
  padding: 60px;
  text-align: center;
}
.mypage-guide .tab-guide__title {
  font-weight: 800;
  font-size: 30px;
  line-height: 34px;
  margin-bottom: 30px;
}
.mypage-guide .tab-guide__title strong {
  font-weight: 800;
  color: #7e44fb;
}
.mypage-guide .tab-guide__content {
  font-size: 18px;
  line-height: 30px;
}
.mypage-guide .tab-guide__visual {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: center;
  flex-wrap: wrap;
  background: #f4f2ff;
}
.mypage-guide .tab-guide__visual .bubble-box {
  position: relative;
  display: inline-block;
  vertical-align: top;
}
.mypage-guide .tab-guide__visual .bubble-box__pointer {
  position: absolute;
  left: 12px;
  bottom: -14px;
  width: 43px;
  height: 16px;
  z-index: 2;
}
.mypage-guide .tab-guide__visual .bubble-box__shadow {
  filter: drop-shadow(4px 0px 15px rgba(126, 68, 251, 0.15));
}
.mypage-guide .tab-guide__visual .bubble-box__cont {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  border-radius: 20px;
  font-weight: 700;
  background-color: #ffffff;
  box-shadow: 4px 0px 15px rgba(126, 68, 251, 0.15);
  z-index: 2;
}
.mypage-guide .tab-guide__visual .bubble-box__cont .ico-guide__visual {
  width: 30px;
  height: 30px;
  background-size: 100% 100%;
}
.mypage-guide .tab-ssem .tab-guide__visual {
  padding: 62px 30px 78px;
  gap: 0px 56px;
}
@media (max-width: 1199px) {
  .mypage-guide .tab-ssem .tab-guide__visual {
    padding: 60px 30px 20px;
  }
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(1) {
  margin-top: 0px;
}
.mypage-guide
  .tab-ssem
  .tab-guide__visual
  .bubble-box:nth-child(1)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-info-visual-1.png");
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(2) {
  margin-top: 53px;
}
.mypage-guide
  .tab-ssem
  .tab-guide__visual
  .bubble-box:nth-child(2)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-info-visual-2.png");
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(3) {
  margin-top: 21px;
}
.mypage-guide
  .tab-ssem
  .tab-guide__visual
  .bubble-box:nth-child(3)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-info-visual-3.png");
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(4) {
  margin-top: 40px;
}
.mypage-guide
  .tab-ssem
  .tab-guide__visual
  .bubble-box:nth-child(4)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-info-visual-4.png");
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box__cont {
  height: 68px;
  gap: 15px;
  padding: 18px 20px;
  font-size: 16px;
  line-height: 28px;
}
.mypage-guide
  .tab-ssem
  .tab-guide__visual
  .bubble-box:nth-child(3)
  .bubble-box__pointer,
.mypage-guide
  .tab-ssem
  .tab-guide__visual
  .bubble-box:nth-child(4)
  .bubble-box__pointer {
  right: 12px;
  left: inherit;
  transform: rotateY(-180deg);
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(1) {
  margin-left: 30px;
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(4) {
  margin-left: 135px;
}
@media (max-width: 1199px) {
  .mypage-guide .tab-ssem .tab-guide__visual .bubble-box {
    width: 100%;
  }
  .mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(1) {
    margin: 0 0 40px;
  }
  .mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(2) {
    margin: 0 0 40px;
  }
  .mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(3) {
    margin: 0 0 40px;
  }
  .mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(4) {
    margin: 0 0 40px;
  }
}
.mypage-guide .tab-ssem .guide-list li {
  min-height: 226px;
}
.mypage-guide .tab-ssem .guide-list li:nth-child(1) {
  background-color: rgba(244, 239, 255, 0.5);
}
.mypage-guide .tab-ssem .guide-list li:nth-child(1) .ico-guide {
  background-image: url("../images/mypage/guide-info-1.svg");
}
.mypage-guide .tab-ssem .guide-list li:nth-child(2) {
  background-color: rgba(242, 245, 255, 0.5);
}
.mypage-guide .tab-ssem .guide-list li:nth-child(2) .ico-guide {
  background-image: url("../images/mypage/guide-info-2.svg");
}
.mypage-guide .tab-ssem .guide-list li:nth-child(3) {
  background-color: rgba(238, 247, 240, 0.5);
}
.mypage-guide .tab-ssem .guide-list li:nth-child(3) .ico-guide {
  background-image: url("../images/mypage/guide-info-3.svg");
}
.mypage-guide .tab-ssem .guide-list li::nth-child(1) .ico-guide {
  margin-top: 13px;
}
.mypage-guide .tab-video .tab-guide__visual {
  padding: 40px 44px;
  gap: 30px;
  justify-content: flex-start;
  align-items: stretch;
}
.mypage-guide .tab-video .tab-guide__visual .bubble-box {
  width: calc(50% - 15px);
}
.mypage-guide .tab-video .tab-guide__visual .bubble-box__cont {
  flex-direction: column;
  align-items: flex-start;
  min-height: 165px;
  gap: 31px;
  padding: 24px 24px 20px;
  font-size: 18px;
  line-height: 30px;
  height: 100%;
}
.mypage-guide
  .tab-video
  .tab-guide__visual
  .bubble-box:nth-child(1)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-video-visual-1.png");
}
.mypage-guide
  .tab-video
  .tab-guide__visual
  .bubble-box:nth-child(2)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-video-visual-2.png");
}
.mypage-guide
  .tab-video
  .tab-guide__visual
  .bubble-box:nth-child(3)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-video-visual-3.png");
}
.mypage-guide
  .tab-video
  .tab-guide__visual
  .bubble-box:nth-child(4)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-video-visual-4.png");
}
.mypage-guide .tab-video .guide-list li {
  min-height: 187px;
}
.mypage-guide .tab-video .guide-list li p {
  min-height: 0px;
}
.mypage-guide .tab-video .guide-list__nth1 li:nth-child(1) .ico-guide {
  background-image: url("../images/mypage/guide-video-1.svg");
}
.mypage-guide .tab-video .guide-list__nth1 li:nth-child(2) .ico-guide {
  background-image: url("../images/mypage/guide-video-2.svg");
}
.mypage-guide .tab-video .guide-list__nth1 li:nth-child(3) .ico-guide {
  background-image: url("../images/mypage/guide-video-3.svg");
}
.mypage-guide .tab-video .guide-list__nth2 {
  padding-bottom: 60px;
}
.mypage-guide .tab-video .guide-list__nth2 li:nth-child(1) .ico-guide {
  background-image: url("../images/mypage/guide-video-4.svg");
}
.mypage-guide .tab-video .guide-list__nth2 li:nth-child(2) .ico-guide {
  background-image: url("../images/mypage/guide-video-5.svg");
}
.mypage-guide .tab-video .guide-list__nth2 li:nth-child(3) .ico-guide {
  background-image: url("../images/mypage/guide-video-6.svg");
}

.mypage-guide {
  padding: 0px;
}
@media (max-width: 1199px) {
  .mypage-guide .xs-br {
    display: none;
  }
}
.mypage-guide .tab-text {
  margin-top: 14px;
}
.mypage-guide .tab-text .tab--button {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.6);
}
.mypage-guide .tab-text .tab--button.active {
  font-size: 18px;
  color: #7e44fb;
  font-weight: 800;
}
.mypage-guide .guide-list {
  padding: 60px 24px 40px;
}
.mypage-guide .guide-list__title {
  font-weight: 700;
  font-size: 18px;
  line-height: 30px;
  margin-bottom: 30px;
  text-align: center;
}
.mypage-guide .guide-list ul {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 24px;
}
@media (max-width: 1199px) {
  .mypage-guide .guide-list ul {
    gap: 20px;
  }
}
.mypage-guide .guide-list ul + .guide-list__title {
  margin-top: 50px;
}
.mypage-guide .guide-list li {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 33.3%;
  border-radius: 20px;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  padding: 0 21px;
  background-color: #f8f9fd;
}
@media (max-width: 1199px) {
  .mypage-guide .guide-list li {
    padding: 0 18px 15px;
    font-size: 14px;
    line-height: 22px;
  }
}
.mypage-guide .guide-list li .ico-guide {
  width: 100%;
  height: 120px;
  margin-bottom: 13px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: auto 100%;
}
.mypage-guide .guide-list li p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  min-height: 72px;
}
.mypage-guide .guide-list__button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin-top: 60px;
}
.mypage-guide .guide-list__button button {
  gap: 8px;
}
.mypage-guide .tab-guide__info {
  padding: 60px;
  text-align: center;
}
.mypage-guide .tab-guide__title {
  font-weight: 800;
  font-size: 30px;
  line-height: 34px;
  margin-bottom: 30px;
}
.mypage-guide .tab-guide__title strong {
  font-weight: 800;
  color: #7e44fb;
}
.mypage-guide .tab-guide__content {
  font-size: 18px;
  line-height: 30px;
}
.mypage-guide .tab-guide__visual {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: center;
  flex-wrap: wrap;
  background: #f4f2ff;
}
.mypage-guide .tab-guide__visual .bubble-box {
  position: relative;
  display: inline-block;
  vertical-align: top;
}
.mypage-guide .tab-guide__visual .bubble-box__pointer {
  position: absolute;
  left: 12px;
  bottom: -14px;
  width: 43px;
  height: 16px;
  z-index: 2;
}
.mypage-guide .tab-guide__visual .bubble-box__shadow {
  filter: drop-shadow(4px 0px 15px rgba(126, 68, 251, 0.15));
}
.mypage-guide .tab-guide__visual .bubble-box__cont {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: relative;
  border-radius: 20px;
  font-weight: 700;
  background-color: #ffffff;
  box-shadow: 4px 0px 15px rgba(126, 68, 251, 0.15);
  z-index: 2;
}
.mypage-guide .tab-guide__visual .bubble-box__cont .ico-guide__visual {
  width: 30px;
  height: 30px;
  background-size: 100% 100%;
}
.mypage-guide .tab-ssem .tab-guide__visual {
  padding: 62px 30px 78px;
  gap: 0px 56px;
}
@media (max-width: 1199px) {
  .mypage-guide .tab-ssem .tab-guide__visual {
    padding: 60px 30px 20px;
  }
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(1) {
  margin-top: 0px;
}
.mypage-guide
  .tab-ssem
  .tab-guide__visual
  .bubble-box:nth-child(1)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-info-visual-1.png");
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(2) {
  margin-top: 53px;
}
.mypage-guide
  .tab-ssem
  .tab-guide__visual
  .bubble-box:nth-child(2)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-info-visual-2.png");
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(3) {
  margin-top: 21px;
}
.mypage-guide
  .tab-ssem
  .tab-guide__visual
  .bubble-box:nth-child(3)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-info-visual-3.png");
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(4) {
  margin-top: 40px;
}
.mypage-guide
  .tab-ssem
  .tab-guide__visual
  .bubble-box:nth-child(4)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-info-visual-4.png");
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box__cont {
  height: 68px;
  gap: 15px;
  padding: 18px 20px;
  font-size: 16px;
  line-height: 28px;
}
.mypage-guide
  .tab-ssem
  .tab-guide__visual
  .bubble-box:nth-child(3)
  .bubble-box__pointer,
.mypage-guide
  .tab-ssem
  .tab-guide__visual
  .bubble-box:nth-child(4)
  .bubble-box__pointer {
  right: 12px;
  left: inherit;
  transform: rotateY(-180deg);
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(1) {
  margin-left: 30px;
}
.mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(4) {
  margin-left: 135px;
}
@media (max-width: 1199px) {
  .mypage-guide .tab-ssem .tab-guide__visual .bubble-box {
    width: 100%;
  }
  .mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(1) {
    margin: 0 0 40px;
  }
  .mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(2) {
    margin: 0 0 40px;
  }
  .mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(3) {
    margin: 0 0 40px;
  }
  .mypage-guide .tab-ssem .tab-guide__visual .bubble-box:nth-child(4) {
    margin: 0 0 40px;
  }
}
.mypage-guide .tab-ssem .guide-list li {
  min-height: 226px;
}
.mypage-guide .tab-ssem .guide-list li:nth-child(1) {
  background-color: rgba(244, 239, 255, 0.5);
}
.mypage-guide .tab-ssem .guide-list li:nth-child(1) .ico-guide {
  background-image: url("../images/mypage/guide-info-1.png");
}
.mypage-guide .tab-ssem .guide-list li:nth-child(2) {
  background-color: rgba(242, 245, 255, 0.5);
}
.mypage-guide .tab-ssem .guide-list li:nth-child(2) .ico-guide {
  background-image: url("../images/mypage/guide-info-2.png");
}
.mypage-guide .tab-ssem .guide-list li:nth-child(3) {
  background-color: rgba(238, 247, 240, 0.5);
}
.mypage-guide .tab-ssem .guide-list li:nth-child(3) .ico-guide {
  background-image: url("../images/mypage/guide-info-3.png");
}
.mypage-guide .tab-makeinfo {
  padding-bottom: 152px;
}
.mypage-guide .tab-makeinfo .tab-guide__visual {
  padding: 0px;
  height: 327px;
}
.mypage-guide .tab-makeinfo .tab-guide__visual.nth1 .tab-visual__image {
  background-image: url("../images/mypage/guide-makeinfo-1.png");
}
.mypage-guide .tab-makeinfo .tab-guide__visual.nth1 .tab-visual__content {
  padding-right: 56px;
}
.mypage-guide
  .tab-makeinfo
  .tab-guide__visual.nth1
  .tab-visual__content
  strong::before {
  background-color: #7e44fb;
  opacity: 0.2;
  right: -14px;
  top: -13px;
}
.mypage-guide .tab-makeinfo .tab-guide__visual.nth2 {
  background-color: #eef6f0;
  margin-top: 24px;
}
.mypage-guide .tab-makeinfo .tab-guide__visual.nth2 .tab-visual__content {
  padding-left: 77px;
}
.mypage-guide .tab-makeinfo .tab-guide__visual.nth2 .tab-visual__image {
  background-image: url("../images/mypage/guide-makeinfo-2.png");
}
.mypage-guide .tab-makeinfo .tab-guide__visual.nth2 strong::before {
  background-color: #74de97;
  opacity: 0.3;
  left: -15px;
  top: -5px;
}
.mypage-guide .tab-makeinfo .tab-visual__image {
  width: 54.6%;
  height: 100%;
  background-size: 100% auto;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
.mypage-guide .tab-makeinfo .tab-visual__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 45.4%;
}
.mypage-guide .tab-makeinfo .tab-visual__content sub {
  display: block;
  font-size: 16px;
  line-height: 24px;
  color: rgba(0, 0, 0, 0.5);
  margin-bottom: 13px;
}
.mypage-guide .tab-makeinfo .tab-visual__content strong {
  position: relative;
  display: block;
  font-weight: 700;
  font-size: 24px;
  line-height: 27px;
  margin-bottom: 13px;
}
.mypage-guide .tab-makeinfo .tab-visual__content strong span {
  position: relative;
  z-index: 2;
}
.mypage-guide .tab-makeinfo .tab-visual__content strong::before {
  content: "";
  position: absolute;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  z-index: 1;
}
.mypage-guide .tab-makeinfo .tab-visual__content p {
  font-size: 14px;
  line-height: 22px;
  word-break: keep-all;
}
.mypage-guide .tab-video .tab-guide__visual {
  padding: 40px 44px;
  gap: 30px;
  justify-content: flex-start;
  align-items: stretch;
}
.mypage-guide .tab-video .tab-guide__visual .bubble-box {
  width: calc(50% - 15px);
}
.mypage-guide .tab-video .tab-guide__visual .bubble-box__cont {
  flex-direction: column;
  align-items: flex-start;
  min-height: 165px;
  gap: 31px;
  padding: 24px 24px 20px;
  font-size: 18px;
  line-height: 30px;
  height: 100%;
}
.mypage-guide
  .tab-video
  .tab-guide__visual
  .bubble-box:nth-child(1)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-video-visual-1.png");
}
.mypage-guide
  .tab-video
  .tab-guide__visual
  .bubble-box:nth-child(2)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-video-visual-2.png");
}
.mypage-guide
  .tab-video
  .tab-guide__visual
  .bubble-box:nth-child(3)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-video-visual-3.png");
}
.mypage-guide
  .tab-video
  .tab-guide__visual
  .bubble-box:nth-child(4)
  .ico-guide__visual {
  background-image: url("../images/mypage/guide-video-visual-4.png");
}
.mypage-guide .tab-video .guide-list li {
  min-height: 187px;
}
.mypage-guide .tab-video .guide-list li p {
  min-height: 0px;
}
.mypage-guide .tab-video .guide-list__nth1 {
  padding-bottom: 60px;
}
.mypage-guide .tab-video .guide-list__nth1 li:nth-child(1) .ico-guide {
  background-image: url("../images/mypage/guide-video-1.png");
}
.mypage-guide .tab-video .guide-list__nth1 li:nth-child(2) .ico-guide {
  background-image: url("../images/mypage/guide-video-2.png");
}
.mypage-guide .tab-video .guide-list__nth1 li:nth-child(3) .ico-guide {
  background-image: url("../images/mypage/guide-video-3.png");
}
.mypage-guide .tab-video .guide-list__nth2 {
  padding-bottom: 60px;
}
.mypage-guide .tab-video .guide-list__nth2 li:nth-child(1) .ico-guide {
  background-image: url("../images/mypage/guide-video-4.png");
}
.mypage-guide .tab-video .guide-list__nth2 li:nth-child(2) .ico-guide {
  background-image: url("../images/mypage/guide-video-5.png");
}
.mypage-guide .tab-video .guide-list__nth2 li:nth-child(3) .ico-guide {
  background-image: url("../images/mypage/guide-video-6.png");
}

.mypage-member {
  padding: 24px 24px 40px;
}
.mypage-member .box--edit-title {
  color: #000000;
  font-weight: 800;
  font-size: 20px;
  line-height: 23px;
}
.mypage-member .page__button {
  padding-top: 48px;
}
.mypage-member .join-info__form {
  padding-left: 0px;
}
.mypage-member .join-info__form .no--input td {
  font-size: 14px;
}
.mypage-member .input-box--text.is--large {
  font-size: 14px;
}
.mypage-member .input-box--text:not(input).is--large input {
  font-size: 14px;
}
.mypage-member .table--info a {
  color: #000000;
}
.mypage-member .table--info table tbody tr:not(:first-child) th {
  padding-top: 0px;
}
.mypage-member .table--info table tbody tr:not(:first-child) td {
  padding: 10px 30px;
}
.mypage-member .table--info td {
  padding: 10px 30px;
  font-size: 16px;
  line-height: 18px;
}
.mypage-member .table--info .table--edit__list {
  margin: -10px -30px;
}
.mypage-member .table--info .table--edit__list li {
  padding: 24px 30px;
}
.mypage-member .table--info .table--edit__list li + li {
  border-top: 1px solid #d9d9d9;
}

.member-leave--box {
  background: #fafafa;
  border-radius: 16px;
  padding: 38px;
}
.member-leave--box li {
  position: relative;
  font-size: 14px;
  line-height: 18px;
  color: rgba(0, 0, 0, 0.7);
  padding-left: 18px;
  padding-bottom: 19px;
}
.member-leave--box li:before {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 100%;
  background-color: #7e44fb;
  top: 5px;
  left: 0;
  z-index: 2;
}
.member-leave--box li:after {
  content: "";
  position: absolute;
  width: 1px;
  height: calc(100% - 9px);
  border-right: 1px dashed rgba(0, 0, 0, 0.6);
  top: 12px;
  left: 2px;
  opacity: 0.3;
  z-index: 1;
  box-sizing: border-box;
}
.member-leave--box li:last-child {
  padding-bottom: 0px;
}
.member-leave--box li:last-child:after {
  display: none;
}
.member-leave--box + .page__button {
  padding-top: 48px;
}

.mypage-terms {
  padding: 21px 24px 40px;
}
.mypage-terms .box--edit-title {
  gap: 14px;
  margin-top: 0;
  margin-bottom: 24px;
  font-size: 20px;
}
.mypage-terms .box--edit-title .f-14 {
  color: #000000;
}
.mypage-terms .box--edit-title > .dropdown--area {
  width: 160px;
}
.mypage-terms--box {
  background: #fafafa;
  border-radius: 16px;
  padding: 24px;
  overflow-y: auto;
  overflow: overlay;
  height: 689px;
  font-size: 14px;
  line-height: 22px;
  /* [KT요청 : 230908] 에디터 입력 내용 폰트 통일 */
}
.mypage-terms--box strong {
  display: block;
  font-weight: 700;
  font-size: 16px;
  line-height: 18px;
  color: #341761;
  margin-bottom: 8px;
  margin-top: 40px;
}
.mypage-terms--box strong:first-child {
  margin-top: 0px;
}
.mypage-terms--box * {
  font-size: 14px !important;
  line-height: 22px !important;
}
.mypage-terms .page__button {
  padding-top: 48px;
}

.mypage-alram {
  display: flex;
  flex-direction: row;
  gap: 20px;
  position: relative;
  padding: 24px;
  padding-right: 68px;
  border-bottom: 1px solid #d9d9d9;
}
.mypage-alram .input-check {
  flex-shrink: 0;
  flex-grow: 0;
  width: 24px;
  height: 24px;
  margin-top: 2px;
}
.mypage-alram .input-check .input--box::before {
  border-color: rgba(0, 0, 0, 0.4);
  border-radius: 24px;
}
.mypage-alram--center {
  display: flex;
  flex-direction: row;
  position: relative;
  padding-left: 100px;
}
.mypage-alram--center .state-box {
  flex-shrink: 0;
  flex-grow: 0;
  position: absolute;
  left: 0;
}
.mypage-alram--center .mypage-alram--textbox .textbox-title {
  display: flex;
  flex-direction: row;
  align-items: top;
}
.mypage-alram--center .mypage-alram--textbox .textbox-title .text {
  padding-top: 4px;
  padding-bottom: 4px;
  color: #000000;
  font-size: 18px;
  line-height: 20px;
  font-weight: 700;
}
.mypage-alram--center .mypage-alram--textbox .textbox-title .icon {
  display: none;
  visibility: hidden;
  margin-left: 4px;
}
.mypage-alram--center .mypage-alram--textbox .textbox-title .date {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  margin-left: 10px;
  color: #848484;
  font-size: 14px;
  line-height: 16px;
}
.mypage-alram--center .mypage-alram--textbox .textbox-title .date::before {
  display: block;
  width: 1px;
  height: 10px;
  background-color: rgba(0, 0, 0, 0.2);
  content: "";
}
.mypage-alram--center .mypage-alram--textbox .textbox-text {
  margin-top: 6px;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
  word-break: break-all;
  /* [이슈리스트 : 230825][2545] 마이페이지 알림: 이미지 비노출처리 */
}
.mypage-alram--center .mypage-alram--textbox .textbox-text pre {
  font-family: "NanumSquareRound", "Malgun Gothic", Arial, "Dotum", sans-serif;
  white-space: pre-wrap;
}
.mypage-alram--center .mypage-alram--textbox .textbox-text img {
  max-width: 100%;
}
.mypage-alram--center .mypage-alram--textbox .textbox-desc {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}
.mypage-alram--center .mypage-alram--textbox .textbox-desc span {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  color: #848484;
  font-size: 14px;
  line-height: 16px;
}
.mypage-alram--center
  .mypage-alram--textbox
  .textbox-desc
  span:not(:first-child)::before {
  display: block;
  width: 1px;
  height: 10px;
  background-color: rgba(0, 0, 0, 0.2);
  content: "";
}
.dim .mypage-alram--center .mypage-alram--textbox {
  opacity: 0.4;
}
.mypage-alram .info-tag__menu {
  position: absolute;
  top: 24px;
  right: 24px;
}
.mypage-alram .info-tag__menu .button-icon {
  width: 32px;
  height: 32px;
}
.mypage-alram .info-tag__menu .tab-menu--box {
  width: 145px;
  border-radius: 20px;
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.mypage-alram .info-tag__menu .tab-menu--box.text--center a {
  height: 46px;
  padding-right: 0;
  padding-left: 0;
  line-height: 46px;
}
.mypage-alram.fixed .mypage-alram--center .textbox-title .text {
  font-weight: 800;
}
.mypage-alram.fixed .mypage-alram--center .textbox-title .icon {
  display: block;
  visibility: visible;
}
.mypage-alram.fixed .mypage-alram--center .textbox-text {
  font-weight: 700;
}
.mypage-alram.noti {
  padding-top: 36px;
  padding-right: 24px;
  padding-bottom: 36px;
}
.mypage-alram.noti .mypage-alram--center {
  padding-left: 73px;
}
.mypage-alram.noti .mypage-alram--center .state-box {
  margin-top: 4px;
}
.mypage-alram.noti .mypage-alram--textbox .textbox-title .date {
  color: rgba(0, 0, 0, 0.5);
}
.mypage-alram.noti .mypage-alram--textbox .textbox-title .date::before {
  height: 14px;
  background-color: rgba(0, 0, 0, 0.3);
}
.mypage-alram.noti .mypage-alram--textbox .textbox-text {
  margin-top: 16px;
}

.mypage-alert {
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding-top: 63px;
}
.mypage-alert .box-bg__white {
  width: 100%;
}
.mypage-alert .box-bg__white > .mypage-alram {
  border-bottom-width: 0;
}
.mypage-alert .page__button {
  margin-top: 44px;
  padding-bottom: 40px;
}
.mypage-alert .tab--wrapper {
  width: 100%;
}
.mypage-alert .tab-tag--wrapper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.mypage-alert .tab-tag--wrapper .dropdown--area {
  width: 150px !important;
}
.mypage-alert .tab--contents {
  padding: 24px 24px 0;
}
.mypage-alert .tab-text {
  margin-top: 13px;
}
.mypage-alert .tab-text .tab--button {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.6);
}
.mypage-alert .tab-text .tab--button.active {
  font-weight: 700;
  font-size: 18px;
  color: #7e44fb;
}
.mypage-alert .tab-tag {
  padding-bottom: 8px;
}
.mypage-alert .tab-tag .tab--button.active {
  font-weight: 400;
  font-size: 18px;
}
.mypage-alert.is--task {
  /* [이슈리스트 : 230811][2221] 나의 할일: 10개 이상 스크롤 처리 */
}
.mypage-alert.is--task .tab-tag .tab--button:nth-child(2) {
  width: 160px;
}
.mypage-alert.is--task .tab-tag .tab--button:nth-child(3) {
  width: 169px;
}
.mypage-alert.is--task .tab-tag .tab--button:nth-child(7) {
  width: 92px;
}
.mypage-alert.is--task .tab-tag .tab--button:nth-child(8) {
  width: 110px;
}
.mypage-alert.is--task .tab--contents {
  overflow: hidden;
  overflow-y: auto;
  overflow: overlay;
  max-height: 1294px;
}
.mypage-alert.is--task .tab--contents > .mypage-alram:last-child {
  border-bottom-width: 0;
}
.mypage-alert .mypage-alram--link {
  display: flex;
  flex-direction: row;
  padding: 21px 24px;
  gap: 10px;
  border-top: 1px solid #d9d9d9;
}
.mypage-alert .mypage-alram--date {
  padding: 28px 24px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
}
.mypage-alert .mypage-alram .box--empty {
  flex-grow: 1;
  min-height: 482px;
}
.mypage-alert .mypage-alram .tab-tag .tab--button {
  padding: 0 20px;
}
.mypage-alert .mypage-alram .tab-tag .tab--button.active {
  padding: 0 18px;
}

.mypage--top {
  flex-shrink: 1;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  text-align: center;
}
.mypage--top-info {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  padding: 24px 0;
  background-color: #ffffff;
  border-radius: 16px;
}
.mypage--top-info + .tab-tag--wrapper {
  margin-top: 44px;
}
.mypage--top:not(:first-child)::before {
  position: absolute;
  width: 1px;
  top: 5px;
  left: 0;
  bottom: 5px;
  background-color: #d9d9d9;
  content: "";
}
.mypage--top .title {
  margin-top: 10px;
  color: rgba(0, 0, 0, 0.6);
  font-size: 16px;
  line-height: 18px;
  font-weight: 700;
}
.mypage--top .text {
  margin-top: 7px;
  color: #000000;
  font-size: 32px;
  line-height: 36px;
  font-weight: 700;
}

.test-home__ing {
  padding: 30px 24px 20px;
  margin-top: 24px;
}
.test-home__ing .title {
  margin-bottom: 24px;
  color: #000000;
  font-size: 24px;
  line-height: 27px;
  font-weight: 700;
}
.test-home__ing .swiper-container {
  padding-bottom: 4px;
}
.test-home__ing
  .swiper-container:not(.swiper-container-initialized)
  .swiper-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch;
  gap: 24px;
}
.test-home__ing
  .swiper-container:not(.swiper-container-initialized)
  .swiper-wrapper
  .swiper-slide {
  width: calc((100% - 48px) / 3);
}
.test-home__ing
  .swiper-container:not(.swiper-container-initialized)
  .swiper-pagination {
  margin-top: 0;
}
.test-home__ing .swiper-container .swiper-pagination {
  margin-top: 20px;
}
.test-home__ing.box--empty {
  position: relative;
  height: 356px;
  min-height: 0;
}
.test-home__ing.box--empty .empty--inner {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}
.test-home__ing.box--empty .box--empty-text {
  text-align: center;
  gap: 48px;
}
.test-home__ing.box--empty .box--empty-text p {
  font-size: 20px;
  line-height: 35px;
}
.test-home__ing.box--empty .empty--bg {
  position: relative;
  z-index: 5;
}
.test-home__ing.box--empty .empty--bg img {
  display: block;
  width: 100%;
}
.test-home__title {
  margin-top: 80px;
  color: #000000;
  font-size: 28px;
  line-height: 32px;
  font-weight: 700;
}
.test-home__title .desc {
  vertical-align: middle;
  display: inline-block;
  padding-left: 16px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 16px;
  line-height: 18px;
}
.test-home__status {
  margin-top: 23px;
}
.test-home__status .tab-text .tab--button.active {
  font-weight: 800;
}
.test-home__status .tab-text .tab--button:not(.active) {
  color: rgba(21, 21, 21, 0.5);
  font-weight: 700;
}
.test-home__status-subject {
  padding: 0 24px;
}
.test-home__status-subject .tab--wrapper {
  padding: 40px 0;
}
.test-home__status-subject .tab--wrapper .tab-box {
  gap: 0;
  border-bottom: none;
}
.test-home__status-subject .tab--wrapper .box-bg__gray {
  padding: 24px;
  background-color: #f6f6f6;
  border-radius: 16px;
}
.test-home__status-subject .tab--wrapper .box-bg__gray .box-bg__white {
  border-radius: 16px;
}
.test-home__status-subject .tab--wrapper .box-bg__gray .box-bg__white .graph {
  overflow: hidden;
  overflow-x: auto;
  padding-top: 30px;
  padding-right: 30px;
  padding-left: 22px;
  overscroll-behavior: none;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .graph
  .legend-html {
  padding-top: 36px;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .graph
  .ai-data {
  margin-top: -32px;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .graph
  .ai-data::after {
  top: 67px;
  height: 222px;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .graph
  .ai-data.single {
  margin-top: -12px;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .graph
  .ai-data.single::after {
  top: 47px;
  height: 222px;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white.scroll-x
  .graph {
  overflow: hidden;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white.scroll-x
  .graph,
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white.scroll-x
  .graph
  .legend-html {
  position: initial;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white.scroll-x
  .graph
  .legend {
  top: 30px;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .aitest-bar-chart.large {
  position: initial;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .aitest-bar-chart.large.legend-html
  .legend {
  top: 30px;
  right: 30px;
}
.test-home__status-subject
  .tab--wrapper
  .box-bg__gray
  .box-bg__white
  .aitest-bar-chart.large
  .ai-data {
  margin-top: 1px;
}
.test-home__status-subject .tab--wrapper .table--list {
  margin-top: 24px;
}
.test-home__status-subject > .table--list {
  padding: 30px 0 40px;
  margin-top: 0;
}
.test-home__status-subject .aitest--scrolled {
  overflow: hidden;
  position: relative;
  padding-top: 46px;
  margin-top: 24px;
}
.test-home__status-subject .aitest--scrolled > .table--list {
  margin-top: 0;
}
.test-home__status-subject .aitest--scrolled > .table--list > table {
  position: absolute;
  top: 0;
}
.test-home__status-subject .aitest--scrolled .scroll-target {
  overflow: auto;
  max-height: 1130px;
  -webkit-transform: translate3d(0, 0, 0);
}
.test-home__status-subject .aitest--scrolled .scroll-target > .tbody {
  position: relative;
  width: fit-content;
}
.test-home__status-subject .aitest--scrolled .scroll-target > .tbody::before,
.test-home__status-subject .aitest--scrolled .scroll-target > .tbody::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 100%;
  top: 0;
  background-color: #ffffff;
  z-index: 5;
}
.test-home__status-subject .aitest--scrolled .scroll-target > .tbody::before {
  left: 0;
}
.test-home__status-subject .aitest--scrolled .scroll-target > .tbody::after {
  right: 0;
}
.test-home__status-table {
  max-height: 1130px;
}
.result-total .test-home__status-table {
  max-height: fit-content;
}
.test-home__status-table .tbody {
  margin-top: 22px;
}
.test-home__status-table table th:last-child,
.test-home__status-table table td:last-child {
  padding-right: 14px;
}
.test-home__status-table table td {
  vertical-align: middle;
  height: 110px;
  padding: 24px 0;
  color: #000000;
  font-size: 16px;
  line-height: 22px;
}
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.great
  + .tooltip--box,
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.normal
  + .tooltip--box,
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.verypoor
  + .tooltip--box {
  right: -26px;
}
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.great
  + .tooltip--box
  .tooltip--box-inner::after,
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.great
  + .tooltip--box
  .tooltip--box-inner::before,
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.normal
  + .tooltip--box
  .tooltip--box-inner::after,
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.normal
  + .tooltip--box
  .tooltip--box-inner::before,
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.verypoor
  + .tooltip--box
  .tooltip--box-inner::after,
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.verypoor
  + .tooltip--box
  .tooltip--box-inner::before {
  right: 49px;
}
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.verygood
  + .tooltip--box,
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.poor
  + .tooltip--box {
  right: -10px;
}
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.verygood
  + .tooltip--box
  .tooltip--box-inner::after,
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.verygood
  + .tooltip--box
  .tooltip--box-inner::before,
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.poor
  + .tooltip--box
  .tooltip--box-inner::after,
.test-home__status-table
  table
  td
  .tooltip--box-wrap
  .tooltip--button.poor
  + .tooltip--box
  .tooltip--box-inner::before {
  right: 46px;
}
.test-home__status-table table td .tooltip--box-wrap .tooltip--box {
  width: 288px;
  left: auto;
  right: 0;
}
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.great
  + .tooltip--box,
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.normal
  + .tooltip--box,
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.verypoor
  + .tooltip--box {
  right: -32px;
}
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.great
  + .tooltip--box
  .tooltip--box-inner::after,
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.great
  + .tooltip--box
  .tooltip--box-inner::before,
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.normal
  + .tooltip--box
  .tooltip--box-inner::after,
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.normal
  + .tooltip--box
  .tooltip--box-inner::before,
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.verypoor
  + .tooltip--box
  .tooltip--box-inner::after,
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.verypoor
  + .tooltip--box
  .tooltip--box-inner::before {
  right: 54px;
}
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.verygood
  + .tooltip--box,
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.poor
  + .tooltip--box {
  right: -16px;
}
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.verygood
  + .tooltip--box
  .tooltip--box-inner::after,
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.verygood
  + .tooltip--box
  .tooltip--box-inner::before,
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.poor
  + .tooltip--box
  .tooltip--box-inner::after,
.test-home__status-table
  table
  td:last-child
  .tooltip--box-wrap
  .tooltip--button.poor
  + .tooltip--box
  .tooltip--box-inner::before {
  right: 52px;
}
.test-home__status-table table td.num {
  padding-left: 42px;
  text-align: left;
}
.test-home__status-table table td.title {
  vertical-align: top;
  padding: 0;
  padding-left: 31px;
  border-bottom: none;
  text-align: left;
}
.test-home__status-table table td.title > div {
  vertical-align: middle;
  justify-content: start;
  min-height: 48px;
  margin: 31px 0;
  padding-left: 4px;
  border-bottom: none;
  line-height: 48px;
}
.test-home__status-table table td.title p {
  display: inline-block;
  min-height: 24px;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  word-break: keep-all;
}
.test-home__status-table table td.date > div {
  text-align: left;
}
.test-home__status-table table td.date.date-empty > div {
  text-align: center;
}
.test-home__status-table table td.total {
  padding-right: 44px;
  color: #7e44fb;
  font-size: 16px;
  text-align: right;
  line-height: 18px;
}
.test-home__status-table table td.total strong {
  display: inline-block;
  width: 76px;
  padding-left: 8px;
  text-align: center;
  font-weight: 800;
}
.test-home__status-table table td.detail > div {
  flex-direction: column;
}
.test-home__status-table table td.detail .button-main {
  width: 75px;
  padding-right: 0;
  padding-left: 0;
}
.test-home__status-table table td.detail .button-main + .button-main {
  margin-top: 5px;
}
.test-home__status-table table td.category--box {
  vertical-align: top;
  padding: 19px 0;
}
.test-home__status-table table td.category--box table tbody tr td,
.test-home__status-table table td.category--box table tbody tr:last-child td {
  border: none;
}
.test-home__status-table table td.category--box table tbody td {
  vertical-align: middle;
  height: auto;
  padding: 20px 0;
}
.test-home__status-table table td.category--box .aitest--more td {
  height: auto;
  padding-top: 20px;
  padding-bottom: 30px;
}
.test-home__status-table
  table
  td.category--box
  .aitest--more
  td
  .aitest--more__button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 34px;
  height: 34px;
  margin-right: auto;
  margin-left: auto;
  background-color: #f6f6f6;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 34px;
}
.test-home__status-table
  table
  td.category--box
  .aitest--more
  td
  .aitest--more__button.show {
  transform: rotate(180deg);
}
.test-home__status-table table td .list ol {
  margin-left: 15px;
  text-align: left;
}
.test-home__status-table table td .list.category ol {
  margin-left: 0;
}
.test-home__status-table table td ol li,
.test-home__status-table table td ul li {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 16px;
  line-height: 22px;
  list-style: decimal;
  list-style-position: inside;
}
.test-home__status-table table tr.total-row {
  background-color: #f9f6ff;
}
.test-home__status-table table tr.total-row td {
  height: 47px;
  padding-top: 14px;
  padding-bottom: 14px;
  border-top: 2px solid #ddd1ed;
}
.test-home__status-table table tr.total-row + tr td {
  border-top: 1px solid #ddd1ed;
}
.test-home__status-table table tr.total-row + tr td.category--box {
  border-bottom: none;
}
.test-home__status-table table tr.total-row + tr td:first-child {
  border-bottom: none;
}
.test-home__status-table table tr.total-row + tr:last-child td {
  border-bottom: none;
}
.test-home__status-table table tr.no-tray td {
  border-bottom: none;
}
.test-home__status-table table tbody tr td {
  padding-top: 0;
  padding-bottom: 0;
}
.test-home__status-table table tbody:last-child tr:last-child td {
  border-bottom: 1px solid #d9d9d9;
}
.test-home .detail-analysis--box:first-child > div {
  margin-top: 0;
  padding-right: 24px;
}
.test-home .legend-html {
  padding-top: 71px;
}
.test-home .legend .legend-line .row .chip {
  width: 17px;
  height: 1px;
  border-width: 1px;
}
.test-home .legend .legend-line .row:nth-child(1) .chip {
  border-style: solid;
  border-color: #45bcff;
}
.test-home .legend .legend-line .row:nth-child(2) .chip {
  border-style: dashed;
  border-color: #cfcfcf;
}
.test-home .legend .legend-dot .row .chip {
  width: 8px;
  height: 8px;
  border: none;
}
.test-home .legend .legend-dot .row:nth-child(4n-3) .chip {
  background-color: #aee6fc;
}
.test-home .legend .legend-dot .row:nth-child(4n-2) .chip {
  background-color: #7d89f0;
}
.test-home .legend .legend-dot .row:nth-child(4n-1) .chip {
  background-color: #a56ded;
}
.test-home .legend .legend-dot .row:nth-child(4n) .chip {
  background-color: #d46fdd;
}
.test-home .tab-tags--box .box--empty {
  gap: 8px;
  width: calc(100% - 72px);
  min-height: 295px;
  background-color: #ffffff;
  border-radius: 10px;
  font-size: 20px;
  line-height: 35px;
  text-align: center;
}
.test-home .tab-tags--box .box--empty .box--empty-icon {
  width: 70px;
  height: 70px;
}
.test-home .tab-tags--box .box--empty .button-main {
  margin-top: 35px;
}
.test-home .aitest--scrolled {
  overflow: hidden;
  position: relative;
  padding-top: 46px;
  margin-top: 24px;
}
.test-home .aitest--scrolled > .table--list {
  margin-top: 0;
}
.test-home .aitest--scrolled > .table--list > table {
  position: absolute;
  top: 0;
}
.test-home .aitest--scrolled .scroll-target {
  overflow: auto;
  max-height: 1130px;
  -webkit-transform: translate3d(0, 0, 0);
}
.test-home .aitest--scrolled .scroll-target > .tbody {
  position: relative;
  width: fit-content;
}
.test-home .aitest--scrolled .scroll-target > .tbody::before,
.test-home .aitest--scrolled .scroll-target > .tbody::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 100%;
  top: 0;
  background-color: #ffffff;
  z-index: 5;
}
.test-home .aitest--scrolled .scroll-target > .tbody::before {
  left: 0;
}
.test-home .aitest--scrolled .scroll-target > .tbody::after {
  right: 0;
}

.test-subject__graph {
  padding: 28px 30px 0;
  margin-top: 24px;
}
.test-subject__graph .title {
  margin-bottom: 24px;
  color: #000000;
  font-size: 24px;
  line-height: 27px;
  font-weight: 700;
}
.test-subject__graph .title .desc {
  vertical-align: middle;
  display: inline-block;
  padding-left: 16px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 16px;
  line-height: 18px;
}
.test-subject__graph .graph {
  overflow: hidden;
  overflow-x: auto;
  margin-top: -45px;
  overscroll-behavior: none;
}
.test-subject__graph .graph .aitest-bar-chart.large {
  position: initial;
}
.test-subject__graph .graph .aitest-bar-chart.large.legend-html .legend {
  top: 0;
  right: 30px;
}
.test-subject__graph .graph .aitest-bar-chart.large .ai-data {
  margin-top: 1px;
}
.test-subject__table {
  padding: 24px 24px 40px;
  margin-top: 24px;
}

.test-start .box-bg__white {
  padding: 20px 38px 40px;
  margin-top: 84px;
}
.test-start .box-bg__white table th {
  vertical-align: top;
  padding: 30px 0;
  color: #000000;
  font-size: 18px;
  line-height: 20px;
  font-weight: 700;
  text-align: left;
}
.test-start .box-bg__white table td {
  padding: 30px 14px;
  color: #000000;
  font-size: 18px;
  line-height: 20px;
}
.test-start .box-bg__white table .line td {
  border-bottom: 1px solid #cccccc;
}
.test-start .box-bg__white table .date-start td {
  padding-top: 20px;
  padding-bottom: 10px;
}
.test-start .box-bg__white table .date-end td {
  padding-top: 10px;
  padding-bottom: 20px;
}
.test-start .box-bg__white table .input-box {
  width: 205px;
}
.test-start .box-bg__white table .dropdown--area {
  width: 86px;
}
.test-start__button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 48px;
  gap: 12px;
}
.test-start__button .button-main {
  width: 240px;
}

.test-select .workbook-make.type--select {
  padding-top: 84px;
}
.test-select .workbook-make__content {
  height: 685px;
}
.test-select .workbook-make__content .box--edit-title .dropdown--area {
  flex-grow: 0;
  width: 260px;
}
.test-select
  .workbook-make__content
  .page__button.is--small
  button:not(.width-240) {
  width: 240px;
}
@media (max-width: 1199px) {
  .test-select
    .workbook-make__content
    .page__button.is--small
    button:not(.width-240) {
    width: 200px;
  }
}
.test-select .workbook-make__scroll {
  height: 561px;
  padding-bottom: 0;
}
/* .test-select .workbook-make__scroll .table--list table tbody tr:nth-child(5) td { 240226 삭제
  border-bottom: none;
} */

.test-result .workbook-detail--info {
  margin-top: 84px;
}
.test-result .workbook-detail--info .contents-info-box {
  padding: 34px 34px 14px;
}
.test-result .workbook-detail--info .detail-analysis--box {
  padding: 34px 24px;
  border-top: 1px solid #d9d9d9;
}
.test-result .workbook-detail--info .detail-analysis--box > div {
  margin-top: 0;
  padding-right: 24px;
}
.test-result .workbook-detail--info + .tab--wrapper {
  margin-top: 48px;
}
.test-result .tab--wrapper .tab--contents {
  padding: 24px;
}
.test-result .total-analysis--graph .graph-title,
.test-result .total-collect--table .graph-title {
  color: #000000;
  font-size: 16px;
  line-height: 18px;
  font-weight: 700;
}
.test-result .total-collect--table {
  padding: 20px 24px 39px;
}
.test-result .total-collect--table table {
  margin-top: 35px;
}
.test-result .total-collect--table table th,
.test-result .total-collect--table table td {
  color: #000000;
  height: 61px;
  font-size: 16px;
  line-height: 18px;
}
.test-result .total-collect--table table thead th {
  height: 32px;
  background-color: #fafafa;
  font-size: 14px;
  font-weight: 400;
  text-align: center;
  line-height: 16px;
}
.test-result .total-collect--table table thead th:first-child {
  border-radius: 20px 0 0 20px;
}
.test-result .total-collect--table table thead th:last-child {
  border-radius: 0 20px 20px 0;
}
.test-result .total-collect--table table tr:not(:first-child) {
  border-top: 1px solid rgba(113, 113, 113, 0.16);
}
.test-result .total-collect--table table tr th {
  font-weight: 400;
}
.test-result .total-collect--table table tr td {
  text-align: center;
}
.test-result .total-collect--table table tr td:not(:first-child) {
  border-left: 1px solid rgba(113, 113, 113, 0.16);
}
.test-result .total-collect--table table.tbody {
  margin-top: 15px;
}
.test-result .total-collect--table table.tbody th {
  padding-left: 14px;
  text-align: left;
}
.test-result__total .box-bg__grayf6 {
  padding: 24px;
}
.test-result__total .box-bg__grayf6 .box--edit-title {
  height: 40px;
  margin-bottom: 14px;
}
.test-result__total .result-total__result .box--edit-title {
  margin-top: 0;
  margin-bottom: 0;
}
.test-result__total .result-total__result .report-month__badgebox {
  padding-top: 14px;
  padding-bottom: 30px;
  margin-top: 14px;
}
.test-result__total
  .result-total__result
  .report-month__badgebox
  .month__badge {
  flex-shrink: 0;
  flex-grow: 0;
  position: relative;
  width: 38.4689%;
}
.test-result__total
  .result-total__result
  .report-month__badgebox
  .month__badge::after {
  position: absolute;
  display: block;
  width: 1px;
  top: 0;
  right: 0;
  bottom: 0;
  background-color: #d9d9d9;
  content: "";
}
.test-result__total
  .result-total__result
  .report-month__badgebox
  .month__badge
  .text {
  font-size: 22px;
  line-height: 32px;
}
.test-result__total
  .result-total__result
  .report-month__badgebox
  .month__badge
  + .month__right,
.test-result__total
  .result-total__result
  .report-month__badgebox
  .month__badge.is--student
  + .month__right {
  background: none;
}
.test-result__total
  .result-total__result
  .report-month__badgebox
  .month__right {
  width: 61.5311%;
  padding-right: 40px;
  padding-left: 40px;
}
@media (max-width: 1199px) {
  .test-result__total
    .result-total__result
    .report-month__badgebox
    .month__right {
    padding-right: 0;
    padding-left: 0;
  }
}
.test-result__total
  .result-total__result
  .report-month__badgebox
  .month__right
  .doughnut-chart__wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  max-width: 516px;
  padding-left: 10px;
}
@media (max-width: 1199px) {
  .test-result__total
    .result-total__result
    .report-month__badgebox
    .month__right
    .doughnut-chart__wrapper {
    padding-left: 0;
  }
}
.test-result__total
  .result-total__result
  .report-month__badgebox
  .month__right
  .doughnut-chart__wrapper
  .doughnut-chart,
.test-result__total
  .result-total__result
  .report-month__badgebox
  .month__right
  .doughnut-chart__wrapper
  .doughnut-chart
  .chart-total {
  width: 230px;
  height: 230px;
}
@media (max-width: 1199px) {
  .test-result__total
    .result-total__result
    .report-month__badgebox
    .month__right
    .doughnut-chart__wrapper
    .doughnut-chart,
  .test-result__total
    .result-total__result
    .report-month__badgebox
    .month__right
    .doughnut-chart__wrapper
    .doughnut-chart
    .chart-total {
    width: 200px;
    height: 200px;
  }
}
.test-result__total
  .result-total__result
  .report-month__badgebox
  .month__right
  .doughnut-chart__wrapper
  .doughnut-chart
  .legend
  .row {
  width: 208px;
}
.test-result__total
  .result-total__result
  .report-month__badgebox
  .month__right
  .doughnut-chart__wrapper
  .doughnut-chart
  .chart-total {
  top: 50%;
  transform: translateY(-50%);
  margin-left: 10px;
}
@media (max-width: 1199px) {
  .test-result__total
    .result-total__result
    .report-month__badgebox
    .month__right
    .doughnut-chart__wrapper
    .doughnut-chart
    .chart-total {
    margin-left: 0;
  }
}
.test-result__total .result-total__analysis {
  margin-top: 30px;
}
.test-result__total .result-total__analysis .total-analysis--graph {
  padding: 20px 24px 0;
}
@media (max-width: 1199px) {
  .test-result__total .result-total__analysis .total-analysis--graph {
    padding-right: 16.8px;
    padding-left: 16.8px;
  }
}
.test-result__total
  .result-total__analysis
  .total-analysis--graph
  .graph-button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 16px;
}
.test-result__total
  .result-total__analysis
  .total-analysis--graph
  .graph-button
  .cell-06 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 10px 20px 10px 15px;
  margin-top: 24px;
  color: #000000;
  font-size: 16px;
  line-height: 18px;
  border-radius: 50px;
}
@media (max-width: 1199px) {
  .test-result__total
    .result-total__analysis
    .total-analysis--graph
    .graph-button
    .cell-06 {
    font-size: 14px;
  }
}
.test-result__total
  .result-total__analysis
  .total-analysis--graph
  .graph-button
  .cell-06
  .chip {
  flex-shrink: 0;
  flex-grow: 0;
  width: 8px;
  height: 8px;
  border-radius: 8px;
}
.test-result__total
  .result-total__analysis
  .total-analysis--graph
  .graph-button
  .cell-06
  .title {
  width: 121px;
  font-size: 16px;
}
.test-result__total
  .result-total__analysis
  .total-analysis--graph
  .graph-button
  .cell-06
  .number {
  width: 50px;
  font-size: 16px;
  font-weight: 800;
  text-align: right;
}
.test-result__total
  .result-total__analysis
  .total-analysis--graph
  .graph-button
  .cell-06:first-child {
  background-color: rgba(0, 0, 0, 0.08);
  border: 1px solid rgba(0, 0, 0, 0.12);
}
.test-result__total
  .result-total__analysis
  .total-analysis--graph
  .graph-button
  .cell-06:first-child
  .chip {
  background-color: #7d7d7d;
}
.test-result__total
  .result-total__analysis
  .total-analysis--graph
  .graph-button
  .cell-06:last-child {
  background-color: rgba(164, 121, 255, 0.1);
  border: 1px solid rgba(164, 121, 255, 0.2);
}
.test-result__total
  .result-total__analysis
  .total-analysis--graph
  .graph-button
  .cell-06:last-child
  .chip {
  background-color: #a479ff;
}
.test-result__total .result-total__analysis .total-analysis--graph .graph-box {
  position: relative;
  overflow: hidden;
  padding-top: 109px;
  margin-top: -80px;
  height: 316px;
}
.test-result__total
  .result-total__analysis
  .total-analysis--graph
  .double-bar-chart {
  position: initial;
  height: 259px;
  padding-top: 0;
}
.test-result__student {
  padding-bottom: 36px;
}
@media (max-width: 1199px) {
  .test-result__student .student--card {
    width: calc((100% - 48px) / 2);
  }
}
.test-result__student .student--card__top {
  gap: 27px;
  justify-content: start;
}
.test-result__student .student--card__top .card-top__right {
  flex-shrink: 0;
  flex-grow: 0;
}
.test-result__student .student--card__bottom {
  overflow: hidden;
  padding: 26px 24px 0;
}
.test-result__student .student--card__bottom .total-analysis--graph {
  flex-shrink: 0;
  flex-grow: 0;
  width: 100%;
}
.test-result__student .student--card__bottom .total-analysis--graph .graph-box {
  overflow: hidden;
  height: 266px;
  margin-top: -19px;
  margin-bottom: 14px;
}
.test-result__student
  .student--card__bottom
  .total-analysis--graph
  .graph-box
  .double-bar-chart {
  width: 100%;
  height: 296px;
  padding-top: 47px;
}
.test-result__student .test-home__status-table td.total {
  text-align: center;
}

.result-total .contents-info__sub {
  padding-top: 0;
  padding-bottom: 33px;
}
.result-total .mystudent--contents .mystudent--card__box .student--card {
  border-color: rgba(0, 0, 0, 0.14);
}
.result-total .mystudent--contents .mystudent--card__box .student--card__top {
  padding: 26px 24px;
}
.result-total
  .mystudent--contents
  .mystudent--card__box
  .student--card__top
  .card-top__left {
  margin-top: 2px;
}
.result-total
  .mystudent--contents
  .mystudent--card__box
  .student--card__top
  .card-top__left
  .user-name {
  margin-bottom: 15px;
}
.result-total
  .mystudent--contents
  .mystudent--card__box
  .student--card__top
  .card-top__right {
  flex-shrink: 1;
  flex-grow: 1;
}
.result-total
  .mystudent--contents
  .mystudent--card__box
  .student--card__top
  .card-top__right
  button
  + .text-bullet {
  margin-top: 16px;
}
.result-total
  .mystudent--contents
  .mystudent--card__box
  .student--card__top
  .card-top__right
  .text-bullet {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.result-total
  .mystudent--contents
  .mystudent--card__box
  .student--card__top
  .card-top__right
  .text-bullet
  span {
  width: auto;
}
.result-total .mystudent--list .test-home__status-table th,
.result-total .mystudent--list .test-home__status-table td {
  color: #000000;
}
.result-total .mystudent--list .test-home__status-table th:first-child,
.result-total .mystudent--list .test-home__status-table td:first-child {
  padding-left: 10px;
}
.result-total .mystudent--list .test-home__status-table th:last-child,
.result-total .mystudent--list .test-home__status-table td:last-child {
  padding-right: 20px;
}
.result-total .mystudent--list .test-home__status-table tbody th {
  border-bottom: 1px solid #d9d9d9;
  font-size: 18px;
  line-height: 20px;
}
.result-total .mystudent--list .test-home__status-table tbody td {
  font-size: 16px;
  line-height: 22px;
}
.result-total .mystudent--list .test-home__status-table tbody td .state-box {
  min-width: 60px;
  height: 30px;
  padding-right: 8px;
  padding-left: 8px;
  /* [이슈리스트 : 230803][1539] 커서 추가 */
  cursor: pointer;
}
.result-total .mystudent--list .test-home__status-table tbody td.total {
  color: rgba(0, 0, 0, 0.7);
}
.result-total
  .mystudent--list
  .test-home__status-table
  tbody
  td.total
  .state-box {
  min-width: 80px;
  height: 35px;
  padding-right: 12px;
  padding-left: 12px;
  margin-left: 10px;
  border-width: 2px;
  font-size: 22px;
  font-weight: 700;
}

.result-student .test-result__total {
  padding-bottom: 0;
}
.result-student .test-result__total .report-month__badgebox {
  display: flex;
  flex-direction: row;
  justify-content: center;
  padding: 0;
  margin-top: 84px;
}
.result-student .test-result__total .report-month__badgebox .month__badge {
  overflow: visible;
  padding-bottom: 0;
}
.result-student
  .test-result__total
  .report-month__badgebox
  .month__badge::after {
  display: none;
}
.result-student
  .test-result__total
  .report-month__badgebox
  .month__badge
  .name {
  color: #000000;
  font-size: 28px;
  line-height: 32px;
}
.result-student
  .test-result__total
  .report-month__badgebox
  .month__badge
  .name
  strong {
  font-size: 40px;
  line-height: 45px;
  font-weight: 700;
}
.result-student
  .test-result__total
  .report-month__badgebox
  .month__badge
  .profile {
  width: 210px;
  height: 210px;
  margin-top: 28px;
}
.result-student
  .test-result__total
  .report-month__badgebox
  .month__badge
  .profile
  .image {
  width: 210px;
  height: 210px;
  border: 3px solid #ffffff;
}
.result-student
  .test-result__total
  .report-month__badgebox
  .month__badge
  .profile
  .bg {
  width: 392px;
  height: 113px;
  top: 19px;
  background-image: url("../images/img/badge-profile-bg3.svg");
}
.result-student
  .test-result__total
  .report-month__badgebox
  .month__badge
  .profile
  .badge {
  width: 142px;
  height: 142px;
  right: -48px;
  bottom: -35px;
}
.result-student .result-total__analysis {
  margin-top: 20px;
}
.result-student .result-total__analysis .box--edit-title {
  margin-bottom: 22px;
}
.result-student .total-collect--table table thead th:first-child {
  border-radius: 10px 0 0 10px;
}
.result-student .total-collect--table table thead th:last-child {
  border-radius: 0 10px 10px 0;
}

.test-student .report-month__badgebox {
  margin-top: 84px;
}
.test-student .report-month__badgebox .graph-title {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.test-student .total-collect--table {
  display: block;
  padding: 14px 24px 12px;
}
.test-student .total-collect--table table {
  margin-top: 0;
}
.test-student .total-collect--table table tr th {
  padding-left: 0;
  text-align: center;
}
.test-student .total-collect--table .swiper-pagination {
  height: 12px;
  margin-top: 21px;
}
.test-student
  .total-collect--table
  .swiper-pagination
  .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
}
.test-student
  .total-collect--table
  .swiper-pagination
  .swiper-pagination-bullet-active {
  width: 50px;
  height: 8px;
  margin-top: 2px;
}
.test-student .test-student__class {
  margin-top: 22px;
}
.test-student .test-student__class .tab--contents {
  padding: 24px 24px 12px;
}
.test-student
  .test-student__class
  .tab--contents
  .swiper-container:not(.swiper-container-initialized) {
  padding-bottom: 12px;
}
.test-student
  .test-student__class
  .tab--contents
  .swiper-container:not(.swiper-container-initialized)
  .swiper-wrapper {
  display: flex;
  flex-direction: row;
  gap: 24px;
}
.test-student
  .test-student__class
  .tab--contents
  .swiper-container:not(.swiper-container-initialized)
  .swiper-wrapper
  .swiper-slide {
  width: calc((100% - 72px) / 4);
}
.test-student
  .test-student__class
  .tab--contents
  .swiper-container:not(.swiper-container-initialized)
  .swiper-pagination {
  display: none;
  visibility: hidden;
}
.test-student.test-result .total-collect--table {
  /* 240911 수정 */
  display: block;
  padding: 24px 24px 24px;
  min-height: 344px;
}
.test-student.test-result .total-collect--table .table--list {
  margin-top: 11px; /* 240911 수정 */
}
.test-student.test-result .total-collect--table table {
  margin-top: 0;
}
.test-student.test-result .total-collect--table table tr th {
  padding-left: 0;
  text-align: center;
}
.test-student.test-result .test-student__class + .page__button {
  margin-top: 50px;
  margin-bottom: 30px;
}

.ai-student__top.box--empty {
  position: relative;
  height: 550px;
  min-height: 0;
}
.ai-student__top.box--empty .empty--inner {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}
.ai-student__top.box--empty .box--empty-text {
  text-align: center;
  gap: 48px;
}
.ai-student__top.box--empty .box--empty-text p {
  font-size: 20px;
  line-height: 35px;
}
.ai-student__top.box--empty .empty--bg {
  position: relative;
  z-index: 5;
}
.ai-student__top.box--empty .empty--bg img {
  display: block;
  width: 100%;
}

.test-dday--box {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 247px;
  padding: 24px 24px 26px;
  border-radius: 10px;
}
.test-dday--box.swiper-slide:nth-child(3n-2),
.test-dday--box.green {
  background-color: rgba(60, 192, 169, 0.2);
}
.test-dday--box.swiper-slide:nth-child(3n-2) .test-dday__tag,
.test-dday--box.green .test-dday__tag {
  background-color: rgba(64, 201, 177, 0.4);
  color: #037c68;
}
.test-dday--box.swiper-slide:nth-child(3n-2) .test-dday__day,
.test-dday--box.green .test-dday__day {
  color: #3cc0a9;
}
.test-dday--box.swiper-slide:nth-child(3n-2) .test-dday__percent,
.test-dday--box.green .test-dday__percent {
  color: #3cc0a9;
}
.test-dday--box.swiper-slide:nth-child(3n-2) .test-dday__graph,
.test-dday--box.green .test-dday__graph {
  background-color: rgba(60, 192, 169, 0.35);
}
.test-dday--box.swiper-slide:nth-child(3n-2) .test-dday__graph .graph,
.test-dday--box.green .test-dday__graph .graph {
  background-color: #29c2a8;
}
.test-dday--box.swiper-slide:nth-child(3n-1),
.test-dday--box.blue {
  background-color: rgba(126, 68, 251, 0.1);
}
.test-dday--box.swiper-slide:nth-child(3n-1) .test-dday__tag,
.test-dday--box.blue .test-dday__tag {
  background-color: rgba(126, 68, 251, 0.2);
  color: #7e44fb;
}
.test-dday--box.swiper-slide:nth-child(3n-1) .test-dday__day,
.test-dday--box.blue .test-dday__day {
  color: #7e44fb;
}
.test-dday--box.swiper-slide:nth-child(3n-1) .test-dday__percent,
.test-dday--box.blue .test-dday__percent {
  color: #9067ff;
}
.test-dday--box.swiper-slide:nth-child(3n-1) .test-dday__graph,
.test-dday--box.blue .test-dday__graph {
  background-color: #dccfff;
}
.test-dday--box.swiper-slide:nth-child(3n-1) .test-dday__graph .graph,
.test-dday--box.blue .test-dday__graph .graph {
  background-color: #7e44fb;
}
.test-dday--box.swiper-slide:nth-child(3n),
.test-dday--box.violet {
  background-color: rgba(88, 144, 255, 0.2);
}
.test-dday--box.swiper-slide:nth-child(3n) .test-dday__tag,
.test-dday--box.violet .test-dday__tag {
  background-color: rgba(88, 144, 255, 0.3);
  color: #3676f5;
}
.test-dday--box.swiper-slide:nth-child(3n) .test-dday__day,
.test-dday--box.violet .test-dday__day {
  color: #5890ff;
}
.test-dday--box.swiper-slide:nth-child(3n) .test-dday__percent,
.test-dday--box.violet .test-dday__percent {
  color: #5890ff;
}
.test-dday--box.swiper-slide:nth-child(3n) .test-dday__graph,
.test-dday--box.violet .test-dday__graph {
  background-color: rgba(88, 144, 255, 0.3);
}
.test-dday--box.swiper-slide:nth-child(3n) .test-dday__graph .graph,
.test-dday--box.violet .test-dday__graph .graph {
  background-color: #417ff9;
}
.test-dday--box.empty .test-dday__top .test-dday__titlebox .test-dday__title {
  color: rgba(0, 0, 0, 0.6);
}
.test-dday__tagbox {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  /* [이슈리스트 : 230804][2139] AI 학습 진단 : 태그와 과목명 안겹치게 처리 */
  gap: 14px;
}
.test-dday__tag {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 102px;
  padding: 6px 10px;
  height: 32px;
  border-radius: 32px;
  font-size: 18px;
  text-align: center;
  line-height: 20px;
  font-weight: 700;
}
.test-dday__day {
  font-size: 22px;
  line-height: 25px;
  font-weight: 800;
  max-width: 80px;
  flex-shrink: 0;
}
.test-dday__titlebox {
  margin-top: 20px;
}
.test-dday__title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  color: #000000;
  font-size: 24px;
  line-height: 27px;
  font-weight: 700;
}
.test-dday__date {
  margin-top: 11px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 18px;
  line-height: 20px;
}
.test-dday__textbox {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.test-dday__percent {
  font-size: 24px;
  line-height: 27px;
  font-weight: 800;
}
.test-dday__percent.text {
  font-size: 24px;
  line-height: 27px;
  font-weight: 800;
}
.test-dday__number {
  color: rgba(0, 0, 0, 0.8);
  font-size: 16px;
  line-height: 18px;
}
.test-dday__graph {
  display: flex;
  flex-direction: row;
  justify-content: stretch;
  align-items: stretch;
  height: 12px;
  margin-top: 6px;
  border-radius: 12px;
}
.test-dday__graph .graph {
  border-radius: 12px;
}

.make--box.type--make .lesson-option__more,
.make--box {
  display: flex;
  flex-direction: column;
  gap: 34px;
  margin-right: auto;
  margin-left: auto;
}

.make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .input-box:not(.no-input) {
  padding: 19px 24px;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  font-size: 22px;
  line-height: 25px;
}
.type--make
  .make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .input-box:not(.no-input),
.make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .type--make
  .input-box:not(.no-input) {
  font-weight: 400;
}
.type--make
  .make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .input-box:not(.no-input)::placeholder,
.make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .type--make
  .input-box:not(.no-input)::placeholder {
  font-weight: 400;
  font-size: 22px;
  line-height: 25px;
}
.type--make
  .make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .input-box:not(.no-input)::-moz-placeholder,
.make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .type--make
  .input-box:not(.no-input)::-moz-placeholder {
  font-weight: 400;
  font-size: 22px;
  line-height: 25px;
}
.type--make
  .make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .input-box:not(.no-input)::-webkit-input-placeholder,
.make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .type--make
  .input-box:not(.no-input)::-webkit-input-placeholder {
  font-weight: 400;
  font-size: 22px;
  line-height: 25px;
}

.make--box-items.lesson-keyword .box-item .input-box--text.no-input,
.make--box-items.lesson-data
  .box-item
  .makeclass-edit--datalist
  .input-box--text.no-input {
  padding: 13px 13px;
  background: #f6f6f6;
  border: 1px solid rgba(0, 0, 0, 0.16);
  border-radius: 8px;
  gap: 14px 10px;
  min-height: 56px;
}
.make--box-items.lesson-keyword .box-item .input-box--text .keyword-ment,
.make--box-items.lesson-data
  .box-item
  .makeclass-edit--datalist
  .input-box--text
  .keyword-ment {
  font-size: 16px;
  line-height: 18px;
  color: rgba(0, 0, 0, 0.35);
  margin: 5px 0;
}

.make--box-items.lesson-homework
  .box-items--box
  .box-item.item-devide.devide--text,
.make--box-items.lesson-attendance
  .box-items--box
  .box-item.item-devide.devide--text,
.make--box-items.lesson-subject
  .box-items--box
  .box-item.item-devide.devide--text,
.make--box-items.lesson-time
  .box-items--box
  .box-item.item-devide.devide--text {
  padding-right: 0;
}
.make--box-items.lesson-homework .box-item.item-devide,
.make--box-items.lesson-attendance .box-item.item-devide,
.make--box-items.lesson-subject .box-item.item-devide,
.make--box-items.lesson-time .box-item.item-devide,
.make--box-items.lesson-homework .box-item.item-devide > *,
.make--box-items.lesson-attendance .box-item.item-devide > *,
.make--box-items.lesson-subject .box-item.item-devide > *,
.make--box-items.lesson-time .box-item.item-devide > * {
  gap: 28px;
  font-size: 20px;
}
.make--box-items.lesson-homework .box-item.item-devide > *:not(.dropdown--area),
.make--box-items.lesson-attendance
  .box-item.item-devide
  > *:not(.dropdown--area),
.make--box-items.lesson-subject .box-item.item-devide > *:not(.dropdown--area),
.make--box-items.lesson-time .box-item.item-devide > *:not(.dropdown--area) {
  flex-shrink: 0;
  flex-grow: 0;
}
.make--box-items.lesson-homework .box-item.item-devide .dropdown--area,
.make--box-items.lesson-attendance .box-item.item-devide .dropdown--area,
.make--box-items.lesson-subject .box-item.item-devide .dropdown--area,
.make--box-items.lesson-time .box-item.item-devide .dropdown--area {
  flex-shrink: 1;
  flex-grow: 1;
}
.make--box-items.lesson-homework .box-item.item-devide .dropdown--select,
.make--box-items.lesson-attendance .box-item.item-devide .dropdown--select,
.make--box-items.lesson-subject .box-item.item-devide .dropdown--select,
.make--box-items.lesson-time .box-item.item-devide .dropdown--select {
  padding-left: 0;
  padding-right: 60px;
}
.make--box-items.lesson-homework .box-item.item-devide .dropdown--select::after,
.make--box-items.lesson-attendance
  .box-item.item-devide
  .dropdown--select::after,
.make--box-items.lesson-subject .box-item.item-devide .dropdown--select::after,
.make--box-items.lesson-time .box-item.item-devide .dropdown--select::after {
  right: 28px;
  background-image: url("../images/ico/down-stroke2-black.svg");
}
/* 250513 수정 */
.make--box-items.lesson-yn .input-radio .input--box::before,
.make--box-items.lesson-type .input-radio .input--box::before,
.make--box-items.lesson-approve-yn .input-radio .input--box::before {
  width: 28px;
  height: 28px;
  border-color: rgba(0, 0, 0, 0.4);
}
/* 250513 수정 */
.make--box-items.lesson-yn
  .input-radio
  input:not([type="text"]):checked
  + .input--box::before,
.make--box-items.lesson-type
  .input-radio
  input:not([type="text"]):checked
  + .input--box::before,
.make--box-items.lesson-approve-yn
  .input-radio
  input:not([type="text"]):checked
  + .input--box::before {
  border-color: #7e44fb;
  background-color: #7e44fb;
}
/* 250513 수정 */
.make--box-items.lesson-yn
  .input-radio
  input:not([type="text"]):checked
  + .input--box::after,
.make--box-items.lesson-type
  .input-radio
  input:not([type="text"]):checked
  + .input--box::after,
.make--box-items.lesson-approve-yn
  .input-radio
  input:not([type="text"]):checked
  + .input--box::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  background-image: url("../images/ico/check-white.svg");
  background-size: 100% auto;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

.make--box__title {
  margin-top: 80px;
  color: #000000;
  font-size: 36px;
  font-weight: 800;
  text-align: center;
  line-height: 41px;
}
.make--box__title strong {
  color: #7e44fb;
  font-weight: 800;
}
.make--box__desc {
  margin-top: 14px;
  color: #000000;
  font-size: 20px;
  text-align: center;
  line-height: 32px;
}
.make--box__desc + .make--box {
  margin-top: 70px;
}
.make--box-items {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
}
.make--box-items .box-items--title {
  flex-shrink: 0;
  flex-grow: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 104px;
  height: 64px;
  color: rgba(0, 0, 0, 0.8);
  font-size: 20px;
  line-height: 32px;
}
.make--box-items .box-items--title span.impo-violet {
  color: #7e44fb;
}
.make--box-items .box-items--box {
  flex-shrink: 1;
  flex-grow: 1;
  flex-wrap: wrap;
}
.make--box-items .box-items--box.is--flex {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.make--box-items .box-items--box.is--grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0%, auto));
  gap: 24px;
}
.make--box-items .box-items--box .box-item.item-devide > *,
.make--box-items .box-items--box .box-item.item-devide {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 23px;
  color: #000000;
  font-size: 22px;
  line-height: 32px;
}
.make--box-items .box-items--box .box-item {
  min-height: 64px;
  background-color: #ffffff;
  border-radius: 16px;
}
.make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .dropdown--select {
  min-height: 64px;
  border: none;
  border-radius: 0;
  font-size: 22px;
  line-height: 25px;
}
.type--make.type--option
  .make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .dropdown--select {
  font-weight: 700;
}
.make--box-items .box-items--box .box-item:not(.makeclass-edit) .dropdown--box {
  gap: 2px;
  max-height: none;
  margin-top: 10px;
  padding: 16px;
  border: none;
  border-radius: 16px;
}
.make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .dropdown--item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px;
  padding: 19px 15px;
  border-radius: 12px;
  font-size: 24px;
  line-height: 27px;
}
.make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .dropdown--item
  [class*="ico"] {
  display: none;
}
.make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .dropdown--select {
  padding-right: 56px;
  border-radius: 16px;
}
.make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .dropdown--select::after {
  right: 24px;
}
.make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .input-box
  + .input-box--edit {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-right: 24px;
  margin-left: 12px;
}
.type--make
  .make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .input-box
  + .input-box--edit {
  margin-right: 28px;
}
.make--box-items .box-items--box .box-item.is--flex {
  display: flex;
  flex-direction: row;
}
.make--box-items .box-items--box .box-item.is--grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0%, auto));
}
.make--box-items .box-items--box .box-item.input-radio .input--box {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 64px;
  padding: 17px 20px;
}
.type--make .make--box-items .box-items--box .box-item.input-radio .input--box {
  padding: 17px 28px 17px 24px;
}
.make--box-items .box-items--box .box-item.input-radio .input--text {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  padding: 0;
  font-size: 22px;
  line-height: 25px;
}
.type--make
  .make--box-items
  .box-items--box
  .box-item.input-radio
  .input--text {
  font-weight: 700;
}
.make--box-items
  .box-items--box
  .box-item.input-radio
  input:not([type="text"]):checked
  + .input--box::after {
  right: 26px;
}
.type--make
  .make--box-items
  .box-items--box
  .box-item.input-radio
  input:not([type="text"]):checked
  + .input--box::after {
  right: 34px;
}
.make--box-items .box-items--box .box-item.item-devide > *.text:first-child {
  margin-left: 24px;
}
.make--box-items .box-items--box .box-item.item-devide > * + *::before {
  display: block;
  width: 2px;
  height: 18px;
  background-color: rgba(0, 0, 0, 0.2);
  content: "";
}
.make--box-items .box-items--box .box-item.item-devide.devide--text {
  padding-left: 24px;
  padding-right: 24px;
}
.make--box-items
  .box-items--box
  .box-item.item-devide.devide--text
  .devide--stext {
  font-size: 20px;
  line-height: 32px;
  color: rgba(0, 0, 0, 0.8);
}
.make--box-items .box-items--box .box-item.item-devide.devide--dropdown,
.make--box-items .box-items--box .box-item.item-devide.devide--dropdown > * {
  gap: 0;
}
.make--box-items
  .box-items--box
  .box-item.item-devide.devide--dropdown
  .dropdown--select {
  height: 64px;
  padding-right: 56px;
  padding-left: 24px;
  background-color: transparent;
  border: none;
  border-radius: 0;
}
.make--box-items
  .box-items--box
  .box-item.item-devide.devide--dropdown
  .dropdown--select::after {
  right: 24px;
}
.make--box-items.disabled {
  opacity: 0.3;
}
.make--box-items.lesson-basic .box-items--box {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.make--box-items.lesson-basic .box-item .dropdown--select {
  min-height: 64px;
  border: none;
  border-radius: 0;
  font-size: 22px;
  line-height: 25px;
}
.type--make.type--option
  .make--box-items.lesson-basic
  .box-item
  .dropdown--select {
  font-weight: 700;
}
.make--box-items.lesson-basic .box-item .dropdown--box {
  gap: 2px;
  max-height: none;
  margin-top: 10px;
  padding: 16px;
  border: none;
  border-radius: 16px;
}
.make--box-items.lesson-basic .box-item .dropdown--item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px;
  padding: 19px 15px;
  border-radius: 12px;
  font-size: 24px;
  line-height: 27px;
}
.make--box-items.lesson-basic .box-item .dropdown--item [class*="ico"] {
  display: none;
}
.make--box-items.lesson-basic .box-item .dropdown--area {
  width: 100%;
}
.make--box-items.lesson-basic
  .box-item
  .dropdown--area.active
  .dropdown--select {
  border: 2px solid #7e44fb;
  padding: 4px 30px 4px 12px;
}
.make--box-items.lesson-basic .box-item .dropdown--select {
  color: #000000;
}
.make--box-items.lesson-basic .box-item.is--date .dropdown--select {
  padding-right: 60px;
}
.make--box-items.lesson-basic .box-item.is--date .dropdown--box {
  width: 360px;
  right: 0;
  padding: 0;
}
.make--box-items.lesson-basic
  .box-item.is--date
  .dropdown--box
  .datepicker-inline,
.make--box-items.lesson-basic .box-item.is--date .dropdown--box .datepicker {
  width: 100%;
  border: none;
}
.make--box-items.lesson-basic
  .box-item.is--date
  .dropdown--box
  .datepicker--nav {
  padding-bottom: 35px;
}
.make--box-items.lesson-basic
  .box-item.is--date
  .dropdown--box
  .datepicker--nav-title {
  font-weight: 700;
}
.make--box-items.lesson-basic
  .box-item.is--date
  .dropdown--box
  .datepicker--content {
  width: 100%;
  padding: 0 20px 20px;
  margin-top: 0;
}
.make--box-items.lesson-basic
  .box-item.is--date
  .dropdown--box
  .datepicker--cell {
  font-weight: 400;
}
.make--box-items.lesson-basic
  .box-item.is--date
  .dropdown--box
  .datepicker--cell.-weekend-:not(.-other-month-) {
  color: #000000;
}
.make--box-items.lesson-basic
  .box-item.is--date
  .dropdown--box
  .datepicker--cell.-weekend-:not(.-other-month-)
  + .-weekend- {
  color: #ff0000;
}
.make--box-items.lesson-basic
  .box-item.is--date
  .dropdown--box
  .datepicker--cell.-weekend-:not(.-other-month-).-selected- {
  color: #ffffff;
}
.make--box-items.lesson-basic.info {
  position: relative;
  z-index: 10;
}
.make--box-items.lesson-basic.info .dropdown--area [class*="ico"] {
  margin-top: -4px;
}
.make--box-items.lesson-basic.info
  .dropdown--area.is--school
  .dropdown--select {
  padding-left: 24px;
}
.make--box-items.lesson-basic.info
  .dropdown--area.is--school
  .dropdown--select::before {
  display: none;
}
.make--box-items.lesson-basic.info
  .dropdown--area.is--school
  .dropdown--select
  .ico-27 {
  margin-left: 3px;
  margin-right: 2px;
}
.make--box-items.lesson-basic.info
  .dropdown--area.is--grade
  .dropdown--select::before {
  background-image: url("../images/ico/lesson-grade.png");
}
.make--box-items.lesson-basic.info
  .dropdown--area.is--date
  .dropdown--select::before {
  background-image: url("../images/ico/lesson-date.png");
}
.make--box-items.lesson-basic.info .dropdown--area.is--dim {
  opacity: 0.5;
}
.make--box-items.lesson-basic.info .dropdown--area.is--dim .dropdown--select {
  color: rgba(0, 0, 0, 0.5);
}
.make--box-items.lesson-basic.info
  .dropdown--area.is--dim
  .dropdown--select::before {
  opacity: 0.5;
}
.make--box-items.lesson-basic.info .dropdown--area.active .dropdown--select {
  padding-left: 22px;
  border: 2px solid #7e44fb;
  color: #7e44fb;
}
.make--box-items.lesson-basic.info
  .dropdown--area.active
  .dropdown--select::after {
  right: 22px;
}
.make--box-items.lesson-basic.info
  .dropdown--area.active.is--school
  .dropdown--select {
  padding-left: 22px;
}
.make--box-items.lesson-basic.info .dropdown--select {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px;
  padding-left: 24px;
  border-radius: 16px;
  font-weight: 400;
  font-size: 22px;
  line-height: 25px;
}
.make--box-items.lesson-basic.info .dropdown--select::before {
  flex-shrink: 0;
  flex-grow: 0;
  display: block;
  width: 32px;
  height: 32px;
  content: "";
}
.make--box-items.lesson-basic.info .dropdown--select p {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.make--box-items.lesson-basic.info .dropdown--box {
  margin-top: 14px;
}
.make--box-items.lesson-basic.option {
  position: relative;
  z-index: 5;
}
.make--box-items.lesson-basic.option .box-item {
  padding: 24px 24px 12px;
}
.make--box-items.lesson-basic.option .box-item .basic-img {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  width: 100%;
  height: 220px;
  margin-bottom: 17px;
  border-radius: 16px;
}
.make--box-items.lesson-basic.option .box-item .basic-img img {
  display: block;
  max-height: 100%;
  max-width: 100%;
}
.make--box-items.lesson-basic.option
  .box-item
  .dropdown--area.open
  .dropdown--select {
  color: #7e44fb;
}
.make--box-items.lesson-basic.option
  .box-item
  .dropdown--area.has--data
  .dropdown--select {
  font-weight: 400;
}
.make--box-items.lesson-basic.option .box-item .dropdown--select {
  padding-right: 34px;
  padding-left: 0;
  font-weight: 700;
  font-size: 24px;
  line-height: 27px;
}
.make--box-items.lesson-basic.option .box-item .dropdown--select::after {
  width: 34px;
  height: 34px;
  right: 0;
  margin-top: -17px;
}
.make--box-items.lesson-basic.option .box-item .dropdown--select span.after {
  display: none;
}
.make--box-items.lesson-basic.option .box-item .dropdown--select .button-tag {
  vertical-align: top;
  display: inline-block;
  margin-top: 1px;
  color: #7e44fb;
}
.make--box-items.lesson-basic.option .box-item .dropdown--select .input-box {
  display: block;
  width: calc(100% - 18px);
  height: 48px;
  padding: 10px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 8px;
}
.make--box-items.lesson-basic.option .box-item .dropdown--select .text {
  display: none;
}
.make--box-items.lesson-basic.option .box-item .dropdown--box {
  width: calc(100% + 48px);
  max-height: 231px;
  margin-left: -24px;
  margin-right: -24px;
  margin-top: 16px;
}
.make--box-items.lesson-basic.option .box-item .dropdown--item span.after,
.make--box-items.lesson-basic.option .box-item .dropdown--item .button-tag,
.make--box-items.lesson-basic.option .box-item .dropdown--item .input-box {
  display: none;
}
.make--box-items.lesson-basic.option .box-item.is--subject .basic-img {
  background-color: #edf8fe;
}
.make--box-items.lesson-basic.option .box-item.is--detail .basic-img {
  background-color: #ebfaf0;
}
.make--box-items.lesson-basic.option .box-item.is--option .basic-img {
  background-color: #fff7dd;
}
.make--box-items.lesson-basic.option .box-item.active {
  padding: 22px 22px 10px;
  border: 2px solid #7e44fb;
}
.make--box-items.lesson-basic.option
  .box-item.active
  .dropdown--select
  .button-tag {
  vertical-align: top;
  display: inline-block;
}
.make--box-items.lesson-basic.option.no--detail .box-items--box {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.make--box-items.lesson-basic.option.no--detail .box-items--box .basic-img {
  height: 227px;
}
.make--box-items.lesson-basic.option + .box-items--button {
  margin-top: 69px;
}
.make--box-items.lesson-info {
  margin-bottom: 34px;
}
.make--box-items.lesson-info .lesson-info__table {
  overflow: hidden;
  background-color: #ffffff;
  border-radius: 16px;
  border: 1px solid #e8ecff;
}
.make--box-items.lesson-info .lesson-info__table table th {
  height: 50px;
  background-color: #f8faff;
  border-bottom: 1px solid #e8ecff;
  color: #000000;
  font-size: 16px;
  font-weight: 700;
  line-height: 18px;
}
.make--box-items.lesson-info .lesson-info__table table td {
  position: relative;
  height: 88px;
  text-align: center;
}
.make--box-items.lesson-info .lesson-info__table table td p {
  display: inline-block;
  color: rgba(0, 0, 0, 0.6);
  font-size: 20px;
  line-height: 22px;
}
.make--box-items.lesson-info
  .lesson-info__table
  table
  td:not(:first-child)
  p::before {
  position: absolute;
  width: 1px;
  height: 40px;
  top: 50%;
  left: 0;
  margin-top: -20px;
  background-color: rgba(217, 217, 217, 0.8);
  content: "";
}
.make--box-items.lesson-info .lesson-info__table table td.date p {
  text-align: left;
}
.make--box-items.lesson-info .lesson-info__table + .lesson-info__table {
  margin-top: 12px;
}
.make--box-items.lesson-time .box-items--box .box-item .lesson-calendar__box {
  overflow: visible;
  align-items: stretch;
  gap: 0;
  min-width: 360px;
  padding: 0;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 16px;
  background-color: #ffffff;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson-calendar__box
  .datepicker,
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson-calendar__box
  .datepicker-inline {
  width: 100%;
  background-color: transparent;
  border: none;
  border-radius: 0;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson-calendar__box
  .datepicker--nav {
  padding: 29px 20px 33px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson-calendar__box
  .datepicker--content {
  width: 100%;
  margin: 0 auto;
  padding: 0 20px 23px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson-calendar__box
  .datepicker--cells {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 15px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson-calendar__box
  .datepicker--cell {
  margin: 0;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson-calendar__box
  .datepicker--days-names {
  padding-bottom: 25px;
}
.make--box-items.lesson-time .box-items--box .box-item .lesson__daterange {
  overflow: hidden;
  border-radius: 16px 16px 0 0;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__daterange
  .datepicker--nav-title {
  font-weight: 700;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__daterange
  .datepicker--cell {
  font-weight: 400;
}
.make--box-items.lesson-time .box-items--box .box-item .lesson__time {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 24px 20px;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time:first-child {
  margin-bottom: 10px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .dropdown--area:last-child {
  margin-left: 4px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .dropdown--select {
  width: 82px;
  min-height: 40px;
  padding: 6px 13px;
  padding-right: 30px;
  border: 1px solid rgba(0, 0, 0, 0.16);
  border-radius: 8px;
  font-size: 16px;
  font-weight: 400;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .dropdown--select::after {
  right: 12px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .dropdown--box {
  max-height: 225px;
  gap: 6px;
  margin-top: 4px;
  padding: 9px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .dropdown--item {
  display: block;
  padding: 10px;
  padding-right: 0;
  border-radius: 4px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .dropdown--item:hover,
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .dropdown--item.active {
  background: rgba(126, 68, 251, 0.1);
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .time--icon {
  flex-shrink: 0;
  flex-grow: 0;
  margin-right: 10px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .time--title {
  flex-shrink: 0;
  flex-grow: 0;
  width: 40px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .time--dropdown {
  flex-shrink: 1;
  flex-grow: 1;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .time--dropdown
  .dropdown--area {
  width: calc((100% - 21px) / 2);
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .time--dropdown
  .dropdown--select {
  width: 100%;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__time
  .time--dropdown
  .devider {
  width: 5px;
  padding-left: 2px;
  color: #000000;
  font-size: 16px;
  text-align: center;
  line-height: 18px;
}
.make--box-items.lesson-time .box-items--box .box-item .lesson__button {
  gap: 12px;
  padding: 0 20px 23px;
  background-color: #ffffff;
  border-radius: 0 0 16px 16px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item
  .lesson__button
  > button:not(.buton-text) {
  min-width: 0;
  width: calc((100% - 12px) / 2);
}
.make--box-items.lesson-time
  .box-items--box
  .box-item.start
  .lesson-calendar__box {
  right: auto;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item.end
  .lesson-calendar__box {
  right: 0;
  /* [0824] 캘린더 버젼
  padding: $GRID-GAP ($GRID-GAP - 4);
  background-color: $WHITE;
  border: 1px solid
  	transparentize($color: $BLACK, $amount: 0.9);
  border-radius: $RADIUS-M;
  */
}
.make--box-items.lesson-time
  .box-items--box
  .box-item.lesson-calendar
  > .dropdown--select {
  padding-left: 24px;
}
.make--box-items.lesson-time
  .box-items--box
  .box-item.lesson-calendar
  > .dropdown--select::after {
  background-image: url("../images/ico/down-stroke2-black.svg");
}
.make--box-items.lesson-subject .box-item.devide--dropdown {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.make--box-items.lesson-subject
  .box-item.devide--dropdown
  .dropdown--area:last-child
  .dropdown--box {
  left: auto;
  right: 0;
}
.make--box-items.lesson-subject .box-item.devide--dropdown .dropdown--box {
  width: 486px;
  max-height: 499px;
}
.make--box-items.lesson-subject .box-item.devide--dropdown .dropdown--item p {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  max-height: 54px;
}
.make--box-items.lesson-subject .info-ment {
  font-size: 14px;
  line-height: 16px;
  color: rgba(0, 0, 0, 0.8);
  margin-top: -4px;
}
.make--box-items.lesson-data .box-item {
  padding: 24px 24px;
}
.make--box-items.lesson-data .box-item .makeclass-edit--datalist {
  margin-bottom: -9px;
}
.make--box-items.lesson-data .box-item .box--edit-group {
  margin-top: 34px;
}
.make--box-items.lesson-data .box-item .box--edit-group .is--list {
  display: flex;
  flex-direction: row;
  gap: 24px;
}
.make--box-items.lesson-data
  .box-item
  .box--edit-group
  .is--list
  .recommend--item {
  width: calc((100% - 48px) / 3);
}
.make--box-items.lesson-data
  .box-item
  .box--edit-group
  .is--list
  .recommend--item
  .recommend--thum
  .input--border {
  border-width: 2px;
}
.make--box-items.lesson-data
  .box-item
  .box--edit-group
  .is--list
  .recommend--item
  .recommend--thum
  .input--border,
.make--box-items.lesson-data
  .box-item
  .box--edit-group
  .is--list
  .recommend--item
  .recommend--thum
  .image {
  border-radius: 16px;
}
.make--box-items.lesson-data .box-item .box--edit-group .is--add {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.make--box-items.lesson-data
  .box-item
  .box--edit-group
  .is--add
  .box--edit-items {
  background-color: #f8f9fd;
}
.make--box-items.lesson-data
  .box-item
  .box--edit-group
  .is--add
  .box--edit-items
  .dropdown--area {
  width: 260px;
}
.make--box-items.lesson-data .box-item .box--edit-group .button-icon {
  margin-right: -4px;
}
.make--box-items.lesson-data .box-item .box--edit-group .box--edit-buttons {
  width: 100%;
  text-align: center;
  padding-bottom: 30px;
}
.make--box-items.lesson-data
  .box-item
  .box--edit-group
  .box--edit-buttons
  .button-main {
  width: 200px;
}
.make--box-items.lesson-data .box-item .recommend--item input[type="checkbox"],
.make--box-items.lesson-data .box-item .recommend--item .input-check {
  left: auto;
  right: 16px;
}
.make--box-items.lesson-data .box-item .workbook--list {
  gap: 15px;
  width: 100%;
}
.make--box-items.lesson-data .box-item .workbook--list .textbook--item {
  width: calc((100% - 30px) / 3);
}
.make--box-items.lesson-data
  .box-item
  .workbook--list
  .textbook--item
  .item--top-box {
  padding: 16px;
  height: 144px;
  border-radius: 16px;
}
.make--box-items.lesson-data
  .box-item
  .workbook--list
  .textbook--item
  .top-box--check {
  top: 16px;
  right: 16px;
}
.make--box-items.lesson-data
  .box-item
  .workbook--list
  .textbook--item
  .top-box--title {
  position: absolute;
  right: 16px;
  bottom: 10px;
  left: 16px;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
  height: 50px;
}
.make--box-items.lesson-data
  .box-item
  .workbook--list
  .textbook--item
  .top-box--subcategory {
  position: absolute;
  right: 16px;
  bottom: 66px;
  left: 16px;
}
.make--box-items.lesson-explain .input-box {
  resize: none;
}
.make--box-items.lesson-explain .input-box--textarea {
  width: 100%;
}
.make--box-items.lesson-explain .input-box--textarea textarea {
  height: 64px;
  max-height: 92px;
  padding: 18px 24px;
  border: none;
  border-radius: 16px;
  font-size: 22px;
  line-height: 28px;
}
.make--box-items.lesson-filelist .box-item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 20px 0 30px;
}
.make--box-items.lesson-filelist .box-item.is--file {
  padding: 24px;
  padding-right: 70px;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
}
.make--box-items.lesson-filelist .box-item.is--file .filelist__name,
.make--box-items.lesson-filelist .box-item.is--file .filelist__type {
  word-break: break-all;
}
.make--box-items.lesson-filelist .filelist__size {
  font-weight: 700;
  font-size: 18px;
  line-height: 32px;
  color: #7e44fb;
}
.make--box-items.lesson-filelist .filelist__info {
  font-size: 16px;
  line-height: 32px;
  color: rgba(0, 0, 0, 0.8);
  margin-top: -5px;
  margin-bottom: 16px;
}
.make--box-items.lesson-filelist .filelist__thum {
  margin-right: 17px;
  position: relative;
  flex-shrink: 0;
  width: 147px;
  height: 117px;
  background-size: cover;
  border-radius: 14px;
}
.make--box-items.lesson-filelist .filelist__thum.empty {
  background: #2c0271;
}
.make--box-items.lesson-filelist .filelist__thum.empty::after {
  position: absolute;
  display: block;
  width: 84px;
  height: 46px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-image: url("../images/img/class-thumb-logo-color.svg");
  content: "";
}
.make--box-items.lesson-filelist .filelist__content {
  padding-top: 6px;
}
.make--box-items.lesson-filelist .filelist__name {
  font-size: 20px;
  line-height: 23px;
}
.make--box-items.lesson-filelist .filelist__type {
  font-size: 16px;
  line-height: 18px;
  margin-top: 4px;
  color: rgba(0, 0, 0, 0.5);
}
.make--box-items.lesson-filelist .filelist__close {
  position: absolute;
  right: 24px;
  top: 14px;
}
.make--box-items.lesson-filelist .filelist__preview {
  display: flex;
  flex-direction: row;
  position: relative;
  gap: 16px;
  width: 100%;
  padding: 24px;
  margin-bottom: -6px;
  background-color: #ffffff;
  border-radius: 16px;
}
.make--box-items.lesson-filelist .filelist__preview--image {
  gap: 16px;
  width: 147px;
  height: 117px;
  background-color: #2c0271;
  background-size: cover;
  border-radius: 14px;
}
.make--box-items.lesson-filelist .filelist__preview--text {
  flex-shrink: 1;
  flex-grow: 1;
}
.make--box-items.lesson-filelist .filelist__preview--text .name {
  margin-top: 6px;
  color: #000000;
  font-size: 20px;
  line-height: 22px;
}
.make--box-items.lesson-filelist .filelist__preview--text .size {
  margin-top: 4px;
  color: rgba(0, 0, 0, 0.5);
  font-size: 16px;
  line-height: 18px;
}
.make--box-items.lesson-filelist .filelist__preview--close {
  position: absolute;
  width: 28px;
  height: 28px;
  top: 18px;
  right: 28px;
}
.make--box-items.lesson-keyword .box-item {
  padding: 24px 24px 30px;
  text-align: center;
}
.make--box-items.lesson-keyword .button-main {
  margin-top: 28px;
}
.make--box-items.lesson-adds .box-items--box {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding-left: 104px;
}
.make--box-items.lesson-adds .box-items--box .button-add {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 44px;
  font-size: 14px;
  font-weight: 700;
  border-radius: 10px;
  padding: 12px 14px;
  border: 2px solid transparent;
  background: rgba(126, 68, 251, 0.1);
}
.make--box-items.lesson-adds .box-items--box .button-add .icon {
  width: 18px;
  height: 18px;
  margin-right: 5px;
  background-image: url("../images/ico/add-black.svg");
}
.make--box-items.lesson-adds .box-items--box .button-add:hover {
  border-color: #7e44fb;
}
.lesson-option__more.add-teacher .button-add.is--permission .icon {
  background-image: url("../images/ico/minus-black.svg");
}
.lesson-option__more.add-keyword .button-add.is--keyword .icon {
  background-image: url("../images/ico/minus-black.svg");
}

.make--box-items.lesson-agreecheck {
  margin: 46px -33px 48px;
}
.make--box-items.lesson-agreecheck .input--box {
  gap: 14px;
}
.make--box-items.lesson-agreecheck .input--text {
  font-size: 20px;
  line-height: 32px;
  padding: 0;
  margin-top: -3px;
  text-align: left;
}
.make--box-items.lesson-agreecheck .input--text p {
  display: inline-block;
  text-align: center;
}
.make--box-items.lesson-option {
  padding-left: 104px;
}
.type--make .make--box-items.lesson-option {
  margin-top: 46px;
}
.type--edit .make--box-items.lesson-option {
  margin-top: 6px;
  margin-bottom: 26px;
}
.make--box-items.lesson-option .box-items--box {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.make--box-items.lesson-option .lesson-option-control {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background: rgba(126, 68, 251, 0.1);
  border: 2px solid #7e44fb;
  border-radius: 100px;
  text-align: center;
  height: 44px;
  font-weight: 700;
  font-size: 18px;
  line-height: 20px;
  padding: 0 28px;
  cursor: pointer;
}
.type--make .make--box-items.lesson-option .lesson-option-control {
  padding: 0 36px;
  cursor: pointer;
}
.make--box-items.lesson-option .lesson-option-control span[class^="ico-"] {
  margin-right: 7px;
}
.make--box-items.lesson-option .lesson-option-control .button-icon {
  width: 28px;
  height: 28px;
  margin-left: 4px;
}
.make--box-items.lesson-option .lesson-option-control .button-icon.active {
  transform: rotate(180deg);
}
.make--box .box-items--button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 62px;
}
.make--box .box-items--button button {
  font-weight: 800;
  font-size: 32px;
  line-height: 36px;
}
.make--box .box-items--button button.violet {
  color: #7e44fb;
}
.make--box .box-items--button button.violet:disabled {
  opacity: 0.2;
}
.make--box.type--make.type--option {
  max-width: 702px;
  margin-left: -128px;
}
.make--box.type--make.type--option .lesson-option .box-items--box {
  margin-right: 0;
}
.make--box.type--make.type--option .lesson-agreecheck {
  padding-left: 128px;
}
.make--box.type--make.type--option .box-items--button {
  padding-left: 128px;
}
.make--box.type--make.make {
  gap: 43px;
}
.make--box.type--make.edit
  .lesson-basic.info
  .box-items--box
  .box-item.open
  .dropdown--select {
  font-weight: 800;
}
.make--box.type--make .make--box {
  margin: 0;
}
.make--box.type--make .box-items--title {
  width: 128px;
  margin-top: 16px;
  word-break: keep-all;
  height: auto;
}
.make--box.type--make .box-items--box {
  gap: 20px;
}
.make--box.type--make .type--make-option {
  padding-top: 26px;
}
.make--box.type--make .lesson-option__more {
  width: 100%;
}
.make--box.type--make .lesson-option__more .type--make-teacher,
.make--box.type--make .lesson-option__more .type--make-keyword {
  display: none;
  visibility: hidden;
}
.make--box.type--make .lesson-option__more.add-teacher .type--make-teacher {
  display: flex;
  visibility: visible;
}
.make--box.type--make .lesson-option__more.add-keyword .type--make-keyword {
  display: flex;
  visibility: visible;
}
.make--box.type--make .lesson-adds .box-items--box {
  gap: 12px;
}

.make--box.type--edit {
  max-width: 840px;
  margin-left: -96px;
}
.make--box.type--edit .box-items--title {
  width: 96px;
}
.make--box.type--edit .box-item {
  border: 1px solid #e8ecff;
}
.make--box.type--edit .type--make-option {
  display: none;
}
.make--box.type--edit .type--make-option .make--box-items + .make--box-items {
  margin-top: 34px;
}

/* 유엑스 스토리 */
/* 231222 스타일 수정 */
.class_design .layer__container {
  width: 1176px;
  min-width: 1176px;
}
.class_design .layer__contents {
  padding: 36px 24px 0;
}
.class_design table td {
  padding: 22px 12px;
}
.class_design table td:not(.empty):nth-child(3) {
  padding-left: 12px !important;
  text-align: center !important;
}

/* 240117 클래스명 oepn_subject > open_subject 수정, student_open_subject 클래스 추가 */
.open_subject .layer__container,
.student_open_subject .layer__container {
  width: 1128px;
  min-width: 1128px;
}
.open_subject .layer__container .layer__contents,
.student_open_subject .layer__contents {
  padding: 34px 24px 0;
}
.history_table table {
  border-top: 1px solid #d9d9d9;
}
.history_table tr td {
  padding: 10px 0 !important;
  height: auto !important;
}
.history_table tr:nth-child(even) td {
  padding: 0 0 20px !important;
}
.history_table tr:nth-child(odd) td:last-child {
  border-bottom: none;
  padding-top: 20px !important;
}
.history_table tr td.f-gray-84 {
  font-size: 14px;
}
/* kt요청 워크북 폰트 현행화 */
.workbook-preview__question .workbook-passage__titles .title {
  font-size: 18px;
  font-family: "Malgun Gothic", sans-serif;
} /* 240904 현행화 맑은고딕으로 변경*/
.workbook-preview__question .slectlist-item .slectlist-contents {
  font-family: "Malgun Gothic", sans-serif;
  font-size: 18px;
} /* 240904 현행화 맑은고딕으로 변경*/
/* 240104 문항뷰어 폰트 이슈 부분 삭제 */
/* .workbook-passage__contents * {font-family: 'Dotum', sans-serif !important; font-size: 18px; } 
 .workbook-preview__body .open-box .workbook-preview__explain .contents :not(.contents_title) {font-family: 'Dotum', sans-serif !important; font-size: 18px; } */
/* //231222 스타일 수정 */

/* 240112 main */
/* 250203 서비스 화면 높이 고정 */
.wrap.unable::after {
  top: 0 !important;
}
.wrap.unable .container {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.wrap.unable .contents-area {
  padding-bottom: 0;
}
.unable_contents {
  position: relative;
}
.unable_contents .white_box {
  width: 1128px;
  min-height: 582px; /*240806 수정*/
  background: #fff;
  border-radius: 20px;
  padding: 120px 80px;
  text-align: center;
}
.unable_contents .main-login--ai {
  position: absolute;
  width: 462px;
  height: 426px;
  top: 350px;
  left: -175px;
}
.unable_contents .edu_list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 24px 32px;
  margin-top: 80px;
}

/* 240118 월간리포트 */
/* 차트 스타일 */
/* 240325 zindex 변경 */
.x_label_tooltip {
  display: none;
  position: absolute;
  bottom: 50px;
  padding-bottom: 20px;
  z-index: 20;
} /* 240829 툴팁 마우스 오버 영역 변경 */
.x_label_tooltip.active {
  display: block;
}
.x_label_tooltip::before,
.x_label_tooltip::after {
  position: absolute;
  width: 10px;
  height: 18px;
  left: 50%;
  bottom: 0px; /* 240829 툴팁 마우스 오버 영역 변경 */
  transform: rotate(180deg);
  content: "";
}
.x_label_tooltip::before {
  width: 6px;
  height: 8px;
  margin-bottom: 3px;
  margin-left: -5px;
  border-right: 5px solid transparent;
  border-top: 9px solid transparent;
  border-left: 5px solid transparent;
  border-bottom: 9px solid #ffffff;
  z-index: 15;
}
.x_label_tooltip::after {
  margin-left: -5px;
  border-right: 5px solid transparent;
  border-top: 9px solid transparent;
  border-left: 5px solid transparent;
  border-bottom: 9px solid #d0d0d0;
  z-index: 10;
}
.x_label_tooltip .label_title {
  font-weight: bold;
  font-size: 14px;
}
.x_label_tooltip .label_body p {
  margin-top: 5px;
}
/* 240124 .level_tag tooltip_tag 추가 */
/* 240124 .level_tag padding 삭제, text-align, height, line-height, font-size 추가*/
.level_tag {
  position: absolute;
  z-index: 17;
}
.level_tag,
.tooltip_tag {
  font-weight: normal;
  border: 2px solid #ccc;
  border-radius: 20px;
  font-weight: 800;
  text-align: center;
  height: 28px;
  line-height: 26px;
  font-size: 14px;
}
.level_tag.verygood,
.tooltip_tag.verygood {
  color: #21c663;
  background: #def6e8;
  border-color: #71da9b;
}
.level_tag.great,
.tooltip_tag.great {
  color: #3d90f3;
  background: #e2eefd;
  border-color: #83b8f7;
}
.level_tag.normal,
.tooltip_tag.normal {
  color: #7662f1;
  background: #eae7fd;
  border-color: #a79af6;
}
.level_tag.somepoor,
.tooltip_tag.somepoor {
  color: #ff8440;
  background: #ffede2;
  border-color: #ffb085;
} /*240826 색상오류 변경*/
.level_tag.poor,
.tooltip_tag.poor {
  color: #e265ce;
  background: #fbe8f8;
  border-color: #ec9de0;
} /*240826 색상오류 변경*/
.level_tag.verygood:hover {
  background: #9df7c2;
}
.level_tag.great:hover {
  background: #c0dcff;
}
.level_tag.normal:hover {
  background: #cfc7ff;
}
.level_tag.somepoor:hover {
  background: #ffd7be;
}
.level_tag.poor:hover {
  background: #ffd2f8;
}
/* 240206 차트 모달 클래스 추가 */
#chartModal .layer__container,
.chart_modal .layer__container {
  width: 480px;
}
#chartModal .layer__container .layer__contents,
.chart_modal .layer__container .layer__contents {
  padding: 25px 25px 0;
}
#chartModal .layer__container .layer__contents .table--list table tbody tr td,
.chart_modal .layer__container .layer__contents .table--list table tbody tr td {
  padding: 16px 0;
}
#chartModal
  .layer__container
  .layer__contents
  .table--list
  table
  tbody
  tr.latest
  td,
.chart_modal
  .layer__container
  .layer__contents
  .table--list
  table
  tbody
  tr.latest
  td {
  background: #eae7fd;
}
#chartModal .layer__container .page__button,
.chart_modal .layer__container .page__button {
  padding: 14px 0 28px;
}
#chartModal .layer__container .layer__title .modal_close,
.chart_modal .layer__container .layer__title .modal_close {
  width: 32px;
  height: 32px;
  background-image: url(../images/ico/close-black.svg);
  font-size: 0;
}
/* //240206 차트 모달 클래스 추가 */
#chartModal.hide {
  opacity: 0;
  z-index: -10;
}
.line-tooltip .color_chip {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ccc;
  display: block;
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
}
.triple-bar-chart.subject {
  margin-bottom: 0 !important;
}
.test_solve.large .line-tooltip__textbox {
  text-align: left;
  font-weight: normal;
}
.test_solve.large .line-tooltip {
  max-width: none;
}
.test_solve.large .line-tooltip .tooltip_value {
  color: #515151;
  font-weight: 800;
  margin-left: 6px;
}

/* 240124 월간리포트 */
.report-month__result .scroll-x,
.subject-detail__ratio .scroll-x {
  scroll-snap-type: x mandatory;
  margin-left: 30px;
}
.report-month__result .scroll-x .graph,
.subject-detail__ratio .scroll-x .graph {
  scroll-snap-align: start;
}
.report-month__result,
.subject-detail__ratio {
  position: relative;
}
/* 240206 y축 고정 라벨 기존 스타일 삭제 */
/* .report-month__result .chart_label, .subject-detail__ratio .chart_label {position: absolute; z-index:2; top: 54px; width: 50px; color: #949494; font-size: 14px; text-align: right; display: flex; flex-direction: column; justify-content: space-between; background: #fff;}
.report-month__result .chart_label.level, .subject-detail__ratio .chart_label.level {color: #000; width: 63px; top: 70px; font-size: 16px; font-weight: 700;}
.report-month__result .chart_label.number, .subject-detail__ratio .chart_label.number {padding-right: 10px; height: 253px;}
.subject-detail__ratio .chart_label.number {top: 60px; height: 241px;} */
.radal-chart.month_radar .line-tooltip__inner {
  min-width: auto;
}

/* 240206 학습진단 */
.relative {
  position: relative;
}
.test-home .legend .legend-dot .row.session .chip {
  background-color: #d2bcff;
}
.test-home .legend .legend-line .row.subject_average .chip {
  border-color: #7e44fb;
}
/* y축 고정 라벨 모두 적용되게 수정 */
.test-subject__graph,
.student_ai_chart {
  position: relative;
}
.chart_label {
  position: absolute;
  z-index: 2;
  top: 54px;
  width: 50px;
  color: #949494;
  font-size: 14px;
  text-align: right;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: #fff;
}
.chart_label.level {
  color: #000;
  width: 63px;
  top: 70px;
  font-size: 16px;
  font-weight: 700;
}
.chart_label.number {
  top: 50px;
  height: 300px;
  padding-bottom: 43px;
  padding-right: 10px;
} /* 240828 수정 */
.level_fix .scroll-x {
  margin-left: 100px;
}

.test-subject__graph .chart_label.level {
  top: 79px;
}
.student_ai_chart .chart_label.level {
  top: 92px;
  margin-left: 24px;
}
.scroll_chart .graph {
  margin-left: 70px;
}
.student_ai_chart .scroll-x {
  margin-left: 100px;
}
.intro-mystat.highschool .intro-mystat--analysis {
  padding: 28px 30px;
}
.intro-mystat.highschool .analysis--box .analysis--graph {
  gap: 25px;
  margin: 30px 0 0 30px;
  width: 490px;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.k_history
  .graph-my {
  background: #cc9759;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.k_history
  .graph-box
  .graph-tooltip--box
  span {
  background: #cc9759;
}
.intro-mystat
  .analysis--box
  .analysis--graph
  .analysis--graph-column.k_history
  .graph-tooltip--box::after {
  border-top-color: #cc9759;
}
.intro-mystat.lower_grade .clock_wrap {
  position: relative;
  display: flex;
  justify-content: center;
}
.intro-mystat.lower_grade .clock-body {
  width: 142px;
  height: 142px;
  margin: 0;
}
.intro-mystat.lower_grade .clock-body .clock-body--circle {
  width: 140px;
  height: 140px;
  border-width: 10px;
  border-color: #def2ea;
}
.intro-mystat.lower_grade .clock-body .clock-body--circle .clock-active {
  width: 142px;
  height: 142px;
  top: -11px;
  left: -11px;
}
.intro-mystat.lower_grade
  .clock-body
  .clock-body--circle
  .clock-active
  .clock-active--inner {
  width: 100%;
  height: 100%;
}
.intro-mystat.lower_grade
  .clock-body
  .clock-body--circle
  .clock-active
  .clock-active--inner
  .clockActiveProgress {
  stroke-width: 10px;
  stroke-dasharray: 408.40696px;
  stroke: #3dcd90;
  fill: transparent;
  stroke-linecap: round;
}
.intro-mystat.lower_grade .clock-body.math .clock-body--circle {
  border-color: #ffe9dc;
}
.intro-mystat.lower_grade
  .clock-body.math
  .clock-body--circle
  .clock-active
  .clockActiveProgress {
  stroke: #ff9960;
}
.intro-mystat.lower_grade
  .clock-body
  .clock-body--circle
  .clock-timepad
  .title {
  font-size: 18px;
}
.intro-mystat.lower_grade .clock-body.average {
  position: absolute;
  top: 20px;
  width: 98px;
  height: 98px;
}
.intro-mystat.lower_grade .clock-body.average .clock-body--circle {
  width: 96px;
  height: 96px;
  border-color: #f4f4f4;
}
.intro-mystat.lower_grade
  .clock-body.average
  .clock-body--circle
  .clock-active {
  width: 98px;
  height: 98px;
}
.intro-mystat.lower_grade
  .clock-body.average
  .clock-body--circle
  .clock-active
  .clockActiveProgress {
  stroke: #dadada;
}
.intro-mystat.lower_grade .subject_wrap {
  display: flex;
  gap: 80px;
  justify-content: center;
  margin-top: 40px;
}
.intro-mystat.lower_grade .subject_title {
  text-align: center;
  margin-top: 20px;
}
.intro-mystat.lower_grade .subject_title .state-box {
  width: 105px;
  height: 35px;
  font-size: 20px;
  font-weight: 800;
}
.intro-mystat.lower_grade .subject_title .state-box.korean {
  background: #def2ea;
  color: #09b66d;
}
.intro-mystat.lower_grade .subject_title .state-box.math {
  background: #ffe8dc;
  color: #f6732a;
}

/* 240226 학습진단 border 이슈*/
.test-select .workbook-make__scroll .table--list table tbody tr:last-child td {
  border-bottom: none;
}

/* 240229 학습진단 table scroll 삭제 및 myclass, mypage 수정사항 */
/* .test-home .aitest--scrolled .scroll-target {overflow-x: hidden;} 240306 스크롤 이슈로 삭제 */

/* 240326 월간리포트 그래프 툴팁 너비, 스크롤 설정 */
.test_solve.large .line-tooltip {
  max-width: 200px;
} /* 240826 수정 */
.test_solve.large .line-tooltip.is--up {
  padding-bottom: 30px;
} /* 240829 툴팁 마우스 오버 영역 변경*/
.test_solve.large .line-tooltip__inner {
  background: #ffffff;
  border-radius: 8px;
  border: 1px solid rgba(0, 0, 0, 0.2);
}
.test_solve.large .line-tooltip__textbox {
  border: none;
  margin: 12px 0 12px 12px;
  padding: 0 12px 0 0;
  max-height: 110px;
  overflow-y: auto;
  word-break: break-all;
  border-radius: 0; /* 240923 추가*/
}
/* .test_solve.triple-bar-chart .line-tooltip {max-width: 180px;}  240826 삭제 */
/* 240327 월간리포트 x축 툴팁 스크롤 설정 */
/* .x_label_tooltip {padding: 0;} */
/* 240829 툴팁 마우스 오버 영역 변경 */
.x_label_tooltip .label_inner {
  padding: 11px 20px;
  max-height: 320px;
  overflow-y: auto;
  background: #fff;
  font-size: 12px;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.1));
  border-radius: 8px;
  border: 1px solid rgba(0, 0, 0, 0.2);
}

/* 240328 문제집 표 스타일 */
.workbook-passage__contents table tr th,
.workbook-passage__contents table tr td {
  border: 1px solid #000;
  padding: 10px;
}
.workbook-passage__contents table tr td .article {
  border: 1px solid #000;
}

/* 240405 학습 콘텐츠, 수업 설계 */
.recommend--item.disabled,
.textbook--item.disabled {
  pointer-events: none;
  cursor: default;
}
.recommend--item.disabled .recommend_text::before,
.textbook--item.disabled .item--top-box::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 12;
  display: block;
  content: "";
  clear: both;
  height: 100%;
  background: rgba(255, 255, 255, 0.6);
}
.recommend_text {
  position: absolute;
  color: #fff;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.recommend_text .button-tag {
  left: 14px;
}
.recommend_text .desc {
  font-size: 15px;
  text-align: left;
  bottom: 51px;
  position: absolute;
  left: 14px;
  line-height: 1.2;
}
.recommend_text .desc_btm {
  width: calc(100% - 34px);
  position: absolute;
  bottom: 16px;
  left: 16px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.recommend_text .desc_btm strong {
  font-size: 20px;
}
.recommend_text .desc_btm span {
  font-size: 700;
  font-size: 14px;
}
.layer-edit__document .input--border + .state-box {
  margin-top: 0 !important;
}
.textbook--item .top-box__teacher {
  position: absolute;
  bottom: 50px;
  line-height: 1.2;
  font-size: 15px;
}
.textbook--item .top-box__share {
  right: 16px;
  position: absolute;
  bottom: 16px;
  font-weight: 800;
  color: #7e44fb;
  font-size: 14px;
}
.layer-list__thumbnail.layer-edit__workbook .textbook--item .item--top-box {
  height: 194px;
}
.layer-list__thumbnail.layer-edit__workbook
  .item--top-box
  .top-box--subcategory {
  margin-top: 0;
  bottom: initial !important;
  top: 50px;
  padding-right: 0;
  width: 180px;
}
.layer-list__thumbnail.layer-edit__workbook
  .textbook--item
  .item--top-box
  .top-box--title {
  bottom: initial;
  top: 74px;
  margin-top: 0;
  width: 190px;
  word-break: keep-all;
}
.layer-list__thumbnail.layer-edit__workbook .top-box__teacher {
  color: #fff;
  bottom: 16px;
  top: initial;
  font-size: 13px;
  line-height: 20px;
}
.layer-list__thumbnail.layer-edit__workbook .top-box__share {
  color: #fff;
  font-weight: 700;
}
.class_design .layer__container {
  width: 1244px;
  min-width: 1244px;
}
.class_design .tab--wrapper .tab-box button {
  padding-top: 0;
}
.class_design .tab--wrapper {
  margin-top: 10px;
}
.class_design .share_state button {
  color: #7e44fb;
  font-size: 16px;
  text-decoration: underline;
  text-underline-offset: 4px;
  line-height: 22px;
}
.class_design .layer__contents {
  overflow: initial;
}
.class_design .layer__contents .table--list {
  max-height: 440px;
  overflow-y: auto;
} /* 240425 height 수정*/
.class_design .page__button {
  padding: 48px 0 40px;
}
.class_design .box--empty {
  min-height: 345px;
}
.class_design .share_state {
  padding: 22px 0;
}
.class_design .share_state .tooltip--button p {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.class_design .share_state .tooltip--button p.school {
  font-size: 14px;
  color: #666;
  margin-top: 4px;
}
.class_design .share_state .tooltip--box {
  width: auto;
}
.class_design .share_state .tooltip--box-text {
  white-space: nowrap;
}
.layer-area.layer-check__plan .layer__container {
  width: 1000px;
  min-width: 1000px;
}
.layer-check__plan .box--edit {
  padding-top: 0;
}
.layer-check__plan .box--edit .table--setting .box--edit-items {
  margin-top: 0;
  width: 100%;
  padding: 20px;
}
.layer-check__plan .box--edit .box--edit-items dl {
  display: block;
}
.layer-check__plan .box--edit .box--edit-items dl dd {
  word-break: break-all;
} /* 241125 추가 */
.layer-check__plan .box--edit .box--edit-items dl dd a {
  color: #000;
}
.layer-check__plan .box--edit .table--setting .box--edit-items dt {
  padding: 0;
  min-height: 0;
}
.layer-check__plan .box--edit .table--setting .box--edit-items dd {
  margin-top: 12px;
}
.layer-check__plan .box--edit .table--setting + .box--edit-items {
  margin-top: 16px;
}
.layer-check__plan .layer__title {
  background: #fff;
}
.layer-check__plan .layer__title .layer__title-text {
  font-size: 18px;
}
.recommend--item .recommend--thum .tagbox {
  top: 16px;
  left: 16px;
}
.recommend--item .recommend--thum .sharing-box {
  left: 16px;
}
.recommend--item.is--contents .recommend--contents {
  padding: 12px 16px;
}
.recommend--item.is--contents .recommend--title {
  margin-top: 8px;
}
.recommend--item.is--contents .recommend--desc {
  margin-top: 5px;
}
.recommend--item .recommend--school {
  font-size: 13px;
  color: rgba(0, 0, 0, 0.7);
  margin-top: 10px;
}
.desc_show {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.8);
  margin-top: 15px;
}
.textbook--item.workbook .item--top-box {
  padding: 12px 16px;
}
.textbook--item.workbook .workbook_tag {
  background: none;
  color: #fff;
  padding: 0;
  gap: 4px;
}
.textbook--item.workbook .item--top-box .top-box--enddate {
  padding-top: 12px;
}
.textbook--item.workbook .workbook_tag span {
  background: none;
  color: #fff;
  gap: 0;
  background: rgba(0, 0, 0, 0.2);
  padding: 5px 16px;
  border-radius: 27px;
}
.textbook--item.workbook .workbook_tag span.tag {
  padding: 5px 12px;
}
.textbook--item.workbook .workbook_tag.hide span {
  font-size: 0;
  background: transparent;
}
.workbook-make__scroll .workbook-make__subjects .input-radio-group {
  width: 100%;
  justify-content: space-between;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
}
.workbook-make__scroll
  .workbook-make__subjects
  .input-radio-group
  .input-radio {
  width: auto;
}
.workbook-make .page__button.privacy_chk {
  padding: 20px 65px 0;
}
.workbook-make .page__button.privacy_chk .input--text {
  font-weight: 700;
  text-align: center;
  line-height: 24px;
  padding: 0;
}
.workbook-make .page__button.privacy_chk .input--text .required {
  color: #ff3a3a;
}
.make--box-items.setting_share .box-items--box.is--grid {
  display: flex;
  justify-content: space-between;
  gap: 0;
}
.make--box-items.setting_share .box-items--box.is--grid .box-item {
  width: calc((100% - 48px) / 3);
}
.make--box-items.setting_share .box-items--box.is--grid .desc_show {
  margin-top: 12px;
}
.layer-view__textbook .textbook-preview__files .file-item {
  margin-bottom: 6px;
}

/* 240409 원패스 로그인 추가 */
.main-login--form {
  background: transparent;
  backdrop-filter: none;
  box-shadow: none;
}
.main-login--form > div {
  background: #fff;
  border-radius: 20px;
  backdrop-filter: blur(15px);
  box-shadow: -30px 40px 50px rgba(15, 6, 46, 0.6);
}
/* 240503 원패스 디자인 변경으로 삭제*/
/* .main-login .onepass {margin-top: 24px; position: relative; width: 475px; height: 60px; color: #fff; box-shadow: 0px 4px 26px 0px rgba(15, 6, 46, 0.20); backdrop-filter: blur(15px);background: #7E44FB; border-radius: 40px; font-size: 20px; font-weight: 700; display: flex; align-items: center; justify-content: center;} */
header {
  z-index: 11;
}
.header--utill__profile .tooltip--box-wrap .tooltip--box.onepass {
  display: block;
  left: 50%;
  transform: translateX(-50%);
  width: 380px;
  top: calc(100% + 16px);
  z-index: 18;
} /*240425 z-index 추가*/
.header--utill__profile .tooltip--box.onepass .tooltip--box-inner::after,
.header--utill__profile .tooltip--box.onepass .tooltip--box-inner::before {
  left: 180px;
}
.header--utill__profile .tooltip--box-wrap .tooltip--box.onepass .desc p {
  font-size: 14px;
  line-height: 20px;
}
.header--utill__profile .tooltip--box-wrap .tooltip--box.onepass .desc button {
  font-size: 13px;
  color: #666;
  line-height: 20px;
  margin-top: 6px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.header--utill__profile .tooltip--box-wrap .tooltip--box.onepass .direct {
  width: 105px;
  height: 40px;
  background: #666;
  color: #fff;
  border-radius: 6px;
  gap: 8px;
  display: flex;
  font-size: 14px;
  font-weight: 400;
  padding-left: 16px;
}
.header--utill__profile
  .tooltip--box-wrap
  .tooltip--box.onepass
  .tooltip--box-text {
  display: flex;
  justify-content: space-between;
  padding: 12px 42px 12px 19px;
}
.header--utill__profile
  .tooltip--box-wrap
  .tooltip--box.onepass
  .tooltip--box-text
  .close_icon {
  font-size: 0;
  width: 16px;
  height: 16px;
  position: absolute;
  top: 12px;
  right: 14px;
}
.join-info__form .button-main.hover {
  font-size: 16px;
  width: 220px;
  height: 40px;
  padding: 0;
}
.layer-area.onepass_modal .layer__title {
  padding-left: 24px;
  padding-right: 24px;
}
.layer-area.onepass_modal .layer__contents {
  padding-top: 24px;
}
.layer-area.onepass_modal .layer__contents .history {
  margin-top: 22px;
  padding: 18px 16px;
  background: #fafafa;
  border-top: 1px solid #d9d9d9;
  border-bottom: 1px solid #d9d9d9;
  font-size: 18px;
}
.layer-area.onepass_modal .page__button {
  flex-direction: column;
  padding: 27px 34px 24px 34px;
}
.layer-area.onepass_modal .page__button button {
  width: 100%;
  height: 50px;
}
.layer-area.layer-notice .layer__title {
  /* 250328 추가 */
  padding: 20px 24px;
  height: 64px;
}
.layer-area.layer-notice .layer__contents {
  padding: 0; /* 250328 수정 */
}
.layer-area.layer-notice .contents_box {
  border: 1px solid rgba(0, 0, 0, 0.16);
  /* border-radius: 8px; 250328 수정 */
  overflow: hidden;
}
.layer-area.layer-notice .contents_box .title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 19px 24px; /* 250403 수정 */
  background: #fafafa;
  border-bottom: 1px solid #d9d9d9;
}
.layer-area.layer-notice .contents_box .file_box {
  padding: 16px 24px; /* 250328 수정 */
  border-bottom: 1px solid #d9d9d9;
}
.layer-area.layer-notice .contents_box .file_box .detail-file--item {
  display: flex;
  gap: 10px;
  color: #000;
}
.layer-area.layer-notice .contents_box .contents {
  max-height: calc(100% - 56px); /*250328수정*/
  height: 719px;
  /* line-height: 1.6; 250529 삭제 */
  /* overflow-y: auto; */
  /* 250403 추가 */
  display: flex;
  flex-direction: column;
}
.layer-area.layer-notice .contents_box .contents .detail {
  /* 250403 수정 */
  padding: 24px 10px 24px 23px;
  flex: 1;
  overflow-y: auto;
  scrollbar-gutter: stable;
  font-size: 18px;
}
.layer-area.layer-notice .contents_box .contents .detail img {
  width: 100% !important;
  height: auto !important;
}
.layer-area.layer-notice .page_num {
  font-size: 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* 250328 수정 */
  padding: 20px 24px;
  border-bottom: 1px solid #d9d9d9;
}
.layer-area.layer-notice .page_num button {
  font-size: 18px;
  gap: 4px;
}
.layer-area.layer-notice .page_num button.disabled {
  color: rgba(0, 0, 0, 0.5);
}
.layer-area.layer-notice .page_num button.disabled .ico-prev-black {
  background-image: url(../images/ico/ic_prev.svg);
}
.layer-area.layer-notice .page_num button.disabled .ico-next-black {
  background-image: url(../images/ico/ic_next.svg);
}
.layer-area.layer-notice.layer-notice__event .layer__container {
  /* 250620 이벤트 공지 추가 */
  max-height: calc(100% - -13px);
}

.layer-area .chk_close {
  background: rgba(217, 217, 217, 0.14);
  text-align: center;
  display: flex;
  gap: 32px;
  align-items: center;
  justify-content: center;
  height: 76px;
  padding: 16px 24px;
}
.layer-area .chk_close .input-check .input--box {
  align-items: center;
  gap: 10px;
}
.layer-area .chk_close .input-check .input--box::before {
  width: 18px;
  height: 18px;
}
/* 250328 추가 */
.layer-area .chk_close .button-main {
  min-width: 120px;
  margin-left: auto;
  padding: 0;
}

/* 240424 문제집 <보기> 스타일 */
.workbook-passage__contents .passage_box {
  border: 1px solid #000;
  position: relative;
  margin: 20px 80px;
  padding: 30px 20px;
}
.workbook-passage__contents .passage_box .passage_title {
  width: 16%;
  text-align: center;
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
}
.workbook-passage__contents .passage_box ul li {
  line-height: 1.3;
}

/* 240425 나의 할일, 학습진단, 리포트 */
.intro-today__info .today-info__profile {
  background: #fff;
}
.report-month__badgebox
  .month__badge.is--student
  + .month__right
  .report_empty_text {
  justify-content: center;
  padding: 0;
}
.mypage-alram.disabled .mypage-alram--center .state-box,
.mypage-alram.disabled .mypage-alram--center p {
  opacity: 0.5;
}
.intro-today__info .today-info__profile {
  height: 184px;
}

/* 240429 영상, 교채 콘텐츠 조회 팝업 이슈 수정 */
.textbook_view.layer-edit__document
  .textbook--list
  .textbook--item
  .top-box--title {
  -webkit-line-clamp: 1;
  width: 165px;
}
.video_view.layer-edit__video ul li .desc_btm strong {
  text-align: left;
  text-overflow: ellipsis;
  width: 140px;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

/* 240430 인트로 메인화면 코멘트 */
.intro-today .intro-today__ai {
  position: relative;
}
.intro-today__ai .intro_bg_motion {
  position: absolute;
  top: 0;
}
.intro-today__ai .today-ai--image {
  height: auto;
  margin: 44px 0 34px 0;
}
.intro-today__ai .today-ai--image .today-ai--image__motion {
  width: 178px;
  height: 181px;
}
.intro-today__ai .today-ai--image .tutor_comment {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
}
.intro-today__ai .today-ai--image .tutor_comment p {
  position: absolute;
  padding: 9px 20px;
  border-radius: 20px;
  background: #1c92ff;
  color: #f6f6f6;
  font-size: 18px;
  font-weight: 700;
}
.intro-today__ai .today-ai--image .tutor_comment p::before {
  position: absolute;
  width: 0;
  height: 0;
  border-left: 16.5px solid transparent;
  border-right: 16.5px solid transparent;
  border-bottom: 13px solid #1c92ff;
  display: block;
  content: "";
  clear: both;
}
.intro-today__ai .today-ai--image .tutor_comment p.right {
  left: calc(50% + 58px);
  animation: textMove 3s alternate infinite ease-in-out;
  transform-origin: bottom left;
}
.intro-today__ai .today-ai--image .tutor_comment p.right::before {
  bottom: 0;
  left: -10px;
}
.intro-today__ai .today-ai--image .tutor_comment p.left {
  background: #bb50ff;
  bottom: 0;
  right: calc(50% + 58px);
  animation: textMove 3s alternate infinite ease-in-out;
  animation-delay: 0.3s;
  transform-origin: top right;
}
.intro-today__ai .today-ai--image .tutor_comment p.left::before {
  border-bottom: 13px solid #bb50ff;
  transform: rotate(180deg);
  top: 0;
  right: -10px;
}
.intro-today__ai .today-ai--text__text {
  margin-top: 21px;
}
@keyframes textMove {
  0%,
  20% {
    transform: scale(0);
  }
  30%,
  100% {
    transform: scale(1);
  }
}
/* 240503 수업설계 VOC 이슈 수정 */
.make--box-items.lesson-subject .box-item.devide--dropdown {
  display: flex;
  max-width: 744px;
}
.make--box-items.lesson-subject
  .box-item.devide--dropdown
  .dropdown--area.is--ellipsis {
  max-width: 33.3333%;
}
.teacher-makeclasses
  .make--box-items
  .box-items--box
  .box-item:not(.makeclass-edit)
  .dropdown--item {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  min-height: 65px;
} /* 240621 2줄 스타일 삭제, min-height 추가 */

/* 240503 원패스 로그인 디자인 변경 */
.main-login .login--item.onepass .login--item-textbox {
  font-size: 22px;
}
.main-login .main-login--icon.is--onepass {
  background: url(../images/ico/ic_onepass_bk.svg);
}
.main-login .login--item.onepass:hover .main-login--icon.is--onepass {
  background: url(../images/ico/ic_onepass_w.svg);
}
.main-login--form .login--item.onepass {
  margin-top: 24px;
}
.main-login--form .login--item.onepass .login--item-button::after {
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  color: transparent;
  font-size: 0;
}

/* 240529 학습콘텐츠 고도화 */
.contents_wrap {
  padding-top: 60px;
}
.contents_wrap .recommend--item {
  height: 196px;
  width: calc((100% - 78px) / 3) !important;
  position: relative;
  border-radius: 16px;
  box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.1);
}
.contents_wrap .recommend--item .recommend--thum {
  padding: 14px 14px 12px 30px;
  height: 100%;
  border: none;
}
.contents_wrap .recommend--item .recommend--thum::before {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  border-radius: 16px;
  z-index: 6;
  content: "";
  clear: both;
  clear: both;
  background: rgba(0, 0, 0, 0.5) !important;
}
.contents_wrap .recommend--item .recommend--thum .image {
  z-index: 0;
  padding-top: 0;
  height: 100%;
  border-radius: 16px;
}
.contents_wrap .recommend--item .recommend--thum .contents_text {
  height: 100%;
  position: relative;
  color: #fff;
  display: flex;
  gap: 24px;
  justify-content: space-between;
  z-index: 10;
}
.contents_wrap .recommend--item .recommend--thum .like {
  padding: 0;
  position: initial;
  background: none;
  border-radius: 0;
  font-size: 18px;
  gap: 0;
}
.contents_wrap .recommend--item .recommend--thum .like::before {
  width: 24px;
  height: 24px;
  background-image: url(../images/ico/icon_like_w.svg);
}
.contents_wrap .recommend--item .recommend--thum .like.on::before {
  background-image: url(../images/ico/icon_like_red.svg) !important;
}
.contents_wrap .recommend--item .title {
  max-width: 112px;
  width: 100%;
}
.contents_wrap .recommend--item .ico_box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 24px;
}
.contents_wrap .recommend--item .description {
  width: 167px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.contents_wrap .recommend--item .description .desc_text {
  font-size: 15px;
  margin-top: 32px;
  min-height: 42px;
  line-height: 1.4;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
} /*240612 3줄 > 2줄 수정*/
.contents_wrap .recommend--item .description .desc_info > * {
  line-height: 1.5;
  color: #e6e6e6;
  font-size: 13px;
}
.contents_wrap .recommend--item .recommend--thum .thum-menu {
  bottom: 12px;
  top: auto;
  right: 14px;
}
.contents_wrap .box--empty {
  background: #fff;
  min-height: 352px;
  margin-top: 12px;
  border-radius: 16px;
}
.contents_wrap .recommend--item:not(.video) .recommend--thum::before {
  width: 156px;
  border-radius: 0;
  background: url(../images/img/img_workbook.svg) no-repeat !important;
}
.contents_wrap .recommend--item:not(.video) {
  background: #fff;
}
.contents_wrap .recommend--item:not(.video) .description {
  color: #333;
  position: relative;
}
.contents_wrap .recommend--item:not(.video) .recommend--thum .like {
  color: #868686;
}
.contents_wrap .recommend--item:not(.video) .recommend--thum .like::before {
  background-image: url(../images/ico/icon_like_gray.svg);
}
.contents_wrap .recommend--item:not(.video) .description .desc_info > * {
  color: #808080;
}
.contents_wrap
  .recommend--item:not(.video)
  .description
  .desc_info
  .recommend--desc
  span {
  color: #b3b3b3;
}
.contents_wrap .info-tag__menu .tab-menu--button {
  background-size: 26px;
}
.contents_wrap .info-tag__menu .tab-menu--box {
  text-align: center;
}
.contents_wrap .info-tag__menu.is--gray .tab-menu--button {
  background-image: url(../images/ico/ic_more_gray.svg);
}
.contents_wrap .recommend--item.que .recommend--thum::before {
  background-image: url(../images/img/img_workbook_que.svg) !important;
}
.contents_wrap .recommend--item.que .contents_text .title {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.contents_wrap .recommend--item.que .contents_text .que_info {
  text-align: center;
}
.contents_wrap .recommend--item.que .contents_text .que_info .ico-28 {
  width: 68px;
}
.contents_wrap .recommend--item.que .contents_text .que_info ul {
  display: flex;
  gap: 10px;
  justify-content: center;
  padding: 4px 10px 0 10px;
}
.contents_wrap .recommend--item.que .contents_text .que_info ul li {
  width: 50%;
}
.contents_wrap .recommend--item.que .contents_text .que_info ul li .num {
  font-size: 26px;
  font-weight: 800;
  word-break: keep-all;
} /* 241223 word-break 추가 */
.contents_wrap .recommend--item .recommend--thum .input-check.is--check {
  top: auto;
  bottom: 12px;
  right: 14px;
}
.contents_wrap .recommend--item.que .description .dim_text {
  position: absolute;
  color: #fff;
  font-weight: 800;
  font-size: 14px;
  background: rgba(0, 0, 0, 0.6);
  border-radius: 8px;
  padding: 9px 4px;
  min-width: 170px;
  z-index: 12;
  text-align: center;
  left: -2px;
}

@media (max-width: 1199px) {
  /*240604 contents-area, 팝업 스타일 추가*/
  .contents-area .contents_wrap .recommend--item {
    width: calc((100% - 39px) / 2) !important;
  }
  .layer-area.layer-list__thumbnail .contents_wrap .recommend--item {
    width: calc((100% - 16px) / 2) !important;
  }
  .contents-area .contents_wrap .recommend--item .title,
  .layer-area.layer-list__thumbnail .contents_wrap .recommend--item .title {
    max-width: 120px;
  }
  .contents-area .contents_wrap .recommend--item .description,
  .layer-area.layer-list__thumbnail
    .contents_wrap
    .recommend--item
    .description {
    width: calc(100% - 144px);
  }
}

/* 240604 학습 추천콘텐츠  */
.tooltip_title {
  gap: 6px;
}
.tooltip_title .tooltip--box {
  left: -100px;
  transform: translateX(0);
}
.tooltip_title .tooltip--box.arrow--center .tooltip--box-inner::after,
.tooltip_title .tooltip--box.arrow--center .tooltip--box-inner::before {
  left: 105px;
  transform: translateY(-100%) rotate(180deg);
}
.intro--title .tooltip_title .tooltip--box .tooltip--box-text strong {
  color: #000;
}
.contents-area .contents_wrap .intro__item--list .swiper-container {
  width: 100%;
  overflow: visible;
  overflow-x: clip;
} /*240614 여백 수정*/
.contents_wrap .intro__item--list .recommend--item.swiper-slide {
  width: 350px !important;
}
.contents_wrap .intro__item--list .recommend--thum::before {
  left: 0;
  top: 0;
  border-radius: 16px;
}
.contents_wrap .intro__item--list .recommend--thum::after {
  display: none;
}
/* 240913 콘텐츠 카드 순위 텍스트로 수정 */
.contents_wrap .intro__item--list.top_5 .recommend--item .ranking_num {
  position: absolute;
  font-size: 64px;
  min-width: 52px;
  text-shadow: 0px 1px 0 #fff;
  letter-spacing: -5.5px;
  text-align: center;
  -webkit-text-stroke-width: 1px;
  color: #fff;
  -webkit-text-stroke-color: #fff;
  font-weight: 800;
  bottom: -36px;
  z-index: 31;
} /* 241105 z-index 수정 */
/* .contents_wrap .intro__item--list.top_5 .recommend--thum::after {display: block; content: ""; clear: both; position: absolute; width: 72px; height: 52px; background: url(../images/ico/icon_top1.svg) no-repeat; bottom: -18px; top: auto; right: auto;}
.contents_wrap .intro__item--list.top_5 .swiper-slide:nth-child(2) .recommend--thum:after {background-image: url(../images/ico/icon_top2.svg);}
.contents_wrap .intro__item--list.top_5 .swiper-slide:nth-child(3) .recommend--thum:after {background-image: url(../images/ico/icon_top3.svg);}
.contents_wrap .intro__item--list.top_5 .swiper-slide:nth-child(4) .recommend--thum:after {background-image: url(../images/ico/icon_top4.svg);}
.contents_wrap .intro__item--list.top_5 .swiper-slide:nth-child(5) .recommend--thum:after {background-image: url(../images/ico/icon_top5.svg);} */

.contents_wrap .intro__item--list.ranking .recommend--item .contents_rank {
  position: absolute;
  font-size: 64px;
  font-weight: 800;
  bottom: -36px;
  z-index: 6;
  color: #fff;
}
.contents_wrap .recommend--item.class_plan .recommend--thum {
  background: linear-gradient(123deg, #ffe38c 16.38%, #f1d375 84.83%);
  padding: 14px 14px 11px 30px; /* 250602 수정 */
}
.contents_wrap .recommend--item.class_plan .recommend--thum:before {
  background-image: url(../images/img/folder.svg) !important;
  width: 36px;
  top: auto;
  bottom: 0;
  height: 109px;
  border-radius: 0;
}
.contents_wrap
  .recommend--item.class_plan
  .recommend--thum
  p:not(.f-14-l.f-center) {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
} /* 241029 수정 */
.recommend--item.class_plan {
  color: #684c15;
}
.recommend--item.class_plan .plan_title {
  padding-bottom: 6px;
  min-height: 53px;
}
/* 250707 선택자 수정 */
.recommend--item.class_plan .plan_title .tooltip--box-wrap {
  margin-top: 4px;
}
/* 250710 추가 */
.recommend--item.class_plan .tooltip--box {
  width: 100%;
}
.recommend--item.class_plan .plan_desc {
  border-top: 2px solid transparent;
  border-image: linear-gradient(90deg, #f8d66b 0%, #eebf29 100%);
  border-image-slice: 1;
  padding-top: 8px;
}
.recommend--item.class_plan .plan_desc .conts {
  font-size: 15px;
  min-height: 20px; /* 250602 수정 */
  line-height: 1.3;
  /* overflow: hidden; 250710 삭제 */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.recommend--item.class_plan .plan_desc li:not(.conts) {
  font-size: 13px;
  color: #926c22;
}
.recommend--item.class_plan .plan_desc .class_name {
  padding: 2px 0 6px; /* 250602 수정 */
  min-height: 28px; /* 250602 수정 */
  line-height: 20px;
  /* 250707 삭제
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis; */
}
.recommend--item.class_plan .plan_desc .school p:last-child {
  margin-top: 2px;
}
/* 240718 명예의 전당 디자인 변경 */
/* 240910 명예의 전당 css 수정 */
.banner_slide.swiper-container {
  border-radius: 20px;
}
.honor_banner {
  position: relative;
  height: 330px;
  width: 100%;
  overflow: hidden;
} /* 240613 수정*/
.honor_banner img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.honor_banner > .inner_txt,
.honor_banner > .btn_wrap {
  position: absolute;
}
.honor_banner .inner_txt {
  top: 40px;
  color: #f0f0f0;
  font-weight: 700;
  left: 40px;
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  line-height: 1.2;
}
/* .honor_banner .inner_txt::before {position: absolute; display: block; content: ""; clear: both; background: url(../images/img/img_laurel_wreath.png)center center/ 100% no-repeat; width: 405px; height: 130px; left: 50%; transform: translateX(-50%); top: -50px;} */
.honor_banner .title {
  background: url(../images/img/banner_title.png) center center/ 100% no-repeat;
  width: 298px;
  height: 123px;
  position: absolute;
  right: 0;
  top: 0;
}
.honor_banner .inner_txt .title span {
  font-size: 36px;
}
.honor_banner .inner_txt .title.open_icon::before {
  display: block;
  content: "";
  clear: both;
  position: absolute;
  bottom: 2px;
  right: -69px;
  width: 120px;
  height: 70px;
  background: url(../images/img/img_contents_open_high.png);
}
.honor_banner .inner_txt .desc {
  font-size: 56px;
  font-weight: 800;
  text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25), 0px 0px 30px #252231;
}
/* .honor_banner .inner_txt .desc span {font-size: 18px; font-weight: 800; color: #fff;}
.honor_banner .inner_txt .desc span i {font-size: 12px; font-style: normal; vertical-align: top;} */
.honor_banner .btn_wrap {
  bottom: 40px;
  left: 40px;
  display: flex;
  gap: 12px;
}
/* 240611 변경 */
.honor_banner .com_btn {
  font-size: 16px;
  color: #fff;
  line-height: 44px;
  background: #7e44fb;
  border-radius: 8px;
  width: 184px;
  height: 44px;
  font-weight: 700;
  text-align: center; /* 240905 추가*/
}
.honor_banner .com_btn:hover {
  background: #9869fc;
}
.honor_banner .com_btn.gray {
  background: #f0f0f0;
  color: #333;
}
.honor_banner .com_btn.gray:hover {
  background: #d9d9d9;
}
.banner_slide .pagination-banner {
  position: absolute;
  bottom: 14px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}
.banner_slide .swiper-pagination-bullet {
  background: rgba(255, 255, 255, 0.4);
}
.banner_slide .swiper-pagination-bullet-active {
  background: rgba(255, 255, 255, 0.8);
}

/* 240604 학습콘텐츠 조회 팝업 */
.layer-area .contents_wrap .box--search .input-box--text {
  text-overflow: ellipsis;
}
.layer-list__thumbnail.layer-edit__video .contents_wrap .recommend--item .input-check input[type=checkbox], /*240618 추가*/
.layer-area .contents_wrap .recommend--item .input-check input[type=checkbox] {
  right: 0;
}
.layer-area .contents_wrap .recommend--item {
  width: calc((100% - 32px) / 3) !important;
}
.layer-area .contents_wrap {
  padding-top: 0;
}
.layer-area .layer__container.contents_wrap .layer__contents .list--lesson {
  gap: 16px;
  min-height: 432px;
}
.layer-list__thumbnail .layer__container.contents_wrap {
  height: auto;
}
.layer-list__thumbnail .layer__container.contents_wrap .layer__contents {
  padding-bottom: 28px;
}
.layer-list__thumbnail
  .layer__container.contents_wrap
  .layer__contents
  .pagenavi--box {
  margin-top: 48px;
}
.layer-list__thumbnail
  .layer__container.contents_wrap
  .layer__contents
  .box--empty {
  min-height: 345px;
  height: 345px;
}
.layer-list__thumbnail
  .contents_wrap
  .recommend--item:not(.video)
  .recommend--thum::before {
  min-height: 196px;
}
.layer-search__plan .contents_wrap .class_plan .recommend--thum {
  border-radius: 16px;
}
.layer-search__plan .contents_wrap .list--lesson {
  padding-top: 24px;
}
.layer-search__plan .contents_wrap .list--lesson .recommend--thum .input-check {
  bottom: auto;
  top: 14px;
  z-index: 13;
}
.layer-search__plan
  .contents_wrap
  .recommend--item.class_plan
  .plan_desc
  .conts {
  overflow: initial;
}
.layer-search__plan .contents_wrap .recommend--item.class_plan .tooltip--box {
  z-index: 16;
  width: 100%;
}
.layer-search__plan .contents_wrap .layer__contents {
  overflow-y: auto;
}

@media (max-width: 1199px) {
  .layer-area .contents_wrap .recommend--item {
    width: calc((100% - 16px) / 2) !important;
  }
}

/* 240610 학생 학습 추천콘텐츠 */
.workbook--intro.is--student .intro--title .tooltip_title::after {
  right: 0;
}
.contents_card {
  display: flex;
  background: #d9e1ff;
  min-height: 276px;
  border-radius: 20px;
}
.contents_card.recommend {
  background: #e0d9ff;
}
.contents_card .inner_card {
  padding: 40px;
  width: 430px;
}
.contents_card .recommend--item {
  width: 350px !important;
}
.contents_card .recommend--item .recommend--thum::after {
  display: none;
}
.contents_card .card_text {
  background: #fff;
  border-radius: 0 16px 16px 0;
  width: calc(100% - 430px);
  padding: 36px 40px;
  font-size: 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.contents_card .card_text .noti {
  color: #7e44fb;
  font-weight: 700;
}
.contents_card .card_text .info {
  color: #494949;
  margin-top: 16px;
  font-size: 0;
}
.contents_card .card_text .info span {
  font-size: 18px;
}
.contents_card .card_text .info span:not(:first-child)::before {
  display: inline-block;
  content: "";
  width: 1px;
  height: 10px;
  background: #999;
  margin: 0 8px;
}
.contents_slide .swiper-container {
  margin: -20px;
  padding: 20px;
}
.contents_slide .swiper-button-prev,
.contents_slide .swiper-button-next {
  margin-top: -50px;
  box-shadow: none;
}
.contents_slide .swiper-button-prev {
  left: -64px;
  transform: rotate(180deg);
}
.contents_slide .swiper-button-next {
  right: -64px;
}
.weak_book .contents_card:not(:first-child) {
  margin-top: 24px;
}
.contents_wrap .con_empty {
  height: 276px;
  position: relative;
  border-radius: 20px;
  overflow: hidden;
}
.contents_wrap .con_empty::before {
  display: block;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.7);
  filter: blur(1.5px);
}
.contents_wrap .con_empty .con_text {
  position: absolute;
  font-size: 20px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  line-height: 1.5;
}

.contents_wrap .intro__item--list .swiper-container {
  margin: -20px;
  padding: 20px;
}
.contents_card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}
/* 240612 토글 이슈 수정 */
.contents_wrap:not(.recommend) .recommend--item:not(.is--dimmed):hover {
  left: -3px;
  top: -2px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
} /* 241105 수정 */
.contents_wrap .info-tag__menu .tab-menu--box {
  width: 145px;
  top: 36px;
}
/* .contents_wrap .info-tag__menu .tab-menu--box a {background: #fff;}
.contents_wrap .info-tag__menu .tab-menu--box a:first-child {border-top-left-radius: 10px; border-top-right-radius: 10px;} */
/* 240612이슈 과목리포트 진단 차트 넓이 이슈 수정 */
.report-month .month_level {
  width: calc(100% - 432px);
}

/* 240613 교사 추천콘텐츠 더보기 버튼 노출 */
.contents_wrap.workbook--intro .intro--title {
  margin-top: 84px;
} /*240614 z-index 삭제/ 240913 margin 값 변경*/

/* 240614 수업설계안 라디오 버튼 */
.layer-area.class_design .contents_wrap .recommend--item .input-radio {
  left: auto;
  top: 14px;
  right: 14px;
}
.layer-area.class_design .contents_wrap .recommend--item .input-radio input {
  left: auto;
  right: 0;
  top: 0;
}

/* 240614이슈 교사 학습콘텐츠 토글 위치 수정 */
.contents-area .contents_wrap .intro__item--list .swiper-container {
  width: calc(100% + 20px);
}
.contents_wrap.workbook--intro.is--teacher
  .swiper-slide.recommend--item
  .tab-menu--box {
  top: auto;
  bottom: 0;
  right: 36px;
  border: 1px solid #e6e6e6;
}
.contents_wrap.workbook--intro.is--teacher
  .info-tag__menu
  .tab-menu--box
  a:not(:first-child) {
  border-top: 1px solid #e6e6e6;
}

/* 240618 설문조사 */
.layer-area.layer_survey .layer__container {
  width: 644px;
}
.layer-area.layer_survey .layer__contents {
  padding: 36px 32px 32px;
}
.layer-area.layer_survey .layer__contents .title {
  margin-top: 16px;
  font-size: 28px;
  color: #7e44fb;
  font-weight: 800;
}
.layer-area.layer_survey .layer__contents .title span {
  position: relative;
}
.layer-area.layer_survey .layer__contents .title span::after {
  display: block;
  content: "";
  position: absolute;
  height: 22px;
  right: 0;
  bottom: 0;
  left: -3px;
  background-color: rgba(126, 68, 251, 0.14);
  border-radius: 22px;
  z-index: 5;
}
.layer-area.layer_survey .layer__contents .desc {
  position: relative;
  border: 1px solid #e3e4f8;
  margin-top: 33px;
  padding: 20px;
  background: #f2f5ff;
  border-radius: 8px;
  width: 100%;
}
.layer-area.layer_survey .layer__contents .desc .desc_list {
  display: flex;
  align-items: center;
  padding: 10px;
  background: #e7edff;
  border-radius: 4px;
  width: 422px;
  height: 40px;
  color: #494949;
  font-size: 18px;
  font-weight: 700;
}
.layer-area.layer_survey .layer__contents .desc .desc_list span {
  color: #628fff;
  margin: 0 14px 0 4px;
  font-size: 20px;
  font-weight: 800;
}
.layer-area.layer_survey .layer__contents .desc .desc_list:not(:first-child) {
  margin-top: 13px;
}
.layer-area.layer_survey .layer__contents .desc .img_survey {
  position: absolute;
  top: 20px;
  right: 24px;
}
.layer-area.layer_survey .chk_close {
  justify-content: space-between;
  padding: 24px;
}
.layer-area.layer_survey .chk_close .input-check .input--box {
  gap: 4px;
}
.layer-area.layer_survey .chk_close .close_btn {
  display: flex;
  align-items: center;
  gap: 2px;
  font-size: 16px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.survey_area .box--edit {
  padding: 0;
}
.survey_area .box--edit .survey_list {
  padding: 24px 24px 48px 24px;
}
.survey_area .box--edit-items .row {
  justify-content: center;
  display: flex;
  margin-top: 40px;
  gap: 40px;
}
.survey_area .box--edit-items .etc {
  display: flex;
}
.survey_area .box--edit-items .input-box.border-gray {
  min-height: 24px;
  padding: 0 0 2px;
  width: 260px;
}
.survey_area .box--edit-items .input-box.border-gray.width-full {
  width: 100%;
}
.survey_area .box--edit-items .column {
  display: flex;
  flex-direction: column;
  margin-top: 32px; /* 240828 수정 */
  gap: 16px;
}
.survey_area .box--edit-items .column .input-radio {
  margin-left: 0;
}
.survey_area .box--edit .page__button {
  box-shadow: 0px -8px 20px rgba(0, 0, 0, 0.06);
  padding: 30px 0;
}
.survey_completed .box-bg__white {
  padding: 84px 0 60px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.survey_completed .box-bg__white img {
  width: 300px;
  margin: 65px 0;
}
.survey_completed .box-bg__white button {
  width: 278px;
}

/* 240618 학습콘텐츠 팝업 */
.contents_wrap .recommend--item.disabled::before {
  display: block;
  content: "";
  background: rgba(255, 255, 255, 0.7);
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: 11;
  border-radius: 16px;
}
.contents_wrap .recommend--item.disabled .contents_text,
.contents_wrap .recommend--item.disabled .input-check {
  opacity: 0.7;
}

/* 240620 학습콘텐츠 영상 카드 구분선 수정 */
.recommend--item.video .recommend--desc span:not(:first-child)::before {
  background-color: #e6e6e6;
}

/* 240621 학생 대시보드 */
.intro_character {
  margin-top: 80px;
}
.intro_character .box-grid {
  gap: 5.3%;
}
.intro_character.intro-today .intro_title {
  padding-top: 12px;
  width: 46.1%;
  height: auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.intro_character .intro_title strong {
  font-size: 36px;
  color: #341761;
  font-weight: 800;
}
.intro_character .intro_title strong .name {
  max-width: 164px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  vertical-align: text-top;
}
.intro_character .intro_title strong .ico-50 {
  vertical-align: middle;
}
.intro_character .intro_title .em_title {
  margin-top: 14px;
  line-height: 30px;
  height: 93px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.intro_character .intro_title .intro-today__info {
  height: auto;
}
.intro_character .intro_title .intro-today__info {
  margin-top: 0;
}
.intro_character .intro-today__info .today-info__worklist .tab--contents {
  background: none;
  padding: 26px 0 0;
  border-radius: 0;
  min-height: 230px;
}
.intro_character
  .intro-today__info
  .today-info__worklist
  .tab--contents
  .box--empty-text
  p {
  padding: 54px 0 80px;
}
.intro_character
  .intro-today__info
  .today-info__worklist
  .info-worklist--row
  .row-text {
  max-width: 350px;
}
.intro_character
  .intro-today__info
  .today-info__worklist
  .info-worklist--row
  .row-text
  .title {
  font-size: 18px;
}
.intro_character
  .intro-today__info
  .today-info__worklist
  .info-worklist--row
  .category {
  position: relative;
  line-height: 28px;
  max-width: 140px;
  padding-right: 28px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.intro_character
  .intro-today__info
  .today-info__worklist
  .info-worklist--row
  .category
  i {
  position: absolute;
  right: 0;
}
.intro_character .intro-today__info .today-info__worklist .tab-box {
  height: 50px;
}
.intro_character
  .intro-today__info
  .today-info__worklist
  .tab-box
  .tab--button {
  font-size: 18px;
}
.intro_character
  .intro-today__info
  .today-info__worklist
  .tab-box
  .tab--button.active {
  border-bottom-width: 3px;
  background: transparent;
  font-weight: 800;
}
.intro_character
  .intro-today__info
  .today-info__worklist
  .info-worklist--button {
  bottom: 0;
  left: 0;
  right: 0;
}
.intro_character
  .intro-today__info
  .today-info__worklist
  .info-worklist--button
  a {
  height: 52px;
  font-size: 18px;
  line-height: 52px;
}
.intro_character.intro-today .intro_profile {
  width: 48.5%;
  padding: 40px;
  height: auto;
  min-height: 458px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.intro_character .profile_top {
  display: flex;
  justify-content: space-between;
}
.intro_character .intro_profile .profile_img {
  position: relative;
  width: 300px;
  height: 300px;
}
.intro_character .intro_profile .profile_img .level_badge {
  position: absolute;
  width: 72px;
  height: 86px;
  padding: 10px;
  font-size: 18px; /* 240930 추가 */
  top: 0;
  right: 0;
}
.intro_character .intro_profile .profile_img .level_badge strong {
  font-size: 30px;
  bottom: 20px;
} /* 240930 추가 */
.intro_character .intro_profile .profile_img .profile_link {
  transition: all 0.3s;
  width: 100%;
  height: 100%;
  display: block;
  overflow: hidden;
  background: #f0e9ff;
  border-radius: 50%;
}
.intro_character .intro_profile .profile_img .profile_link img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}
.intro_character .intro_profile .profile_img .profile_link .profile_level {
  display: none;
}
.intro_character .intro_profile .profile_img .profile_link:hover:before {
  display: block;
  position: absolute;
  width: 100%;
  border-radius: 50%;
  content: "";
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(1px);
}
.intro_character
  .intro_profile
  .profile_img
  .profile_link:hover
  .profile_level {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 160px;
  height: 40px;
  background: rgba(240, 233, 255, 0.9);
  border-radius: 10px;
  color: #7e44fb;
  font-size: 16px;
  font-weight: 700;
}
.intro_character
  .intro_profile
  .profile_img
  .profile_link
  .profile_level
  .ico-down-violet {
  transform: rotate(-90deg);
}
.intro_character .profile_info {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.intro_character .profile_info .point_area {
  color: #b3b3b3;
  font-size: 18px;
  font-weight: 700;
}
.intro_character .profile_info .profile_text {
  text-align: right;
}
.intro_character .profile_info .profile_text strong {
  font-size: 26px;
  font-weight: 800;
  max-width: 130px;
  display: block;
}
.intro_character .profile_info .profile_text span {
  display: inline-block;
}
.intro_character .profile_info .profile_text p {
  color: #808080;
  margin-top: 12px;
  line-height: 1.2;
  font-weight: 700;
  max-width: 130px;
  word-break: break-all;
}
.intro_character .emotion_state {
  padding: 44px 40px 0;
  text-align: center;
}
.intro_character .emotion_state .state_image {
  width: 38px;
  height: 38px;
  background: url(../images/ico/profile_ico_normal.svg) center center/100%
    no-repeat;
}
.intro_character .emotion_state.very_bad .state_image {
  background-image: url(../images/ico/profile_ico_very_bad.svg);
}
.intro_character .emotion_state.bad .state_image {
  background-image: url(../images/ico/profile_ico_bad.svg);
}
.intro_character .emotion_state.good .state_image {
  background-image: url(../images/ico/profile_ico_good.svg);
}
.intro_character .emotion_state.very_good .state_image {
  background-image: url(../images/ico/profile_ico_very_good.svg);
}
.intro_character .emotion_state .state_text_area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  color: #494949;
  font-size: 18px;
  font-weight: 700;
}
.intro_character .emotion_state .state_text span {
  color: #7e44fb;
  font-weight: 800;
  font-size: 20px;
}
.intro_character .emotion_state .state_text .state_text span.active {
  transform: scale(1.2);
  transform-origin: center;
  transition: all 0.2s;
}
.intro_character .emotion_state .range_wrap {
  position: relative;
  width: 100%;
  height: 12px;
  margin-top: 30px;
}
.intro_character .emotion_state input.emotion_range {
  display: block;
  -webkit-appearance: none;
  outline: 0;
  background: linear-gradient(
    to right,
    #7e44fb 0%,
    #7e44fb 50%,
    #f0e9ff 50%,
    #f0e9ff 100%
  );
  border-radius: 6px;
  height: 12px;
  width: 100%;
}
.intro_character .emotion_state input.emotion_range::-webkit-slider-thumb {
  position: relative;
  z-index: 1;
  -webkit-appearance: none;
  background: #fff;
  width: 22px;
  height: 22px;
  box-shadow: 0 0 0 8px rgba(126, 68, 251, 0.1);
  border-radius: 50%;
  cursor: pointer;
  transition: 0.3s ease-in-out;
}
​
  .intro_character
  .emotion_state
  input.emotion_range::-webkit-slider-thumb:hover {
  border: 2px solid #fff;
}
.intro_character
  .emotion_state
  input.emotion_range::-webkit-slider-thumb:active {
  transform: scale(1.2);
}
.intro_character .emotion_state .range_wrap ul {
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 3px;
}
.intro_character .emotion_state .range_wrap ul li {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #cbb4fd;
}
.notice_board .box-bg__white {
  padding: 30px 32px;
  min-height: 331px;
}
.notice_board .main-notice--inner {
  float: none;
  width: 100%;
  gap: 18px;
}
.notice_board .main-notice--inner .main-notice--title {
  margin-left: 0;
}
.notice_board .main-notice--inner .main-notice--title .button-tag {
  margin-right: 8px;
} /* 250605 수정 */
.main-notice--inner .main-notice--row {
  height: 28px;
}
.main-notice--info .cate {
  width: 90px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  display: inline-block;
  text-align: right;
}

@media (max-width: 1199px) {
  .intro_character .profile_top {
    display: block;
  }
  .intro_character .intro_profile .profile_img {
    width: 240px;
    height: 240px;
    margin: auto;
  }
  .intro_character .profile_info {
    margin-top: 20px;
    flex-direction: row;
  }
  .intro_character .emotion_state {
    padding: 44px 0 0;
  }
  .intro_character
    .intro-today__info
    .today-info__worklist
    .info-worklist--row
    .row-text {
    max-width: 280px;
  }
}

/* 240621 학습콘텐츠 요청사항 */
.contents_wrap .contents_list .contents_type {
  display: flex;
  gap: 20px;
}
.contents_wrap .recommend--item .title p:nth-child(2) {
  text-overflow: ellipsis;
  width: 112px;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.contents_wrap.workbook--intro .intro--title .tooltip_title::after {
  right: 30px;
  height: 19px;
}

/* 240621 학습설계안 팝업 이슈 */
.layer-area
  .contents_wrap
  .recommend--item.class_plan
  .info-tag__menu
  .tab-menu--box {
  top: auto;
  bottom: 0;
  right: 36px;
}

/* 240625 설문조사 수정/ 240828 survey_list 삭제 */
.survey_area .box--edit .box--edit-items p {
  line-height: 1.5;
}
.survey_area .box--edit .input--text span,
.survey_area .box--edit .box--edit-items p span {
  font-weight: 800;
}

/* 240627 수업설계 시간 선택 넓이 이슈 */
.teacher-makeclasses
  .make--box-items
  .box-items--box
  .box-item.lesson-calendar
  .dropdown--item {
  min-height: 34px;
}

/* 240625 교사 대시보드 */
.intro-today .intro_profile.intro-today__info {
  margin-top: 0;
  padding: 30px 32px;
}
.intro_profile.intro-today__info .today-info__profile {
  padding: 0;
  height: auto;
}
.intro_profile.intro-today__info .intro_point {
  background: rgba(240, 233, 255, 0.6);
  border-radius: 8px;
  width: 180px;
  margin: 20px auto 32px;
  padding: 11px;
  color: #7e44fb;
  font-weight: 700;
  font-size: 16px;
}
.intro_profile.intro-today__info .intro_point:hover {
  background: #d8c7fe;
}
/* .intro_profile.intro-today__info .today-info__profile .intro_point span {display: none;}
.intro_profile.intro-today__info .today-info__profile .intro_point:hover span {display: block;} */
.intro_profile.intro-today__info .today-info__profile__box {
  margin-top: 0;
}
.intro_profile.intro-today__info .today-info__profile__box .profile-box__image {
  width: 100px;
  height: 100px;
}
/* .intro_profile.intro-today__info .today-info__profile__box .profile-box__text {max-width: 175px; } */
.intro_profile.intro-today__info
  .today-info__profile__box
  .profile-box__text
  .name {
  font-size: 20px;
}
.intro_profile.intro-today__info
  .today-info__profile__box
  .profile-box__text
  .name
  strong {
  font-size: 26px;
  line-height: 1.4;
  padding: 2px 4px 0 0;
}
.intro_profile.intro-today__info .cheer_text {
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  color: #494949;
}
.intro_profile.intro-today__info .info_box {
  display: flex;
  gap: 18px;
  justify-content: space-between;
}
.intro_profile.intro-today__info .info_box .info_link_btn {
  border: 1px solid #e6e6e6;
  min-height: 173px;
  border-radius: 12px;
  width: calc((100% - 36px) / 3);
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
.intro_profile.intro-today__info .info_box.info_box2 .info_link_btn {
  width: calc((100% - 18px) / 2);
}
.intro_profile.intro-today__info .info_box .info_link_btn:hover {
  background: #f2ecff;
  border-color: #7e44fb;
}
.intro_profile.intro-today__info .info_box .info_link_btn .info_title i {
  margin-bottom: 14px;
}
.intro_profile.intro-today__info .info_box .info_link_btn .info_title p {
  color: #808080;
  font-size: 16px;
  line-height: 1.2;
}
.intro_profile.intro-today__info
  .info_box
  .info_link_btn
  .info_title
  p.f-black-60 {
  color: #494949;
  font-size: 18px;
  font-weight: 700;
  margin-top: 6px;
}
.intro_profile.intro-today__info .em_title {
  min-height: 100px;
}
.intro-notice .notice_board .box--empty-text p {
  text-align: center;
}
.button_notice .notice_board .box-bg__white .box--empty-text {
  justify-content: space-between;
  height: calc(100% - 59px);
}
.subject_notice.main-notice {
  min-height: 331px;
  padding: 30px 32px;
  background: #fff;
  border-radius: 20px;
  min-height: 330px;
}
.subject_notice .notice_title {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 32px;
}
.subject_notice .main-notice--box {
  padding: 0;
}
.subject_notice .box--empty {
  margin: 0;
  min-height: 165px;
}
.subject_notice .main-notice--inner:first-child {
  margin-right: 64px;
}
.subject_notice .main-notice--inner {
  width: calc(50% - 32px);
  gap: 18px;
}

@media (max-width: 1199px) {
  .intro-today .box-grid > .intro_profile.intro-today__info {
    width: 48.5%;
    padding: 24px;
  }
  .intro_profile.intro-today__info .today-info__profile {
    flex-direction: column;
  }
  .intro_profile.intro-today__info .today-info__profile .intro_point {
    align-self: flex-end;
  }
  .intro_profile.intro-today__info .info_box .info_link_btn {
    padding: 30px 12px;
  }
  .intro_profile.intro-today__info .info_box .info_link_btn .info_title p {
    font-size: 14px;
  }
  .intro_profile.intro-today__info
    .info_box
    .info_link_btn
    .info_title
    p.f-black-60 {
    font-size: 16px;
  }
}
/* 240625 학습경영도구 */
.tool-box li.sticker .ico {
  background-image: url(../images/tool/ic_points_border.svg);
}
.tool-box li.sticker.active button {
  background: #fff7dc;
  border-color: #ffca0e;
}
.tool-box li span.text {
  white-space: pre;
  writing-mode: vertical-rl;
  line-height: 36px;
}
.point_ranking {
  margin-top: 24px;
}
.point_ranking .tab--contents {
  padding: 0 24px 24px;
}
.point_ranking .table--list {
  margin-top: 20px;
}
.point_ranking .table--list tr td {
  padding: 16px 0;
}
.point_ranking .table--list tr td .ico_char {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-size: contain;
  margin: auto;
}
.point_ranking .table--list tr td:not(.f-16) {
  font-size: 14px;
}
.point_ranking .table--list tr td .ico-40 {
  display: block;
  margin: auto;
}
.ranking_table .table--list tr td .level_badge,
.point_ranking .table--list tr td .level_badge {
  width: 28px;
  height: 34px;
  padding: 4px;
  font-size: 7px;
  background-size: 100%;
  background-repeat: no-repeat;
  margin: auto;
}
.ranking_table .table--list tr td .level_badge strong,
.point_ranking .table--list tr td .level_badge strong {
  font-size: 12px;
  bottom: 7px;
}
.point_ranking .table--list.is--scroll-y .table--list__thead {
  margin: 0;
}
.point_ranking .table--list.is--scroll-y .table--list__tbody {
  padding: 0 4px 0 14px;
  margin: 0;
  max-height: 754px;
}
.point_ranking .sticker--box {
  height: 636px;
  padding: 0;
}
.point_ranking .tab--contents .button-main.line {
  width: 160px;
  height: 40px;
  padding: 0;
}
.point_ranking .sticker-box .list--box.is--option.open .list__tbody {
  height: 460px;
}
.ranking_table .tab--contents {
  padding: 24px;
}
.ranking_table .table--list {
  margin-top: 20px;
}
.ranking_table .table--list tr td {
  height: 64px;
  padding: 16px 0;
}
.point_ranking .table--list.is--scroll-y .table--list__thead,
.ranking_table .table--list.is--scroll-y .table--list__thead {
  padding: 0 14px;
  background: #fafafa;
  border-radius: 10px;
}
.ranking_table .table--list.is--scroll-y .table--list__thead {
  margin: 0;
}
.ranking_table .table--list.is--scroll-y .table--list__tbody {
  padding: 0 4px 0 14px;
  margin: 0;
  max-height: 354px;
}
.point_ranking .table--list.is--scroll-y .table--list__tbody table,
.ranking_table .table--list.is--scroll-y .table--list__tbody table {
  border-bottom: 1px solid #d9d9d9;
}
.point_ranking
  .table--list.is--scroll-y
  .table--list__tbody
  tr:not(:first-child),
.ranking_table
  .table--list.is--scroll-y
  .table--list__tbody
  tr:not(:first-child) {
  border-top: 1px solid #d9d9d9;
}
.point_ranking .table--list.is--scroll-y .table--list__tbody tr td,
.ranking_table .table--list.is--scroll-y .table--list__tbody tr td {
  border-bottom: none;
}
.table--list.is--scroll-y .table--list__tbody tr.my_rank {
  outline: 1px solid #b28eed;
  outline-offset: -2px;
  border-radius: 10px;
  border-top: none !important;
}
.table--list.is--scroll-y .table--list__tbody tr.my_rank + tr {
  border-top: none !important;
}
.layer-option__sticker .button-icon.open + .layer-inner {
  display: block;
}
/* 240930 학생 칭찬포인트 수정 */
.my_level {
  margin-top: 80px;
  padding: 24px;
  min-height: 552px;
}
.my_level .lv_profile {
  border-radius: 20px;
  cursor: pointer;
  max-width: 504px;
  flex: 1;
  overflow: hidden;
  position: relative;
  border: 3px solid transparent;
}
.my_level .lv_profile:hover {
  border-color: #b28ffd;
}
.my_level .lv_profile .image {
  font-size: 0;
  display: block;
  height: 100%;
}
.my_level .lv_profile .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.my_level .lv_profile .change_img {
  position: absolute;
  bottom: 24px;
  right: 24px;
  transform: scaleX(1);
  transition: all 0.2s;
  background: #fff;
  border-radius: 8px;
  color: #7e44fb;
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 11px 10px;
  min-width: 40px;
  font-size: 14px;
}
.my_level .lv_profile .change_img:hover {
  padding: 11px;
}
.my_level .lv_profile .change_img:hover::before {
  display: inline-block;
  content: "사진 프로필";
  clear: both;
}
.my_level .lv_profile .change_img.open:hover::before {
  content: "캐릭터 프로필";
}
.my_level .image .my_image {
  display: none;
}
.my_level .change_img.open + .image .my_character {
  display: none;
}
.my_level .change_img.open + .image .my_image {
  display: block;
}
.my_level .lv_profile_info {
  padding: 24px 16px 36px 24px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 42px;
}
.my_level .lv_profile_info .title strong {
  font-size: 34px;
  font-weight: 800;
}
.my_level .lv_profile_info .title strong span {
  font-size: 26px;
  font-weight: 700;
  color: #494949;
}
.my_level .lv_profile_info .title p {
  color: #808080;
  margin-top: 12px;
  font-size: 20px;
  font-weight: 700;
}
.my_level .lv_profile_info .title p span {
  padding-left: 7px;
}
.my_level .lv_profile_info .title p span:before {
  display: inline-block;
  content: "";
  clear: both;
  vertical-align: middle;
  width: 1px;
  height: 14px;
  background: #b3b3b3;
  margin-right: 10px;
}
.my_level .lv_profile_info .lv_state {
  min-height: 210px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
  border-top: 1px solid #e6e6e6;
  border-bottom: 1px solid #e6e6e6;
}
.my_level .lv_profile_info .lv_state .point {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #999;
  font-size: 18px;
  font-weight: 700;
}
.my_level .lv_profile_info .total_rank {
  display: flex;
  justify-content: space-between;
}
.my_level .lv_profile_info .total_rank li {
  text-align: center;
  flex: 1;
  position: relative;
}
.my_level .lv_profile_info .total_rank li:not(:first-child)::before {
  position: absolute;
  display: block;
  content: "";
  clear: both;
  width: 1px;
  height: 74px;
  background: #e6e6e6;
}
.my_level .lv_profile_info .total_rank li p {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  color: rgba(0, 0, 0, 0.5);
  font-size: 18px;
  font-weight: 700;
}
.my_level .lv_profile_info .total_rank li strong {
  font-size: 30px;
  padding-top: 16px;
  display: block;
}
.point_state {
  background: #fff;
  padding: 32px 24px;
  border-radius: 20px;
}
.point_state .tbody tr td {
  line-height: 1.4;
  word-break: keep-all;
}
.point_state .tbody tr td.time {
  color: #494949;
  height: 64px;
}
.point_state .tbody tr td:not(.f-16) {
  font-size: 14px;
}
.point_state .tbody tr td.text-left {
  text-align: left;
}
.point_state .tbody tr td .text-ellipsis {
  max-width: 319px;
  vertical-align: bottom;
  display: inline-block;
}
.sticker--box.is--student {
  background: #fff;
  gap: 48px;
  border-radius: 20px;
  padding: 40px;
}
.sticker--box.is--student .sticker-slider {
  padding: 0;
}
.sticker--box.is--student .sticker-slider__control {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 48px;
}
.sticker--box.is--student .sticker-slider__control p {
  margin-top: 0;
  font-size: 24px;
  font-weight: 700;
}
.sticker--box.is--student .sticker-slider__control .box-flex > button {
  position: initial;
  transform: none;
  box-shadow: none;
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.sticker--box.is--student .sticker-have__list {
  gap: 4px;
  padding: 0 6px;
}
.sticker--box.is--student .sticker-type--box {
  padding: 0;
}
.sticker--box.is--student .sticker-have__list .ico.empty {
  background: #f8f8f8;
}
.sticker--box.is--student .sticker-type--box .list--box .input--text {
  font-weight: 400;
}
.sticker-class--box ul {
  padding-bottom: 70px;
}
.sticker-class--box ul li input {
  cursor: pointer;
}
.sticker-class--box:after {
  background: linear-gradient(
    270deg,
    rgba(255, 255, 255, 0.8) 32.18%,
    rgba(255, 255, 255, 0) 87.36%
  );
}
.sticker-class--box label .input--box .input--text {
  max-width: 200px;
  max-height: 48px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.layer-character .layer__contents .title {
  font-size: 14px;
  color: #494949;
}
.layer-character .layer__container {
  width: 1096px;
  min-width: 1096px;
}
.layer-character .layer__contents {
  padding: 24px 24px 0;
  margin-bottom: 40px;
}
.layer-character .layer__contents .title strong {
  font-size: 18px;
  color: #341761;
  font-weight: 700;
  margin-right: 8px;
}
.layer-character .layer__contents .character_list {
  display: flex;
  margin-top: 32px;
  gap: 8px;
  flex-wrap: wrap;
  padding: 0 8px;
}
.layer-character .layer__contents .character_list li {
  position: relative;
  width: calc((100% - 32px) / 5);
  min-height: 200px;
  border-radius: 6px;
  overflow: hidden;
}
.layer-character .layer__contents .character_list li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.layer-character .layer__contents .character_list li .level_badge {
  width: 38px;
  font-size: 10px;
  height: 45px;
  position: absolute;
  right: 0;
  padding: 5px;
}
.layer-character .layer__contents .character_list li .level_badge strong {
  font-size: 16px;
  bottom: 9px;
}
.layer-character .layer__contents .character_list li.active {
  z-index: 1;
  transform: scale(1.1);
  box-shadow: 0px 0px 24px 0px rgba(58, 0, 183, 0.24);
}
.layer-character .layer__contents .character_list li.active img {
  border: 1px solid #7e44fb;
  border-radius: 6px;
}
.layer-character .layer__contents .character_list li.empty {
  background: #f8f8f8;
  display: flex;
  justify-content: center;
  align-items: center;
}
.layer-character .layer__contents .character_list li .ico-lock-gray {
  width: 120px;
  height: 120px;
}

/* 240702이슈 [#5177] UI 겹침  */
.modal-area.is--makelesson.class .dropdown--area .dropdown--box {
  max-height: 98px;
}

/* 240628고도화 나의교실 */
.class_info_box {
  display: flex;
  gap: 24px;
  min-height: 270px;
  margin-top: 24px;
}
.class_info_box .box-bg__white {
  padding: 30px 32px;
}
.class_info_box .box-bg__white .title {
  font-size: 24px;
  display: flex;
  align-items: center;
}
.class_info_box .box-bg__white .title .ico-30 {
  margin-right: 14px;
}
.class_info_box .my_class {
  width: calc(100% - 828px);
  min-width: 216px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.class_info_box .my_class .total {
  font-size: 24px;
  color: #808080;
}
.class_info_box .my_class .f-right p:not(.total) {
  font-size: 36px;
  margin-top: 14px;
}
.class_info_box .top_level {
  width: 804px;
}
.class_info_box .top_level ul {
  display: flex; /* 240829 justify-content: space-between;  이슈327_삭제, gap 추가 */
  gap: calc((100% - 560px) / 4);
  margin-top: 32px;
}
.class_info_box .top_level ul li .profile {
  width: 112px;
  height: 112px;
  position: relative;
}
.class_info_box .top_level ul li .profile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.class_info_box .top_level ul li .profile .level_badge {
  position: absolute;
  top: 0;
  right: 0;
  width: 38px;
  height: 45px;
  padding: 5px;
  font-size: 10px;
  line-height: 10px;
}
.class_info_box .top_level ul li .profile .level_badge strong {
  font-size: 16px;
  bottom: 9px;
  line-height: 18px;
}
.week_attendance .tab--wrapper {
  padding: 24px;
}
.week_attendance .tab--wrapper .date--button {
  gap: 24px;
}
.week_attendance .tab--wrapper .date--button .button-icon {
  width: 32px;
  height: 32px;
  border: 1px solid #e6e6e6;
}
.week_attendance .tab--wrapper .date--button .button-icon > p {
  width: 22px;
  height: 22px;
  background-position: -2px 0;
}
.week_attendance .tab--wrapper .tab-box {
  overflow: hidden;
  height: 40px;
  gap: 0;
}
.week_attendance .tab--wrapper .tab-box .tab--button {
  min-width: 72px;
  margin-top: 0;
  border: 1px solid #d9d9d9;
  border-radius: 7px 0 0 7px;
  background: #f8f8f8;
}
.week_attendance .tab--wrapper .tab-box .tab--button:last-child {
  border-left: 1px solid #d9d9d9;
  border-radius: 0 7px 7px 0;
}
.week_attendance .tab--wrapper .tab-box .tab--button .ico-28 {
  vertical-align: middle;
}
.week_attendance .tab--wrapper .tab-box .tab--button.active {
  background: #f2ecff;
  border: 1px solid #7e44fb;
}
.week_attendance .tab--wrapper .tab-box .tab--button.active .ico-sun-gray {
  background-image: url(../images/ico/btn_weatherview_violet.svg);
}
.week_attendance .tab--wrapper .tab-box .tab--button.active .ico-table-gray {
  background-image: url(../images/ico/btn_table_violet.svg);
}
.week_attendance .tab--wrapper .tab--contents {
  margin-top: 32px;
}
.week_attendance .tab--wrapper .tab--contents .table--list__thead {
  margin: 0;
  padding-right: 14px;
  background: #f8f8f8;
  border-radius: 10px;
}
.week_attendance
  .tab--wrapper
  .tab--contents
  .table--list__thead
  tr
  th:not(:first-child, :nth-child(2)) {
  padding: 16px 0 6px;
}
.week_attendance
  .tab--wrapper
  .tab--contents
  .table--list__thead
  tr:last-child
  th {
  padding: 6px 0 16px;
  color: #999;
}
.week_attendance .tab--wrapper .tab--contents .table--list__tbody {
  margin: 0;
  padding: 0 4px 0 14px;
  max-height: 330px;
}
.week_attendance .tab--wrapper .tab--contents .table--list__tbody tr td {
  padding: 13px 0;
  height: 72px;
}
.week_attendance
  .tab--wrapper
  .tab--contents
  .table--list__tbody
  tr
  td:not(:first-child, :nth-child(2)) {
  color: #808080;
}
.myclass__index
  .index__mylesson-activity
  .mylesson-activity--list
  .table--list {
  min-height: auto;
}
.myclass_student .box-bg__white {
  padding: 24px 24px 40px 24px;
}
.myclass_student .page__button {
  margin-top: 48px;
}
.myclass_student .table--setting .setting__right .input-box.is--search {
  width: 314px;
}
.mystudent--contents .mystudent--list .table--list td .table--setting {
  padding-left: 14px;
}
.mystudent--contents .mystudent--list .table--list td .name {
  max-width: 85px;
}
.index__mylesson-activity
  .mylesson-activity--list
  .dropdown--area.is--text
  > .dropdown--select
  + .dropdown--box {
  width: 124px;
}
.myclass__index .empty--bg {
  position: relative;
  min-height: 270px;
}
.myclass__index .empty--bg img {
  width: 100%;
}
.myclass__index .empty--bg::before {
  position: absolute;
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  bottom: 0;
  z-index: 1;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(6px);
  border-radius: 20px;
}
.myclass__index .empty--bg .box--empty-text {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  text-align: center;
}
.myclass__index .empty--bg .box--empty-text p {
  line-height: 1.5;
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__left {
  min-width: 304px;
}
.myclass__index .week_attendance .tab--contents .box--empty {
  min-height: 300px;
}

/* 학생 나의교실 */
.myclass__index.myclass_state .myclass-index--title.table--setting {
  display: flex;
  gap: 4px;
}
.myclass__index.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs {
  margin-top: 24px;
}
.myclass__index.myclass_state
  .mylesson-complete--graphs
  .complete-graphs--week {
  padding: 32px;
  display: flex;
  justify-content: space-between;
}
.myclass_state .intro-mystat {
  width: calc(100% - 480px);
}
/* .myclass_state .tab--wrapper .tab-box {gap: 0; height: 40px;} 240711 출석부 디자인 변경으로 삭제
.myclass_state .tab--wrapper .tab-box .tab--button {min-width: 72px; margin-top: 0; background: #f8f8f8; border-radius: 7px 0 0 7px; border: 1px solid #d9d9d9;}
.myclass_state .tab--wrapper .tab-box .tab--button.active {border-color: #7E44FB;}
.myclass_state .tab--wrapper .tab-box .tab--button.active .ico-sun-gray {background-image: url(../images/ico/btn_weatherview_violet.svg);}
.myclass_state .tab--wrapper .tab-box .tab--button.active .ico-graph-gray {background-image: url(../images/ico/ic_graph_purple.svg);}
.myclass_state .tab--wrapper .tab-box .tab--button:last-child {border-radius: 0 7px 7px 0;}
.myclass_state .tab--wrapper .tab-box .tab--button .ico-28 {vertical-align: middle;} */
.emotion_wrap {
  display: flex;
  justify-content: space-between;
  width: 61%;
  position: relative;
}
.emotion_wrap::before {
  display: inline-block;
  content: "";
  width: 1px;
  height: 100%;
  background: #d9d9d9;
  position: absolute;
  left: -32px;
}
.emotion_wrap .emotion_chart_wrap {
  width: 100%;
  max-width: 610px;
}
.emotion_wrap .week_emotion_chart canvas {
  margin-right: -10px;
}
.emotion_wrap .emotion_y_label {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: rgba(0, 0, 0, 0.5);
  padding-top: 24px;
  min-width: 30px;
}
.emotion_wrap .emotion_x_label {
  display: flex;
  justify-content: space-between;
  padding: 15px 28px 0;
}
.emotion_wrap .emotion_x_label li {
  text-align: center;
}
.emotion_wrap .emotion_x_label li .day {
  color: #808080;
  margin-top: 6px;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart {
  width: 28%;
  display: block;
  margin: 28px 0 0 28px;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend {
  flex-direction: row;
  margin-top: 40px;
  background: #f8f9fd;
  justify-content: center;
  border-radius: 8px;
  max-width: 296px;
  padding: 12px;
  gap: 32px;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend
  p:first-child
  .title:before {
  background: #7e44fb;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend
  p:last-child
  .title:before {
  background: #d8c7fe;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend
  p {
  gap: 6px;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend
  p
  .title {
  font-size: 18px;
  color: #808080;
  gap: 8px;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--chart
  .legend
  p
  .title::before {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 2px;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body,
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body
  .clock-active {
  width: 206px;
  height: 206px;
  margin: auto;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body--circle {
  width: 200px;
  height: 200px;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body
  .title {
  font-size: 20px;
  color: #808080;
  font-weight: 700;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body
  .text {
  font-size: 18px;
  font-weight: 700;
  margin-top: 1px;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body
  .text
  strong {
  font-size: 36px;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .clock-body
  .clock-active--inner
  #clockActiveProgress {
  stroke-dasharray: 615.75px;
}
.myclass_state .intro-mystat .monthly--box {
  flex-wrap: wrap;
  margin-top: 32px;
  gap: 24px;
}
.myclass_state .intro-mystat .monthly--box-item.is--solved .icon {
  background-image: url(../images/ico/img_workbook.svg);
}
.myclass_state .intro-mystat .monthly--box-item.is--rate .icon {
  background-image: url(../images/ico/img_answer.svg);
}
.myclass_state .intro-mystat .monthly--box-item.is--solvedtime .icon {
  background-image: url(../images/ico/img_time.svg);
}
.myclass__index.myclass_state .monthly--box-item .number strong {
  font-size: 30px;
}
.myclass__index.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--stack
  .monthly--box-item {
  height: 128px;
  padding: 24px;
  text-align: left;
  border-radius: 16px;
}
.myclass__index.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--stack
  .monthly--box-item
  .tag {
  font-size: 18px;
  background: transparent;
  border: none;
  padding: 0;
  border-radius: 0;
  line-height: 22px;
  margin-bottom: 25px;
}
.myclass__index.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--stack
  .monthly--box-item
  .tag
  .icon {
  width: 22px;
  height: 22px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
}
.myclass__index.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--stack
  .monthly--box-item
  .number {
  line-height: 35px;
  font-size: 20px;
  margin-top: 0;
  text-align: right;
}
.myclass_state .mystudent-detail__completion {
  margin-top: 24px;
  padding: 24px 24px 40px;
}
.myclass_state
  .mystudent-detail__completion
  .table--list
  .tbody
  td.empty
  .box--empty {
  min-height: 248px;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list {
  border: none;
  padding-top: 0;
  margin: 10px -4px 0 8px;
  align-items: flex-start;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list
  .graphs-list--day {
  width: 20%;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list
  .graphs-list--day
  .date {
  font-size: 16px;
  color: #808080;
}
.myclass_state
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list
  .graphs-list--day
  .date
  span {
  color: #333;
  margin-bottom: 4px;
  display: inline-block;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list
  .graphs-list--day
  .text {
  background: rgba(248, 248, 248, 1);
  width: 58px;
  height: 30px;
  border-radius: 20px;
  line-height: 30px;
  font-weight: 700;
  margin-top: 8px;
  display: inline-block;
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list
  .graphs-list--day
  .text.yes-end {
  background: rgba(0, 186, 19, 0.1);
}
.myclass__index
  .index__mylesson-complete
  .mylesson-complete--graphs
  .complete-graphs--week
  .graphs-week--list
  .graphs-list--day
  .text.no-end {
  background: rgba(255, 235, 235, 1);
}
.attendancelist--box .table--list thead th .emotion_tag {
  margin-top: 14px;
}

@media (max-width: 1199px) {
  .myclass_state
    .index__mylesson-complete
    .mylesson-complete--graphs
    .complete-graphs--week
    .graphs-week--chart {
    margin-left: 0;
  }
  .emotion_wrap {
    width: 65%;
  }
}

/* 8월 학생 추천콘텐츠 */
.end_contents {
  position: relative;
  cursor: default;
}
.end_contents.contents_card:hover {
  box-shadow: none;
  transform: none;
}
.end_contents .end_box {
  position: absolute;
  top: 0;
  padding: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(1.5px);
  z-index: 10;
}
.end_contents .end_box i {
  width: 52px;
  height: 52px;
  display: inline-block;
}
.end_contents .end_box p {
  text-align: center;
  color: #1a1a1a;
  font-size: 20px;
  line-height: 1.5;
  margin-top: 18px;
}
.layer_point.layer-area .layer__contents {
  padding: 40px;
  width: 570px;
}
.layer_point .layer__contents strong {
  font-size: 26px; /*240806 변경*/
  font-weight: 700;
}
.layer_point .layer__contents .point_text {
  font-size: 28px;
  font-weight: 700;
  margin-top: 24px;
}
.layer_point .layer__contents .point_text span {
  font-weight: 800;
}
.layer_point .layer__contents .button-main {
  background: #494949;
  color: #fff;
  width: 183px;
  margin-top: 24px;
}

/* 240705 설문 이미지케이스 추가 */
.survey_area .survey_img {
  margin-top: 32px;
  max-width: 746px;
}
.survey_area .survey_img:not(:first-child) {
  margin-top: 26px;
}
.survey_area .survey_img img {
  border: 1px solid #b3b3b3;
  width: 100%;
}

/* 240710 AI리포트 */
.student_scatter {
  margin-top: 24px;
  padding: 24px;
}
.student_scatter .title.f-24-sb {
  display: flex;
  gap: 8px;
  margin-bottom: 24px;
}
.student_scatter .title .tooltip--box-wrap {
  height: 24px;
}
.student_scatter .tooltip--box {
  transform: none;
  left: -150px;
}
.student_scatter .tooltip--box.arrow--center .tooltip--box-inner::after,
.student_scatter .tooltip--box.arrow--center .tooltip--box-inner::before {
  left: 155px;
  transform: translate(0, -100%) rotate(180deg);
}
.student_scatter .tooltip--box.arrow--center .tooltip--box-inner::after {
  left: 156px;
}
.student_scatter .scatter_info {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 40px;
}
.student_scatter .scatter_chart {
  flex: 1;
  width: 60%;
  position: relative;
  padding-left: 15px;
}
.student_scatter .scatter_chart .legend {
  font-size: 14px;
  color: #494949;
  position: absolute;
}
.student_scatter .scatter_chart .legend.answer {
  top: 0;
  left: 0;
  transform-origin: right bottom;
  text-rendering: optimizeLegibility;
  transform: rotate(-90deg);
  top: -17px;
  left: -44px;
}
.student_scatter .scatter_chart .legend.learning {
  bottom: -14px;
  right: 12px;
}
.student_scatter .scatter_chart .scatter_bg {
  width: calc(100% - 81px);
  height: calc(100% - 57px);
  position: absolute;
  pointer-events: none;
  display: flex;
  flex-wrap: wrap;
  top: 19px;
  left: 59px;
}
.student_scatter .scatter_chart .scatter_bg .group {
  width: 50%;
  height: 50%;
  background: rgba(61, 144, 243, 0.08);
}
.student_scatter .scatter_chart .scatter_bg .group2 {
  background: rgba(33, 198, 99, 0.08);
}
.student_scatter .scatter_chart .scatter_bg .group3 {
  background: rgba(226, 101, 206, 0.08);
}
.student_scatter .scatter_chart .scatter_bg .group4 {
  background: rgba(255, 132, 64, 0.08);
}
.student_scatter .scatter_chart .scatter_bg .group1.hover {
  background: rgba(61, 144, 243, 0.16);
}
.student_scatter .scatter_chart .scatter_bg .group2.hover {
  background: rgba(33, 198, 99, 0.16);
}
.student_scatter .scatter_chart .scatter_bg .group3.hover {
  background: rgba(226, 101, 206, 0.16);
}
.student_scatter .scatter_chart .scatter_bg .group4.hover {
  background: rgba(255, 132, 64, 0.16);
}
.student_scatter .scatter_chart .scatter_bg .group1.click {
  border: 2px solid rgba(61, 144, 243, 1);
}
.student_scatter .scatter_chart .scatter_bg .group2.click {
  border: 2px solid rgba(33, 198, 99, 1);
}
.student_scatter .scatter_chart .scatter_bg .group3.click {
  border: 2px solid rgba(226, 101, 206, 1);
}
.student_scatter .scatter_chart .scatter_bg .group4.click {
  border: 2px solid rgba(255, 132, 64, 1);
}
.student_scatter .scatter_chart .chart {
  position: relative;
  z-index: 1;
}
.student_scatter .scatter_tooltip {
  position: absolute;
  z-index: 1;
  min-width: 300px;
  width: auto; /*240806 width 수정*/
  padding: 10px 0 10px 12px;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
}
.student_scatter .scatter_tooltip::before,
.student_scatter .scatter_tooltip::after {
  display: block;
  content: "";
  width: 0;
  height: 0;
  position: absolute;
  border-width: 6px 12px 6px 0px;
  border-color: transparent rgba(0, 0, 0, 0.2) transparent transparent;
  border-style: solid;
  top: 50%;
  transform: translateY(-50%);
  left: -12px;
}
.student_scatter .scatter_tooltip::after {
  left: -11px;
  border-color: transparent #fff transparent transparent;
}
.student_scatter .scatter_tooltip.left::before,
.student_scatter .scatter_tooltip.left::after {
  left: auto;
  right: -12px;
  transform: translateY(-50%) rotate(180deg);
}
.student_scatter .scatter_tooltip.left::after {
  right: -11px;
}
.student_scatter .scatter_tooltip .tooltip_inner {
  max-height: 176px;
}
.student_scatter .scatter_tooltip li {
  display: flex;
  align-items: center;
  gap: 8px;
}
.student_scatter .scatter_tooltip li:not(:first-child) {
  margin-top: 12px;
}
.student_scatter .scatter_tooltip li i.ico-28 {
  border-radius: 50%;
}
.student_scatter .scatter_tooltip li strong {
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  max-width: 52px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.student_scatter .scatter_tooltip li .tooltip_text {
  font-size: 0;
}
.student_scatter .scatter_tooltip li .tooltip_text span {
  font-size: 12px;
  color: #333;
}
.student_scatter .scatter_tooltip li .tooltip_text span:last-child::before {
  display: inline-block;
  content: "";
  clear: both;
  width: 3px;
  height: 3px;
  background: #ccc;
  margin: 0 4px;
  border-radius: 50%;
  vertical-align: middle;
}
.student_scatter .tab_wrap {
  width: 35.46%;
  max-width: 383px;
  min-height: 410px;
  flex: 1;
  position: relative;
}
.student_scatter .tab_wrap .tab .table--setting strong {
  line-height: 32px;
}
.student_scatter .tab_wrap .tab {
  visibility: hidden;
  position: absolute;
  top: 0;
  width: 100%;
}
.student_scatter .tab_wrap .tab.active {
  visibility: visible;
}
.student_scatter .tab_wrap::before {
  display: block;
  content: "";
  clear: both;
  width: 1px;
  height: 100%;
  background: #d9d9d9;
  position: absolute;
  left: -24px;
}
.student_scatter .tab_wrap .slide_btn {
  display: flex;
  gap: 6px;
}
.student_scatter .tab_wrap .slide_btn button:last-child {
  transform: rotate(180deg);
}
.student_scatter .tab_wrap .group_empty {
  margin-top: 16px;
  position: relative;
}
.student_scatter .tab_wrap .group_empty .empty_bg img {
  width: 100%;
}
.student_scatter .tab_wrap .group_empty .title {
  position: absolute;
  width: 100%;
  font-size: 20px;
  text-align: center;
  margin-top: 80px;
}
.student_scatter .swiper-pagination {
  margin-top: 0;
}
.student_scatter .swiper-pagination-bullet {
  width: 6px;
  height: 6px;
}
.student_scatter .swiper-pagination-bullet-active {
  width: 28px;
  height: 4px;
  margin-top: 1px;
}
.student_scatter .swiper-button-disabled {
  opacity: 0.3;
}
.student_scatter .swiper-slide {
  display: flex;
  flex-wrap: wrap;
  align-content: space-between; /*gap: 16px 37px; 240828 삭제 align-content 추가*/
  padding: 16px;
  width: 100%;
  min-height: 204px;
}
.student_scatter .swiper-slide .student_icon {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: url(../images/img/class_profile_image.svg) 100% / cover no-repeat;
}
.student_scatter .swiper-slide li {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 25%;
} /* 240828 수정*/
.student_scatter .swiper-slide li p:not(.student_icon) {
  max-width: 60px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  font-size: 14px;
  margin-top: 12px;
}
.student_scatter .send_feedback {
  padding: 12px 16px 16px;
}
.student_scatter .send_feedback .input-box--textarea {
  position: relative;
  padding: 10px 0 0 14px;
  border: 1px solid #ccc;
  border-radius: 8px;
  height: 101px;
}
.student_scatter .send_feedback textarea {
  padding: 0 4px 0 0;
  border-radius: 0;
  height: 59px;
  line-height: 24px;
  border: none;
}
.student_scatter .send_feedback .limit {
  position: absolute;
  bottom: 14px;
  right: 14px;
  font-size: 12px;
  color: #808080;
}
.student_scatter .send_feedback .button-main {
  margin-top: 12px;
  height: 28px;
  font-size: 14px;
  width: 100%;
}
.student_scatter.is--empty {
  position: relative;
  min-height: 517px;
  padding: 0;
  background: #fff;
  border-radius: 20px;
}
.student_scatter.is--empty .empty_bg img {
  width: 100%;
}
.student_scatter.is--empty .box--empty-text {
  position: absolute;
  width: 100%;
  gap: 0;
  top: 50%;
  transform: translateY(-50%);
}
.feedback_list {
  margin-top: 24px;
  padding: 24px 24px 40px;
}
.feedback_list .table--list table tr td {
  font-size: 14px;
  height: 64px;
}
.feedback_list .table--list table tr .text-left {
  text-align: left;
  padding: 0 24px;
  word-break: break-all;
} /* 240826 수정*/
.student_list_full .personal--list .table--list tbody tr td {
  height: 64px;
  border-bottom: 2px solid #fff;
  cursor: pointer;
}
.student_list_full .personal--list .table--list tbody tr td:first-child {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}
.student_list_full .personal--list .table--list tbody tr td:last-child {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.student_list_full .personal--list .table--list tbody tr.red td {
  background: rgba(226, 101, 206, 0.08);
}
.student_list_full .personal--list .table--list tbody tr.orange td {
  background: rgba(255, 132, 64, 0.08);
}
.student_list_full .personal--list .table--list tbody tr.blue td {
  background: rgba(61, 144, 243, 0.08);
}
.student_list_full .personal--list .table--list tbody tr.green td {
  background: rgba(33, 198, 99, 0.08);
}
.student_list_full .personal--list .table--list tbody tr:hover.red td {
  background: rgba(226, 101, 206, 0.16);
}
.student_list_full .personal--list .table--list tbody tr:hover.orange td {
  background: rgba(255, 132, 64, 0.16);
}
.student_list_full .personal--list .table--list tbody tr:hover.blue td {
  background: rgba(61, 144, 243, 0.16);
}
.student_list_full .personal--list .table--list tbody tr:hover.green td {
  background: rgba(33, 198, 99, 0.16);
}
.student_list_full .table--list > .tbody::before,
.student_list_full .table--list > .tbody::after {
  display: none;
}
.learning_change .layer__container {
  width: 1016px;
  min-width: 1016px;
}
.learning_change .tab--contents {
  width: calc(100% - 120px);
}
.learning_change .tab--contents .legend {
  display: flex;
  justify-content: flex-end;
  gap: 16px;
  font-size: 14px;
  margin-bottom: 16px;
}
.learning_change .tab--contents .legend p span {
  width: 8px;
  height: 8px;
  background: #6e97ff;
  display: inline-block;
  border-radius: 50%;
  margin-right: 8px;
}
/* .learning_change .tab--contents .legend p:last-child span {background: #fff; border: 2px solid #3DCD90;} 240731 정답률 삭제 */
.learning_change .tab--contents .scale_label {
  display: flex;
  justify-content: space-between;
  margin-left: 32px;
  font-size: 14px;
  color: #494949;
  margin-bottom: 24px;
} /* 240731  margin-bottom 변경 */
.learning_change .layer__contents {
  display: block;
  padding: 32px 32px 24px;
}
.learning_change .layer__contents .tab--wrapper {
  display: flex;
}
.learning_change .layer__contents .learning_student {
  max-height: 600px;
  width: 120px;
  border-right: 1px solid #d9d9d9;
  display: block;
  height: auto;
}
.learning_change .layer__contents .learning_student .tab--button {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100px;
  gap: 16px;
  min-width: 100px;
  background-color: transparent;
  border-radius: 0;
  font-weight: 400;
  margin-top: 0;
}
.learning_change
  .layer__contents
  .learning_student
  .tab--button
  ~ .tab--button {
  margin-top: 24px;
}
.learning_change .layer__contents .learning_student .student_icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background-size: cover;
}
.learning_change
  .layer__contents
  .learning_student
  .tab--button.active
  .student_icon,
.learning_change
  .layer__contents
  .learning_student
  .tab--button:hover
  .student_icon {
  border: 1px solid #7e44fb;
}
.learning_change .layer__contents .learning_student .tab--button.active p,
.learning_change .layer__contents .learning_student .tab--button:hover p {
  color: #7e44fb;
  font-weight: 700;
}
.learning_change
  .layer__contents
  .learning_student
  .tab--button.active
  .student_icon {
  width: 100px;
  height: 100px;
}
.learning_change .layer__contents .learning_student p:not(.student_icon) {
  font-size: 18px;
  text-align: center;
  max-width: 100px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.learning_change .learning_chart_box {
  display: flex;
  width: calc(100% - 32px);
  margin-left: 32px;
}
.learning_change .learning_chart_box .label {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: #949494;
  font-size: 14px;
  text-align: right;
  margin-top: -8px;
} /* 240731 margin-top 추가 */
.learning_change .learning_chart_box .scroll-x {
  max-width: 800px;
} /* 240731 정답률 삭제로 변경 */
.learning_change .learning_chart_box .learning_charnge_chart {
  min-width: 600px;
}
.feedback_list .table--list .box--empty {
  min-height: 240px;
}
/* 240828 삭제 */
/* @media (min-width: 768px) and (max-width: 1199px) {
    .student_scatter .swiper-slide {gap: 16px 5px; justify-content: space-between;}
} */

/* 240710 과목리포트 */
.report-month__badgebox.subject-teacher .month__badge,
.report-month__subjects .month-subject__total .month__badge {
  min-height: 267px;
  width: calc(100% - 456px);
}
.report-month__subjects .month-subject__total .month__badge .badge {
  height: 200px;
}
.month__status .student_report {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.month__status .student_report .img {
  display: block;
  width: 144px;
  height: 144px;
  border-radius: 50%;
  background-size: contain;
  background-repeat: no-repeat;
}
.month__status .student_report .button-main {
  width: 240px;
  height: 40px;
  padding: 0;
}
.report-month__subjects .month-subject__total .month__badge strong {
  font-weight: 800;
}
.report-month__subjects .month-subject__total .month__status {
  padding: 32px;
}
.report_status {
  display: flex;
  justify-content: space-between;
  height: 100%;
}
.report_status .text {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 160px;
}
.report_status li {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.report_status li:last-child {
  border-left: 1px solid #e3e4f8;
  padding-left: 24px;
}
.report_status .text .f-blue {
  color: rgba(46, 106, 255, 0.8);
}
.report_status .text .f-green {
  color: rgba(24, 167, 53, 0.8);
}
.report_status .text .f-gray {
  color: #808080;
}
.report_status .text strong {
  font-size: 18px;
  font-weight: 700;
}
.report_status .icon {
  width: 54px;
  height: 54px;
  display: inline-block;
}
.report-month__badgebox.is--empty {
  position: relative;
}
.report-month__badgebox.is--empty .month__badge.is--student + .month__right {
  background: none;
}
.report-month__badgebox.is--empty .month__right .box--empty-text {
  position: absolute;
}
.report-month__badgebox.is--empty .month__status {
  position: relative;
}
.report-month__badgebox.is--empty .month__status .empty_text {
  position: absolute;
  font-size: 20px;
  color: #1a1a1a;
  width: 100%;
  left: 0;
  text-align: center;
  top: 50%;
  transform: translateY(-50%);
  line-height: 1.5;
}
.report-month__result .box--empty-text {
  gap: 40px;
}
.month__status .more_learning {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.month__status .more_learning .list li {
  max-width: 408px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.month__status .more_learning .list li ~ li {
  margin-top: 20px;
}
.month__status .more_learning .button-main {
  width: 240px;
  padding: 0;
  align-self: flex-end;
}

/* 240710 학습콘텐츠 필수 문구 위치 변경 */
.workbook-make__content .page__button.is--small {
  padding: 30px 24px 6px;
}
.workbook-make__content .page__button.is--small button:not(.width-240) {
  min-width: 140px;
}
.workbook-make .page__button.privacy_chk .input--text .required {
  margin-right: 4px;
}

/* 240718 명예의 전당 팝업 */
.layer-area.honor_modal .layer__container {
  width: 1400px;
  min-width: 1400px;
}
.layer-area.honor_modal .layer__contents {
  padding: 0;
  background: #2c2a6d;
}
.layer-area.honor_modal .bg {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-height: 20px;
  position: relative;
}
.layer-area.honor_modal .honor_title {
  height: 54px;
  min-width: 272px;
  width: fit-content;
  background: url(../images/img/img_popup_goldtitle_272px.png) center / 100%
    no-repeat;
  margin: auto;
}
.layer-area.honor_modal .honor_title.title2 {
  width: 408px;
  background-image: url(../images/img/img_popup_goldtitle_408px.png);
}
.layer-area.honor_modal .section_info {
  position: relative;
  min-height: 1442px;
}
.layer-area.honor_modal .section_info::before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background: url(../images/img/img_content_bg.png) center/cover;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
.layer-area.honor_modal .section_info .open {
  color: #fff;
  font-size: 28px;
  font-weight: 700;
  display: flex;
  gap: 10px;
  margin: 350px auto 0;
  width: 196px;
}
.layer-area.honor_modal .section_info .desc {
  color: #f0f0f0;
  font-size: 18px;
  line-height: 1.7;
}
.layer-area.honor_modal .section_info .desc strong {
  position: relative;
  z-index: 0;
}
.layer-area.honor_modal .section_info .desc strong::after {
  display: block;
  content: "";
  clear: both;
  width: 100%;
  height: 12px;
  background: #6b36da;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
  border-radius: 6px;
}
.layer-area.honor_modal .section_info .box-bg__white {
  border-radius: 18px;
  padding: 8px;
  width: 374px;
}
.layer-area.honor_modal .section_info .info_inner {
  width: 100%;
  max-width: 1000px;
  position: absolute;
  top: 693px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}
.layer-area.honor_modal .section_info .box-bg__white .inner {
  border: 1px solid #9b78fd;
  border-radius: 14px;
  padding: 28px 20px;
}
.layer-area.honor_modal .section_info .box-bg__white .award_title {
  width: 148px;
  height: 34px;
  margin: auto;
  line-height: 34px;
  font-weight: 800;
  color: #f8f8f8;
  border-radius: 40px;
  background: linear-gradient(90deg, #5d4ad7 0%, #8472f3 51.5%, #5d4ad7 100%);
}
.layer-area.honor_modal .section_info .box-bg__white .award_title span {
  color: #3dffdc;
}
.layer-area.honor_modal .section_info .guide_box {
  background: #2c2a6d;
  min-height: 96px;
  max-width: 779px;
  margin: auto;
  border-radius: 14px;
  padding: 24px;
  color: #b3b3b3;
  font-weight: 700;
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 30px;
}
.layer-area.honor_modal .section_info .box-bg__white .contents {
  font-size: 23px;
  font-weight: 800;
  margin-top: 24px;
  display: flex;
  gap: 10px;
  justify-content: center;
}
.layer-area.honor_modal .section_info .box-bg__white .desc {
  color: #494949;
  font-size: 16px;
  font-weight: 700;
  margin-top: 14px;
}
.layer-area.honor_modal .section_howto {
  width: 100%;
  max-width: 1000px;
  margin: auto;
  text-align: center;
  padding-bottom: 100px;
}
.layer-area.honor_modal .section_howto .howto {
  display: flex;
  flex-direction: column;
  gap: 36px;
  margin-top: 36px;
}
.layer-area.honor_modal .section_howto .title_wrap strong {
  font-size: 30px;
  color: #f7f4ff;
  line-height: 40px;
  font-weight: 800;
}
.layer-area.honor_modal .section_howto .title_wrap strong span {
  color: #b28ffd;
}
.layer-area.honor_modal .section_howto .title_wrap .sub_txt {
  color: #b3b3b3;
  margin-top: 14px;
}
.layer-area.honor_modal .section_howto .preview_box {
  background: #fff;
  border-radius: 20px;
  position: relative;
  padding: 30px 32px 32px;
}
.layer-area.honor_modal .section_howto .preview_box .orange_txt {
  color: #ff8c4c;
  font-size: 18px;
  font-weight: 700;
  margin-top: 12px;
}
.layer-area.honor_modal .section_howto .tip {
  background: url(../images/ico/img_popup_tip.svg) no-repeat;
  width: 114px;
  height: 114px;
  position: absolute;
  left: 50px;
  top: -8px;
  padding: 16px;
}
.layer-area.honor_modal .section_howto .tip strong {
  display: block;
  color: #3dffdc;
  font-size: 24px;
  font-weight: 800;
  margin-top: 4px;
}
.layer-area.honor_modal .section_howto .video_wrap {
  border-radius: 20px;
  width: 100%;
  height: 711px;
  border: 1px solid #e6e6e6;
  overflow: hidden;
  margin: 30px auto 0;
}
.layer-area.honor_modal .section_howto .video_wrap video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 240924 수상자 명단 수정 */
.layer-area.honor_winner .layer__container {
  width: 1080px;
  min-width: 1080px;
}
.layer-area.honor_winner .layer__contents {
  background: #252869;
  padding: 0;
  position: relative;
}
/* .layer-area.honor_winner .layer__contents::before {display: block; content: ""; clear: both; width: 800px; height: 800px;  background: radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, 0.40) 0%, rgba(7, 20, 70, 0.00) 100%); opacity: 0.6; position: absolute; top: -400px; left: 140px; z-index: -1;} */
/* .layer-area.honor_winner .layer__contents .contents_inner {padding: 48px;} */
.layer-area.honor_winner .layer__contents .month_teacher_wrap {
  padding: 60px 48px;
  position: relative;
  background: #061541;
}
.layer-area.honor_winner .layer__contents .month_teacher_wrap::before {
  content: "";
  background: url(../images/img/img_popup_awards_bg.png);
  width: 100%;
  height: 445px; /* 241008 이슈448 수정 */
  position: absolute;
  top: 0;
  left: 0;
}
.layer-area.honor_winner .layer__contents .month_teacher_wrap .title_wrap {
  position: relative;
}
.layer-area.honor_winner .layer__contents .month_teacher_wrap .title {
  width: 708px;
  height: 122px;
  background: url(../images/img/img_popup_title.png);
  margin: auto;
}
.layer-area.honor_winner .layer__contents .month_teacher_wrap .sub_title {
  width: 296px;
  height: 60px;
  background: url(../images/img/img_popup_subtitle.png);
  margin: auto;
}
.layer-area.honor_winner .layer__contents .violet_title {
  width: 343px;
  height: 101px;
  background: url(../images/img/img_popup_awards_sub_teacher.png);
  text-align: center;
  color: #fff;
  line-height: 34px;
  margin: auto;
}
.layer-area.honor_winner .layer__contents .month_teacher {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 24px;
}
.layer-area.honor_winner .layer__contents .con_box {
  background: rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  position: relative;
  min-height: 200px;
  padding: 24px 20px;
}
.layer-area.honor_winner .layer__contents .con_box .icon_medal {
  width: 110px;
  height: 110px;
  background: url(../images/ico/img_popup_reward_110px.svg);
  position: absolute;
  left: 24px;
  top: -20px;
  font-weight: 800;
  color: #b47c28;
  text-align: center;
  padding-top: 24px;
  line-height: 20px;
}
.layer-area.honor_winner .layer__contents .month_school {
  position: absolute;
  left: 20px;
  top: 24px;
}
.layer-area.honor_winner .layer__contents .month_school::before {
  position: absolute;
  left: 0;
  display: inline-block;
  clear: both;
  content: "";
  width: 10px;
  height: 47px;
  background: radial-gradient(
    107.06% 171.46% at 90.67% 0%,
    rgba(98, 207, 162, 0.98) 0%,
    rgba(32, 146, 98, 0.98) 100%
  );
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 3px;
}
.layer-area.honor_winner .layer__contents .month_school .school_name {
  width: 116px;
  height: 47px;
  margin-left: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  color: #fff;
  font-size: 20px;
  background: radial-gradient(
    107.06% 171.46% at 90.67% 0%,
    rgba(98, 207, 162, 0.98) 0%,
    rgba(32, 146, 98, 0.98) 100%
  );
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 8px;
}
.layer-area.honor_winner .layer__contents .month_school.middle::before {
  background: radial-gradient(
    91.56% 129.72% at 90.67% 0%,
    rgba(116, 161, 255, 0.98) 0%,
    rgba(54, 112, 226, 0.98) 100%
  );
  border-color: rgba(255, 255, 255, 0.2);
}
.layer-area.honor_winner .layer__contents .month_school.middle .school_name {
  background: radial-gradient(
    91.56% 129.72% at 90.67% 0%,
    rgba(116, 161, 255, 0.98) 0%,
    rgba(54, 112, 226, 0.98) 100%
  );
  border-color: rgba(255, 255, 255, 0.2);
}
.layer-area.honor_winner .layer__contents .month_school.high::before {
  background: radial-gradient(
    91.56% 129.72% at 90.67% 0%,
    rgba(176, 140, 255, 0.98) 0%,
    rgba(128, 74, 247, 0.98) 100%
  );
  border-color: rgba(255, 255, 255, 0.3);
}
.layer-area.honor_winner .layer__contents .month_school.high .school_name {
  background: radial-gradient(
    91.56% 129.72% at 90.67% 0%,
    rgba(176, 140, 255, 0.98) 0%,
    rgba(128, 74, 247, 0.98) 100%
  );
  border-color: rgba(255, 255, 255, 0.3);
}
.layer-area.honor_winner .layer__contents .con_box .teacher_wrap {
  display: flex;
  padding-left: 172px;
}
.layer-area.honor_winner .layer__contents .con_box .teacher {
  width: 252px;
  padding-top: 20px;
  display: flex;
  gap: 18px;
  flex-direction: column;
  align-items: center;
}
.layer-area.honor_winner .layer__contents .profile_img {
  width: 144px;
  height: 144px;
  position: relative;
  background: #323f68;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.layer-area.honor_winner .layer__contents .profile_img img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.layer-area.honor_winner .layer__contents .profile_img .ranking_wrap {
  position: absolute;
  z-index: 1;
  top: -14px;
  left: -12px;
  display: flex;
  align-items: center;
}
.layer-area.honor_winner .layer__contents .ranking {
  position: relative;
  font-weight: 800;
  font-size: 30px;
  background: linear-gradient(180deg, #cfb9ff 0%, #a982ff 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.layer-area.honor_winner .layer__contents .ranking.num {
  font-size: 46px;
}
.layer-area.honor_winner .layer__contents .ranking::before {
  content: attr(title);
  position: absolute;
  -webkit-text-stroke: 5px #1e2a55;
  z-index: -1;
  left: 0;
  top: 0;
}
.layer-area.honor_winner .layer__contents .ranking_wrap.top1 .ranking {
  background-image: linear-gradient(180deg, #fee89a 0%, #d8b027 100%);
}
.layer-area.honor_winner .layer__contents .ranking_wrap.top2 .ranking {
  background-image: linear-gradient(180deg, #f4f4f4 0%, #b9b9b9 100%);
}
.layer-area.honor_winner .layer__contents .ranking_wrap.top3 .ranking {
  background-image: linear-gradient(180deg, #fcd8a2 0%, #c6821a 100%);
}
.layer-area.honor_winner .layer__contents .con_box .teacher .info {
  color: rgba(255, 255, 255, 0.6);
  font-size: 18px;
  text-align: center;
}
.layer-area.honor_winner .layer__contents .con_box .teacher .info strong {
  color: #fff;
  font-size: 22px;
  font-weight: 800;
  margin-bottom: 8px;
  display: block;
}
.layer-area.honor_winner .layer__contents .con_box.empty {
  display: flex;
  justify-content: center;
  align-items: center;
}
.layer-area.honor_winner .layer__contents .con_box.empty .empty_text {
  line-height: 1.5;
  margin-top: 12px;
  color: #ccc;
  text-align: center;
}
.layer-area.honor_winner .layer__contents .month_contents {
  padding: 60px 48px;
}
.layer-area.honor_winner .layer__contents .month_contents .violet_title {
  background-image: url(../images/img/img_popup_awards_sub_contetns.png);
}
.layer-area.honor_winner .layer__contents .month_contents .contents_wrap {
  position: relative;
}
.layer-area.honor_winner
  .layer__contents
  .month_contents
  .contents_wrap:not(:first-of-type) {
  margin-top: 60px;
}
.layer-area.honor_winner .layer__contents .month_contents .month_school {
  left: 0;
  top: 0;
}
.layer-area.honor_winner .layer__contents .month_contents .award_list {
  padding-top: 67px;
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.layer-area.honor_winner .layer__contents .month_contents .award_list li {
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.08);
  width: calc((100% - 32px) / 3);
  padding: 16px;
  min-height: 241px;
}
.layer-area.honor_winner .layer__contents .month_contents .award_teacher {
  padding: 8px 0 18px 16px;
  display: flex;
  gap: 16px;
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.layer-area.honor_winner .layer__contents .month_contents .award_teacher .name {
  max-width: 167px; /*241010 수정*/
}
.layer-area.honor_winner
  .layer__contents
  .month_contents
  .award_teacher
  .name
  p {
  margin-top: 8px;
  color: rgba(255, 255, 255, 0.6);
  font-size: 18px;
}
.layer-area.honor_winner .layer__contents .month_contents .profile_img {
  width: 80px;
  height: 80px;
  background-color: #525592;
}
.layer-area.honor_winner
  .layer__contents
  .month_contents
  .profile_img
  .ranking_wrap {
  top: -8px;
  left: -20px;
}
.layer-area.honor_winner .layer__contents .month_contents .ranking {
  font-size: 26px;
}
.layer-area.honor_winner .layer__contents .month_contents .ranking.num {
  font-size: 42px;
}
.layer-area.honor_winner .layer__contents .month_contents .ranking::before {
  -webkit-text-stroke: 5px #363975;
}
.layer-area.honor_winner .layer__contents .month_contents .contents .subject {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
}
.layer-area.honor_winner .layer__contents .month_contents .contents .tag {
  background: rgba(126, 68, 251, 0.7);
  border-radius: 8px;
  width: 62px;
  height: 28px;
  display: flex;
  gap: 4px;
  align-items: center;
  justify-content: center;
}
.layer-area.honor_winner
  .layer__contents
  .month_contents
  .contents
  .subject
  .name {
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  display: flex;
  gap: 6px;
}
.layer-area.honor_winner
  .layer__contents
  .month_contents
  .contents
  .subject
  .name
  span
  + span::before {
  display: inline-block;
  content: "";
  width: 2px;
  height: 15px;
  border-radius: 1px;
  background: #fff;
  vertical-align: middle;
  margin-right: 6px;
} /* 241008 수정 */
.layer-area.honor_winner .layer__contents .month_contents .contents .title {
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
  margin-top: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.layer-area.honor_winner
  .layer__contents
  .month_contents
  .contents_wrap.is_school {
  padding-top: 67px;
} /* 241010 기본 이미지 변경 */
.layer-area.honor_winner
  .layer__contents
  .month_teacher
  .profile_img
  .ico-profile-awards {
  width: 80px;
  height: 80px;
}
.layer-area.honor_winner
  .layer__contents
  .month_contents
  .profile_img
  .ico-profile-awards {
  width: 44px;
  height: 44px;
}

/* .layer-area.honor_winner .layer__contents .con_box .teacher strong {font-size: 18px; font-weight: 800;}
.layer-area.honor_winner .layer__contents .empty_text {text-align: center; color: #ccc; line-height: 1.6; font-size: 16px; font-weight: 400;}
.layer-area.honor_winner .layer__contents .con_box .text-ellipsis {max-width: 794px;}
.layer-area.honor_winner .layer__contents .con_box .text-ellipsis .border {width: 1px; height: 12px; display: inline-block; background: #fff; margin: 0 12px;} 
.layer-area.honor_winner .layer__contents .con_box.wait {padding: 32px; text-align: center;}
.layer-area.honor_winner .layer__contents .month_teacher {display: flex; gap: 30px; margin-top: 20px;}
.layer-area.honor_winner .layer__contents .month_teacher li {width: 33.3333%; text-align: center; position: relative; background: rgba(255, 255, 255, 0.12); min-height: 188px; border-radius: 14px; display: flex; flex-direction: column; justify-content: center; gap: 32px; padding: 32px 40px; color: #fff; font-weight: 700;}
.layer-area.honor_winner .layer__contents .month_teacher li:not(.empty) p {line-height: 1.5;}
.layer-area.honor_winner .layer__contents .month_teacher li:not(.empty)::before {display: block; content: ""; clear: both; position: absolute; background: url(../images/img/img_popup_elem.png); left: 0; top: 0; width: 78px; height: 78px;}
.layer-area.honor_winner .layer__contents .month_teacher li.mid::before {background-image: url(../images/img/img_popup_mid.png);}
.layer-area.honor_winner .layer__contents .month_teacher li.high::before {background-image: url(../images/img/img_popup_high.png);}
.layer-area.honor_winner .layer__contents .month_teacher li strong {font-size: 18px; margin-right: 8px; font-weight: 800;} */
/* 학습콘텐츠 카드 영역 고정 */
.contents_wrap .recommend--item .description .desc_info {
  display: flex;
  flex-direction: column;
  justify-content: end;
  min-height: 62px;
}

/* 240722 학습콘텐츠 서술형 */
.type--hover table tr td .chk_box {
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
  border-radius: 10px 0 0 10px;
}
.type--hover table tr.active td .chk_box {
  background: rgba(126, 68, 251, 0.1);
}
.workbook-make__preview.descriptive .desc-box .desc-title {
  font-weight: 700;
  font-size: 20px;
  line-height: 23px;
  margin: 5px 0 12px;
}
.workbook-make__preview.descriptive .desc-box .answer {
  border-radius: 10px;
  border: 1px solid #ccc;
  padding: 10px;
  min-height: 200px;
}
.workbook-make__content .page__button.is--small button:not(.width-240) {
  padding: 0;
}
.descriptive_body .desc-box {
  width: 100%;
}
.descriptive_body .desc-box .workbook-passage__titles {
  margin-bottom: 23px;
}
.descriptive_body .desc-box .desc-contents {
  height: 246px;
  max-height: 246px;
}
.descriptive_body .desc-box textarea {
  padding: 24px;
  font-size: 18px;
  line-height: 24px;
}
.descriptive.open-box .workbook-preview__explain {
  gap: 22px;
}
.workbook-preview__graph .open-box--contents {
  padding: 0;
  border: none;
}
.workbook-preview__graph .open-box--contents .recommend--item {
  flex-direction: row;
  margin-top: 12px;
}
.workbook-preview__graph .open-box--contents .recommend--thum {
  width: 300px;
  height: 155px;
  padding-top: 0;
  border-radius: 0;
  overflow: hidden;
  border: none;
}
.workbook-preview__graph .open-box--contents .recommend--thum .image {
  border-radius: 0;
}
.workbook-preview__graph .open-box--contents .recommend--contents {
  padding: 0 0 0 10px;
  border: none;
}
.workbook-preview__graph .open-box--contents .recommend--grade {
  display: block;
}
.workbook-preview__graph .open-box--contents .recommend--title {
  max-width: 160px;
  min-height: 48px;
  margin-bottom: 12px;
}
.workbook-preview__graph .open-box--contents .recommend--desc {
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
}
.workbook-preview__graph .open-box--contents .recommend--desc span::before {
  display: none;
}
.workbook-preview__graph .open-box--contents .recommend--button {
  width: 100%;
  margin-top: 20px;
}
.workbook-preview--box.is--student .descriptive_body .limit_text textarea {
  height: 204px;
  min-height: 204px;
}
.workbook-preview--box.is--student .descriptive_body .limit_text.disabled {
  background: #f0f0f0;
}
.workbook-preview--box.is--student
  .descriptive_body
  .limit_text.disabled
  textarea {
  color: #b3b3b3;
}
.workbook-preview--box .page__button .tooltip--box-wrap {
  display: flex;
}
.workbook-preview--box .page__button .tooltip--box-wrap .tooltip--box {
  left: 50%;
  transform: translateX(-50%);
  top: calc(-100% - 30px);
}
.workbook-preview--box
  .page__button
  .tooltip--box-wrap
  .tooltip--box
  .tooltip--box-inner::before,
.workbook-preview--box
  .page__button
  .tooltip--box-wrap
  .tooltip--box
  .tooltip--box-inner::after {
  transform: translate(-50%, 100%) rotate(0);
  top: auto;
  bottom: 1px;
}
.workbook-preview--box .page__button .tooltip--box-wrap:hover .tooltip--box {
  display: block;
}

.workbook-preview__graph.box-grid {
  gap: 60px;
}
.workbook-preview__graph.box-grid .cell-06 {
  width: calc((100% - 60px) / 2);
}
.workbook-preview--box
  .open-box.is--recommend
  .recommend--item
  .recommend--thum
  .image {
  border-radius: 0 0 0 10px;
}

.workbook--make .box-grid .cell-06.type-05 .tag {
  position: absolute;
  width: 60px;
  height: 28px;
  background: #ffe03e;
  color: #684c15;
  font-size: 15px;
  font-weight: 800;
  border-radius: 6px;
  line-height: 28px;
  text-align: center;
  top: 30px;
  right: 28px;
}
.workbook--make .box-grid .cell-06.type-05 .icon {
  background-image: url(../images/img/icon_descriptive.svg);
}

.layer-workbook__result.descriptive .layer__container {
  width: 1200px;
  min-width: 1200px;
}
.layer-workbook__result.descriptive .layer__contents .workbook-result__filter {
  gap: 10px;
}
.layer-workbook__result.descriptive
  .layer__contents
  .workbook-result__filter
  .dropdown--area {
  width: 110px;
}
.layer-workbook__result.descriptive
  .layer__container
  .workbook-result--table
  .table--list
  table
  thead
  th:first-child {
  padding-left: 9px;
}
.layer-workbook__result.descriptive
  .layer__container
  .workbook-result--table
  .table--list
  table
  tbody
  tr
  td
  p:not(.ico-28) {
  text-align: left;
  padding: 14px 12px;
  font-size: 14px;
  word-break: break-all;
  width: 100%; /*240807 break 추가, 240828 width 추가*/
}
.layer-workbook__result.descriptive .edit_result {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 28px 0 20px;
}
.layer-workbook__result.descriptive .edit_result p {
  margin: 0 10px;
}
.layer-workbook__result.descriptive .edit_result button {
  height: 38px;
  font-size: 18px;
  min-width: 60px;
  padding: 0 12px;
}
.layer-workbook__result.descriptive .edit_result .edit_save {
  display: none;
}
.layer-workbook__result.descriptive
  .workbook-result--table.active
  .edit_result
  .edit_btn {
  display: none;
}
.layer-workbook__result.descriptive
  .workbook-result--table.active
  .edit_result
  .edit_save {
  display: flex;
  gap: 8px;
}
.layer-workbook__result.descriptive .table--list > .tbody::before,
.layer-workbook__result.descriptive .table--list > .tbody::after {
  display: none;
}
.layer-workbook__result.descriptive .table--list .tbody .dropdown--item {
  padding: 0 10px;
  text-align: center;
  height: 36px;
}
.layer-workbook__result.descriptive .table--list .dropdown--area.icon {
  width: 80px;
  display: none;
}
.layer-workbook__result.descriptive
  .table--list
  .dropdown--area.icon
  .dropdown_icon {
  background: url(../images/ico/correct-green.svg) center/ 100% no-repeat;
  width: 28px;
  height: 28px;
  display: block;
}
.layer-workbook__result.descriptive
  .table--list
  .dropdown--area
  .dropdown_icon.red {
  background-image: url(../images/ico/incorrect-red.svg);
}
.layer-workbook__result.descriptive
  .workbook-result--table.active
  .dropdown--area.icon {
  display: block;
}
.layer-workbook__result.descriptive .workbook-result--table.active .default {
  display: none;
}

/* 240726 학습콘텐츠 미리보기 영역 수정 */
.workbook-make .workbook-preview__body .workbook-passage__contents {
  margin-bottom: 16px;
}
.workbook-make .workbook-preview__body .workbook-passage__titles {
  margin-bottom: 28px;
}

/* 240731 리포트 상단 메뉴탭 이슈 */
.report-month .tab-tags--wrapper {
  position: relative;
  z-index: 16;
}

/* 240802 과목리포트 툴팁 추가 */
.report_status .text strong .tooltip--box-wrap .tooltip--box-text strong {
  font-size: 14px;
  color: #000;
}

/* 240806 시스템 점검 추가 */
.unable_contents .box-bg__gray {
  width: fit-content;
  margin: 20px auto 0;
  background: #f8f8f8;
  padding: 14px 24px;
  color: rgba(0, 0, 0, 0.6);
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-radius: 10px;
}
.unable_contents .box-bg__gray strong {
  font-weight: 800;
}
/* 240806 헤더 현행화 */
.tooltip--box.onepass .desc p {
  color: #000;
}
/* 240812 학습경영도구 최초 진입시 추가 */
.ranking_table .tab--contents tbody .box--empty {
  min-height: 354px;
}

/* 240826 서술형 가이드 추가 및 과목리포트 툴팁이슈 */
.test_solve .line-tooltip__inner::after,
.test_solve .line-tooltip__inner::before {
  left: calc(50% - 20px);
}
.workbook-make__scroll .workbook-make__subjects .guide.f-12::before {
  content: "";
  display: inline-block;
  margin-right: 12px;
  width: 4px;
  height: 4px;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 50%;
}
.layer-workbook__result .workbook-result--table thead th .tooltip--box-text {
  padding: 11px 18px;
}

/* 240827 이번주 수업활동 드롭다운 글자 잘림 추가 */
.myclass__index .table--list .dropdown--area > .dropdown--select {
  border-radius: 0;
}

/* 240828  설문조사 및 모달 반응형 크기 이슈 */
.survey_area .box--edit-items .f-extrabold {
  font-weight: 700 !important;
}
.survey_area .box-bg__graye1 {
  padding: 24px 36px;
}
.survey_title {
  background: #9ca1b0;
  color: #fff;
  padding: 15px;
  border-radius: 8px;
  margin-top: 40px;
  font-size: 18px;
  font-weight: 800;
  text-align: center;
}
.survey_area .box--edit-items .row.is_start {
  justify-content: flex-start;
  margin-top: 32px;
}
.survey_area .box--edit-items .row .input-radio {
  margin-left: 0;
} /* 240829 수정 */
.survey_area .box--edit-items .table--list thead tr th {
  height: 44px;
  background: #e6e6e6;
  font-size: 14px;
  border-radius: 0;
  padding: 13px 4px; /* 240829 수정 */
  font-weight: 700;
}
.survey_area .box--edit-items .table--list tbody tr td {
  height: 48px;
  background: #fff;
  font-size: 14px;
  padding: 10px 12px;
  line-height: 20px;
  font-weight: 700;
}
.survey_area .box--edit-items .table--list tbody tr td .input-radio {
  vertical-align: middle;
}
.survey_area .box--edit-items .table--list .tbody::before,
.survey_area .box--edit-items .table--list .tbody::after {
  display: none;
}
.survey_area .box--edit-items .input-box--textarea textarea {
  min-height: 200px;
  padding: 20px 14px;
}
.layer-area {
  min-width: unset;
}
.report-total__top3 .people-list__list li > button {
  cursor: default;
} /* 종합리포트 학생 프로필 */

/* 240829 나의 교실 툴팁 이슈, 종합리포트 과목교사 */
.myclass_student .mystudent--list .table--list {
  padding-top: 30px;
  margin-top: -30px;
} /* 240906 이슈 393 수정 */
.myclass_student .mystudent--list .table--list tbody td .tooltip--box {
  width: 400px;
  padding-top: 14px;
  margin-top: -14px;
  padding-bottom: 14px;
  margin-bottom: -14px;
}
.myclass_student
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box-wrap:hover
  .tooltip--box {
  display: block;
}
.myclass_student .mystudent--list .table--list tbody td .tooltip--box-text {
  overflow: hidden;
  overflow-y: auto;
  max-height: 96px;
} /* 240906 이슈 393 수정 */
.report-total__information .total-monthly--subtitle {
  margin-top: 26px;
  text-align: center;
  z-index: unset; /* 240912 수정 */
}
.report-total .tension-line-chart.legend-html .legend {
  max-width: 271px;
  flex-wrap: wrap;
  top: -46px;
  left: 50%;
  transform: translateX(calc(-50% - 83px));
  right: auto;
  gap: 10px;
  flex-direction: row;
}
.report-total.subject .tension-line-chart.legend-html .legend {
  top: -36px;
}
.report-total .tension-line-chart.legend-html .legend .row {
  cursor: pointer;
}
.report-total .tension-line-chart.legend-html .legend .row .text {
  color: #999;
}
.report-total .tension-line-chart.legend-html .legend .row.active .text {
  color: #000;
}
@media (max-width: 1199px) {
  .report-total:not(.subject) .tension-line-chart.legend-html .legend {
    top: -34px;
  }
}

/* 240902 감정차트 아이콘 이슈 포인트 이벤트 삭제 */
.week_emotion_chart {
  pointer-events: none;
}

/* 240904 콘텐츠 카드, 이슈 382 폰트 변경  */
.feedback_list .table--list table tr .text-left,
.layer-workbook__result
  .layer__container
  .workbook-result--table
  .table--list
  table
  tbody
  tr
  td
  p,
.workbook-preview__explain .contents p,
textarea {
  font-family: "Malgun Gothic", sans-serif;
}
.recommend--item.class_plan .plan_desc .class_name,
.contents_wrap .recommend--item .description .desc_text {
  font-weight: bold;
}

/* 240920 이슈, 캐릭터 변경  */
.workbook-make__preview .pagenavi--box .pagenavi--number {
  min-width: auto;
}
.report-month .tab-tags .tag--button {
  height: fit-content;
  min-height: 58px;
  padding: 10px 40px;
  word-break: break-word;
}
.main-login--visual .login--visual-desc {
  margin-top: 33px;
}
.main-login--visual .main-login--ai {
  width: 562px;
  height: 500px;
  top: 231px;
}
/* 241007 메인 이미지 변경 */
.main-login--visual .main-login--ai img {
  position: absolute;
}
.main-login--visual .main-login--ai img:not(.effect) {
  width: 500px;
  height: 445px;
}
.main-login--visual .main-login--ai img.effect {
  top: -23px;
  left: -32px;
}

/* 241016 이슈 480 첨부파일 박스 깨짐 */
.tab-question-detail .box--edit-items .box-flex .input-box.input-box--text {
  padding: 6px;
  flex-wrap: wrap;
  gap: 8px;
}

/* 241105 학습콘텐츠 신고하기 기능 추가 */
.contents_wrap .recommend--item {
  z-index: 0;
}
.contents_wrap .info-tag__menu .tab-menu--box,
.contents_wrap .info-tag__menu.is--white .tab-menu--box {
  top: auto;
  bottom: 0;
  right: 36px;
  border: 1px solid #e6e6e6;
}
.contents_wrap .recommend--item .dim_box {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(2.5px);
  z-index: 30;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.contents_wrap .recommend--item .dim_box p {
  color: #fff;
  font-size: 15px;
  line-height: 22px;
  font-weight: 700;
  text-align: center;
}
.recommend--item.is--dimmed .recommend--thum .input-check,
.recommend--item.is--dimmed .recommend--thum .input-radio {
  z-index: 31;
}
.layer-view__textbook .table--setting .button-notify {
  border-radius: 8px;
  gap: 4px;
  font-size: 16px;
}
/* 콘텐츠 팝업 넓이 수정 */
.layer-contents__notify .layer__container:not(.alert):not(.confirm) {
  width: 720px;
  min-width: 720px;
}
.layer-contents__notify
  .layer__container:not(.alert):not(.confirm)
  .layer__contents {
  padding: 0;
}
.layer-contents__notify .box--edit-items {
  padding: 24px;
}
.layer-contents__notify .box--edit-items ~ .box--edit-items {
  margin-top: 24px;
}
.box--edit-items > dl.flex--column {
  flex-direction: column;
  align-items: flex-start;
}
.box--edit-items > dl.flex--column dt {
  padding: 0;
  width: 100%;
  min-height: unset;
  margin-bottom: 24px;
}
.layer-contents__notify .box--edit-items .input-radio-group {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
}
.layer-contents__notify
  .box--edit-items
  .input-radio
  + .input-radio:not(.width-full) {
  margin-left: 32px;
}
.layer-contents__notify .input-box--textarea textarea {
  padding: 20px 14px;
}
.layer-contents__notify .desc_txt {
  padding: 24px 24px 0;
}
.layer-contents__notify .desc_txt p {
  color: #808080;
  font-size: 14px;
  line-height: 18px;
  font-weight: 700;
}
.layer-contents__notify .desc_txt p ~ p {
  margin-top: 10px;
}
.layer-contents__notify .layer__container .page__button {
  padding-top: 70px;
}

/* 241121 띠배너 추가 및 파일명 말줄임 추가 */
.band-banner--wrap.is--hide {
  visibility: hidden;
  opacity: 0;
  transform: translateY(-100%);
  transition: transform 0.7s, opacity 0.7s, visibility 0.7s;
}
.band-banner {
  background-color: #4a2188;
  transition: transform 0.7s, opacity 0.7s, visibility 0.7s;
}
.band-banner.is--hide {
  visibility: hidden;
  opacity: 0;
  transform: translateY(-100%);
}
.band-banner .band-banner--inner {
  position: relative;
  padding: 14px 40px;
}
.band-banner .band-banner--text {
  text-align: center;
  display: flex;
  justify-content: center;
  gap: 60px;
  width: 863px; /* 250401 수정 */
  margin: 0 auto;
}
.band-banner .band-banner--text .band-banner--text--content {
  /* 250401 수정 */
  max-width: 1200px;
  min-width: 360px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}
.band-banner .band-banner--text .band-banner--text--content::before {
  /* 250401 수정 */
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: #fff;
  display: inline-block;
  /* margin-right: 8px; */
}
.band-banner .band-banner--text a {
  /* 250401 수정 */
  color: #fff;
  text-decoration: underline;
  text-underline-position: under;
}
.band-banner .band-banner--close {
  color: #fff;
  font-size: 16px;
  display: flex;
  align-items: center;
  position: absolute;
  right: 40px;
  top: 50%;
  transform: translateY(-50%);
}
.band-banner--wrap + .contents-area .intro_character {
  margin-top: 36px;
}
@media (max-width: 1199px) {
  .band-banner .band-banner--text {
    padding: 0 160px 0 0;
    gap: 40px;
    width: 100%;
  }
  .band-banner .band-banner--text .band-banner--text--content {
    min-width: unset;
  }
}
.make--box.type--edit
  .make--box-items.lesson-data
  .box-items--box
  .button-tag
  .file_name {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-all; /* 241125 추가*/
}
.make--box.type--edit
  .make--box-items.lesson-data
  .box-items--box
  .makeclass-edit--datalist
  .button-tag
  .file_name {
  -webkit-line-clamp: 1;
  word-break: break-all; /* 241125 추가*/
}

/* 241125 팝업 제목 말줄임 추가*/
.layer-view__textbook .layer__title-text {
  word-break: break-all;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 1030px;
}
.layer-view__textbook .file-item .file-item--name {
  word-break: break-all;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 1000px;
}

/* 241127 로그인 관리 팝업 */
.layer-certification .layer__container {
  width: 540px;
}
.layer-certification .layer__contents {
  padding: 0 30px 0;
}
.layer-certification .text-bullet {
  font-size: 14px;
  padding-left: 12px;
  text-align: center;
  margin: 24px auto;
}
.layer-certification .text-bullet::before {
  opacity: 1;
}
.layer-certification .input-box__timer .timer {
  top: 21px;
  right: 24px;
}
.layer-certification .input-box__timer.error input {
  background: #fff3f3;
  border: 1px solid #ff3a3a;
}
.layer-certification .page__button {
  padding: 34px 30px 40px;
}
.layer-certification .page__button .f-error {
  position: absolute;
  top: 6px;
  left: 30px;
}
.layer-login_manage .layer__contents .flex--column {
  align-items: start;
}

/* 241128 수업 설계 공유 비활성화 241202 수정 */
/* .teacher-makeclasses .make--box-items.disabled {opacity: 1; pointer-events: none;}
.teacher-makeclasses .make--box-items.disabled .box-items--title,
.teacher-makeclasses .make--box-items.disabled .input--text,
.teacher-makeclasses .make--box-items.disabled .desc_show {opacity: 0.3;} */
.make--box-items:not(.lesson-yn)
  .input-radio
  input:not([type="text"]):disabled:checked
  + .input--box::before {
  background-image: url("../images/form/radio_disabled.svg");
  border-color: rgba(0, 0, 0, 0.2);
}
/* 241203 맨티스이슈_326 학습진단 태그 더보기 스크롤 추가 */
.report-month .tab-tags--box.tags-select .tab-tags {
  max-height: 580px;
  overflow-y: auto !important;
}
/* 칭찬포인트 유저 포인트 회수 팝업 추가 */
.sticker-box .list__li li.user_point:hover {
  cursor: pointer;
}
.sticker-box .list__li li.user_point:hover::before {
  display: block;
  content: "";
  backdrop-filter: blur(1.5px);
  width: 100%;
  height: 100%;
  position: absolute;
  background: rgba(255, 255, 255, 0.6);
}
.sticker-box .list__li li.user_point .show_point {
  display: none;
  gap: 8px;
  background: #9869fc;
  width: 158px;
  padding-left: 8px;
  border-radius: 16px;
  height: 32px;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.sticker-box .list__li li.user_point:hover .show_point {
  display: flex;
}
.layer-point__history .layer__container {
  width: 692px;
}
.layer-point__history .layer__contents {
  padding: 16px 24px 40px;
}
.layer-point__history .sticker-box {
  background: #f7f4ff;
  border: 1px solid #d8c7fe;
  padding: 10px 20px;
  border-radius: 10px;
  width: 100%;
  font-weight: 700;
  font-size: 18px;
  display: flex;
  gap: 14px;
  justify-content: center;
  align-items: center;
  height: 69px;
}
.layer-point__history .table--list th {
  font-weight: 700;
  height: 52px;
}
.layer-point__history .table--list table tbody tr td:not(:last-child) {
  border-right: 1px solid #d9d9d9;
}
.layer-point__history .table--list table tbody tr td {
  padding: 10px 0;
  height: 48px;
}
.layer-point__history .table--list .minus_point {
  display: flex;
  justify-content: center;
  gap: 24px;
}
.layer-point__history .table--list .button-main {
  height: 28px;
  min-width: 60px;
  padding: 0 12px;
  font-size: 14px;
}
.layer-point__history .table--list .complete .count span:first-child {
  text-decoration: line-through;
}

/* 250108 otp 인증하기 */
.text-bullet.f-14-l {
  font-size: 14px;
  line-height: 20px;
}
.otp_input button.gray {
  width: 142px;
  min-width: 142px;
  height: 60px;
  padding: 0 12px;
  font-size: 16px;
}
.otp_input .input-box--text.is--large {
  font-size: 16px;
}
.otp_input .timer {
  top: 21px;
  right: 14px;
}

/* 250211 수업 복사 관련 */
.make--box-items.lesson-basic .box-item.disabled,
.make--box-items.lesson-basic.option .box-item--box .box-item.disbled {
  position: relative;
  z-index: 1;
}
.make--box-items.lesson-basic .box-item.disabled .dropdown--select {
  color: #d9d9d9;
}
.make--box-items.lesson-basic .box-item.disabled::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-color: #f6f8fe;
  opacity: 0.3;
  border-radius: 20px;
}
.make--box-items.lesson-basic.option .box-item--box .box-item.disbled::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-color: #edf1fc;
  opacity: 0.5;
  border-radius: 20px;
}

.layer-area.modal-area.layer-lesson__time .layer__container {
  width: 657px;
}
.layer-area.modal-area.layer-lesson__time .layer__container .layer__contents {
  padding: 28px 24px 52px;
}
.layer-area.modal-area.layer-lesson__time
  .layer__container
  .layer__contents
  .box--edit {
  width: 100%;
  padding: 0;
  height: 100%;
}
.layer-area.modal-area.layer-lesson__time
  .layer__container
  .layer__contents
  .box--edit-title {
  margin-bottom: 28px;
}
.layer-area.modal-area.layer-lesson__time
  .layer__container
  .layer__contents
  .box--edit-items
  > dl
  > dt {
  width: 108px;
}
.layer-area.modal-area.layer_lesson__time
  .layer__container
  .layer__contents
  dl
  dd
  .box-flex {
  width: 100%;
}
.layer-area.modal-area.layer_lesson__time
  .layer__container
  .layer__contents
  dl
  dd
  .dropdown--area:not(.width-full):not([class*="width"]) {
  width: 167px;
}
.layer-lesson__time .input-box--datetime .dropdown--area {
  width: 99px !important;
  flex-shrink: 1;
  flex-grow: 1;
}
.layer-area.modal-area.layer_lesson__time
  .layer__container
  .layer__contents
  .input-box--datetime
  + .f-16-sb {
  width: 33px;
}
.layer-area.modal-area.layer_lesson__time
  .layer__container
  .layer__contents
  .cycle__day-time
  dt {
  line-height: 36px;
}
.layer-lesson__time
  .layer__container
  .layer__contents
  .cycle__day
  .dropdown--box {
  max-height: 181px !important;
}
.layer-area.modal-area.layer_lesson__time
  .layer__container
  .layer__contents
  .cycle__week-time
  dd
  .flex--fixed.width-50 {
  width: 56px;
}
.layer-area.modal-area.layer_lesson__time .layer__container .page__button {
  justify-content: center;
  padding-top: 24px !important;
}
.layer-area.modal-area.layer_lesson__time
  .layer__container
  .page__button
  a:not([class*="width"]),
.layer-area.modal-area.layer_lesson__time
  .page__button
  button:not([class*="width"]) {
  margin: 0;
}

/* 250214 */
.layer-area.layer-lesson__copy .layer__container {
  width: 1000px;
  min-width: 1000px;
}
.layer-area.layer-lesson__copy .layer__contents {
  padding: 25px 34px 0;
  height: 100%;
}
.layer-area.layer-lesson__copy .contents-info-box {
  flex-direction: column;
  padding: 0;
  border-bottom: none;
}
.layer-area.layer-lesson__copy .contents-info-box .lesson_info {
  width: 100%;
  padding: 24px;
  margin-top: 12px;
  background-color: #f8f8f8;
  border: 1px solid #f0f0f0;
  border-radius: 16px;
  display: flex;
  gap: 52px;
}
.layer-area.layer-lesson__copy .contents-info-box .lesson_info > strong {
  font-size: 16px;
  color: #341761;
  font-weight: 700;
}
.layer-area.layer-lesson__copy .contents-info-box .lesson_info_detail {
  display: flex;
  gap: 32px;
}
.layer-area.layer-lesson__copy .contents-info-box .lesson_info_detail > p {
  font-size: 16px;
}
.layer-area.layer-lesson__copy
  .contents-info-box
  .lesson_info_detail
  > p
  > strong {
  width: 60px;
  font-weight: 700;
  margin-right: 10px;
}
.layer-area.layer-lesson__copy .layer_input_box {
  margin-top: 32px;
  /* padding: 20px 18px; 250526 삭제 */
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* border-bottom: 1px solid #f0f0f0; 250526 삭제 */
  gap: 8px;
}
.layer-area.layer-lesson__copy .check_box_list {
  display: flex;
  gap: 20px;
  /* width: 494px; 250526 삭제 */
  padding-top: 20px;
}
.layer-area.layer-lesson__copy .input-check .input--box {
  display: flex;
  gap: 8px;
}
.layer-area.layer-lesson__copy .layer_input_box .search_box {
  display: flex;
  gap: 8px;
  flex: 1;
}
.layer-area.layer-lesson__copy .layer_input_box .search_box .input-box {
  flex: 1;
}
.layer-lesson__copy .layer__container .layer__contents .table--scroll-y {
  margin-top: 16px;
}
.layer-area.layer-lesson__copy .table--list .tbody {
  height: 220px; /* 250224 수정 */
  overflow: hidden;
  overflow-y: overlay;
}
.layer-area.layer-lesson__copy .table--list table tbody tr .input-check {
  vertical-align: middle;
}

.layer-area.layer-lesson__copy
  .table--list
  table
  tbody
  tr
  td.td-title
  .td-title--text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: normal;
  font-weight: normal;
  line-height: 22px;
  text-align: left; /* 250220 추가 */
}
.layer-area.layer-lesson__copy .table--list table tbody tr td {
  padding: 10px 20px;
}
.layer-area.layer-lesson__copy
  .table--list
  table
  tbody
  tr:has(.input-check input[type="checkbox"]:checked) {
  background-color: #f7f4ff;
}
.layer-area.layer-lesson__copy .tooltip--box-wrap.tooltip_line2 .tooltip--box {
  width: 485px;
  top: calc(100% + 8px);
}
/* // 250214 수정 */

.layer-area.layer-lesson__copy .layer__container .page__button {
  padding: 32px 0;
}

/* 250225 추가 */
.layer-area.layer-lesson__copy .table--list > .tbody::before,
.layer-area.layer-lesson__copy .table--list > .tbody::after {
  display: none;
}

/* 250228 추가 */
.workbook--make .box-grid.grid-3 {
  width: 100%;
}
.workbook--make .box-grid.grid-3 .cell-06 {
  width: calc((100% - 48px) / 3);
  min-height: 280px;
  height: auto;
}
.workbook--make .box-grid .cell-06.type-05 .icon {
  background-image: url("../images/ico/icon_descriptive2.svg");
}
.workbook--make .box-grid .cell-06.type-06 .icon {
  background-image: url("../images/ico/icon_essay.svg");
}
.workbook--make .box-grid .cell-06 .icon_wrap {
  position: relative;
  width: 100%;
  min-height: 87px;
  margin-top: auto;
}
.workbook--make .box-grid .cell-06 .icon_wrap .icon {
  left: 0;
  bottom: 0;
}
.workbook--make .box-grid .cell-06 .icon_wrap .arrow {
  right: 0;
  bottom: 0;
}
.layer-area.layer-workbook__essay .layer__container {
  width: 1138px;
  min-width: 1138px;
}
.layer-area.layer-workbook__essay .layer__contents {
  padding: 24px 34px 20px;
}
.layer-area.layer-workbook__essay
  .box--search
  .dropdown--area:not([class*="width"]) {
  width: 156px;
}
.layer-area.layer-workbook__essay .table--list .tbody {
  min-height: 240px; /* 250305 수정 */
  max-height: calc(100vh - 720px); /* 250305 수정 */
  overflow: hidden;
  overflow-y: overlay;
}
.layer-area.layer-workbook__essay .page__button {
  padding: 32px 0;
}
.layer-area.layer-workbook__essay
  .tooltip--box-wrap.tooltip_line2
  .tooltip--box {
  width: 488px;
}
.layer-area.layer-workbook__essay .box--search {
  border-bottom: 1px solid #f0f0f0;
}
.layer-area.layer-workbook__essay .table--list table tbody tr td {
  padding: 10px 20px;
}
.layer-area
  .table--scroll-y
  .table--list
  tbody
  tr:last-child
  td
  .tooltip--box-wrap
  .tooltip--box {
  top: auto;
  bottom: calc(100% + 14px);
}
.layer-area
  .table--scroll-y
  .table--list
  tbody
  tr:last-child
  td
  .tooltip--box.arrow--center
  .tooltip--box-inner::after,
.layer-area
  .table--scroll-y
  .table--list
  tbody
  tr:last-child
  td
  .tooltip--box.arrow--center
  .tooltip--box-inner::before {
  transform: translate(-50%, 100%) rotate(0);
  top: auto;
  bottom: 0;
  margin-bottom: 1px;
  margin-top: 0;
}
.layer-area.layer-workbook__essay
  .table--list
  table
  tbody
  tr:has(.input-radio input[type="radio"]:checked) {
  background-color: #f7f4ff;
}
.layer-area.layer-workbook__essay .table--list table tbody tr .input-radio {
  vertical-align: middle;
}
.layer-area.layer-workbook__essay .table--list > .tbody::before,
.layer-area.layer-workbook__essay .tbody::after {
  display: none;
}
.layer-area.layer-workbook__essay
  .table--list
  table
  tbody
  tr
  td.td-title
  .td-title--text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: normal;
  font-weight: normal;
  line-height: 18px;
  text-align: left;
}
/* 250304 이슈518 */
@media (max-width: 1199px) {
  .mystudent-detail__info .detail-info__text {
    padding: 32px;
  }
  .mystudent-detail__info .detail-info__text--box {
    gap: 16px;
  }
  .mystudent-detail__info .detail-info__text p {
    width: 100%;
  }
  .mystudent-detail__info .detail-info__text p:nth-child(2n) span {
    width: 113px;
  }
}

/* 250312 수업설계 고도화 */
.make--box-items .makeclass-type {
  display: flex;
  align-items: center;
  gap: 10px;
}
.make--box-items .makeclass-type .title {
  color: #341761;
  font-size: 18px;
  font-weight: 700;
}
.make--box-items .makeclass-title {
  padding: 16px 24px;
  display: flex;
  align-items: center;
  gap: 20px;
  border-bottom: 1px solid #f0f0f0;
}
.make--box-items .makeclass-btn {
  padding: 20px 24px 24px;
}
.make--box-items .makeclass-btn .toggle-tab {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}
.make--box-items .makeclass-btn .toggle-tab .tab--button {
  border-radius: 12px;
  border: 1px solid #d9d9d9;
  background: #fff;
  min-width: auto;
  font-size: 14px;
  font-weight: 700;
  margin-top: 0;
  height: 68px;
  display: flex;
  gap: 6px;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}
.make--box-items .makeclass-wrap .toggle-tab .tab--button.dim {
  opacity: 0.3;
  pointer-events: none;
}
.make--box-items .makeclass-wrap .toggle-tab .tab--button.active {
  border-radius: 12px;
  border: 2px solid #7e44fb;
  background: #f7f4ff;
}
.make--box-items .makeclass-wrap .tab--contents {
  border-top: 1px solid #f0f0f0;
  padding-top: 20px;
}
.make--box-items .makeclass-wrap .tab--contents .box--edit-group {
  margin-top: 0;
}
.make--box-items .makeclass-wrap .tab--contents .box--edit-title {
  margin: 0;
  min-height: 28px;
}
.make--box-items .makeclass-wrap .tab--contents .box--edit-title .button-icon {
  width: 28px;
  height: 28px;
}
.make--box-items .makeclass-btn .tab--contents .is--add_wrap,
.make--box-items .makeclass-btn .tab--contents .is--list {
  margin-top: 16px;
}
.make--box-items .makeclass-btn .recommend--title {
  font-size: 16px;
  margin-top: 12px;
  color: #494949;
}
.make--box-items .box-items--box .makeclass-list {
  margin-top: 16px;
  padding: 0;
}
.make--box-items .makeclass-list__sort {
  padding: 24px;
  min-height: 234px;
  display: grid;
  /* 250324 수정 */
  grid-template-columns: 20px 1fr;
  gap: 8px;
}
.make--box-items .makeclass-wrap .empty-box {
  min-height: 186px;
  color: #494949;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 26px;
  text-align: center;
}
.make--box-items .makeclass-list__sort .makeclass-list__num,
.make--box-items .makeclass-list__sort .makeclass-list__name {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.make--box-items .makeclass-list__sort .makeclass-list__num li,
.make--box-items .makeclass-list__sort .makeclass-list__name li {
  height: 52px;
  display: flex;
  align-items: center;
}
.make--box-items .makeclass-list__sort .makeclass-list__num li {
  font-weight: 800;
  color: #b3b3b3;
}
.make--box-items .makeclass-list__sort .makeclass-list__name li {
  justify-content: space-between;
  padding: 12px 10px;
  border-radius: 12px;
  border: 1px solid #d9d9d9;
  background: #fff;
  max-width: 672px;
  cursor: default;
  user-select: none;
}
.make--box-items .makeclass-list__sort .makeclass-list__name li .label {
  display: flex;
  align-items: center;
  width: calc(100% - 38px);
}
.make--box-items
  .makeclass-list__sort
  .makeclass-list__name
  .sortable-fallback {
  border: 1px solid #9869fc;
  opacity: 1 !important;
}
.make--box-items
  .makeclass-list__sort
  .makeclass-list__name
  .sortable-chosen.sortable-ghost {
  opacity: 0;
}
.make--box-items
  .makeclass-list__sort
  .makeclass-list__name
  .sortable-chosen
  .ico-drag-gray {
  opacity: 0.7;
}
.make--box-items
  .makeclass-list__sort
  .makeclass-list__name
  li
  .text-ellipsis::before {
  display: inline-block;
  content: "";
  width: 1px;
  height: 16px;
  background: #d9d9d9;
  margin: 0 10px;
  vertical-align: middle;
}
.layer-check__plan .box--edit-items.is__box {
  padding: 20px;
}
.layer-check__plan .box--edit-items.is__box dl > dt {
  padding: 0 0 12px;
  min-height: auto;
}
/* 250313 수업 목록 고도화 */
.today-lesson.type--myclass .today-lesson--data {
  border-radius: 0;
}
.today-lesson .today-lesson--data__list.today-lesson--noti {
  height: 68px;
  padding: 20px 24px;
  display: flex;
  overflow-y: initial;
  align-items: center;
  overflow-y: hidden;
  background: #f8f8f8;
  border-radius: 0;
  border-bottom: 1px solid #d9d9d9;
}
.today-lesson .today-lesson--data__list.today-lesson--noti .data-list__title {
  font-size: 17px;
  font-weight: 700;
}
.today-lesson
  .today-lesson--data__list.today-lesson--noti
  .data-list__title
  span {
  color: #333;
}
.today-lesson
  .today-lesson--data__list.today-lesson--noti
  .today-lesson--data__btns {
  position: initial;
  flex-shrink: 0;
}
.today-lesson--data__list .data-list__box .text-ellipsis {
  color: #000;
  margin: 0 12px;
  flex-shrink: 1;
  flex-grow: 1;
}
.today-lesson
  .today-lesson--data
  .today-lesson--data__list:not(.today-lesson--noti) {
  height: calc(100% - 68px);
}
.intro-lesson .intro-lesson--title .button-main.transparent,
.index__myclass-info .myclass-info--my .button-main.transparent {
  padding: 0 8px 0 16px;
}
/* 250321 수업설계, 수업목록 고도화 */
.make--box-items
  .makeclass-list__sort
  .makeclass-list__name.in-class
  li
  .label {
  width: 100%;
}
.make--box-items
  .makeclass-list__sort
  .makeclass-list__name.in-class
  li
  .label
  .ico-drag-gray {
  background-image: url(../images/ico/ic_drag_28px_lightgray.svg);
}
.make--box-items.lesson-type
  .input-radio
  input:not([type="text"]):disabled:checked
  + .input--box::before {
  background-color: rgba(0, 0, 0, 0.2);
  border-color: transparent;
}
.make--box-items.disabled button {
  cursor: default;
}
.today-lesson--data__list .tooltip--box-wrap .tooltip--box.arrow--right {
  left: auto;
  right: -10px;
  transform: translateX(0);
}
.today-lesson--data__list
  .tooltip--box.arrow--right
  .tooltip--box-inner::before {
  margin-left: 0;
}
.today-lesson--data__list
  .tooltip--box.arrow--right
  .tooltip--box-inner::before,
.today-lesson--data__list
  .tooltip--box.arrow--right
  .tooltip--box-inner::after {
  left: auto;
  right: 16px;
}
/* 250324 수정 */
.today-lesson--data__list
  .data-list__box
  li:last-child:not(:only-child)
  .tooltip--box-wrap
  .tooltip--box.arrow--right {
  top: auto;
  bottom: calc(100% + 8px);
}
.today-lesson--data__list
  .data-list__box
  li:last-child:not(:only-child)
  .tooltip--box.arrow--right
  .tooltip--box-inner::before,
.today-lesson--data__list
  .data-list__box
  li:last-child:not(:only-child)
  .tooltip--box.arrow--right
  .tooltip--box-inner::after {
  top: auto;
  bottom: 0;
  transform: translateY(100%) rotate(0);
  margin-top: 0;
  margin-bottom: 1px;
}
/* 250325 추천 영상 disabled 추가 */
.make--box-items.lesson-data
  .box-item
  .box--edit-group
  .is--list
  .recommend--item.disabled {
  position: relative;
}
.make--box-items.lesson-data
  .box-item
  .box--edit-group
  .is--list
  .recommend--item.disabled::before,
.make--box-items.lesson-data
  .box-item
  .box--edit-group
  .is--list
  .textbook--item.disabled
  .item--top-box::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: rgba(255, 255, 255, 0.7);
  top: 0;
  left: 0;
  z-index: 35;
}
/* 250328 공지사항 팝업 공지,서비스공지 분리 */
.layer-area.layer-twin .layer-twin__container-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
  max-height: 100%;
}
.layer-twin__container--1,
.layer-twin__container--2 {
  width: 592px;
  max-width: unset;
  height: 100%;
  max-height: 100%;
}
/* 250424 학습진단(학생) 미제공 과목 */
.test-home__status-subject .box--empty {
  min-height: 410px;
}
/* 250513 온라인 학교 과목개설 */
.make--box-items.lesson-credit .dropdown--area {
  flex-shrink: 1;
  flex-grow: 1;
}
.make--box-items.lesson-credit .dropdown--area .dropdown--select {
  padding-left: 24px;
}
.make--box-items.lesson-credit
  .box-items--box
  .box-item.item-devide.devide--text {
  padding: 0;
}
.make--box.type--make .make--box-items.lesson-person .box-items--box {
  column-gap: 12px !important; /* 250605 수정 */
  align-items: center;
}
.make--box-items.lesson-approve-yn .input-checked-group {
  gap: 12px;
}
.type--make
  .make--box-items.lesson-approve-yn
  .box-items--box
  .box-item.input-radio {
  min-width: 168px;
}
.type--make
  .make--box-items.lesson-approve-yn
  .box-items--box
  .box-item.input-radio:last-child {
  flex: 1;
}
.type--make
  .make--box-items.lesson-approve-yn
  .box-items--box
  .box-item.input-radio
  .input--box {
  padding-right: 24px;
  gap: 4px;
}
.make--box-items.lesson-approve-yn
  .input-radio
  input:not([type="text"]):checked
  + .input--box::after {
  right: 30px !important;
}
.make--box-items.lesson-pw
  .box-items--box
  .password_box
  .input-box:not(.no-input) {
  padding-right: 52px;
}
.make--box-items.lesson-pw .password_box i {
  top: 22px;
  right: 24px;
}
.make--box-items.lesson-subject-info {
  margin-top: 36px;
  padding-left: 104px;
}
/* 250515 학부모 승인 */
.layer-parental-approval .layer__contents {
  padding: 48px 90px 0 90px;
}
.layer-parental-approval .table--info table tbody tr td {
  padding: 23px 30px;
}
.layer-parental-approval .table--info table tbody tr:first-child td:last-child {
  border-radius: 0 10px 0 0;
}
.bullet-violet {
  color: #7e44fb;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;
  padding-left: 16px;
  position: relative;
}
.bullet-violet::before {
  content: "※";
  position: absolute;
  left: 0;
}
/* 저작자 표시 추가 */
.layer-contents__notify
  .box--edit-items
  .input-radio
  + .input-radio:not(.width-full) {
  margin-left: 0;
}
/* 250616 그리드 넓이 수정 */
.layer-contents__notify .box--edit-items .input-radio-group {
  grid-template-columns: 142px 213px auto;
  gap: 16px 32px;
}
.layer-view__textbook .textbook-preview__info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.layer-view__textbook .textbook-preview__info__item {
  display: flex;
  gap: 12px;
}
.layer-view__textbook .textbook-preview__info__item > strong {
  width: 100px;
  display: inline-block;
  min-height: 30px;
  padding: 6px 0;
  font-weight: 700;
}
.layer-view__textbook .textbook-preview__info__item > span {
  min-height: 30px;
  padding: 6px 0;
}
.layer-view__textbook .textbook-preview__info .textbook-preview__files {
  justify-content: flex-start;
}
.layer-view__textbook
  .textbook-preview__info
  .textbook-preview__files
  .file-item {
  background-color: #f8f8f8;
  padding: 10px 12px;
  border-radius: 8px;
  margin-bottom: 0;
  max-width: 878px;
}
.layer-view__textbook
  .textbook-preview__info
  .textbook-preview__files
  .file-item:hover {
  background-color: #f0f0f0;
}
.layer-view__textbook .table--setting .button-notify {
  height: 40px;
  padding-right: 16px;
  gap: 8px;
}

/* 250523 추가 */
.classes--filter.new {
  display: flex;
  align-items: center;
  gap: 40px;
  margin-top: 12px; /* 250625 수정 */
  padding: 14px 20px;
  background-color: #f8f8f8;
  border-radius: 8px;
}
.classes--filter.new .classes-filter__button-box {
  display: flex;
  align-items: center;
}
.classes--filter.new .classes-filter__button-box dd {
  margin-left: 12px;
}
.classes--filter.new .classes-filter__button-box dd + dd {
  margin-left: 8px;
}
.classes--filter.new .classes-filter__button-box .button-tag.active {
  color: #7e44fb;
  border-color: #7e44fb;
  background: rgba(126, 68, 251, 0.1);
  font-weight: 700;
}

.recommend--item.is--myclass.new:not(.is--contents)[tabindex="0"]:hover
  .recommend--thum::after,
.recommend--item.is--myclass.new:not(.is--contents)[tabindex="0"]:focus
  .recommend--thum::after {
  position: absolute;
  top: -1px;
  right: -1px;
  left: -1px;
  bottom: 0;
  border: 2px solid #7e44fb;
  border-bottom: 0;
  border-radius: 16px 16px 0 0;
  z-index: 10;
  content: "";
}
/* 250701 수정 */
.recommend--item.is--myclass.new .recommend--textbox {
  display: flex;
  flex-direction: column;
  row-gap: 4px;
  padding-left: 8px;
  width: 100%;
  margin-top: 10px;
  height: auto;
}
.recommend--item.is--myclass.new
  .recommend--textbox
  span.recommend--title__subject {
  font-size: 14px;
  color: #7779fa;
  font-weight: 700;
  min-height: 0;
}
.recommend--item.is--myclass.new .recommend--textbox span {
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  width: 100%;
  max-height: 48px;
  color: #000000;
  font-size: 18px;
  line-height: 24px;
  font-weight: 700;
  word-wrap: break-word;
  word-break: keep-all;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  min-height: 48px;
}
.recommend--item.is--myclass.new .recommend--info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-left: 8px;
  position: relative;
}
.recommend--item.is--myclass.new .recommend--info span {
  font-size: 14px;
  margin-top: 10px;
}
.recommend--item.is--myclass.new .recommend--info span.grade {
  display: inline-block;
  width: 100%;
  color: #333;
  margin-top: 0px;
}
.recommend--item.is--myclass.new .recommend--info span.name {
  display: inline-block;
  width: 100%;
  max-width: 100%;
}

.recommend--item.is--myclass.new .recommend--info span.date {
  color: #999;
  opacity: 1;
}
.recommend--item.is--myclass.new .recommend--info span.join {
  position: absolute;
  bottom: 0;
  right: 0;
  font-weight: 800;
  background: none;
}
@media (max-width: 1199px) and (min-width: 110px) {
  .recommend--item.is--myclass.new .recommend--info span.date,
  .recommend--item.is--myclass.new .recommend--info span.join  {
    font-size: 12px;
  }
}
.recommend--item.is--myclass.new .recommend--info .online {
  display: flex;
  gap: 8px;
  margin-top: 10px;
  width: 100%;
}
.recommend--item.is--myclass.new .recommend--info .online:first-of-type {
  margin-top: 0px;
}
.recommend--item.is--myclass.new .recommend--info .online .grade {
  width: auto;
}
.recommend--item.is--myclass.new .recommend--info .online .name {
  position: relative;
  max-width: 100%;
  margin-top: 0px;
  width: auto;
}
/* // 250701 수정 */

.recommend--item.is--myclass.new .recommend--info .online .name:last-of-type {
  padding-left: 8px;
}
.recommend--item.is--myclass.new
  .recommend--info
  .online
  .name:last-of-type::before {
  content: "";
  width: 1px;
  height: 12px;
  background-color: #d9d9d9;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}

/* 과목정보 */
.tab--contents.subject-info {
  padding: 40px;
}
.tab--contents .subject-info__box {
  display: flex;
  flex-direction: column;
}
.tab--contents .subject-info__box .subject-title {
  color: #341761;
  font-size: 20px;
  font-weight: 700;
}
.tab--contents .subject-info__box .subject-title::before {
  content: "";
  display: inline-block;
  width: 2px;
  height: 16px;
  /* margin-top: 3.5px; */ /* 250609 삭제*/
  vertical-align: middle; /* 250609 추가 */
  margin-right: 12px;
  background-color: #341761;
}
.tab--contents .subject-info__box .subject-text {
  display: block;
  width: 100%;
  padding-top: 16px;
  margin-top: 16px;
  border-top: 1px solid #d9d9d9;
  font-size: 18px;
  line-height: 160%;
  color: #494949;
}
.tab--contents .subject-info__box .subject__empty {
  display: block;
  width: 100%;
  padding-top: 16px;
  margin-top: 16px;
  border-top: 1px solid #d9d9d9;
  font-size: 18px;
  line-height: 160%;
  color: #999;
}
.subject-banner {
  padding: 12px 16px;
  border-radius: 12px;
  margin-bottom: 24px;
}
.subject-banner .subject-banner__text {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  line-height: 22px;
}
.subject-banner.success {
  background-color: #e6f6ea;
  color: #189e66;
}
.subject-banner.error {
  background-color: #fff3f3;
  color: #ff3a3a;
}
.class-related--box .tab-studentmanage .studentmanage-category.online {
  padding: 24px 0;
}
.table_btnbox {
  display: flex;
  justify-content: center;
  gap: 8px;
}
@media (max-width: 1199px) {
  .table_btnbox {
    gap: 4px;
  }
}

/* 비밀번호 입력 팝업 */
.layer-online__password .layer__container {
  width: 540px;
}
.layer-online__password .layer__contents {
  padding: 40px 32px 0;
}
.layer-online__password .layer__container .page__button {
  padding: 0 32px 40px;
  margin-top: 34px;
}
.layer-online__password .layer__container .page__button button {
  width: 100%;
}
.layer-online__password .layer__container .input-box--text {
  padding: 16px 50px 16px 24px;
  height: 60px;
  font-size: 16px;
}
.layer-online__password .password_box i {
  right: 24px;
  top: 20px;
}
.layer-online__password .password_box + .input-box--required.is--error {
  font-size: 14px;
  margin-top: 12px;
}

/* 250526 추가 */
.myclass__classes .tab--contents.classes__onlined {
  padding-top: 0;
}
/* 250529 */
.workbook--detail .workbook-detail--info .contents-info__sub > p .ellipsis {
  max-width: 88px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 250530 myclass 나의교실 */
.myclass_student
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box.subject-tooltip--box {
  width: 180px;
}
.myclass_student
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box.subject-tooltip--box
  .tooltip--box-text {
  padding: 11px 16px;
}
.myclass_student
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box.subject-tooltip--box
  .bullet-dot {
}
.myclass_student
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box.subject-tooltip--box
  .bullet-dot
  li {
  color: #808080;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
  padding-left: 12px;
  position: relative;
  text-align: left;
}
.myclass_student
  .mystudent--list
  .table--list
  tbody
  td
  .tooltip--box.subject-tooltip--box
  .bullet-dot
  li::before {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #808080;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.myclass__index
  .index__mylesson-info
  .mylesson-info--box
  .info-box__detail
  .info-swiper--item
  .box-detail__left
  .tag_violet {
  color: #7779fa;
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  margin-bottom: 4px;
}
.mystudent-detail .mystudent-detail__completion .table--list thead th {
  padding-left: 12px;
  padding-right: 12px;
}
.mystudent-detail
  .mystudent-detail__completion
  .table--list
  thead
  th:first-child {
  padding-left: 26px;
}
.mystudent-detail
  .mystudent-detail__completion
  .table--list
  thead
  th:last-child {
  padding-right: 26px;
}
.mystudent-detail .mystudent-detail__completion .table--list tbody td {
  padding: 0 12px;
}
.mystudent-detail
  .mystudent-detail__completion
  .table--list
  tbody
  td:first-child {
  padding-left: 26px;
}
.mystudent-detail
  .mystudent-detail__completion
  .table--list
  tbody
  td:last-child {
  padding-right: 26px;
}
.myclass_state .mystudent-detail__completion .table--list table thead th {
  padding-left: 12px;
  padding-right: 12px;
}
.myclass_state .mystudent-detail__completion .table--list table tbody td {
  padding: 0 12px;
  line-height: 1.6;
}
/* 250602 수업설계안 가져오기 팝업 수정 */
.recommend--item.class_plan .plan_tag {
  background: #edc56a;
  color: #684c15;
  border-radius: 4px;
  padding: 4px;
  font-size: 13px;
  font-weight: 800;
  display: inline-block;
  margin-bottom: 6px;
}
.recommend--item.class_plan .tooltip--box-wrap .tooltip--box-text {
  white-space: initial;
}
.layer-search__plan .contents_wrap .recommend--item {
  z-index: unset;
}

/* 250613 콘텐츠 신고 */
.contents_wrap .recommend--item.declare .recommend--thum .declare_text {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-align: center;
  line-height: 22px;
  background: rgba(0, 0, 0, 0.4);
  border-radius: 16px;
  backdrop-filter: blur(2.5px);
  z-index: 20;
}
.list--video .recommend--item.declare .recommend--thum .declare_text {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-align: center;
  font-size: 14px;
  background: rgba(0, 0, 0, 0.4);
  border-radius: 8px;
  backdrop-filter: blur(5px);
  z-index: 20;
}

/* 250618 팝업 과목 타입 태그 추가 */
.box--edit-items .tag_type {
  margin-right: 6px;
  color: #7779fa;
  font-size: 16px;
  font-weight: 700;
}
.box--edit-items .input-box--text .tag_type {
  margin-left: 0;
  margin-right: 3px;
  font-size: 14px;
}
.layer-option__distribute .button-tag {
  padding: 5px 7px;
}
.layer-option__distribute .dropdown--item:not(label) {
  font-size: 16px;
}
.layer-option__distribute .dropdown--item:disabled {
  opacity: 0.3;
}

/* 250620 마이페이지 할 일/알림 수정 */
.mypage--area.is--task .text_tag::after {
  height: 18px;
  background-color: #d9d9d9;
}
.mypage--area.is--task .mypage-alram {
  padding-left: 16px;
}
.mypage--area.is--task .mypage-alram--center {
  padding-left: 0;
  gap: 20px;
}
.mypage--area.is--task .mypage-alram--tagbox {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  width: 92px;
}
.mypage--area.is--task .mypage-alram--center .state-box {
  position: initial;
  font-size: 14px;
  padding: 6px 12px;
  border-radius: 19px;
}
.mypage--area.is--notice .text_tag {
  margin-right: 8px;
}
.mypage--area.is--notice .text_tag::after {
  display: none;
}

/* 이벤트 페이지 추가 */
.vote-event {
  background: #7174f0 url("../images/img/event-page/vote-event_bg.jpg")
    no-repeat center; /* 250626 수정 */
  background-size: cover;
}
.vote-event .content-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 92px;
  margin: 180px auto 0;
  width: 800px;
}
.vote-event .title {
  width: 850px;
}
.vote-event .vote {
  position: relative;
}
.vote-event .vote .cont {
  position: absolute;
  top: 148px;
  padding: 0 50px;
}
.vote-event .vote-options {
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
  margin-bottom: 70px;
  font-size: 26px;
  font-weight: 800;
  color: #3a3a3a;
}
.vote-event .vote input {
  display: none;
}
.vote-event .vote-option {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding: 20px 30px;
  width: calc(50% - 12.5px);
  height: 120px;
  border: 3px solid #fff;
  border-radius: 20px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
}
.vote-event .vote-option .num {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 14px;
  padding-top: 4px;
  width: 45px;
  height: 45px;
  border-radius: 30px;
  color: #fff;
  background: #6783ea;
}
.vote-event .vote-option .text {
  width: 100%;
}
.vote-event .vote-option::after {
  flex-shrink: 0;
  content: "";
  width: 80px;
  height: 80px;
  background: url("../images/img/event-page/vote-icon1.png") no-repeat center;
  background-size: contain;
}
.vote-event .vote-option.opt2::after {
  background-image: url("../images/img/event-page/vote-icon2.png");
}
.vote-event .vote-option.opt3::after {
  background-image: url("../images/img/event-page/vote-icon3.png");
}
.vote-event .vote-option.opt4::after {
  background-image: url("../images/img/event-page/vote-icon4.png");
}
.vote-event .vote-option:hover,
.vote-option.checked {
  border-radius: 20px;
  background: linear-gradient(180deg, #2c9ff9 0%, #6783ea 100%);
}
.vote-event .vote-option:hover .num,
.vote-option.checked .num {
  color: #6783ea;
  background-color: #fff;
}
.vote-event .vote-option:hover .text,
.vote-option.checked .text {
  /* 250626 추가 */
  color: #fff;
}
.vote-event .vote p {
  margin-bottom: 16px;
  color: #fff;
  text-align: center;
  font-size: 22px;
  font-weight: 700;
  line-height: 160%;
}
.vote-event .vote-btn {
  padding: 20px 30px;
  width: 100%;
  text-align: center;
  color: #fff;
  font-size: 40px;
  font-weight: 800;
  border-radius: 20px;
  border: 3px solid #6783ea;
  background: linear-gradient(91deg, #32f1d6 0%, #6681e9 99.84%);
  transition: background-color 0.3s ease, transform 0.1s ease;
}
.vote-event .vote-btn:hover,
.vote-event .vote-btn:active {
  background: #fff;
  color: #5273ed;
  transform: scale(0.98);
}
.vote-event .noti {
  color: #fff;
  background: rgb(0 0 0 / 0.15);
}
.vote-event .noti .noti-box {
  margin: 0 auto;
  padding: 63px 16px;
  width: 800px;
}
.vote-event .noti .title {
  margin-bottom: 19px;
  width: 223px;
}
.vote-event .noti .cont li {
  margin-bottom: 6px;
}

/* 이벤트 팝업 */
.layer-event-agree .layer__container {
  width: 481px;
  min-width: 481px;
}
.event-agree-input {
  display: flex;
  justify-content: space-between;
  margin-top: 40px; /* 250626 수정 */
  width: 100%;
  font-size: 16px !important;
}
.event-agree-input a {
  color: #999;
  text-decoration: underline;
}
.layer-event-agree-detail .layer__container {
  width: 558px;
  min-width: 558px;
}
.layer-event-agree-detail .layer__contents {
  padding: 24px;
}
.layer-event-agree-detail .text {
  margin-bottom: 27px;
  line-height: 28px;
  font-weight: 700;
}
.layer-event-agree-detail table {
  margin: 20px 0 24px;
  border: 1px solid #ececec;
}
.layer-event-agree-detail table th {
  padding: 8px 16px;
  text-align: left;
  font-weight: 700;
  line-height: 28px;
  background: #f8f8f8;
  border-bottom: 1px solid #ececec;
}
.layer-event-agree-detail table td {
  padding: 4px 16px;
  line-height: 28px;
}

/* 250625 */
.layer-area.teacher_subject .layer__container {
  width: 920px;
}

/* 250707 수강 희망 시간 선택 팝업 */
.layer-online__time-select .layer__container {
  width: 540px;
  overflow: visible;
}
.layer-online__time-select .layer__contents {
  padding: 40px 32px 0;
}
.layer-online__time-select .layer__container .page__button {
  padding: 60px 32px 40px;
  gap: 12px; /* 250708 수정 */
}
.layer-online__time-select .layer__container .page__button button {
  /* 250708 추가 */
  width: 100%;
}
.layer-online__time-select .select-box {
  margin-top: 32px;
}
.layer-online__time-select .select-box .title {
  margin-bottom: 14px;
  font-weight: 700;
}
.layer-online__time-select .select-item__list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.layer-online__time-select .select-item__list li {
  min-width: 80px;
}
.layer-online__time-select .select-item__list input {
  display: none;
}
.layer-online__time-select .select-item__list .button-tag {
  padding: 7px 10px;
  width: 100%;
  font-size: 16px;
  cursor: pointer;
}
/* 250708 선택자 수정 */
.layer-online__time-select .select-item__list input:checked + .button-tag {
  background-color: rgba(126, 68, 251, 0.1);
  border: 1px solid #7e44fb;
  color: #7e44fb;
  font-weight: 700;
}

.layer-online__time-select .select-item__list .button-tag.violet-light {
  padding: 7px 7px 7px 12px;
}
.layer-online__time-select .desc {
  position: absolute;
  bottom: -46px;
  width: 100%;
  text-align: center;
  font-size: 20px;
  font-weight: 800;
  color: #fff;
}

/* 250722 온라인 학교 문구 배치 추가 */
.online-info-box {
  margin-top: 32px;
  text-align: center;
}
.online-info {
  padding: 0 2px;
  font-size: 14px;
  color: #ff3a3a;
}
.teacher-makelessons__infos .online-info {
  margin-top: 4px;
  line-height: 32px;
  font-size: 16px;
}
.make--box-items.lesson-basic.option .is--option {
  position: relative;
}
.make--box-items.lesson-basic.option .is--option .online-info {
  position: absolute;
  left: 0;
  bottom: -36px;
  width: 102%;
  font-size: 15px;
}
.myclass__classes .classes--wrapper {
  padding-top: 34px;
}
.myclass__classes .classes--wrapper .box--search {
  padding-top: 0;
}
.classes--wrapper .online-info {
  display: none;
  padding: 0 30px 16px;
  text-align: right;
}
.classes--wrapper .online-info.show {
  display: block;
}

/* 250804 종합리포트 공유하기 팝업 */
.layer-report-share .layer__container {
  width: 848px;
  min-width: 848px;
}
.layer-report-share .layer__contents {
  padding: 0;
}
.layer-report-share .box--edit {
  padding: 24px 34px 0;
}
.layer-report-share .box--edit-items {
  padding: 24px;
}
.layer-report-share .label--block .list__thead {
  height: 46px;
  padding-right: 32px;
}
.layer-report-share .label--block .list__tbody {
  height: 342px;
  padding: 0 16px;
}
.layer-report-share .label--block .input--text {
  text-align: center;
}
.layer-report-share .label--block .input--text span {
  color: #999;
}
.layer-report-share .label--block .list__tbody .no-parents {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.layer-report-share .info {
  margin-top: 20px;
  color: #808080;
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
}

@media (max-width: 1199px) {
  /* 250723 나의 수업 classes--filter 크기 조정 */
  .classes--filter.new {
    gap: 14px;
  }
  .classes--filter.new .classes-filter__button-box dt {
    font-size: 14px;
  }
  .classes--filter.new .classes-filter__button-box dd {
    margin-left: 6px;
  }
  .classes--filter.new .classes-filter__button-box dd + dd {
    margin-left: 4px;
  }
  .button-tag {
    font-size: 13px;
  }

  /* 250728 태블릿 대응 - 나의 교실: 우리반 학생 테이블 */
  .mystudent--contents .table--setting .setting__left {
    flex-wrap: wrap;
  }
  .mystudent--contents .table--setting .setting__left .input-check {
    margin-right: 12px;
    margin-left: 0 !important;
  }

  /* 250728 태블릿 대응 - 학생 상세 테이블 */
  .mystudent-detail .mystudent-detail__completion .table--list table {
    min-width: 1100px;
  }

  /* 250729 태블릿 대응 - 과목 개설 */
  .make--box-items.lesson-basic.info .box-items--box .dropdown--select, 
  .make--box-items.lesson-basic.info .box-items--box .dropdown--item {
    font-size: 16px;
  }
}