header .header-tab {
  width: 100vw;
  height: 12vw;
  text-align: center;
  display: flex;
  position: relative;
}
header .header-tab .left,
header .header-tab .right {
  width: 16vw;
  height: 12vw;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
header .header-tab .left img,
header .header-tab .right img {
  width: 7vw;
  height: 7vw;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
header .header-tab .center {
  width: 68vw;
  height: 12vw;
  text-align: center;
}
header .header-tab .center .top {
  font-size: 4.5vw;
  font-weight: 700;
}
header .header-tab .center .bottom {
  font-size: 3.5vw;
  font-weight: 500;
}
header .date-tab {
  width: 100vw;
  height: 12vw;
  text-align: center;
  display: flex;
  justify-content: center;
  position: relative;
  border: 0.1vw solid #e6e6e6;
}
header .date-tab .tab-item {
  width: calc(100vw / 8);
  height: 12vw;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  border-right: 0.1vw solid #e6e6e6;
  border-bottom: 0.1vw solid #e6e6e6;
  background-color: #f0f0f0;
}
header .date-tab .tab-item .top {
  font-size: 3.5vw;
  font-weight: 700;
}
header .date-tab .tab-item .bottom {
  font-size: 3vw;
}
.scroll-wrapper {
  position: absolute;
  /* 如果是通过top和bottom设置高度，此处一定要是绝对定位，否则内容没法滚动 */
  /* 同时设置top和bottom相当于给当前元素设置了一个高度，而且这个高度时随着不同屏幕尺寸自适应的 */
  /* 如果不给当前元素（即scroll组件）设置高度，是没法滚动的 */
  /* 设置高度方式1：*/
  top: 24vw;
  /* 设置滚动内容的头部距离页面顶部的距离（因为页面头部有导航栏，会遮住顶部内容）*/
  bottom: 0;
  /* 滚动内容的尾部距离页面底部的距离（因为页面底部有菜单栏，会遮住底部内容） */
  left: 0;
  right: 0;
  /* 设置了高度后，一定要设置overflow为scroll或者auto，否则页面滚动会有问题 */
  overflow: scroll;
}
.scroll-wrapper .scroll-content {
  position: relative;
}
.scroll-wrapper .scroll-content table {
  width: 100vw;
  margin: 0 auto;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.scroll-wrapper .scroll-content table tr td {
  width: calc(100vw / 8);
  table-layout: fixed;
  word-wrap: break-wrod;
  word-break: break-all;
  border: 0.1vw solid #e6e6e6;
  background-color: #f0f0f0;
}
.scroll-wrapper .scroll-content table tr .course-hour {
  text-align: center;
}
.scroll-wrapper .scroll-content table tr .course-hour .number {
  font-size: 3.5vw;
  font-weight: 700;
}
.scroll-wrapper .scroll-content table tr .course-hour .time {
  font-size: 3vw;
}
.scroll-wrapper .scroll-content table tr .course-content {
  font-size: 3.5vw;
  color: #fff;
  padding: 1vw;
  text-align: center;
}
.scroll-wrapper .scroll-content table tr .has-course {
  border-radius: 1.2vw;
}
.scroll-wrapper .scroll-content footer {
  position: relative;
  width: 100vw;
  height: 20vw;
}
.scroll-wrapper .bottom-tabbar {
  position: fixed;
  bottom: 0;
  z-index: 9999999;
  width: 100vw;
  height: 14vw;
  background-color: #fff;
  box-shadow: 0 -0.1vw 0.9vw rgba(0, 0, 0, 0.2);
}
.scroll-wrapper .bottom-tabbar .tabbar-item-list {
  position: relative;
  width: 95%;
  height: 95%;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: space-around;
}
.scroll-wrapper .bottom-tabbar .tabbar-item-list .tabbar-item {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 19vw;
  height: 14vw;
  padding-top: 1.2vw;
  background-color: transparent;
  color: #444;
}
.scroll-wrapper .bottom-tabbar .tabbar-item-list .tabbar-item .item-ico {
  width: 6vw;
  height: 6vw;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.scroll-wrapper .bottom-tabbar .tabbar-item-list .tabbar-item .item-name-text {
  width: 19vw;
  height: 8vw;
  line-height: 8vw;
  font-size: 3vw;
  text-align: center;
  white-space: nowrap;
  /*强制文本一行显示*/
  overflow: hidden;
  /*超出元素默认宽度内容隐藏*/
  text-overflow: ellipsis;
  /*使用省略号代表有内容未显示*/
}
.scroll-wrapper .toast {
  position: fixed;
  top: 80vw;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 2vw;
  text-align: center;
  color: #fff;
  padding: 5vw;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 9999999;
}