@charset "UTF-8";
.flexBetweenCenter {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.timeTableItem {
  background-color: #EEF6FF;
  border-radius: 5px;
  border-left: 5px solid #D6E5F6;
  height: 90px;
  margin: 1px;
  width: 170px;
  overflow: hidden;
}

/*Normal課表樣式*/
.timeTableItemLarge .timeTableItem {
  width: 180px;
}
.timeTableItemLarge .disableTimeTableItem {
  width: 180px;
}
.timeTableItemLarge .holidayTimeTableItem {
  width: 180px;
}

.SubjectDisplay {
  background-color: white;
  border-radius: 5px;
  padding: 3px;
  color: #1D2D41;
  font-size: 15px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.classDisplay {
  color: #344269;
  font-size: 15px;
  line-height: 26px;
  font-weight: bold;
}

.tableClassroomItem {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 60px;
}

.teacherDisplay {
  font-size: 15px;
  color: #436EA7;
  font-weight: bold;
  cursor: pointer;
}

.disableTimeTableItem {
  background-color: #F5F5F5;
  border-radius: 5px;
  border-left: 5px solid #F5F5F5;
  min-height: 90px;
  margin: 1px;
  width: 170px;
}

.holidayTimeTableItem {
  background-color: #e3fbff;
  border-radius: 5px;
  border-left: 5px solid #F5F5F5;
  min-height: 90px;
  margin: 1px;
  width: 170px;
}

/*Medium課表樣式*/
.timeTableItemMedium .disableTimeTableItem {
  width: 140px;
}
.timeTableItemMedium .holidayTimeTableItem {
  width: 140px;
}
.timeTableItemMedium .timeTableItem {
  border-left: none;
  height: 95px;
  width: 140px;
  overflow: hidden;
  position: relative;
}
.timeTableItemMedium .user-select-none {
  width: 40px;
  position: absolute;
  top: 34%;
  right: 0;
}
.timeTableItemMedium .btnSmall {
  padding: 0 3px;
  font-size: 14px;
}
.timeTableItemMedium .classDisplay { /*中課表模式時，班級長度超過就會顯示...*/
  width: 60px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/*Small 課表樣式*/
.shinherTimeTableSmallRegion {
  border-color: #dcdcdc;
  background-color: white;
}
.shinherTimeTableSmallRegion .disableTimeTableItem {
  background-color: #F5F5F5;
  border-radius: 0;
  border-left: none;
  min-height: 55px;
  margin: 0;
  width: 60px;
}
.shinherTimeTableSmallRegion .holidayTimeTableItem {
  background-color: #e3fbff;
  border-radius: 0;
  border-left: none;
  min-height: 55px;
  margin: 0;
  width: 60px;
}

.timeTableItemSmall {
  width: 60px;
  min-height: 55px;
  padding-bottom: 10px;
  overflow: hidden;
}
.timeTableItemSmall .btnSmall {
  padding: 0 2px;
  font-size: 12px;
}
.timeTableItemSmall .SubjectDisplay {
  font-size: 12px;
  padding: 1px;
}
.timeTableItemSmall .classDisplay {
  font-size: 12px;
  line-height: 14px;
}
.timeTableItemSmall .teacherDisplay {
  font-size: 12px;
}
.timeTableItemSmall .teacherDisplay i {
  font-size: 8px;
}

/*Small 課表樣式+extend*/
.shinherTimeTableSmallRegion.extend .timeTableItemSmall {
  width: 90px;
  min-height: 40px;
  padding-bottom: 10px;
}
.shinherTimeTableSmallRegion.extend .disableTimeTableItem {
  display: none;
}
.shinherTimeTableSmallRegion.extend .holidayTimeTableItem {
  display: none;
}
.shinherTimeTableSmallRegion.extend .teacherDisplay {
  line-height: 13px;
}
.shinherTimeTableSmallRegion.extend .tableClassroomItem {
  display: none !important;
}

/*切換科目的箭頭樣式*/
.user-select-none { /*固定切換按鈕寬度，不因寬度換行*/
  min-width: 35px;
}

.changeOrder {
  border-radius: 2px;
  padding: 2px 5px;
  background-color: #DCDCDC;
  color: white;
  font-size: 12px;
  transition-duration: 0.2s;
}
.changeOrder.show {
  background-color: #F1B136;
  transition-duration: 0.2s;
  cursor: pointer;
}
.changeOrder.show:hover {
  background-color: #EEA924;
}

/*切換單雙週的樣式*/
.changeWeek {
  border-radius: 20px;
  padding: 2px 6px;
  background-color: #DCDCDC;
  color: white;
  font-size: 14px;
  font-weight: bold;
}
.changeWeek.show {
  background-color: #349874;
}

/*衝堂的樣式*/
.clashClass.show {
  border-radius: 20px;
  padding: 2px 6px;
  background-color: white;
  color: #E95464;
  font-size: 14px;
  font-weight: bold;
}

/*排課系統專用*/
.TimeTableFail {
  overflow-x: auto;
}

/*.timeTableItem .show {
    color: white !important;
    background-color: #436EA7;
}*/
#tableReorderLeft, #tableReorderRight {
  display: none;
}

/*雙課表調課模式*/
.doubleTableTableContentL { /*雙課表左方區塊*/
  background-color: white;
  border-top: 10px solid #4BB1F5;
  padding: 0 10px 10px 10px;
}

.doubleTableTableContentR { /*雙課表右方區塊*/
  background-color: white;
  border-top: 10px solid #4D53A2;
  padding: 0 10px 10px 10px;
}

.doubleTableTableContent { /*課表區域*/
  overflow: auto;
}

.modifyTable { /*進入調課模式的Grid分割*/
  background-color: #EEEEF2;
}

#modifyLeftTable {
  overflow-x: auto;
}

.modifyTableRightTop {
  overflow-x: auto;
}

.modifyTableTeacherTable {
  min-height: 300px;
  overflow-x: auto;
}

.modifyTableRightBtm {
  overflow-x: auto;
}

.modifyTableClassTable {
  min-height: 300px;
  overflow-x: auto;
}

/*針對線上課表查詢的調整*/
.timeTableItemMedium .disableTimeTableItem.classtableDisable {
  min-height: 56px;
}
.timeTableItemMedium .holidayTimeTableItem.classtableDisable {
  min-height: 56px;
}

/*針對節次、時間的調整*/
.sectionTime {
  background-color: #4BB1F5;
  border-radius: 8px;
  font-size: 14px;
  color: white;
  border: 2px solid white;
}

.sectionName {
  background-color: #4D53A2;
  border-radius: 8px;
  font-size: 14px;
  color: white;
  letter-spacing: 2px;
  border: 2px solid white;
}

.lunchSection {
  background-color: #f5f5f5;
  border-radius: 8px;
  border: 2px solid white;
}

/*針對螢幕大小調整課表的縮放*/
.transformScale {
  transform: scale(0.9, 0.9);
  transform-origin: 0% 0%;
  width: 110%;
}
.transformScale .timeTableItemMedium .timeTableItem {
  height: 84px;
}

/*手機版畫面的畫面調整*/
.classtableRWD {
  width: 49%;
}

@media (max-width: 768px) {
  .classtableRWD {
    width: 100%;
  }
  .transformScale {
    transform: scale(1);
    transform-origin: 0% 0%;
    width: 100%;
  }
}
@media (min-width: 769px) and (max-width: 1181px) {
  .transformScale {
    transform: scale(0.56, 0.68);
    transform-origin: 0% 0%;
    width: 180%;
  }
}
@media (min-width: 1182px) and (max-width: 1367px) {
  .transformScale {
    transform: scale(0.66, 0.8);
    transform-origin: 0% 0%;
    width: 156%;
  }
}