/*
 * PE-Class v1.16.20
 * Memo modal and class-progress column balance for desktop, iPad, MacBook,
 * and Galaxy Fold wide layouts only.
 */

body.progressMemoModalOpen11620 {
  overflow:hidden!important;
  overscroll-behavior:none!important;
  touch-action:none!important;
}

.progressMemoModal11620 {
  position:fixed;
  inset:0;
  z-index:2147483000;
  display:grid;
  place-items:center;
  padding:24px;
  box-sizing:border-box;
  background:rgba(24,43,62,.48);
  backdrop-filter:blur(2px);
}

.progressMemoDialog11620 {
  width:min(560px,calc(100vw - 48px));
  max-height:calc(100dvh - 48px);
  overflow:hidden;
  border:1px solid #d7e4ef;
  border-radius:18px;
  background:#fff;
  box-shadow:0 24px 70px rgba(24,43,62,.25);
}

.progressMemoHead11620 {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding:20px 22px 17px;
  border-bottom:1px solid #e3ebf2;
  background:linear-gradient(135deg,#f8fbff 0%,#eef7ff 100%);
}

.progressMemoHead11620 span {
  display:block;
  margin-bottom:3px;
  color:#248bd2;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
}

.progressMemoHead11620 h3 {
  margin:0;
  color:#21384d;
  font-size:21px;
  line-height:1.25;
}

.progressMemoHead11620 p {
  margin:6px 0 0;
  color:#718397;
  font-size:12px;
  font-weight:700;
}

.progressMemoClose11620 {
  flex:0 0 38px;
  width:38px;
  height:38px;
  padding:0;
  border:1px solid #d5e1eb;
  border-radius:11px;
  background:#fff;
  color:#587087;
  font-size:17px;
  font-weight:900;
  cursor:pointer;
}

.progressMemoBody11620 {
  padding:20px 22px 17px;
}

.progressMemoBody11620 label {
  display:block;
  margin-bottom:8px;
  color:#2c455b;
  font-size:13px;
  font-weight:900;
}

.progressMemoBody11620 textarea {
  display:block;
  width:100%;
  min-height:170px;
  padding:14px;
  border:1px solid #cbdbe8;
  border-radius:12px;
  outline:none;
  box-sizing:border-box;
  resize:vertical;
  background:#fbfdff;
  color:#20384d;
  font:inherit;
  font-size:14px;
  line-height:1.55;
}

.progressMemoBody11620 textarea:focus {
  border-color:#3498db;
  box-shadow:0 0 0 3px rgba(52,152,219,.13);
}

.progressMemoBody11620 p {
  margin:8px 0 0;
  color:#8493a2;
  font-size:11px;
}

.progressMemoFoot11620 {
  display:flex;
  justify-content:flex-end;
  gap:9px;
  padding:13px 22px 17px;
  border-top:1px solid #e6edf3;
  background:#fbfdff;
}

.progressMemoFoot11620 .btn {
  min-width:104px;
  min-height:40px;
}

@media (min-width:769px) {
  #progressTableBox table.pe87ClassProgress {
    table-layout:fixed!important;
  }

  #progressTableBox table.pe87ClassProgress .progressColCheck {
    width:3.5%!important;
  }

  #progressTableBox table.pe87ClassProgress .progressColLesson {
    width:6%!important;
  }

  #progressTableBox table.pe87ClassProgress .progressColDate {
    width:21%!important;
  }

  #progressTableBox table.pe87ClassProgress .progressColPeriod {
    width:6.5%!important;
  }

  #progressTableBox table.pe87ClassProgress .progressColPlace {
    width:9%!important;
  }

  #progressTableBox table.pe87ClassProgress .progressColSubject {
    width:14.5%!important;
  }

  #progressTableBox table.pe87ClassProgress .progressColSubjectLesson {
    width:8%!important;
  }

  #progressTableBox table.pe87ClassProgress .progressColActivity {
    width:25%!important;
  }

  #progressTableBox table.pe87ClassProgress .progressColMemo {
    width:6.5%!important;
  }

  #progressTableBox .progressMemoControl11620 {
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-width:0;
  }

  #progressTableBox .progressMemoOpenBtn11620 {
    width:100%;
    max-width:76px;
    min-height:38px;
    padding:6px 8px;
    border:1px solid #bdd8eb;
    border-radius:9px;
    background:#f5fbff;
    color:#248bd2;
    font-size:12px;
    font-weight:900;
    white-space:nowrap;
    cursor:pointer;
  }

  #progressTableBox .progressMemoOpenBtn11620.hasMemo {
    border-color:#8fd9ba;
    background:#effbf6;
    color:#16805a;
  }

  #progressTableBox select.progressInput[data-k="subject"] {
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
}

@media (min-width:769px) and (max-width:1440px) {
  html.pe87Ipad #progressTableBox .progressColCheck,
  html.pe87IpadRuntime #progressTableBox .progressColCheck {
    width:4%!important;
  }

  html.pe87Ipad #progressTableBox .progressColLesson,
  html.pe87IpadRuntime #progressTableBox .progressColLesson {
    width:6.5%!important;
  }

  html.pe87Ipad #progressTableBox .progressColDate,
  html.pe87IpadRuntime #progressTableBox .progressColDate {
    width:20%!important;
  }

  html.pe87Ipad #progressTableBox .progressColPeriod,
  html.pe87IpadRuntime #progressTableBox .progressColPeriod {
    width:7.5%!important;
  }

  html.pe87Ipad #progressTableBox .progressColPlace,
  html.pe87IpadRuntime #progressTableBox .progressColPlace {
    width:10%!important;
  }

  html.pe87Ipad #progressTableBox .progressColSubject,
  html.pe87IpadRuntime #progressTableBox .progressColSubject {
    width:15.5%!important;
  }

  html.pe87Ipad #progressTableBox .progressColSubjectLesson,
  html.pe87IpadRuntime #progressTableBox .progressColSubjectLesson {
    width:8%!important;
  }

  html.pe87Ipad #progressTableBox .progressColActivity,
  html.pe87IpadRuntime #progressTableBox .progressColActivity {
    width:22.5%!important;
  }

  html.pe87Ipad #progressTableBox .progressColMemo,
  html.pe87IpadRuntime #progressTableBox .progressColMemo {
    width:6%!important;
  }
}

html.pe87FoldWide #progressTableBox .progressColCheck {
  width:4%!important;
}

html.pe87FoldWide #progressTableBox .progressColLesson {
  width:7%!important;
}

html.pe87FoldWide #progressTableBox .progressColDate {
  width:18%!important;
}

html.pe87FoldWide #progressTableBox .progressColPeriod {
  width:7%!important;
}

html.pe87FoldWide #progressTableBox .progressColPlace {
  width:10%!important;
}

html.pe87FoldWide #progressTableBox .progressColSubject {
  width:16%!important;
}

html.pe87FoldWide #progressTableBox .progressColSubjectLesson {
  width:8%!important;
}

html.pe87FoldWide #progressTableBox .progressColActivity {
  width:24%!important;
}

html.pe87FoldWide #progressTableBox .progressColMemo {
  width:6%!important;
}

html.pe87FoldWide #progressTableBox .progressMemoControl11620 {
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
}

html.pe87FoldWide #progressTableBox .progressMemoOpenBtn11620 {
  width:100%;
  min-height:36px;
  padding:5px 4px;
  border:1px solid #bdd8eb;
  border-radius:8px;
  background:#f5fbff;
  color:#248bd2;
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}

html.pe87FoldWide #progressTableBox .progressMemoOpenBtn11620.hasMemo {
  border-color:#8fd9ba;
  background:#effbf6;
  color:#16805a;
}

@media (max-width:768px) {
  html:not(.pe87FoldWide) .progressMemoModal11620,
  html:not(.pe87FoldWide) #progressTableBox .progressMemoControl11620 {
    display:none!important;
  }
}