/* 교사 자료실 */

/* 헤더 메뉴 항목 */
.headerMenu1 {
  color: var(--mainColor);
}

.headerMenu1 > span {
  color: var(--mainColor) !important;
  border-bottom: 3px solid var(--mainColor);
}
.headerMenu1:hover > span {
  color: var(--mainColor) !important;
  border-bottom: 3px solid var(--mainColor);
}

.headerMenu1 .subMenuLi:nth-of-type(4) > .subMenuDiv {
  background-color: var(--mainColor);
  color:var(--whiteColor);
}
.headerMenu1 .subMenuLi:nth-of-type(4) .subMenuUl > li:first-child > a {
  color: var(--mainColor);
}

/* 메뉴 항목 */
.asideMenu > li:nth-child(4) > span {
  background-color: var(--anColor);
}

.asideMenu > li:nth-child(4) > .asideSubMenu > li:first-child > a {
  color: var(--mainColor);
}
.asideMenu > li:nth-child(4) > .asideSubMenu > li:first-child > a::before {
  color: var(--mainColor);
}


.pageContents {
  display: flex;
  flex-direction: column;
  gap: 50px;
  position: relative;
}

/* 콘텐츠 내용 */
.contentsInner {
  display: flex;
  flex-direction: column;
}

.contentsInner > div {
  width: 100%;
  display: flex;
}

.contentsTh {
  width: 200px;
  height: 60px;
  background-color: var(--borderBack);
  color: var(--titColor);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  border: 1px solid var(--tableLine);
  font-weight: 700;
}
.contentsTd {
  height: 60px;
  flex: 1;
  display: flex;
  align-items: center;
  font-size: 15px;
  color: var(--txtColor);
  border-top: 1px solid var(--tableLine);
  border-right: 1px solid var(--tableLine);
  border-bottom: 1px solid var(--tableLine);
  padding: 0 10px;
}

/* 제목 */
.contentsTitBox > .contentsTh {
  border-bottom: none;
}
.contentsTitBox > .contentsTd {
  border-bottom: none;
}

/* 날짜/조회수 */
.contentsDayView > div {
  width: 50%;
  display: flex;
}

.contentsDay > .contentsTd {
  border-right: none;
}


/* 내용 */
.contentsMore {
  border-left: 1px solid var(--tableLine);
  border-right: 1px solid var(--tableLine);
  padding: 10px;
}

.contentsMore textarea {
  width: 100%;
  border: none;
  color: var(--txtColor);
  line-height: 22px;
  cursor: default;
  font-size: 15px;
}

/* 첨부파일 */
.contentsFile .contentsTh {
  min-height: 60px;
  height: auto;
}

.contentsFile .contentsTd {
  min-height: 60px;
  height: auto;
  padding: 5px;
}

.contentsFile .addFiles {
  width: 100%;
  border: none;
}

.contentsFile .fileTxt {
  color: var(--txtSColor);
}

/* 페이지 이동 */
.pageMove {
  display: flex;
  flex-direction: column;
}

.pageMoveBox {
  width: 100%;
  display: flex;
}
.pageMoveTit {
  width: 100px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid var(--tableLine);
  border-left: 1px solid var(--tableLine);
  border-right: 1px solid var(--tableLine);
  font-size: 13px;
  color: var(--txt6Color);
  background-color: var(--borderBack);
  cursor: pointer;
  font-weight: 700;
}

.pageMoveBox:hover .pageMoveTxt {
  background-color: var(--anColor);
}

.pageMove > .pageMoveBox:last-of-type {
  border-bottom: 1px solid var(--tableLine);
}

.pageMoveTxt {
  height: 50px;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid var(--tableLine);
  border-right: 1px solid var(--tableLine);
  font-size: 14px;
}

.pageMoveTxt > a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  color: var(--txtColor);
  font-size: 13px;
  font-weight: 400;
}

.fileIcon {
  color: var(--mainColor);
}
.fileIcon > i {
  font-size: 15px;
}

.pageBottomBtns {
  justify-content: center;
}

/* 모바일 사이드 메뉴 */
.sideNav > li:first-child .sideSubNav {
  display: flex;
}
.sideNav > li:first-child .sideSubNav > .sideSubNavLi:nth-child(4) .sideInnerNav {
  display: flex;
}
.sideNav > li:first-child .sideSubNav > .sideSubNavLi:nth-child(4) > .sideSubNavTop {
  background-color: var(--subColor);
  color: var(--mainColor);
}

.pageMoveTxt > a > span {
  max-height: 30px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

/* 반응형 */
@media screen and (max-width: 1200px) {
  .contentsTh {
    font-size: 13px;
    width: 150px;
  }
  .contentsTd {
    font-size: 13px;
  }

  .contentsMore textarea {
    font-size: 13px;
  }

  .pageMoveTxt {
    font-size: 13px;
  }
}

@media screen and (max-width: 800px) {
  .roundLineBtns {
    font-size: 13px;
  }

  .contentsTh {
    font-size: 13px;
    height: 50px;
  }
  .contentsTd {
    font-size: 13px;
    height: 50px;
  }

  .contentsMore textarea {
    font-size: 13px;
  }

  .pageMoveTit {
    font-size: 13px;
  }

  .pageMoveTxt {
    font-size: 13px;
  }
}

@media screen and (max-width: 600px) {
  .contentsTh {
    width: 100px;
  }

  .pageMoveTxt > a {
    padding: 0 10px;
  }

  .addFiles {
    gap: 10px;
  }
}

@media screen and (max-width: 500px) { 
  .contentsTh {
    width: 60px;
    font-size: 13px;
  }
  .contentsTd {
    font-size: 13px;
  }
  .pageMoveTit {
    width: 60px;
    font-size: 13px;
  }
  .pageMoveTxt {
    font-size: 13px;
  }

  .contentsMore textarea {
    font-size: 13px;
  }

  .roundLineBtns {
    font-size: 13px;
  }
}