body {
  background-color: #f4f5fA;
}

.allCourse {
  margin-top: 30px;
}

.allCourse .commonDiv {
  background-color: #fff;
  border-radius: 3px;
}

.allCourse .site1 {
  border-bottom: 1px solid #edebf0;
  padding: 30px;
}

.allCourse .site1 .site11 {
  font-size: 20px;
  color: #323f22;
}

.allCourse .site1 .site12 {
  margin-top: 40px;
  display: flex;
  align-items: center;
}

.allCourse .site1 .site12 .label {
  font-size: 14px;
  color: #646566;
}

.allCourse .site1 .site12 .list {
  margin-left: 15px;
  display: flex;
  align-items: center;
}

.allCourse .site1 .site12 .list .item {
  margin-right: 15px;
  font-size: 14px;
  color: #323f22;
  padding: 3px;
  border-radius: 3px;
  cursor: pointer;
}

.allCourse .site1 .site12 .list .active {
  background-color: #355df1;
  color: #fff;
}

.allCourse .site2 {
  padding: 30px 30px 0;
}

.allCourse .site2 .list {
  display: flex;
  flex-wrap: wrap;
}

.allCourse .site2 .item {
  width: 264px;
  margin-right: 28px;
  margin-bottom: 28px;
  cursor: pointer;
}

.allCourse .site2 .item .site21 img {
  width: 100%;
  height: 152px;
}

.allCourse .site2 .item .site22 {
  margin-top: 15px;
}

.allCourse .site2 .item .site22 .site221 {
  font-size: 16px;
  color: #323f62;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.allCourse .site2 .item .site22 .site222 {
  margin-top: 15px;
  font-size: 12px;
  color: #7d7e80;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.allCourse .site2 .item:nth-of-type(4n) {
  margin-right: 0;
}

#footer {
  margin-top: 30px;
}
