* {
  margin: 0;
  padding: 0;
}

html {
  font-size: 100px;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

fieldset, img {
  border: 0;
  display: block;
}

ol, ul, dl {
  list-style: none;
}

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
}

em, s, i {
  font-style: normal;
}

textarea {
  resize: none;
}

a {
  text-decoration: none;
  display: inline-block;
}

a:hover {
  text-decoration: none;
}

img {
  width: 100%;
  max-width: 100%;
  height: auto;
}

.video embed, .video object, .video iframe {
  width: 100%;
  height: auto;
}

a, button {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

input {
  outline: 0 none;
}

body {
  background: url("../images/bg_dot.png") repeat #F7F8FA 0 0;
}

.topfix {
  display: none;
  position: fixed;
  z-index: 11;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  margin-left: -0.02rem;
  height: 0.72rem;
  width: 6.9rem;
  color: #FFF;
  font-size: 0.3rem;
  font-weight: 600;
}
.topfix .item {
  float: left;
  width: 0.78rem;
  height: 0.72rem;
  line-height: 0.72rem;
  text-align: center;
}
.topfix .item.item-blue, .topfix .item.item-green, .topfix .item.item-yellow {
  width: 2.04rem;
}
.topfix .item.item-blue {
  background: url("../images/header_blue_s.png") no-repeat;
  background-size: contain;
}
.topfix .item.item-green {
  background: url("../images/header_green_s.png") no-repeat;
  background-size: contain;
}
.topfix .item.item-yellow {
  background: url("../images/header_yellow_s.png") no-repeat;
  background-size: contain;
}

.top-title {
  padding: 0.3rem 0.3rem 0;
  height: 0.72rem;
  color: #FFF;
  font-size: 0.3rem;
  font-weight: 600;
  overflow: hidden;
}
.top-title .item {
  float: left;
  width: 0.78rem;
  height: 0.72rem;
  line-height: 0.65rem;
  text-align: center;
}
.top-title .item.item1, .top-title .item.item2, .top-title .item.item3 {
  width: 2.04rem;
}
.top-title .item.item1 {
  background: url("../images/header_blue_s.png") no-repeat;
  background-size: contain;
}
.top-title .item.item2 {
  background: url("../images/header_green_s.png") no-repeat;
  background-size: contain;
}
.top-title .item.item3 {
  background: url("../images/header_yellow_s.png") no-repeat;
  background-size: contain;
}

.mod-course {
  margin: 0 auto 0.5rem;
  width: 6.9rem;
}
.mod-course li {
  border-bottom: 1px solid #EDF0F4;
  overflow: hidden;
}
.mod-course li .item {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  float: left;
  color: #171823;
  font-size: 0.22rem;
  text-align: center;
  border-right: 1px solid #E2E7EC;
}
.mod-course li .item.item1 {
  display: table;
  width: 0.78rem;
  height: 100%;
  background: #518BFB;
  color: #FFF;
}
.mod-course li .item.item2, .mod-course li .item.item3, .mod-course li .item.item3, .mod-course li .item.item4 {
  display: table;
  width: 2.04rem;
  height: 100%;
}
.mod-course li.line1 .item1 {
  border-radius: 0.12rem 0 0 0;
}
.mod-course li.line1 .item2,
.mod-course li.line1 .item3,
.mod-course li.line1 .item4 {
  width: 2.04rem;
  height: 100%;
}
.mod-course li.line1 .item2 .btn,
.mod-course li.line1 .item3 .btn,
.mod-course li.line1 .item4 .btn {
  margin-bottom: 0.2rem;
  width: 1.65rem;
  height: 0.6rem;
  line-height: 0.6rem;
  border: 1px solid #4CB8F4;
  color: #4CB8F4;
  font-size: 0.24rem;
  text-align: center;
  border-radius: 0.3rem;
}
.mod-course li.line1 .item2 .btn1,
.mod-course li.line1 .item3 .btn1,
.mod-course li.line1 .item4 .btn1 {
  margin-top: 0.5rem;
}
.mod-course li.line1 .item2 .btn2,
.mod-course li.line1 .item3 .btn2,
.mod-course li.line1 .item4 .btn2 {
  background: #649CF0;
  border-color: #649CF0;
  color: #FFF;
}
.mod-course li.line1 .item2 .btn3,
.mod-course li.line1 .item3 .btn3,
.mod-course li.line1 .item4 .btn3 {
  border-color: #649CF0;
  color: #649CF0;
}
.mod-course li.line1 .price {
  margin: 0.2rem 0 0.2rem;
}
.mod-course li.line1 .price span {
  display: block;
}
.mod-course li.line1 .price .t2 {
  color: #F3684F;
}
.mod-course li.line1 .price .t2 b {
  font-size: 0.36rem;
}
.mod-course li.line2 .item1,
.mod-course li.line2 .item2,
.mod-course li.line2 .item3,
.mod-course li.line2 .item4, .mod-course li.line3 .item1,
.mod-course li.line3 .item2,
.mod-course li.line3 .item3,
.mod-course li.line3 .item4, .mod-course li.line4 .item1,
.mod-course li.line4 .item2,
.mod-course li.line4 .item3,
.mod-course li.line4 .item4, .mod-course li.line5 .item1,
.mod-course li.line5 .item2,
.mod-course li.line5 .item3,
.mod-course li.line5 .item4, .mod-course li.line6 .item1,
.mod-course li.line6 .item2,
.mod-course li.line6 .item3,
.mod-course li.line6 .item4, .mod-course li.line7 .item1,
.mod-course li.line7 .item2,
.mod-course li.line7 .item3,
.mod-course li.line7 .item4, .mod-course li.line8 .item1,
.mod-course li.line8 .item2,
.mod-course li.line8 .item3,
.mod-course li.line8 .item4 {
  padding: 0.3rem 0.1rem;
}
.mod-course li.line2 .item1, .mod-course li.line3 .item1, .mod-course li.line4 .item1, .mod-course li.line5 .item1, .mod-course li.line6 .item1, .mod-course li.line7 .item1, .mod-course li.line8 .item1 {
  padding: 0.3rem 0.2rem;
}
.mod-course li.line2 .item1 b, .mod-course li.line3 .item1 b, .mod-course li.line4 .item1 b, .mod-course li.line5 .item1 b, .mod-course li.line6 .item1 b, .mod-course li.line7 .item1 b, .mod-course li.line8 .item1 b {
  display: table-cell;
  font-weight: 600;
  font-size: 0.28rem;
  vertical-align: middle;
}
.mod-course li.line2 .item2,
.mod-course li.line2 .item3,
.mod-course li.line2 .item4, .mod-course li.line3 .item2,
.mod-course li.line3 .item3,
.mod-course li.line3 .item4, .mod-course li.line4 .item2,
.mod-course li.line4 .item3,
.mod-course li.line4 .item4, .mod-course li.line5 .item2,
.mod-course li.line5 .item3,
.mod-course li.line5 .item4, .mod-course li.line6 .item2,
.mod-course li.line6 .item3,
.mod-course li.line6 .item4, .mod-course li.line7 .item2,
.mod-course li.line7 .item3,
.mod-course li.line7 .item4, .mod-course li.line8 .item2,
.mod-course li.line8 .item3,
.mod-course li.line8 .item4 {
  display: table;
}
.mod-course li.line2 .item2 .table-cell,
.mod-course li.line2 .item3 .table-cell,
.mod-course li.line2 .item4 .table-cell, .mod-course li.line3 .item2 .table-cell,
.mod-course li.line3 .item3 .table-cell,
.mod-course li.line3 .item4 .table-cell, .mod-course li.line4 .item2 .table-cell,
.mod-course li.line4 .item3 .table-cell,
.mod-course li.line4 .item4 .table-cell, .mod-course li.line5 .item2 .table-cell,
.mod-course li.line5 .item3 .table-cell,
.mod-course li.line5 .item4 .table-cell, .mod-course li.line6 .item2 .table-cell,
.mod-course li.line6 .item3 .table-cell,
.mod-course li.line6 .item4 .table-cell, .mod-course li.line7 .item2 .table-cell,
.mod-course li.line7 .item3 .table-cell,
.mod-course li.line7 .item4 .table-cell, .mod-course li.line8 .item2 .table-cell,
.mod-course li.line8 .item3 .table-cell,
.mod-course li.line8 .item4 .table-cell {
  display: table-cell;
  vertical-align: middle;
}
.mod-course li.line2 .item2 p,
.mod-course li.line2 .item3 p,
.mod-course li.line2 .item4 p, .mod-course li.line3 .item2 p,
.mod-course li.line3 .item3 p,
.mod-course li.line3 .item4 p, .mod-course li.line4 .item2 p,
.mod-course li.line4 .item3 p,
.mod-course li.line4 .item4 p, .mod-course li.line5 .item2 p,
.mod-course li.line5 .item3 p,
.mod-course li.line5 .item4 p, .mod-course li.line6 .item2 p,
.mod-course li.line6 .item3 p,
.mod-course li.line6 .item4 p, .mod-course li.line7 .item2 p,
.mod-course li.line7 .item3 p,
.mod-course li.line7 .item4 p, .mod-course li.line8 .item2 p,
.mod-course li.line8 .item3 p,
.mod-course li.line8 .item4 p {
  display: inline-block;
  margin-bottom: 0.05rem;
  width: 100%;
  color: #171921;
  vertical-align: middle;
}
.mod-course li.line2 .item2 .title,
.mod-course li.line2 .item3 .title,
.mod-course li.line2 .item4 .title, .mod-course li.line3 .item2 .title,
.mod-course li.line3 .item3 .title,
.mod-course li.line3 .item4 .title, .mod-course li.line4 .item2 .title,
.mod-course li.line4 .item3 .title,
.mod-course li.line4 .item4 .title, .mod-course li.line5 .item2 .title,
.mod-course li.line5 .item3 .title,
.mod-course li.line5 .item4 .title, .mod-course li.line6 .item2 .title,
.mod-course li.line6 .item3 .title,
.mod-course li.line6 .item4 .title, .mod-course li.line7 .item2 .title,
.mod-course li.line7 .item3 .title,
.mod-course li.line7 .item4 .title, .mod-course li.line8 .item2 .title,
.mod-course li.line8 .item3 .title,
.mod-course li.line8 .item4 .title {
  margin-bottom: 0.12rem;
  line-height: 0.36rem;
}
.mod-course li.line2 .item2 .title span,
.mod-course li.line2 .item2 .title b,
.mod-course li.line2 .item3 .title span,
.mod-course li.line2 .item3 .title b,
.mod-course li.line2 .item4 .title span,
.mod-course li.line2 .item4 .title b, .mod-course li.line3 .item2 .title span,
.mod-course li.line3 .item2 .title b,
.mod-course li.line3 .item3 .title span,
.mod-course li.line3 .item3 .title b,
.mod-course li.line3 .item4 .title span,
.mod-course li.line3 .item4 .title b, .mod-course li.line4 .item2 .title span,
.mod-course li.line4 .item2 .title b,
.mod-course li.line4 .item3 .title span,
.mod-course li.line4 .item3 .title b,
.mod-course li.line4 .item4 .title span,
.mod-course li.line4 .item4 .title b, .mod-course li.line5 .item2 .title span,
.mod-course li.line5 .item2 .title b,
.mod-course li.line5 .item3 .title span,
.mod-course li.line5 .item3 .title b,
.mod-course li.line5 .item4 .title span,
.mod-course li.line5 .item4 .title b, .mod-course li.line6 .item2 .title span,
.mod-course li.line6 .item2 .title b,
.mod-course li.line6 .item3 .title span,
.mod-course li.line6 .item3 .title b,
.mod-course li.line6 .item4 .title span,
.mod-course li.line6 .item4 .title b, .mod-course li.line7 .item2 .title span,
.mod-course li.line7 .item2 .title b,
.mod-course li.line7 .item3 .title span,
.mod-course li.line7 .item3 .title b,
.mod-course li.line7 .item4 .title span,
.mod-course li.line7 .item4 .title b, .mod-course li.line8 .item2 .title span,
.mod-course li.line8 .item2 .title b,
.mod-course li.line8 .item3 .title span,
.mod-course li.line8 .item3 .title b,
.mod-course li.line8 .item4 .title span,
.mod-course li.line8 .item4 .title b {
  display: inline-block;
  font-weight: 400;
  vertical-align: middle;
}
.mod-course li.line2 .item2 .title span,
.mod-course li.line2 .item3 .title span,
.mod-course li.line2 .item4 .title span, .mod-course li.line3 .item2 .title span,
.mod-course li.line3 .item3 .title span,
.mod-course li.line3 .item4 .title span, .mod-course li.line4 .item2 .title span,
.mod-course li.line4 .item3 .title span,
.mod-course li.line4 .item4 .title span, .mod-course li.line5 .item2 .title span,
.mod-course li.line5 .item3 .title span,
.mod-course li.line5 .item4 .title span, .mod-course li.line6 .item2 .title span,
.mod-course li.line6 .item3 .title span,
.mod-course li.line6 .item4 .title span, .mod-course li.line7 .item2 .title span,
.mod-course li.line7 .item3 .title span,
.mod-course li.line7 .item4 .title span, .mod-course li.line8 .item2 .title span,
.mod-course li.line8 .item3 .title span,
.mod-course li.line8 .item4 .title span {
  margin-right: 0.05rem;
  width: 0.36rem;
  height: 0.38rem;
  line-height: 0.36rem;
  background: -webkit-gradient(linear, right top, left top, from(#FF8988), to(#FE5755));
  background: linear-gradient(270deg, #FF8988 0%, #FE5755 100%);
  border-radius: 0.08rem;
  color: #FFF;
  font-size: 0.22rem;
  text-align: center;
}
.mod-course li.line2 .item2 .title1,
.mod-course li.line2 .item3 .title1,
.mod-course li.line2 .item4 .title1, .mod-course li.line3 .item2 .title1,
.mod-course li.line3 .item3 .title1,
.mod-course li.line3 .item4 .title1, .mod-course li.line4 .item2 .title1,
.mod-course li.line4 .item3 .title1,
.mod-course li.line4 .item4 .title1, .mod-course li.line5 .item2 .title1,
.mod-course li.line5 .item3 .title1,
.mod-course li.line5 .item4 .title1, .mod-course li.line6 .item2 .title1,
.mod-course li.line6 .item3 .title1,
.mod-course li.line6 .item4 .title1, .mod-course li.line7 .item2 .title1,
.mod-course li.line7 .item3 .title1,
.mod-course li.line7 .item4 .title1, .mod-course li.line8 .item2 .title1,
.mod-course li.line8 .item3 .title1,
.mod-course li.line8 .item4 .title1 {
  margin-bottom: 0.2rem;
  width: 1.76rem;
  height: 0.47rem;
  line-height: 0.47rem;
  background: -webkit-gradient(linear, right top, left top, from(#FFFFFF), to(#DFEAFF));
  background: linear-gradient(270deg, #FFFFFF 0%, #DFEAFF 100%);
  color: #171822;
  font-size: 0.24rem;
}
.mod-course li.line2 .item2 .num,
.mod-course li.line2 .item3 .num,
.mod-course li.line2 .item4 .num, .mod-course li.line3 .item2 .num,
.mod-course li.line3 .item3 .num,
.mod-course li.line3 .item4 .num, .mod-course li.line4 .item2 .num,
.mod-course li.line4 .item3 .num,
.mod-course li.line4 .item4 .num, .mod-course li.line5 .item2 .num,
.mod-course li.line5 .item3 .num,
.mod-course li.line5 .item4 .num, .mod-course li.line6 .item2 .num,
.mod-course li.line6 .item3 .num,
.mod-course li.line6 .item4 .num, .mod-course li.line7 .item2 .num,
.mod-course li.line7 .item3 .num,
.mod-course li.line7 .item4 .num, .mod-course li.line8 .item2 .num,
.mod-course li.line8 .item3 .num,
.mod-course li.line8 .item4 .num {
  position: relative;
  margin-bottom: 0.18rem;
  padding-left: 0.5rem;
  width: 1.2rem;
  text-align: left;
}
.mod-course li.line2 .item2 .num span,
.mod-course li.line2 .item3 .num span,
.mod-course li.line2 .item4 .num span, .mod-course li.line3 .item2 .num span,
.mod-course li.line3 .item3 .num span,
.mod-course li.line3 .item4 .num span, .mod-course li.line4 .item2 .num span,
.mod-course li.line4 .item3 .num span,
.mod-course li.line4 .item4 .num span, .mod-course li.line5 .item2 .num span,
.mod-course li.line5 .item3 .num span,
.mod-course li.line5 .item4 .num span, .mod-course li.line6 .item2 .num span,
.mod-course li.line6 .item3 .num span,
.mod-course li.line6 .item4 .num span, .mod-course li.line7 .item2 .num span,
.mod-course li.line7 .item3 .num span,
.mod-course li.line7 .item4 .num span, .mod-course li.line8 .item2 .num span,
.mod-course li.line8 .item3 .num span,
.mod-course li.line8 .item4 .num span {
  position: absolute;
  top: -0.04rem;
  left: 0;
  width: 0.36rem;
  height: 0.38rem;
  line-height: 0.36rem;
  background: #E6E6E6;
  border-radius: 0.04rem;
  color: #9597A6;
  text-align: center;
  vertical-align: middle;
}
.mod-course li.line2 .item2 .orange,
.mod-course li.line2 .item3 .orange,
.mod-course li.line2 .item4 .orange, .mod-course li.line3 .item2 .orange,
.mod-course li.line3 .item3 .orange,
.mod-course li.line3 .item4 .orange, .mod-course li.line4 .item2 .orange,
.mod-course li.line4 .item3 .orange,
.mod-course li.line4 .item4 .orange, .mod-course li.line5 .item2 .orange,
.mod-course li.line5 .item3 .orange,
.mod-course li.line5 .item4 .orange, .mod-course li.line6 .item2 .orange,
.mod-course li.line6 .item3 .orange,
.mod-course li.line6 .item4 .orange, .mod-course li.line7 .item2 .orange,
.mod-course li.line7 .item3 .orange,
.mod-course li.line7 .item4 .orange, .mod-course li.line8 .item2 .orange,
.mod-course li.line8 .item3 .orange,
.mod-course li.line8 .item4 .orange {
  color: #F26155;
}
.mod-course li.line5 .item2,
.mod-course li.line5 .item3,
.mod-course li.line5 .item4, .mod-course li.line6 .item2,
.mod-course li.line6 .item3,
.mod-course li.line6 .item4 {
  padding: 0.3rem 0.15rem;
  text-align: left;
}