@charset "UTF-8";
* {
  padding: 0;
  margin: 0;
}

a {
  font-style: normal;
}

li {
  list-style: none;
}

.导航栏 {
  position: sticky;
  top: 0px;
  width: 100%;
  height: 15vw;
  background-color: #fcfdfe;
  border-bottom: gray 1px solid;
  line-height: 15vw;
  z-index: 2;
}

.导航栏 .图标 {
  display: inline-block;
  margin-left: 2.5vw;
  background-color: #e2e8f0;
  width: 10vw;
  height: 10vw;
  font-size: 4vw;
  border-radius: 1vw;
  line-height: 10vw;
  text-align: center;
}

.导航栏 .图标:hover {
  background-color: rgba(66, 153, 225, 0.6);
}

.导航栏 .题头 {
  display: inline-block;
  margin-left: 2vw;
  font-size: 5vw;
  font-weight: 600;
}

.轮播图 {
  width: 100%;
  height: 50vw;
  margin-top: 1vw;
}

.轮播图 .swiper {
  width: 100%;
  height: 100%;
}

.轮播图 .swiper .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.轮播图 .swiper .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.数据可视化 {
  width: 100%;
  height: 45vw;
  margin-top: 2vw;
}

.数据可视化 .左 {
  float: left;
  width: 60%;
  height: 45vw;
}

.数据可视化 .右 {
  float: right;
  width: 40%;
  height: 45vw;
}

.数据可视化 .右 .todolist li {
  margin-left: 5vw;
}

.数据可视化 .右 .todolist li div {
  display: inline-block;
}

.数据可视化 .右 .todolist li .circle1,
.数据可视化 .右 .todolist li .circle2,
.数据可视化 .右 .todolist li .circle3 {
  width: 3vw;
  height: 3vw;
  border-radius: 1.5vw;
}

.数据可视化 .右 .todolist li .text1,
.数据可视化 .右 .todolist li .text2,
.数据可视化 .右 .todolist li .text3 {
  margin-left: 2vw;
}

.数据可视化 .右 .todolist .toDo {
  margin-top: 15vw;
}

.数据可视化 .右 .todolist .toDo .circle1 {
  background-color: #dd6b20;
}

.数据可视化 .右 .todolist .near .circle2 {
  background-color: #3182ce;
}

.数据可视化 .右 .todolist .OK {
  margin-bottom: 15vw;
}

.数据可视化 .右 .todolist .OK .circle3 {
  background-color: #38a169;
}

.侧边栏 {
  display: none;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
}

.侧边栏 .任务栏 {
  left: -70%;
  top: 0;
  position: absolute;
  width: 70%;
  height: 100%;
  background-color: white;
  z-index: 3;
}

.侧边栏 .任务栏 .任务栏标题捏 {
  width: 100%;
  height: 30vw;
  padding-left: 10vw;
  line-height: 30vw;
  font-size: 6vw;
  font-weight: 700;
  border-bottom: solid black 1px;
}

.侧边栏 .任务栏 .任务 {
  padding-top: 5vw;
  padding-left: 10vw;
}

.侧边栏 .任务栏 .任务 li {
  display: inline-block;
  width: 100%;
  height: 10vw;
  line-height: 10vw;
}

.侧边栏 .任务栏 .任务 li div {
  display: inline-block;
}

.侧边栏 .任务栏 .任务 li .图标一,
.侧边栏 .任务栏 .任务 li .图标二,
.侧边栏 .任务栏 .任务 li .图标三,
.侧边栏 .任务栏 .任务 li .图标四 {
  width: 6vw;
  height: 6vw;
  font-size: 4vw;
}

.侧边栏 .任务栏 .任务 li .图标一 {
  color: #38a169;
}

.侧边栏 .任务栏 .任务 li .图标二 {
  color: #ed64a6;
}

.侧边栏 .任务栏 .任务 li .图标三 {
  color: #00b5d8;
}

.侧边栏 .任务栏 .任务 .关于 .拉 {
  margin-left: 30vw;
}

.侧边栏 .任务栏 .任务 .关于 .拉 .上拉 {
  display: none;
}

.侧边栏 .任务栏 .任务 .关于 .关于下拉的 {
  display: none;
  height: 10vw;
}

.侧边栏 .任务栏 .任务 .关于 .关于下拉的 img {
  width: 5vw;
  height: 5vw;
}

.侧边栏 .任务栏 .任务 .关于 .关于下拉的 a {
  display: inline-block;
  margin-left: 2vw;
  color: black;
}

.侧边栏 .空白 {
  left: 0;
  top: 0;
  position: absolute;
  display: inline-block;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 2;
}

.登陆状态框 {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 4;
}

.登陆状态框 .登陆成功,
.登陆状态框 .登陆失败 {
  display: none;
  position: absolute;
  width: 70vw;
  height: 40vw;
  background-color: white;
  border-radius: 5px;
  left: 50%;
  margin-left: -35vw;
  top: 30%;
  margin-top: -15vw;
}

.登陆状态框 .登陆成功 .对号,
.登陆状态框 .登陆成功 .错号,
.登陆状态框 .登陆失败 .对号,
.登陆状态框 .登陆失败 .错号 {
  width: 100%;
  height: 18vw;
  text-align: center;
  line-height: 18vw;
  font-size: 10vw;
}

.登陆状态框 .登陆成功 .对号,
.登陆状态框 .登陆失败 .对号 {
  color: green;
}

.登陆状态框 .登陆成功 .错号,
.登陆状态框 .登陆失败 .错号 {
  color: red;
}

.登陆状态框 .登陆成功 .成功提示字,
.登陆状态框 .登陆成功 .失败提示字,
.登陆状态框 .登陆失败 .成功提示字,
.登陆状态框 .登陆失败 .失败提示字 {
  width: 100%;
  height: 12vw;
  text-align: center;
  line-height: 12vw;
  font-size: 6vw;
}

.登陆状态框 .登陆成功 .对号按钮,
.登陆状态框 .登陆成功 .错号按钮,
.登陆状态框 .登陆失败 .对号按钮,
.登陆状态框 .登陆失败 .错号按钮 {
  width: 100%;
  height: 10vw;
}

.登陆状态框 .登陆成功 .对号按钮 .对号确认,
.登陆状态框 .登陆成功 .对号按钮 .错号确认,
.登陆状态框 .登陆成功 .错号按钮 .对号确认,
.登陆状态框 .登陆成功 .错号按钮 .错号确认,
.登陆状态框 .登陆失败 .对号按钮 .对号确认,
.登陆状态框 .登陆失败 .对号按钮 .错号确认,
.登陆状态框 .登陆失败 .错号按钮 .对号确认,
.登陆状态框 .登陆失败 .错号按钮 .错号确认 {
  width: 10vw;
  height: 6vw;
  border-radius: 1vw;
  margin-left: 30vw;
  margin-top: 2vw;
  text-align: center;
  line-height: 6vw;
  background-color: gray;
}

.课程列表框 {
  width: 100vw;
}

.课程列表框 .待做课程列表捏,
.课程列表框 .未来课程列表捏,
.课程列表框 .完成课程列表捏 {
  display: none;
  width: 96vw;
  margin: 0vw 2vw;
}

.课程列表框 .近期待做捏,
.课程列表框 .未来待做捏,
.课程列表框 .完成的捏 {
  display: none;
  width: 96vw;
  height: 10vw;
  line-height: 10vw;
  padding-left: 2vw;
}

.课程列表框 .课程捏 {
  overflow: hidden;
  width: 96vw;
  height: 10vw;
  border: black solid 1px;
  background-color: #f5f5f5;
  margin-bottom: 1vw;
  border-radius: 2vw;
  font-size: 3vw;
}

.课程列表框 .课程捏 .显示行 div {
  word-wrap: break-word;
  text-align: center;
  float: left;
  width: 31.5vw;
  height: 10vw;
  border-right: black solid 1px;
  border-bottom: black solid 1px;
}

.课程列表框 .课程捏 .显示行 .课程名 {
  overflow: scroll;
}

.课程列表框 .课程捏 .显示行 .日期,
.课程列表框 .课程捏 .显示行 .时间 {
  line-height: 10vw;
}

.课程列表框 .课程捏 .显示行 .时间 {
  border-right: 0;
}

.课程列表框 .课程捏 .隐藏行 div {
  word-wrap: break-word;
  overflow: scroll;
  text-align: center;
  float: left;
  width: 31.5vw;
  height: 10vw;
  line-height: 10vw;
  border-right: black solid 1px;
}

.课程列表框 .课程捏 .隐藏行 .教师 {
  border: 0;
}