@charset "UTF-8";
.mobile_size_side_list{
  display: none;
}

body {
  overflow: hidden;
}
.preview-noti {
  height: 40px;
  width: 100%;
  background-color: #5e5e5e;
  font-size: 20px;
  text-align: center;
  padding-top: 5px;
  color: #fff;
  position: fixed;
  top: 0;
  z-index: 1001;
}
.viewer_wrap {
  height: 100vh;
  overflow-y: auto;
}

.viewer_wrap::-webkit-scrollbar,
.sidebar::-webkit-scrollbar{
  width: 8px;
  height: 8px;
  background: #ffffff;
}
.viewer_wrap::-webkit-scrollbar-thumb,
.sidebar::-webkit-scrollbar-thumb{
  border-radius: 3.5px;
  background-color: #ced4da;
}
.viewer_wrap::-webkit-scrollbar-thumb:hover,
.sidebar::-webkit-scrollbar-thumb:hover{
  background-color: #adb5bd;
}
.viewer_wrap::-webkit-scrollbar-track,
.sidebar::-webkit-scrollbar-track{
  background: #ffffff;
}

.bg-gray {
  background-color: #e0e0e0;
}
.bg-yellow {
  background-color: #F5C453;
}
.bg-red {
  background-color: #F76661;
}
.bg-green {
  background-color: #8DC669;
}
.bg-blue {
  background-color: #4D75C3;
}
.fill-yellow {
  fill: #f5b600;
}
.fill-red {
  fill: #fd3c35;
}
.fill-green {
  fill: #38a951;
}
.fill-blue {
  fill: #0c87d8;
}

#scrollTop {
  z-index: 20;
  position: absolute;
  right: 20px;
  bottom: 22px;
  background-color: transparent;
  border: 0;
}

.viewer_header {
  z-index: 10;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  padding: 30px 20px 31px;
  background-color: #fff;
  border-bottom: solid 1px #e8e8e8;
}
.viewer_header .inner {
  position: relative;
  max-width: 1432px;
  margin: 0 auto;
}
.viewer_header .btn_back {
  position: absolute;
  top: 5px;
  left: 8.1006%;
}
.viewer_header .title_area {
  text-align: center;
}
.viewer_header .title_area .title {
  font-size: 28px;
  font-weight: bold;
  line-height: 1.43;
  color: #111;
}
.viewer_header .title_area .sub_title {
  margin-top: 4px;
  font-size: 18px;
  color: #888;
  cursor:pointer;
}
.viewer_header .title_area .sub_title:after {
  content: "";
  display: inline-block;
  width: 26px;
  height: 26px;
  margin-left: 10px;
  border: solid 1px #e0e0e0;
  border-radius: 100%;
  background: url("../images/ico_arrow_down_sm.svg") no-repeat 0 0;
  background-size: cover;
  transform: rotate(180deg);
  vertical-align: text-bottom;
}
.viewer_header .utils {
  display: flex;
  position: absolute;
  top: 5px;
  right: 0;
}
.viewer_header .utils .btn {
  margin-left: 20px;
  background-color: transparent;
  border: 0;
  line-height: 1;
}
.pdf_view{
  margin: 0 auto;
}
.viewer_wrap {
  min-height: 100vh;
  padding: 125px 20px 100px;
  background-color: #fff;
  font-size: 12pt;
  line-height:1.8;
}
.viewer_wrap.full {
  padding-top: 30px;
  padding-bottom: 17px;
}

.touch-none {
  background-color: #f0f0f0;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.modal-bg{
  position: fixed;
  z-index: 999;
  opacity: 0.5;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: none;
}
.modal-bg.open {
  display: block;
  background-color: unset;
}
/* 강의 플레이어 버튼 */
.viewer_wrap .vod-player-control-wrap {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 8px;
}
.viewer_wrap .vod-player-control-wrap .btn_control_group {
  display: flex;
  flex-direction: row;
  justify-content: left;
  gap: 8px;
}
.viewer_wrap .vod-player-control-wrap .btn-player {
  border: 1px solid #E0E0E0;
  border-radius: 6px;
  background-color: #fff;
  color: #999999;
  line-height: 34px;
  font-size: 12px;
  font-weight: 400;
  padding: 0 6px;
}
.viewer_wrap .vod-player-control-wrap .btn-player.before {
  padding: 0 15px 0 5px;
}
.viewer_wrap .vod-player-control-wrap .btn-player.before:before {
  content:"";
  display:inline-block;
  width: 18px;
  height: 18px;
  background-position-y: 5px;
}
.viewer_wrap .vod-player-control-wrap .left_double_arrow:before {
  background:  url("../images/ico_arrow_double_black.svg") no-repeat center / cover;
}
.viewer_wrap .vod-player-control-wrap .left_single_arrow:before {
  background:  url("../images/ico_arrow_single_black.svg") no-repeat center / cover;
}
.viewer_wrap .vod-player-control-wrap .btn-player.after {
  padding: 0 5px 0 15px;
}
.viewer_wrap .vod-player-control-wrap .btn-player.after:after {
  content:"";
  display:inline-block;
  width: 18px;
  height: 18px;
  background-position-y: -5px;
}
.viewer_wrap .vod-player-control-wrap .right_double_arrow:after {
  background:  url("../images/ico_arrow_double_black.svg") no-repeat center / cover;
  transform: rotate(180deg);
}
.viewer_wrap .vod-player-control-wrap .right_single_arrow:after {
  background:  url("../images/ico_arrow_single_black.svg") no-repeat center / cover;
  transform: rotate(180deg);
}
.viewer_wrap .vod-player-control-wrap .dropdown > .btn_player_speed {
  font-size: 12px;
  line-height: 34px;
  background-color: #376DD5;
  border: 0;
  border-radius: 6px;
  color: #fff;
}
.viewer_wrap .vod-player-control-wrap .dropdown > .btn_player_speed:after {
  background:  url("../images/ico_arrow_down_white.svg") no-repeat center / cover;
  background-position-y: 5px;
}
.viewer_wrap .vod-player-control-wrap .dropdown.open > .btn_player_speed:after {
  transform: rotate(180deg);
  background-position-y: -5px;
}

.viewer_wrap .vod-player-control-wrap .dropdown .dropdown-menu {
  margin-top: 10px;
  padding: 12px 0;
}
.viewer_wrap .vod-player-control-wrap .dropdown .dropdown-menu li a {
  padding: 9px 16px 10px;
  font-size: 14px;
  line-height: 16px;
}
.viewer_wrap .vod-player-control-wrap .dropdown .dropdown-menu li.active a {
  font-weight: bold;
}
.viewer_wrap .editor_content {
  position: relative;
  /*margin: 0 auto;*/
  margin-top: 20px;
}
.viewer_wrap .editor_content:focus {
  outline: none;
}
.viewer_wrap .editor_content .txt_memo {
  color: #fff;
}
.viewer_wrap .editor_content .txt_memo .ico {
  position: absolute;
  right: 100%;
}

.viewer_wrap .card {
  position : relative;
  display : flex;
  -webkit-box-orient : vertical;
  -webkit-box-direction : normal;
  flex-direction : column;
  min-width : 0;
  word-wrap : break-word;
  border-radius : 0.25rem;
}

#summary-viewer{
  max-width:100%;
}
#summary-viewer,
#summary-viewer * {
  font-family: Arial;
  word-break: break-word;
  vertical-align: unset;
  box-sizing: border-box;
}
#summary-viewer * {
  margin: 0 auto;
}
#summary-viewer .embed-container, #summary-viewer .embed-container * {
  margin: 0;
}
/* 16:9 비율인 경우 56.25%, 4:3 비율인 경우 75%로 설정 */
#summary-viewer .embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
}
#summary-viewer .embed-container.embed-option-4-3 {
  padding-bottom: 75%;
}
#summary-viewer .embed-container embed, #summary-viewer .embed-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
#summary-viewer a{
  color: #007bff;
}
#summary-viewer a:hover{
  color: #0056b3;
}
#summary-viewer a::after {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f0c1";
  margin-left: 2px;
  font-size:85%;
}
#summary-viewer a.after_none::after {
  content: "";
  margin-left:0;
}

#summary-viewer a[href^='#']::after {
  display: none;
}

#summary-viewer a > img{
  vertical-align: middle;
  border-style: none;
}

#summary-viewer img{
  vertical-align: middle;
  max-width : 100%;
}

#summary-viewer h1, #summary-viewer h2, #summary-viewer h3, #summary-viewer h4, #summary-viewer h5, #summary-viewer h6 {
  font-weight:bold;
  line-height: 1.2;
  margin-top: 0;
  margin-bottom: 0.5rem;
}
#summary-viewer h1{ font-size: 2.5rem; }
#summary-viewer h2{ font-size: 2rem; }
#summary-viewer h3{ font-size: 1.75rem; }
#summary-viewer h4{ font-size: 1.5rem; }
#summary-viewer h5{ font-size: 1.25rem; }
#summary-viewer h6{ font-size: 1rem; }
#summary-viewer b, #summary-viewer strong{ font-weight: bolder; }

#summary-viewer table td{ vertical-align: middle; }

#summary-viewer ul{
  display: block;
  list-style: disc;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 40px;
  margin-top: 0px;
  margin-bottom: 1rem;
}

#summary-viewer li {
  list-style:inherit;
}
#summary-viewer .assignment_content {
  margin-top: 50px;
  margin-bottom: 50px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
#summary-viewer .assignment_content > * {
  margin: unset !important;
}
#summary-viewer .assignment_content .btn_assignment {
  background-color: #376DD5;
  color: #fff;
  font-weight: 700;
  border: 1px solid #376DD5;
  padding: 9px 24px 12px;
  border-radius: 80px;
  font-size: 16px !important;
  line-height: 16px !important;
}
#summary-viewer .assignment_content .btn_assignment:after {
  content: "";
  display: inline-block;
  height: 24px;
  width: 24px;
  margin-left: 12px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 50%;
  vertical-align: sub;
  background-image: url("../images/ico_plus_sm_white.svg");
  background-position-y: 2px;
}
#summary-viewer .assignment_content .btn_assignment_submit {
  background-color: #1EBB54;
  color: #fff;
  font-weight: 700;
  border: 1px solid #1EBB54;
  padding: 9px 24px 12px;
  border-radius: 80px;
  font-size: 16px !important;
  line-height: 16px !important;
}
#summary-viewer .assignment_content .btn_assignment_submit:after {
  content: "";
  display: inline-block;
  height: 24px;
  width: 24px;
  margin-left: 12px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 50%;
  vertical-align: sub;
  background-image: url("../images/ico_round_check_white.svg");
  background-position-y: 2px;
}
#summary-viewer .assignment_content .btn_assignment_list {
  background-color: #fff;
  color: #909497;
  font-weight: 700;
  border: 2px solid #979595;
  padding: 12px 24px 12px;
  border-radius: 80px;
  font-size: 16px !important;
  line-height: 16px !important;
}

.txt_tooltip {
  z-index: 20;
  position: absolute;
  width: 182px;
  padding: 17px 20px;
  margin-top: -90px;
  background-color: #fff;
  border: solid 1px #f0f0f0;
  border-radius: 4px;
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}
.txt_tooltip .utils {
  display: flex;
  justify-content: space-between;
}
.txt_tooltip .utils .item {
  background-color: transparent;
  border: 0;
  color: rgb(34, 34, 34);
}
.txt_tooltip .color_palette {
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
  padding: 0 5px;
}
.txt_tooltip .color_palette .btn_color {
  position: relative;
  width: 18px;
  height: 18px;
  border: 0;
  border-radius: 50%;
  text-indent: -9999em;
}
.txt_tooltip .color_palette .btn_color.on:after {
  content: "";
  position: absolute;
  left: 1px;
  right: 1px;
  top: 1px;
  bottom: 1px;
  border: 1px solid #fff;
  border-radius: 50%;
}
.txt_tooltip.memo {
  width: 300px;
  margin-top: -219px;
}
.txt_tooltip.memo .memo_head {
  margin: 0 -20px;
  padding: 0 22px 15px;
  border-bottom: 1px solid #f0f0f0;
  text-align: right;
}
.txt_tooltip.memo .item {
  margin-left: 4px;
  width: 24px;
  background-color: transparent;
  border: 0;
}
.txt_tooltip.memo .input_txt {
  width: 100%;
  height: 117px;
  padding: 12px 0;
  border: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 2.14;
}
.txt_tooltip.memo .color_palette {
  justify-content: left;
}
.txt_tooltip.memo .color_palette .btn_color {
  margin-right: 20px;
}

.viewer_nav {
  z-index: 10;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
}
.viewer_nav .page_info {
  position: relative;
  max-width: 1264px;
  padding: 0px 0 18px;
  margin: 0 auto;
}
.viewer_nav .page_info .btn {
  width: 126px;
  background-color: transparent;
  border: 0;
}
.viewer_nav .page_info .btn_next_last img {
  display: none;
}
.viewer_nav .page_info .page_num {
  display: inline-block;
  padding: 14px 30px;
  margin: 0 16px;
  color: #555;
  background-color: #fff;
  border-radius: 6px;
  white-space: nowrap;
}
.viewer_nav .progress-wrap {
  max-width: none;
}
.viewer_nav .progress-wrap .progress {
  background-color: #fff;
  height: 12px;
}
.viewer_nav .progress-wrap .progress .progress-bar {
  background-color: #376dd5;
}

/* 사이드 메뉴 | 공통 */
.sidebar {
  z-index: 1000;
  position: fixed;
  right: -100%;
  top: 0;
  width: 90%;
  height: 100%;
  background-color: #fff;
  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.16);
  transition: right 0.45s ease-in-out;
  overflow-y: auto;
}
.sidebar.open {
  right: 0;
}
.sidebar .sidebar_title {
  padding: 28px 40px 28px;
  font-size: 18px;
  font-weight: bold;
  color: #333;
}
.sidebar .sidebar_title .btn_bookmark_single {
  width: 30px;
  height: 30px;
  background: none;
}
.sidebar .sidebar_title .btn_bookmark_single.is-active > img {
  content: url('../images/btn_bookmark_active_single.png');
}
.sidebar > .utils {
  position: absolute;
  display: flex;
  right: 42px;
  top: 28px;
}
.sidebar > .utils .btn {
  margin-left: 14px;
  background-color: transparent;
  border: 0;
  line-height: 1;
}
.sidebar .sidebar_content {
  border-top: 1px solid #e0e0e0;
  padding: 30px 40px;
}
.sidebar .sidebar_content .content_title {
  font-size: 20px;
  font-weight: bold;
  color: #333;
}

/*사이드메뉴 | 북마크(메모)*/
#memoSidebar .sidebar_content {
  border-top: 1px solid #e0e0e0;
  padding: 0;
  margin-bottom: 130px;
}
#memoSidebar .sidebar_content .content_title {
  font-size: 20px;
  font-weight: bold;
  color: #333;
  padding: 30px 40px 10px 40px;
}
.sidebar .sidebar_content .memo_sort_wrap {
  padding: 0px 40px 16px;
}
.sidebar .sidebar_content .memo_sort_wrap:after {
  content: '';
  clear: both;
  display: block;
}
.sidebar .sidebar_content ul.memo_sort li {
  list-style-type: none;
  float: left;
  margin-right: 8px;
  margin-bottom: 8px;
}
.sidebar .sidebar_content ul.memo_sort li button {
  padding : 0 12px;
  border-radius: 16px;
  border: solid 2px #e0e0e0;
  font-size: 12px;
  font-weight: bold;
  line-height: 2.5;
  color: #888;
  background: #fff;
}
.sidebar .sidebar_content ul.memo_sort li button.is-active {
  background-color: #376dd5;
  border: solid 2px;
  color: #fff;
}
/*사이드메뉴 | 북마크(메모)*/

/* 사이드 메뉴 | 강조표시 및 메모 */
.sidebar .memo_list > li {
  position: relative;
  padding: 10px 41px 10px 46px;
}
.sidebar .memo_list > li.is-active {
  background-color: #eaf0fa;
}
.sidebar .memo_list > li .title {
  color: #555;
  line-height: 1.8;
  margin-right: 97px;
}
.sidebar .memo_list > li.is-active .title {
  margin-right: 28px;
}
.sidebar .memo_list > li .content {
  margin-top: 10px;
  padding: 7px 10px;
  border-radius: 4px;
  background-color: #333;
  line-height: 1.88;
  color: #fff;
  position: relative;
}

.sidebar .memo_list > li .title .ico {
  vertical-align: top;
  position: relative;
  top: 3px;
}
.sidebar .memo_list > li .title .ico.color-blue circle {
  stroke:#376dd5;
}
.sidebar .memo_list > li .title .ico.color-orange circle {
  stroke:#FF6A00;
}
/*.sidebar .memo_list > li.color-gray > .title .ico {
  fill: #cccccc;
}*/
.sidebar .memo_list > li .content.color-gray {
  background-color: #e0e0e0;
}
.sidebar .memo_list > li .content.color-gray > .memo_date,
.sidebar .memo_list > li .content.color-gray > .memo_content
{
  color: #333;
}
.sidebar .memo_list > li .content.color-gray > .dropdown .btn_menu img {
  content: url("../images/ico_menu_vertical.svg");
}
.sidebar .memo_list > li .content.color-blue {
  background-color: #4D75C3;
}
.sidebar .memo_list > li.color-orange .title .ico {
  fill: #FF6A00;
}
.sidebar .memo_list > li.color-blue .title .ico {
  fill: #376dd5;
}
.sidebar .memo_list > li .content.color-red {
  background-color: #F76661;
}
.sidebar .memo_list > li.color-red .title .ico {
  fill: #fd3c35;
}
.sidebar .memo_list > li .content.color-yellow {
  background-color: #F5C453;
}
.sidebar .memo_list > li.color-yellow .title .ico {
  fill: #f5b600;
}
.sidebar .memo_list > li .content.color-green {
  background-color: #8DC669;
}
.sidebar .memo_list > li.color-green .title .ico {
  fill: #38a951;
}
.sidebar .memo_list > li .btn_add {
  margin-top: 10px;
  background-color: transparent;
  border: 0;
  color: #ccc;
}
.sidebar .memo_list > li .btn_add_memo {
  display: inline-block;
  height: 21px;
  border: 0;
  border-radius: 5px;
  background-color: #777;
  color: #fff;
  line-height: 1.88;
  font-size: 10px;
  padding: 0px 12px;
  margin-top: 6px;
}
.sidebar .memo_list > li.color-blue .btn_memo_add {
  background-color: #376dd5;
}
.sidebar .memo_list > li.color-red .btn_memo_add {
  background-color: #fd3c35;
}
.sidebar .memo_list > li.color-yellow .btn_memo_add {
  background-color: #f5b600;
}
.sidebar .memo_list > li.color-green .btn_memo_add {
  background-color: #38a951;
}
.sidebar .memo_list > li.color-green .btn_memo_add {
  background-color: #38a951;
}
.sidebar .memo_list > li .btn_memo_add{
  width: 49%;
  float: right;
  padding : 7px;
  margin-top : 5px;
  border: 0 none;
  border-radius: 4px;
  color: #fff;
  background-color: #376dd5;
}
.sidebar .memo_list > li .btn_memo_close{
  width: 49%;
  padding : 7px;
  margin-top : 5px;
  border: 0 none;
  border-radius: 4px;
  color: #fff;
  background-color: #777;
}
.sidebar .memo_list > li .input_content::-webkit-input-placeholder {
  color: #ccc;
}
.sidebar .memo_list > li .input_content::-moz-placeholder {
  color: #ccc;
} /* firefox 19+ */
.sidebar .memo_list > li .input_content:-moz-placeholder {
  color: #ccc;
}
.sidebar .memo_list > li .input_content:-ms-input-placeholder {
  color: #ccc;
} /* ie */
.sidebar .memo_list > li .content.input_content {
  width: 100%;
  height: 94px;
  background-color: #f0f4fc;
  border: 0;
  color: #333;
}
.sidebar .memo_list > li .content .memo_content {
  display: inline-block;
  margin-right: 20px;
}
.sidebar .memo_list > li .content .memo_date {
  font-size: 8px;
  opacity: 0.5;
  color: #fff;
  display: block;
  text-align: right;
  margin-right: 3px;
}
.sidebar .memo_list > li .memo_count_title{
  font-size: 16px;
  line-height: 1.88;
  color: #ccc;
  cursor: pointer;
}

.sidebar .memo_list > li .dropdown_memo{
  position: absolute;
  right: 40px;
  top: 15px;
}
.sidebar .memo_list > li .dropdown_memo .btn_other_bookmark {
  display: inline-block;
  width: 55px;
  height: 20px;
  padding: 3px;
  background-color: #333;
  border: 0;
  border-radius: 5px;
  color: #fff;
  font-size: 10px;
  text-align: center;
}
.sidebar .memo_list > li .dropdown_memo .btn_menu {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../images/ico_arrow_button_down_blue.svg") no-repeat;
  background-size: cover;
  border: 0;
}
.sidebar .memo_list > li .dropdown_memo .btn_menu.is-active {
  transform: rotate(180deg);
}

.sidebar .memo_list > li .dropdown {
  position: absolute;
  right: 0px;
  top: 25px;
}
.sidebar .memo_list > li .dropdown .btn_menu {
  display: inline-block;
  width: 26px;
  height: 26px;
  background-color: transparent;
  border: 0;
  padding:5px;
}
.sidebar .memo_list > li .dropdown .dropdown-menu {
  left: inherit;
  right: 22px;
  margin-top: 4px;
}
.sidebar .memo_list > li .dropdown .dropdown-menu .btn_delete {
  font-size: 12px;
  line-height: 22px;
}
.sidebar .memo_list > li .dropdown .dropdown-menu .btn_delete .ico {
  margin-right: 6px;
  position: relative;
}
.sidebar .memo_list > li .dropdown .dropdown-menu .color_palette {
  margin: 15px -20px 0;
  padding: 14px 20px 0;
  border-top: 1px solid #f0f0f0;
}

.sidebar .sidebar_footer {
  z-index: 1001;
  position: fixed;
  right: -100%;
  bottom: 0;
  width: 90%;
  transition: right 0.45s ease-in-out;
}
.sidebar .sidebar_footer.open {
  right: 0;
}
.sidebar .sidebar_footer button {
  width: 80%;
  padding: 16px 18px;
  background-color: #333;
  color: #fff;
  border: solid 1px #202631;
  border-radius: 4px;
  font-size: 16px;
  text-align: center;
  cursor:pointer;
  font-weight: bold;
}


/* 사이드메뉴 | 다른 전자책의 북마크(메모)*/
#other_memoSidebar .sidebar_content {
  border-top: 1px solid #e0e0e0;
  padding: 30px 0 0 0;
  margin-bottom: 150px;
}
#other_memoSidebar .memo_list{
  margin: 2px 18px 30px 23px;
}
#other_memoSidebar .memo_list > li {
  position: relative;
  padding :14px 17px;
  border: solid 1px #e0e0e0;
  border-radius: 5px;
  box-shadow: 1px 2px 10px 0 rgba(0, 0, 0, 0.1);
  margin-bottom: 22px;
}
#other_memoSidebar .memo_list > li .title {
  font-weight: bold;
  margin-right: 31px;
}
#other_memoSidebar .memo_list > li .dropdown_bookmarks {
  position: absolute;
  top:15px;
  right: 22px;
}
#other_memoSidebar .memo_list > li .dropdown_bookmarks .btn_menu {
  display: inline-block;
  width: 26px;
  height: 26px;
  background: url("../images/ico_arrow_button_down_gray.svg") no-repeat;
  background-size: cover;
  border: 0;
}
#other_memoSidebar .memo_list > li .dropdown_bookmarks .btn_menu.is-active {
  background: url("../images/ico_arrow_button_up_gray.svg") no-repeat;
  background-size: cover;
}

#other_memoSidebar .memo_list > li ul.bookmarks_list > li {
  position: relative;
  padding: 10px 5px;
}
#other_memoSidebar .memo_list > li ul.bookmarks_list > li .title {
  margin-right: 85px;
  font-weight: 400;
}
#other_memoSidebar .memo_list > li ul.bookmarks_list > li .title .ico {
  fill: #376dd5;
}
#other_memoSidebar .memo_list > li ul.bookmarks_list > li .dropdown_memo {
  top: 15px;
  right: 9px;
}
#other_memoSidebar .memo_list > li ul.bookmarks_list > li .dropdown_memo .btn_menu {
  width: 20px;
  height: 20px;
  background: url("../images/ico_arrow_button_down_blue.svg") no-repeat;
  background-size: cover;
}
#other_memoSidebar .memo_list > li ul.bookmarks_list > li .dropdown_memo .btn_menu.is-active {
  background: url("../images/ico_arrow_button_up_blue.svg") no-repeat;
  background-size: cover;
}
#other_memoSidebar .memo_list > li ul.bookmarks_list > li .dropdown_memo .btn_other_bookmark {
  width: 55px;
  height: 20px;
  padding: 3px;
  text-align: center;
}
#other_memoSidebar .memo_list >li ul.bookmarks_list > li .dropdown_memo .btn_other_bookmark {
  display: none;
}
#other_memoSidebar .memo_list >li.open ul.bookmarks_list > li .dropdown_memo .btn_other_bookmark {
  display: inline-block;
}

/*사이드 메뉴 | 등록된 북마크 없을때 */
.content_none {
  margin: 20px 0 auto;
  text-align: center;
}
.content_none .ico{
  display: block;
  width: 60px;
  height: 60px;
  margin: 0 auto;
  padding: 12px 0 11px;
  background-color: #f0f4fc;
  border-radius: 50%;
  font-family: Montserrat;
  font-size: 30px;
  font-weight: 700;
  color: #5991ff;
  text-align: center;
}
.content_none .title {
  margin-top: 20px;
  font-size: 14px;
  font-weight: 700;
  color: #333;
}
.content_none .desc {
  margin-top: 11px;
  font-size: 12px;
  color: #666;
}

  /* 사이드 메뉴 | 설정 */
.sidebar .viewer_setting dl {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sidebar .viewer_setting dl + dl {
  margin-top: 20px;
}
.sidebar .viewer_setting .control_box {
  display: flex;
  align-items: center;
}
.sidebar .viewer_setting .control_box .num {
  width: 40px;
  font-weight: bold;
  color: #555;
  text-align: center;
}
.sidebar .viewer_setting .control_box .btn {
  position: relative;
  width: 30px;
  height: 30px;
  background-color: #fff;
  border: solid 2px #376dd5;
  border-radius: 50%;
  text-indent: -9999em;
}
.sidebar .viewer_setting .control_box .btn:after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 10px;
  height: 2px;
  margin: -1px 0 0 -5px;
  background-color: #376dd5;
}
.sidebar .viewer_setting .control_box .btn_plus:before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 2px;
  height: 10px;
  margin: -5px 0 0 -1px;
  background-color: #376dd5;
}
.sidebar .viewer_mode {
  margin-top: 33px;
}
.sidebar .viewer_mode .title {
  margin: 0 -20px;
  padding: 18px 20px;
  background-color: #f0f0f0;
  border-radius: 6px;
  font-weight: bold;
  color: #333;
}
.sidebar .viewer_mode .radio {
  margin-top: 20px;
}
.sidebar .viewer_mode .radio label {
  padding-left: 39px;
  line-height: 29px;
}
.sidebar .viewer_mode .radio input {
  left: 0;
  width: 29px;
  height: 29px;
  margin-left: 0;
  background: url("../images/ico_radio_default.svg") no-repeat 0 0;
  border: 0;
}
.sidebar .viewer_mode .radio input:checked {
  background-image: url("../images/ico_radio_active.svg");
}

/* 사이드 메뉴 | 목차 */
.sidebar .content_list {
}
.sidebar .content_list > li + li {
  margin-top: 24px;
}
.sidebar .content_list > li .depth01 {
  display: flex;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.45;
  color: #333;
}
.sidebar .content_list > li .depth01 .num {
  flex: 0 0 44px;
  max-width: 44px;
}
.sidebar .content_list > li .depth01 .title {
}
.sidebar .content_list .depth02_wrap {
  margin-top: 19px;
}
.sidebar .content_list .depth02_wrap > li {
}
.sidebar .content_list .depth02_wrap > li + li {
  margin-top: 0;
}
.sidebar .content_list .depth02_wrap > li .depth02 {
  display: flex;
  padding: 7px 0 8px 5px;
  color: #333;
}
.sidebar .content_list .depth02_wrap > li .depth02 .num {
  flex: 0 0 30px;
  max-width: 30px;
}
.sidebar .content_list > li.is-active .depth01 {
  color: #1d4289;
}
.sidebar .content_list > li.is-active .depth02_wrap > li .depth02 {
  padding-left: 5px;
}
.sidebar .content_list .depth02_wrap > li .depth02.is-active {
  border-radius: 4px;
  background: #f0f4fc;
  color: #376dd5;
}
.sidebar .content_list .depth02_wrap > li .depth02.is-active .title {
  font-weight: bold;
}

/* 뷰어 미션게시판 */
#assignmentSidebar {
  max-width: 650px;
}
#assignmentSidebar .sidebar_content {
  min-height: 100vh;
  background-color: #f0f4fc;
  padding: 0;
}
#assignmentSidebar .sidebar_content .write_wrap {
  padding: 30px 20px;
}
#assignmentSidebar .sidebar_content .write_wrap .form-group {
  margin-bottom: 30px;
}
#assignmentSidebar .sidebar_content .write_wrap .title {
  margin-bottom: 10px;
  font-weight: 700;
}
#assignmentSidebar .sidebar_content .write_wrap .form-group input {
  width: 100%;
  height: 44px;
  border: 1px solid #c2c2c2;
  border-radius: 8px;
}
#assignmentSidebar .sidebar_content .write_wrap .btn-group .btn_save {
  width: 150px;
  border-width: 2px;
  box-shadow: 0 3px 6px 0 rgb(55 109 213 / 15%);
  background-color: #5991ff !important;
  border-color: transparent !important;
  border-radius: 4px;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 34px;
}

/* 뷰어 미션 사이드메뉴 타입 추가 */
.sidebar.assignment_type .sidebar_content {
  padding: 30px 25px;
}
.sidebar.assignment_type .sidebar_content .content_list .depth02_wrap > li {
  position: relative;
}
.sidebar.assignment_type .sidebar_content .content_list .depth02_wrap > li .depth02 {
  padding-right: 60px;
}
.sidebar.assignment_type .sidebar_content .content_list .depth02_wrap > li .depth02 .assignment {
  position: absolute;
  top: 5px;
  right: 8px;
  padding : 2px 10px 4px;
  background-color: #EBEBEB;
  color: #5E5E5E;
  font-size: 12px;
  border-radius: 12px;
  line-height: 17px;
  border: none;
}
.sidebar.assignment_type .sidebar_content .content_list .depth02_wrap > li .depth02 .assignment.on {
  background-color: #376DD5;
  color: #fff;
}
.orange_box .sidebar.assignment_type .sidebar_content .content_list .depth02_wrap > li .depth02 .assignment.on {
  background-color: #FF6A00;
  color: #fff;
}

/* 뷰어페이지 마지막 */
.viewer_wrap .review_box .box_title {
  font-weight: bold;
  color: #1d4289;
}
.viewer_wrap .review_box .box_content .desc {
  color: #333;
}
.viewer_wrap .review_box .box_content .btn_link {
  width: 100%;
  background-color: #376dd5;
  color: #fff;
}

/*강의 오렌지 색상 적용*/
.lecture-font.orange_box .viewer_nav .progress-wrap .progress .progress-bar {
  background-color: #FF6A00;
}
.lecture-font.orange_box .viewer_header .utils .utils_bookmark_div > div {
  background: url("../images/btn_bookmark_background_black.svg") no-repeat center;
}
.lecture-font.orange_box .viewer_header .utils .utils_bookmark_div > div .btn_bookmark.is-active img {
  content: url('../images/btn_bookmark_active.svg');
}
.lecture-font.orange_box .sidebar .viewer_setting .control_box .btn {
  border: solid 2px #FF6A00;
}
.lecture-font.orange_box .sidebar .viewer_setting .control_box .btn_plus:before {
  background-color: #FF6A00;
}
.lecture-font.orange_box .sidebar .viewer_setting .control_box .btn:after {
  background-color: #FF6A00;
}
.lecture-font.orange_box .sidebar .viewer_mode .radio input:checked {
  background-image: url("../images/ico_radio_active_orange.svg");
}
.lecture-font.orange_box .sidebar .content_list > li.is-active .depth01 {
  color: #FF6A00;
}
.lecture-font.orange_box .sidebar .content_list .depth02_wrap > li .depth02.is-active {
  background: #FFF0E5;
  color: #FF6A00;
}
.lecture-font.orange_box .sidebar .memo_list > li .content.input_content {
  background-color: #FFFCF7;
}
.lecture-font.orange_box .sidebar .memo_list > li .btn_memo_add {
  background-color: #FF6A00;
}
.lecture-font.orange_box .sidebar .sidebar_title .btn_bookmark_single.is-active > img {
  content: url('../images/btn_bookmark_active_single_black.png');
}
.lecture-font.orange_box .sidebar .sidebar_content ul.memo_sort li button.is-active {
  background-color: #FF6A00;
}
.lecture-font.orange_box .sidebar .memo_list > li.is-active {
  background-color: #FDF5EC;
}
.lecture-font.orange_box .sidebar .memo_list > li .dropdown_memo .btn_menu {
  background: url("../images/ico_arrow_button_down_orange.svg") no-repeat;
  background-size: cover;
}
.lecture-font.orange_box #other_memoSidebar .memo_list > li ul.bookmarks_list > li .title .ico {
  fill: #FF6A00;
}
.lecture-font.orange_box #other_memoSidebar .memo_list > li ul.bookmarks_list > li .dropdown_memo .btn_menu {
  background: url("../images/ico_arrow_button_down_orange.svg") no-repeat;
  background-size: cover;
}
.lecture-font.orange_box .viewer_wrap .review_box .box_content .btn_link {
  background-color: #FF6A00;
}
.lecture-font.orange_box .viewer_wrap .review_box .box_title {
 color: #FF6A00;
}

@media screen and (min-width: 768px) {
  .viewer_header .utils .btn_setting {
    display: inline-block;
    width: 28px;
    height: 28px;
    background: url("../images/ico_setting_gear.svg") no-repeat center;
    background-size: 24px 24px;
  }
  .viewer_header .utils .btn_list {
    display: inline-block;
    width: 28px;
    height: 28px;
    background: url("../images/ico_list.svg") no-repeat center;
    background-size: 24px 24px;
  }
  .viewer_header .utils .utils_bookmark_div {
    position: relative;
    width: 73px;
    height: 28px;
    margin-left: 20px;
  }
  .viewer_header .utils .utils_bookmark_div > div {
    width: 100%;
    height: 100%;
    background: url("../images/btn_bookmark_background.svg") no-repeat center;
    background-size: contain;
  }
  .viewer_header .utils .utils_bookmark_div > div .btn_bookmark {
    position: absolute;
    width: 24px;
    height: 24px;
    left: 10px;
    margin-left: 0;
  }
  .viewer_header .utils .utils_bookmark_div > div .btn_bookmark img {
    width: 100%;
    padding: 6px;
  }
  .viewer_header .utils .utils_bookmark_div > div .btn_bookmark.is-active img {
    content: url('../images/btn_bookmark_active.svg');
  }
  .viewer_header .utils .utils_bookmark_div > div .btn_memo {
    position: absolute;
    top: 3px;
    right: 5px;
  }

/*
  .viewer_header .utils .btn_bookmark {
    display: inline-block;
    width: 56px;
    height: 28px;
    background: url("../images/ico_bookmark_memo.svg") no-repeat;
    background-size: cover;
  }
  .viewer_header .utils .btn_bookmark.is-active {
    background-image: url("../images/ico_bookmark_memo_active.svg");
  }
*/
  .viewer_header .utils .btn .title {
    display: block;
    padding-top: 28px;
    background-repeat: no-repeat;
    background-position:  50% 0;
    background-size: 28px 28px;
    margin-top: 5px;
    font-size: 13px;
    font-weight: 400;
  }

  .viewer_header .utils .utils_bookmark_div .title {
    display: block;
    margin-top: 5px;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 400;
  }

  /*사이드 메뉴 | 북마크및메모*/
  .sidebar .sidebar_footer {
    text-align: center;
    max-width: 500px;
    padding: 25px 0;
    background-color: #fff;
  }
  .sidebar .sidebar_footer button img {
    vertical-align: text-bottom;
    width: 24px;
    height: 24px;
  }

  /* 사이드 메뉴 | 공통 */
  .sidebar {
    max-width: 500px;
  }

  /* 뷰어페이지 마지막 */
  .viewer_wrap .review_box {
    position: relative;
    max-width: 740px;
    margin: 164px auto 0;
    /* background-color: #fff; */
    /* border: solid 1px #c2d6ff; */
    box-shadow: 0 3px 20px 0 rgba(55, 109, 213, 0.14);
    border-radius: 40px 40px 40px 8px;
    /* overflow: hidden; */
  }
  .viewer_wrap .review_box:before {
    content: "";
    position: absolute;
    left: -50px;
    top: -24px;
    width: 83px;
    height: 83px;
    background: url("../images/ico_quotation_mark.png") no-repeat 0 0;
  }
  .viewer_wrap .review_box .box_title {
    position: relative;
    z-index: 1;
    padding: 36px 70px;
    background-color: #f0f4fc;
    border: solid 1px #c2d6ff;
    border-radius: 40px 40px 0 0;
    font-size: 24px;
  }
  .viewer_wrap .review_box .box_content {
    padding: 40px 70px 60px;
    background-color: #fff;
    border: solid 1px #c2d6ff;
    border-top: 0;
    border-radius: 0 0 40px 8px;
  }
  .viewer_wrap .review_box .box_content .desc {
    font-size: 20px;
    line-height: 1.45;
  }
  .viewer_wrap .review_box .box_content .btn_link {
    margin-top: 30px;
    font-size: 20px;
    line-height: 62px;
  }

  /*강의 오렌지색 변경*/
  .lecture-font.orange_box .viewer_wrap .review_box:before {
    background: url("../images/ico_quotation_mark_orange_p.png") no-repeat 0 0;
  }
  .lecture-font.orange_box .viewer_wrap .review_box .box_title {
    background-color: #FDF5EC;
    border: solid 1px #FFDBAA;
  }
  .lecture-font.orange_box .viewer_wrap .review_box .box_content {
    border: solid 1px #FFDBAA;
  }
}

@media (min-width: 767px) and (max-width: 1024px) {
  .viewer_header .title_area .title {
    font-size: 22px;
  }
  .viewer_header .title_area .sub_title {
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .viewer_header .title_area .sub_title span {
    display: inline-block;
    width: 50%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .viewer_header .title_area .sub_title:after {
    width: 22px;
    height: 22px;
    margin-left: 0;
  }
}

@media screen and (max-width: 767px) {
  #scrollTop {
    width: 50px;
    bottom: 10px;
    right: 10px;
  }
  .pc_size_side_list{
    display: none !important;
  }
  .mobile_size_side_list{
    display: block;
  }

  .mobile_size_side_list .utils {
    display: flex;
    right: 0;
  }
  .mobile_size_side_list .utils .btn {
    margin-left: 20px;
    background-color: transparent;
    border: 0;
    line-height: 1;
  }

  .mobile_size_side_list .utils {
    bottom: 0;
    top: inherit;
    left: 0;
    background-color: #F4F4F4;
  }
  .mobile_size_side_list .utils .btn {
    flex: 0 0 18%;
    max-width: 18%;
    margin-left: 0;
    padding: 9px 0 10px;
  }
  .mobile_size_side_list .utils .btn.btn_wide {
    flex: 0 0 23%;
    max-width: 23%;
    margin-left: 0;
    padding: 9px 0 10px;
  }
  .mobile_size_side_list .utils .btn .title {
    padding-top: 30px;
    background-repeat: no-repeat;
    background-position: 50% 0;
    background-size: 24px 24px;
    font-size: 12px;
    font-weight: 700;
    color: #888;
  }
  .mobile_size_side_list .utils .utils_bookmark_div {
    flex: 0 0 40%;
    max-width: 40%;
    padding: 7px 0 5px;
  }
  .mobile_size_side_list .utils .utils_bookmark_div > div {
    position: relative;
    width: 73px;
    height: 28px;
    background: url("../images/btn_bookmark_background.svg") no-repeat center;
    background-size: contain;
    margin: 0 auto;
  }
  .mobile_size_side_list .utils .utils_bookmark_div > div .btn_bookmark {
    position: absolute;
    left: 15px;
    top: 3px;
    margin-left: 0;
    padding: 4px;
  }
  .mobile_size_side_list .utils .utils_bookmark_div > div .btn_bookmark.is-active img {
    content: url('../images/btn_bookmark_active.svg');
  }
  .mobile_size_side_list .utils .utils_bookmark_div > div .btn_memo {
    position: absolute;
    top: 3px;
    right: 6px;
    padding: 0;
  }
  .mobile_size_side_list .utils .utils_bookmark_div .title {
    font-size: 12px;
    font-weight: 400;
    color: #888;
  }

  .mobile_size_side_list .utils .btn_setting .title {
    background-image: url("../images/ico_setting_gear_mob.svg");
  }
  .mobile_size_side_list .utils .btn_bookmark .title {
    background-image: url("../images/ico_bookmark_mob.svg");
  }
  .mobile_size_side_list .utils .btn_bookmark.is-active .title {
    background-image: url("../images/ico_bookmark_black.svg");
  }
  .mobile_size_side_list .utils .btn_memo .title {
    background-image: url("../images/ico_memo_mob.svg");
  }
  .mobile_size_side_list .utils .btn_list .title {
    background-image: url("../images/ico_list_mob.svg");
  }
  .mobile_size_side_list .utils .btn_pre .title {
    background-image: url("../images/arrow-left-sm-gray.png");
    background-position: 30% 0;
    background-position-y: -1px;
    height: 24px;
    padding-top: 5px;
    padding-left: 20px;
  }
  .mobile_size_side_list .utils .btn_next .title {
    background-image: url("../images/arrow-right-sm-gray.png");
    background-position: 70% 0;
    background-position-y: -1px;
    height: 24px;
    padding-top: 5px;
    padding-right: 20px;
  }
  .modal-bg.open {
    display: block;
    background-color: #212121;
  }
  .viewer_header {
    padding: 20px 20px;
    background-color: rgb(255, 255, 255);
  }
  .viewer_header .btn_back {
    left: 0;
    top: 0;
  }
  .viewer_header .inner > .btn_bookmark {
    background: none;
    border: none;
    position: absolute;
    top: -3px;
    right: 0;
  }
  .viewer_header .inner > .btn_bookmark.is-active > img {
    content: url('../images/btn_bookmark_mb_active.png');
  }
  .viewer_header .title_area {
    text-align: left;
    padding-left: 34px;
    padding-right: 38px;
  }
  .viewer_header .title_area .title {
    font-size: 16px;
  }
  .viewer_header .title_area .sub_title {
    margin-top: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 23px;
    color: #111;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    min-height: 32px;

  }
  .viewer_header .title_area .sub_title:after {
    display: none;
  }

  .viewer_wrap {
    padding-top: 70px;
    padding-bottom: 116px;
  }
  .viewer_wrap.full {
    padding-top: 20px;
    padding-bottom: 11px;
  }

  /* 강의 플레이어 버튼 */
  .viewer_wrap .vod-player-control-wrap {
    justify-content: center;
    padding-bottom: 10px;
    border-bottom: 1px solid #E0E0E0;
  }
  .viewer_wrap .vod-player-control-wrap .btn_control_group {
    flex-grow: 2;
  }
  .viewer_wrap .vod-player-control-wrap .dropdown{
    flex-grow: 0.5;
  }
  .viewer_wrap .vod-player-control-wrap .btn-player {
    flex-grow: 1;
  }

  .viewer_wrap .vod-player-control-wrap .btn-player,
  .viewer_wrap .vod-player-control-wrap .dropdown
  {
    line-height: 26px;
  }
  .viewer_wrap .vod-player-control-wrap .btn-player.before {
    padding: 0 10px 0 3px;
  }
  .viewer_wrap .vod-player-control-wrap .btn-player.after {
    padding: 0 3px 0 10px;
  }
  .viewer_wrap .vod-player-control-wrap .dropdown > .btn_player_speed {
    width: 100%;
  }

  #summary-viewer .assignment_content .btn_assignment,
  #summary-viewer .assignment_content .btn_assignment_submit,
  #summary-viewer .assignment_content .btn_assignment_list{
    font-size: 14px !important;
    line-height: 14px !important;
    padding: 12px 24px;
  }
  #summary-viewer .assignment_content .btn_assignment:after {
    width: 18px;
    height: 18px;
    background-position-y: 0px;
  }
  #summary-viewer .assignment_content .btn_assignment_submit:after {
    width: 18px;
    height: 18px;
    background-position-y: 0px;
  }

  .txt_tooltip.memo {
    position: fixed;
    width: 100%;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: inherit !important;
    margin-top: 0;
    padding-bottom: 31px;
  }
  .txt_tooltip.memo .input_txt {
    height: 184px;
  }

  /* 프로그래스바 */
  .viewer_nav .page_info {
    padding: 0 0 10px 0;
  }
  .viewer_nav .page_info .page_num {
    margin: 0 16px;
    padding: 8px 23px 8px;
    border-radius: 6px;
    background-color: #fff;
    font-size: 12px;
    color: #555;
    white-space: nowrap;
  }
  .viewer_nav .page_info .btn {
    width: 80px;
    line-height: 1;
  }
  .viewer_nav .progress-wrap .progress {
    height: 18px;
    background: rgba(244, 244, 244, 0.3);
    backdrop-filter: blur(3px);
  }
  .viewer_nav .progress-wrap .progress .progress-bar span {
    text-align: right;
    color: #FFFFFF;
    font-weight: 700;
    padding-right: 5px;
    line-height: 15px;
  }

  /* 사이드 메뉴 | 공통 */
  .sidebar .sidebar_title {
    padding: 22px 20px 21px 58px;
    font-size: 16px;
  }
  .sidebar .sidebar_title .btn_bookmark_single {
    position: absolute;
    width: 28px;
    height: 28px;
    top: 17px;
    right: 30px;
  }
  .sidebar > .utils {
    left: 20px;
    top: 18px;
  }
  .sidebar > .utils .btn {
    margin-left: 0;
  }
  .sidebar .sidebar_content {
    padding-left: 30px;
    padding-right: 30px;
  }
  .sidebar .sidebar_content .content_title {
    font-size: 16px;
  }

  /* 사이드 메뉴 | 강조표시 및 메모 */
  .memo_list_wrap {
    margin-bottom: 62px;
  }
  .sidebar .memo_list > li .title,
  .sidebar .memo_list > li .btn_add {
    font-size: 14px;
  }
  .sidebar .memo_list > li .title .ico,
  .sidebar .memo_list > li .dropdown .btn_menu {
    width: 20px;
  }
  .sidebar .memo_list > li.color-blue .content,
  .sidebar .memo_list > li.color-orange .content,
  .sidebar .memo_list > li .content.input_content {
    font-size: 14px;
    line-height: 2.14;
  }
  .sidebar .memo_list > li .memo_count_title
  {
    font-size: 14px;
  }
  .sidebar .memo_list > li .btn_add_memo {
    margin-top: 3px;
  }

  .sidebar .memo_list > li .dropdown {
    right: 2px;
  }
  .sidebar .memo_list > li .dropdown .dropdown-menu {
    right: 92px;
  }
  .sidebar .memo_list > li .dropdown_memo {
    right: 30px;
  }
  #memoSidebar .memo_list > li .title {
    margin-right: 70px;
  }
  #memoSidebar .sidebar_content .content_title,
  .sidebar .sidebar_content .memo_sort_wrap
  {
    padding-left: 35px;
    padding-right: 35px;
  }
  #memoSidebar .memo_list > li {
    padding-left: 46px;
    padding-right: 41px;
  }

  .sidebar .sidebar_footer button {
    width: 100%;
    border-radius: 0;
    border: none;
    font-size: 15px;
    text-align: left;
  }
  .sidebar .sidebar_footer button img {
    position: absolute;
    right: 18px;
    top: 7px;
  }

  /* 사이드 메뉴 | 설정 */
  .sidebar .viewer_setting dl + dl {
    margin-top: 10px;
  }
  .sidebar .viewer_mode {
    margin-top: 20px;
  }
  .sidebar .viewer_mode .title {
    margin: 0;
    padding: 15px 10px;
    font-size: 14px;
  }
  .sidebar .viewer_mode .radio {
    margin-top: 10px;
  }

  /* 사이드 메뉴 |  목차 */
  .sidebar .content_list > li + li {
    margin-top: 12px;
  }
  .sidebar .content_list > li .depth01 {
    font-size: 16px;
  }
  .sidebar .content_list > li .depth01 .num {
    flex: 0 0 29px;
    max-width: 29px;
  }
  .sidebar .content_list .depth02_wrap {
    margin-top: 4px;
  }
  .sidebar .content_list .depth02_wrap > li .depth02 {
    padding: 5px 0 6px 14px;
    font-size: 14px;
  }
  .sidebar .content_list .depth02_wrap > li .depth02.is-active {
    background-size: 20px;
    background-position: 5px 4px;
  }
  .sidebar .content_list > li.is-active .depth02_wrap > li .depth02 {
    padding-left: 14px;
  }

  /* 뷰어페이지 마지막 */
  .viewer_wrap .review_box {
    margin-top: 25px;
  }
  .viewer_wrap .review_box .box_title {
    text-align: center;
  }
  .viewer_wrap .review_box .box_title .ico {
    margin: 0 auto 14px;
  }
  .viewer_wrap .review_box .box_content {
    margin-top: 30px;
  }
  .viewer_wrap .review_box .box_content .desc {
    font-size: 14px;
    line-height: 1.86;
  }
  .viewer_wrap .review_box .box_content .btn_link {
    margin-top: 30px;
    font-size: 16px;
    line-height: 54px;
  }

  #other_memoSidebar .memo_list > li.color-gray > .title .ico {
    top: 1px;
    right: 3px;
  }
  #other_memoSidebar .memo_list_wrap {
     margin-bottom: 100px;
   }
  #other_memoSidebar .memo_list > li ul.bookmarks_list > li .content {
    font-size: 14px;
    line-height: 2.14;
  }

  /* 사이드메뉴 - 목차 */
  .sidebar.assignment_type .sidebar_content {
    padding-left: 20px;
    padding-right: 20px;
  }
  .sidebar.assignment_type .sidebar_content .content_list .depth02_wrap > li .depth02 .assignment {
    padding: 2px 10px 4px;
    top: 3px;
  }


  /*강의 오렌지색 변경*/
  .lecture-font.orange_box .mobile_size_side_list .utils .utils_bookmark_div > div {
    background: url("../images/btn_bookmark_background_black.svg") no-repeat center;
    background-size: contain;
  }
  .lecture-font.orange_box .mobile_size_side_list .utils .utils_bookmark_div > div .btn_bookmark.is-active img {
    content: url('../images/btn_bookmark_active.svg');
  }
  .lecture-font.orange_box .sidebar .content_list .depth02_wrap > li .depth02.is-active {
    background-size: 20px;
    background-position: 5px 4px;
  }
}


/* Assignment Modal Start */
#assignment_modal .modal-content {
  padding : 0;
}

#assignment_modal .modal-content .modal-header {
  display: inline-flex;
  justify-content: end;
  align-items: center;
  width: 100%;
  padding: 0 20px;
}

#assignment_modal .modal-content .modal-header .btn-modal-close {
  background: #fff;
  margin-left: auto;
  margin-right: 0px;
  font-size: 20px;
  color : #757575;
}

#assignment_modal .modal-content .modal-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding : 0px 40px 0px 40px;
}

#assignment_modal .modal-content .modal-body .sub-title {
  color: #5991FF;
  font-size: 20px;
  font-weight: 500;
  margin-bottom : 16px;
}

#assignment_modal .modal-content .modal-body .title {
  color: #000;
  font-size: 28px;
  font-weight: 600;
  text-align: center;
  word-break: keep-all;
}

#assignment_modal .modal-content .modal-body img.stamp{
  width : 300px;
  height : auto;
}

#assignment_modal .modal-content .modal-body .progress-wrap {
  position : relative;
  padding-top: 25px;
  width : 100%;
  max-width: 100%;
}

#assignment_modal .modal-content .modal-body .progress-wrap .progress{
  width : 100%;
  height : 20px;
}

#assignment_modal .modal-content .modal-body .progress-wrap .progress .progress-bar{
  background-color : #5991FF;
}

#assignment_modal .modal-content .modal-body .progress-wrap .progress-tag{
  position : absolute;
  top : 0px;
  font-size : 14px;
  font-weight: 700;
  color : #000;
}

#assignment_modal .modal-content .modal-body .progress-wrap .progress-tag.final{
  right : 0px;
  color : #757575;
}

#assignment_modal .modal-content .modal-footer .btn-modal-confirm {
  width: 100%;
  background-color: #5991FF;
  color: #fff;
  font-size : 24px;
  height: 60px;
  border-radius: 0px;
  cursor: pointer;
}

@media screen and (max-width: 767px) {
  #assignment_modal.in {
    display: flex !important;
    align-items: center;
    justify-content: center;
  }

  #assignment_modal .modal-content .modal-header {
    padding: 0 10px;
  }

  #assignment_modal .modal-content .modal-body {
    padding : 20px;
    padding-top : 0px;
  }

  #assignment_modal .modal-content .modal-body .sub-title {
    font-size: 16px;
    margin-bottom : 12px;
  }

  #assignment_modal .modal-content .modal-body .title {
    font-size: 20px;
  }

  #assignment_modal .modal-content .modal-body img.stamp{
    width : 250px;
  }

  #assignment_modal .modal-content .modal-body .progress-wrap {
    padding-top: 20px;
  }

  #assignment_modal .modal-content .modal-body .progress-wrap .progress{
    height : 10px;
  }

  #assignment_modal .modal-content .modal-body .progress-wrap .progress-tag{
    font-size : 12px;
  }

  #assignment_modal .modal-content .modal-footer .btn-modal-confirm {
    font-size : 16px;
    height: initial;
  }
}
/* Assignment Modal End */

/*@media (min-width: 810px) {*/
/*  .pdf_view {*/
/*    width: 750px !important;*/
/*    max-width: 750px !important;*/
/*  }*/
/*}*/

