/*! normalize.css v3.0.0 | Base | MIT License | git.io/normalize */
html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  margin: 0;
}

/*! normalize.css v3.0.0 | Links | MIT License | git.io/normalize */
a {
  background: transparent;
}

a:active,
a:hover {
  outline: 0;
}

/*! normalize.css v3.0.0 | HTML5 Display Definitions | MIT License | git.io/normalize */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden],
template {
  display: none;
}

body {
  background-color: #ffffff;
  color: #333333;
  font-family: 'Microsoft YaHei';
}

*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.container {
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  *zoom: 1;
}
.container:after {
  content: " ";
  display: block;
  clear: both;
}
@media (max-width: 1080px) {
  .container {
    max-width: 100%;
  }
}

body:after {
  content: " ";
  display: block;
  clear: both;
}
body p,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6 {
  margin: 0px;
  line-height: 1;
}

ul,
li {
  margin: 0px;
  padding: 0px;
  list-style: none;
}

a {
  text-decoration: none;
}

img {
  max-width: 100%;
  display: block;
}

input,
textarea,
button,
select {
  border: none;
  resize: none;
}
input:focus,
textarea:focus,
button:focus,
select:focus {
  outline: none;
}

textarea {
  width: 100%;
}

input, select {
  width: 100%;
  background-color: transparent;
}
input::-webkit-input-placeholder, select::-webkit-input-placeholder {
  font-size: 2.4rem;
  color: #e8e8e8;
}

i,
span {
  display: inline-block;
  vertical-align: middle;
}

table {
  border-spacing: 0px;
  width: 100%;
}

select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  padding-right: 15px;
}

.icon-new:hover, .icon-delete-big:hover {
  cursor: pointer;
}

select::-ms-expand {
  display: none;
}

@font-face {
  font-family: NotoSansCJKsc-Black;
  src: url("font/NotoSansCJKsc-Black.otf");
}
@font-face {
  font-family: NotoSansCJKsc-Bold;
  src: url("font/NotoSansCJKsc-Bold.otf");
}
@font-face {
  font-family: NotoSansCJKsc-Light;
  src: url("font/NotoSansCJKsc-Light.otf");
}
@font-face {
  font-family: NotoSansCJKsc-Medium;
  src: url("font/NotoSansCJKsc-Medium.otf");
}
@font-face {
  font-family: NotoSansCJKsc-Thin;
  src: url("font/NotoSansCJKsc-Thin.otf");
}
.alldone {
  height: 1.2rem;
  margin-bottom: .7rem;
}
.alldone p {
  line-height: 0.52rem;
  text-align: center;
  font-size: 0.2rem;
  color: #8e95a4;
  padding-top: 0.3rem;
}

#loading {
  width: 100%;
  height: 100%;
  position: fixed;
  left: 0px;
  top: 0px;
  z-index: 9999;
  background-color: rgba(255, 255, 255, 0.5);
}
#loading img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.hidden {
  display: none;
}

.dark {
  color: #333333;
}
.dark::-webkit-input-placeholder{
  font-size: .3rem;
}
.dark::-moz-input-placeholder{
  font-size: .3rem;
}.dark::-ms-input-placeholder{
  font-size: .3rem;
}
footer {
  position: fixed;
  bottom: 0px;
  left: 0px;
  width: 100%;
  z-index: 99999;
}
footer img {
  margin: 0 auto;
}


body h2 {
  font-size: 0.64rem;
  font-weight: normal;
}
body h3 {
  font-size: 0.42rem;
  margin-bottom: 0.3rem;
  font-weight: normal;
}
body h4 {
  font-size: 0.32rem;
  font-weight: normal;
}
body h5 {
  font-size: 0.4rem;
  font-weight: normal;
  color: #6e5aa1;
  line-height: 2;
}
body i {
  font-style: normal;
  font-weight: 400;
  font-size: 0.32rem !important;
}

.class-list:after {
  content: " ";
  display: block;
  clear: both;
}
.class-list0:after,.class-list1:after {
  content: " ";
  display: block;
  clear: both;
}
.class-list li{
  width: 50%;
  float: left;
  padding-left: 5%;
  padding-right: 5%;
  margin-bottom: .2rem;
}
.class-list li div:last-child,.class-list li h5{
  background-color: rgb(243,250,251);
  padding: .15rem .4rem;
  border-bottom-left-radius: 0.1rem;
  border-bottom-right-radius: 0.1rem;
}
.class-list li div:last-child{
  padding-bottom: .15rem;
}
.class-list li:nth-child(odd) {
  padding-left: 0px;
  padding-right: 0.12rem;
}
.class-list li:nth-child(even) {
  padding-right: 0px;
  padding-left: 0.12rem;
}
.class-list0 li,.class-list1 li{
  width: 50%;
  float: left;
  padding-left: 5%;
  padding-right: 5%;
}
.class-list0 li:nth-child(odd) {
  padding-left: 0px;
  padding-right: 0.12rem;
}
.class-list0 li:nth-child(even) {
  padding-right: 0px;
  padding-left: 0.12rem;
}
.class-list1 li:nth-child(odd) {
  padding-left: 0px;
  padding-right: 0.12rem;
}
.class-list1 li:nth-child(even) {
  padding-right: 0px;
  padding-left: 0.12rem;
}

.class-cell {
  min-height: 120px;
}
.class-cell a{
  background-color: rgb(243,250,251);
}
.class-cell div:after {
  content: " ";
  display: block;
  clear: both;
}
.class-cell p {
  float: left;
  font-size: 0.26rem;
  color: #333333;
}
.class-cell p span {
  vertical-align: middle;
}

.class-tag {
  background-color: #ffc832;
  font-size: 0.32rem;
  color: #ffffff;
  border-radius: 0.5rem;
  padding: 0.13rem 0.35rem;
  margin-bottom: 0.38rem;
  margin-top: 0.25rem;
  display: inline-block;
}
@media (max-width: 768px) {
  .class-tag {
    margin-bottom: 0.14rem;
    margin-top: 0.14rem;
    font-size: 0.22rem;
    padding: 0.05rem 0.35rem;
  }
}

.class-teacher {
  width: 60%;
  padding-top: 0.05rem;
}

.new-uopdate0601 {
  float: right !important;
  padding-right: 0.1rem;
}

.people-num-box {
  width: 60%;
  text-align: right;
  padding-right: 0.25rem;
}

.people-num-img img {
  width: 0.3rem;
  display: inline-block;
}

.class-cover {
  position: relative;
  background-color: rgb(243,250,251);
  padding-top: .2rem;
}
.class-cover img:first-child {
  width: 80%;
  margin: 0 auto;
}
.class-cover .new-icon {
  width: 0.5rem;
  position: absolute;
  top: 0px;
  right: 0rem;
  display: none;
}
.class-cover .new-icon.active {
  display: block;
}

.index-img-cover {
  height: 1.45rem;
  width: 80%;
  margin: 0 auto;
  border-radius: 0.1rem;
}

.grade {
  float: left;
  width: 70%;
}
.grade img {
  display: inline-block;
  margin-top: -0.03rem;
  width: 14%;
  vertical-align: middle;
}
.grade span {
  font-size: 0.26rem;
  margin-left: 0.1rem;
  color: #333333;
}
.grade span:first-child {
  margin-left: 0rem;
}

.has-grade:after {
  content: " ";
  display: block;
  clear: both;
}
.has-grade .class-num-box {
  width: auto;
  float: right;
}

.tab-bar {
  background-color: #503291;
  padding-bottom: 0.1rem;
}

.tab-title {
  background-color: #ffffff;
}
.tab-title:after {
  content: " ";
  display: block;
  clear: both;
}
.tab-title li {
  font-size: 0rem;
  width: 50%;
  float: left;
  padding-left: 5%;
  padding-right: 5%;
  text-align: center;
}
.tab-title li.active span {
  font-size: 0.4rem;
  color: #503291;
  border-color: #eb3c96;
}
.tab-title li span {
  font-size: 0.3rem;
  padding: 0.25rem 0.15rem 0.15rem;
  border-bottom: 0.1rem solid transparent;
}
.tab-title li span:hover {
  cursor: pointer;
}

.tab-content {
  padding: 0rem 0.35rem;
  background-color: #ffffff;
}
.tab-content.tab-content2 > li {
  display: block;
}
.tab-content > li {
  display: none;
}
.tab-content > li.active {
  display: block;
}
.tab-content h4 {
  padding: 0.4rem 0rem 0.1rem;
}
.tab-content h4.mulu {
  border-bottom: 0.02rem solid #e1e9f0;
  padding: 0.3rem 0rem;
}
.tab-content p {
  line-height: 1.5;
  font-size: 0.26rem;
  color: #838c9f;
  /*margin-bottom: 0.35rem;*/
}

.portrait-box {
  text-align: center;
  display: inline-block;
  position: relative;
  margin-right: 0.1rem;
}

.portrait {
  width: 1.2rem;
  background:#503291;
  height: 1.2rem;
  border-radius: 50%;
}

.medal {
  position: absolute;
  bottom: 0rem;
  left: 0rem;
  width: 100%;
  transform: translateY(53%);
}
.medal img {
  margin: 0 auto;
  width: 0.4rem;
}

.tab-content {
  overflow-y: scroll;
  height: 425px;
  overflow-x: hidden;
  margin-bottom: 1.3rem;
}

#progressBox {
  width: 100%;
  height: 0.4rem;
  background: #fbd8ea;
  position: relative;
}
#progressBox span {
  position: absolute;
  top: 0px;
  right: 5px;
  color: #ffffff;
  font-size: 0.24rem;
  color: #5f4297;
  z-index: 9;
}

#progressBar {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  height: 0.4rem;
  width: 0%;
  line-height: 0.4rem;
  color: #ffffff;
  text-align: right;
  background: #eb3c96;
  border-bottom-right-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
}

#ul1 {
  display: inline-block;
  font-size: 0.3rem;
  padding-bottom: 0.1rem;
  padding-top: 0.3rem;
  padding-right: 0.3rem;
}
#ul1.active span {
  transform: rotate(0deg);
}
#ul1 span {
  width: 0.3rem;
  margin-left: 0.13rem;
  transform: rotate(-180deg);
  margin-top: -0.05rem;
}

#ul2 {
  display: none;
}

.status-select-box li {
  text-align: left;
  background-color:  rgb(58,133,212);
  width: 100%;
  font-size: 0.3rem;
  padding: 0.3rem 0rem 0.2rem 0.4rem;
  color: #ffffff;
  border-bottom: 0.02rem solid #ffffff;
}
.status-select-box li:last-child {
  border: none;
}
.status-select-box li.active {
  color: #ffc832;
}
.status-select-box li.active span {
  display: inline-block;
  margin-left: -0.1rem;
  margin-top: -0.05rem;
}
.status-select-box li span {
  width: 0.4rem;
  float: right;
  display: none;
}

.status-select-box ul {
  width: 2.35rem;
  position: absolute;
  right: 0.13rem;
  border-radius: 0.1rem;
  padding: 0rem 0.2rem 0.2rem;
  background-color: rgb(58,133,212);
  z-index: 10;
}

.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}

.fade.in {
  opacity: 1;
  background-color: rgba(0, 0, 0, 0.5);
}

.modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050;
  display: none;
  overflow: hidden;
  -webkit-overflow-scrolling: touch;
  outline: 0;
}

.fade {
  opacity: 0;
  -webkit-transition: opacity .15s linear;
  -o-transition: opacity .15s linear;
  transition: opacity .15s linear;
}

.modal.in .modal-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  transform: translate(0, 0);
}

.modal.fade .modal-dialog {
  -webkit-transition: -webkit-transform .3s ease-out;
  -o-transition: -o-transform .3s ease-out;
  transition: transform .3s ease-out;
  -webkit-transform: translate(0, -25%);
  -ms-transform: translate(0, -25%);
  -o-transform: translate(0, -25%);
  transform: translate(0, -25%);
}

.modal-dialog {
  position: absolute;
  top: 20%;
  left: 0px;
  width: auto;
  margin: 10px;
  z-index: 9999;
}

.modal-content {
  position: relative;
  background-color: #fff;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  border: 1px solid #999;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  outline: 0;
  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
}

.modal-header {
  padding: 15px;
  border-bottom: 1px solid #e5e5e5;
}

.modal-header .close {
  margin-top: -2px;
}

button.close {
  -webkit-appearance: none;
  padding: 0;
  cursor: pointer;
  background: 0 0;
  border: 0;
}

.close {
  float: right;
  font-size: 21px;
  font-weight: 700;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  filter: alpha(opacity=20);
  opacity: .2;
}

.modal-title {
  margin: 0;
  line-height: 1.42857143;
}

.modal-body {
  position: relative;
  padding: 15px;
}

.home .se1 {
  background: url("../images/homeBack.png") no-repeat;
  background-size: 100% auto;
  padding: 2.25rem 0 .25rem 0;
}
@media (max-width: 768px) {
  .home .se1 {
    padding-top: 1.5rem;
  }
}
.home .se2 {
  padding: 0rem 0.4rem;
  min-height: 300px;
  margin-top: .2rem;
}
.home .se2 .mui-table-view:before {
  background-color: transparent;
}
.home .se2 h3 {
  margin-bottom: 0.2rem;
}

.search-box {
  width: 100%;
  font-size: 0rem;
  background-color: #ffffff;
  text-align: center;
  border-radius: 0.1rem;
  line-height: 0.8rem;
}
@media (max-width: 768px) {
  .search-box {
    line-height: 0.6rem;
  }
}
.search-box img {
  width: 0.3rem;
  margin-right: 0.1rem;
}
.search-box > span {
  font-size: 0.32rem;
  color: #9d9c9c;
}
.search-box.index-search {
  width: 100%;
  margin: 0 auto;
  margin-bottom: 0.15rem;
  border: 1px solid #666;
}

.swiper-container1 .swiper-slide img {
  border-radius: 0.25rem;
  height: 3.1rem;
  width: 100%;
}
.swiper-container1 .swiper-pagination {
  position: static;
  margin-top: 0.15rem;
  line-height: 0.1rem;
}
@media (max-width: 768px) {
  .swiper-container1 .swiper-pagination {
    margin-top: 0.05rem;
    margin-bottom: 0.05rem;
  }
}
.swiper-container1 .swiper-pagination-bullet {
  width: 0.16rem;
  height: 0.16rem;
  display: inline-block;
  border-radius: 100%;
  background: #fff;
  opacity: 1;
}
.swiper-container1 .swiper-pagination-bullet-active {
  width: 0.4rem;
  background: #ffc832;
  border-radius: 0.2rem;
}

.cat-part {
  position: relative;
  /*background-color: #eb3c96;*/
  background: url("../images/indexbox.png") no-repeat center;
  background-size: 100% 100%;
  margin: 0 auto;
  width: 95%;
  margin-top: 0.2rem;
  border-radius: 0.1rem;
  padding: .15rem 0 0rem 0rem;
  box-shadow: 1px 1px 10px #666666;
  font-size: .3rem;
  color: #333;
  height: 2.8rem;
}
.cat-part a{
  color: #333;
}
.cat-part.active .more-part {
  display: block;
}
.cat-part.active .cat-more > img {
  transform: rotate(90deg);
}
@media (max-width: 768px) {
  .cat-part {
    /*padding: 0.15rem 0rem;*/
    /*padding-bottom: .3rem;*/
  }
}
.cat-part:after {
  content: " ";
  display: block;
  clear: both;
}
.cat-part li {
  width: 25%;
  float: left;
  /*padding-left: 2.5%;*/
  /*padding-right: 2.5%;*/
}
.cat-part li img {
  margin: 0 auto;
  width: 50%;
}
.cat-part li p {
  font-size: 0.32rem;
  margin-top: 0.1rem;
  color: #ffffff;
  font-family: Verdana;
  text-align: center;
  transform: scale(.8);
  -webkit-transform: scale(.8);
  -moz-transform: scale(.8);
  -ms-transform: scale(.8);
  -o-transform: scale(.8);
}
@media (max-width: 768px) {
  .cat-part li p {
    font-size: 0.2rem;
  }
}

.more-part {
  z-index: 9;
  display: none;
  background-color: #f06db0;
  border-radius: 0.1rem;
  position: absolute;
  padding: 0.25rem 0rem 0rem;
  top: 0px;
  left: 0px;
  transform: translateY(30%);
  width: 100%;
}
.more-part:after {
  content: " ";
  display: block;
  clear: both;
}
.more-part li p {
  height: 0.7rem;
}

.class-list h5 {
  overflow: hidden;
  display:-webkit-box;
  text-overflow:ellipsis;
  -webkit-line-clamp:2;
  /* autoprefixer: ignore next */
  -webkit-box-orient:vertical;
  white-space:normal;
  line-height: 17px;
  height: 41px;
  font-size: 13px!important;
  border-bottom-left-radius: 0.1rem;
  border-bottom-right-radius: 0.1rem;
}
.class-list0 h5,.class-list1 h5 {
  overflow: hidden;
  display:-webkit-box;
  text-overflow:ellipsis;
  -webkit-line-clamp:2;
  /* autoprefixer: ignore next */
  -webkit-box-orient:vertical;
  white-space:normal;
  line-height: 18px;
  height: 43px;
  font-size: 14px!important;
  background-color: rgb(243,250,251);
  padding: .15rem .4rem;
  border-bottom-left-radius: 0.1rem;
  border-bottom-right-radius: 0.1rem;
  padding-bottom: 0;
}
@media (max-width: 768px) {
  .class-list h5 {
    font-size: 0.26rem;
  }
  .class-list0 h5,.class-list1 h5 {
    font-size: 0.26rem;
  }
}

.index-classlist .class-cell {
  min-height: 165px;
}

.search-page .mui-placeholder {
  text-align: left;
}
.search-page .mui-icon-search {
  margin-left: 0.3rem;
  margin-right: 0.2rem;
}

.search-box2 {
  background-color: #503291;
  padding: 0.2rem 0.3rem;
  position: relative;
  font-size: 0px;
}
.search-box2.search-box3 {
  padding-right: 1.3rem;
}
.search-box2 input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
}
.search-box2 input {
  font-size: 0.36rem;
  padding-left: 0.85rem;
  height: 0.8rem;
  background-color: #ffffff;
  border-radius: 0.15rem;
}
.search-box2 input.active {
  color: #8e95a4;
}
.search-box2 img {
  position: absolute;
  width: 0.4rem;
  left: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
}
.search-box2 .search-btn {
  font-size: 0.36rem;
  color: #ffffff;
  position: absolute;
  top: 50%;
  right: 0.3rem;
  transform: translateY(-50%);
}

.search-se1 {
  margin-top: 0.2rem;
  margin-bottom: 0.1rem;
  font-size: 0.3rem;
}
.search-se1:after {
  content: " ";
  display: block;
  clear: both;
}
.search-se1 > div {
  width: 50%;
  float: left;
  padding-left: 5%;
  padding-right: 5%;
  padding-right: 0px;
  padding-left: 2.5%;
}
.search-se1 > div.sTotal {
  width: 57%;
}
.search-se1 > div.sorts {
  width: auto;
  padding-right: 0.3rem;
}
.search-se1 .sorts {
  float: right;
}
.search-se1 .sorts:after {
  content: " ";
  display: block;
  clear: both;
}
.search-se1 .sorts img {
  display: inline-block;
}
.search-se1 .sorts span {
  color: #8e95a4;
}
.search-se1 .sorts span:hover {
  cursor: pointer;
}
.search-se1 .sorts span.active {
  color: #503291;
}
.search-se1 .sorts span img {
  width: 0.3rem;
  transform: rotate(180deg);
}
.search-se1 .sorts .main img {
  transform: rotate(0deg);
}

.search-se2 {
  padding: 0px 0.32rem;
}
.search-se2 li {
  padding: 0.35rem 0px;
  border-top: 0.02rem solid #e6f0fa;
  font-size: 0px;
}
.search-se2 li > div {
  display: inline-block;
  vertical-align: top;
}
.search-se2 .class-cover-s {
  width: 50%;
  position: relative;
}
.search-se2 .class-cover-s img:first-child {
  height: 1.8rem;
  width: 100%;
}
.search-se2 .new2 {
  position: absolute;
  top: 0px;
  right:0;
  width: 0.4rem;
}
.search-se2 .class-info {
  width: 50%;
  padding-left: 0.35rem;
  overflow: hidden;
}
.search-se2 .class-info h5 {
  line-height: 1.2;
  margin-top: 0.05rem;
  margin-bottom: 0.3rem;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
@media (max-width: 768px) {
  .search-se2 .class-info h5 {
    margin-bottom: 0.13rem;
    font-size: 0.3rem;
  }
}
@media (max-width: 768px) {
  .search-se2 .class-info .class-teacher {
    font-size: 0.22rem;
  }
}

.class-cover2 {
  width: 4.2rem;
}

.search-total {
  vertical-align: middle;
}

.classbrief header {
  position: relative;
}
.classbrief .class-banner-img {
  height: 4rem;
  width: 100%;
}

.banner-box {
  position: relative;
}
.banner-box.classbrief-banner img:first-child {
  height: 4rem;
  margin: 0 auto;
}

.banner-bottom {
  position: absolute;
  bottom: 0px;
  left: 0px;
}

.introduce-box {
  position: absolute;
  left: 0rem;
  bottom: 0.2rem;
  padding: 0rem 0.3rem;
  width: 100%;
  font-size: 0px;
}

.yellow-block {
  background-color: #ffc000;
  padding: 0.38rem;
  border-radius: 0.1rem;
  background: url("../images/introduce-box.png") no-repeat center;
  background-size: 100%;
}
@media (max-width: 768px) {
  .yellow-block {
    padding: 0.2rem;
  }
}

.introduce {
  width: 65%;
  display: inline-block;
  vertical-align: bottom;
}
.introduce h3 {
  color: #503291;
  font-size: 0.4rem;
}
@media (max-width: 768px) {
  .introduce h3 {
    margin-bottom: 0.12rem;
  }
}
.introduce .class-num-box {
  font-size: 0.36rem;
}
@media (max-width: 768px) {
  .introduce .class-num-box {
    font-size: 0.26rem;
  }
}
.introduce .class-num-box {
  float: left;
  line-height: 1.3;
}
.introduce .has-grade {
  margin-bottom: 0.3rem;
}
@media (max-width: 768px) {
  .introduce .has-grade {
    margin-bottom: 0.12rem;
  }
}
.introduce .grade {
  width: 55%;
}
.introduce .has-grade .class-num-box {
  width: 45%;
}

.class-time {
  font-size: 0.4rem;
  color: #503291;
}
@media (max-width: 768px) {
  .class-time {
    font-size: 0.32rem;
  }
}

.rili {
  margin-right: 0.24rem;
  width: 0.3rem;
}

.class-time1 {
  margin-bottom: 0.25rem;
}
@media (max-width: 768px) {
  .class-time1 {
    margin-bottom: 0.1rem;
  }
}

.join {
  width: 35%;
  display: inline-block;
}

.join-btn {
  background-color: rgb(28,188,193);
  padding: 0.3rem 0rem;
  font-size: 0.4rem;
  color: #ffffff;
  text-align: center;
  border-radius: 0.1rem;
}
@media (max-width: 768px) {
  .join-btn {
    padding: 0.2rem 0rem;
    font-size: 0.3rem;
  }
}

.q-mark {
  width: 0.4rem;
  margin-left: 0.35rem;
}
.q-mark:hover {
  cursor: pointer;
}

.class-teacher-troduce {
  margin-top: 0.1rem;
}
.class-teacher-troduce .portrait-box {
  vertical-align: middle;
}
.class-teacher-troduce .class-teacher-info {
  display: inline-block;
  vertical-align: middle;
}
.class-teacher-troduce .class-teacher-info p {
  line-height: 1.5;
  color: #8e95a4;
  margin-bottom: 0rem;
}
.class-teacher-troduce .class-teacher-info p span {
  font-size: 0.26rem;
  vertical-align: middle;
}
.class-teacher-troduce .teacher-name {
  font-size: 0.42rem;
}
.class-teacher-troduce .teacher-post {
  margin-left: 0.28rem;
}

.catalogue h4 {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  padding: 0.4rem 0rem;
  border-bottom: 2px solid #e7edf3;
}

.classlist-more {
  padding-top: 0.3rem;
}
.classlist-more img {
  margin: 0 auto;
  width: 0.4rem;
}

.tab-title-attend {
  font-size: 0rem;
}
.tab-title-attend li {
  width: 33.33333%;
  float: left;
  padding-left: 3.33333%;
  padding-right: 3.33333%;
}

.tab-bar-attend {
  background-color: #dbd6e9;
}

.introduce-attend {
  padding-top: 0.36rem;
  width: 100%;
}
.introduce-attend h3 {
  color: #333333;
  margin-bottom: 0.25rem;
  font-size: 0.4rem;
}
.introduce-attend .class-num-box {
  float: none;
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 0rem;
  font-size: 0.26rem;
}
.introduce-attend .grade {
  float: none;
  width: 3rem;
  font-size: 0px;
  vertical-align: middle;
  display: inline-block;
}
.introduce-attend .grade span {
  width: 10%;
  margin-top: -0.03rem;
}
.introduce-attend .grade span:last-child {
  width: auto;
  color: #838c9f;
  margin-left: 0.1rem;
  margin-top: 0rem;
}
.introduce-attend .grade span img {
  width: auto;
  padding-right: 0px;
}

.tab-content-attend .catalogue {
  margin: 0rem -0.35rem;
}
.tab-content-attend .first-title {
  position: relative;
  margin: 0rem 0.35rem;
}
.tab-content-attend .first-title:hover {
  cursor: pointer;
}
.tab-content-attend .first-title.active + ul {
  display: block;
}
.tab-content-attend .first-title.active span {
  transform: translateY(-50%) rotate(180deg);
}
.tab-content-attend .first-title span {
  position: absolute;
  width: 0.3rem;
  top: 50%;
  right: 0px;
  transform: translateY(-50%);
  transition: 0.4s;
}
.tab-content-attend h4 {
  padding-right: 0.5rem;
}

.second-level {
  display: none;
}

.class-status-box {
  background-color: #503291;
  padding: 0.3rem 0.35rem;
  color: #ffffff;
  font-size: 0.34rem;
}
.class-status-box:after {
  content: " ";
  display: block;
  clear: both;
}
@media (max-width: 768px) {
  .class-status-box {
    font-size: 0.28rem;
  }
}
.class-status-box > div {
  float: left;
}

.class-status {
  width: 38%;
}
.class-status span {
  font-size: 0.4rem;
  vertical-align: bottom;
}
@media (max-width: 768px) {
  .class-status span {
    font-size: 0.3rem;
  }
}
.class-status span img {
  width: 0.4rem;
}

.score-time {
  width: 62%;
}
.score-time:after {
  content: " ";
  display: block;
  clear: both;
}
.score-time div {
  float: right;
}
.score-time div span {
  vertical-align: bottom;
}
.score-time .score {
  padding-right: 0.25rem;
}

.purple {
  color: #eb3c96;
}

.yellow {
  color: rgb(0,247,82);
}

.attend-tips > div {
  border-bottom: 0.02rem solid #ffffff;
  font-size: 0.3rem;
}
.attend-tips > div:last-child {
  border: none;
}
.attend-tips > div:after {
  content: " ";
  display: block;
  clear: both;
}
.attend-tips > div > span {
  float: right;
  padding-left: 0.5rem;
}

.second-level {
  background-color: #fbd8ea;
}
.second-level li {
  padding: 0.2rem 0.35rem;
  border-bottom: 2px solid #ffffff;
}
.second-level li > div {
  display: inline-block;
  font-size: 0.3rem;
  vertical-align: middle;
}
.second-level li > div:first-child {
  margin-right: 0.35rem;
}

.play-link-box {
  margin-right: 0.3rem !important;
}

.play-link {
  font-size: 0.2rem;
  border: 0.02rem solid #503291;
  width: 100%;
  text-align: center;
  padding: 0rem 0.12rem;
  border-radius: 0.1rem;
}
.play-link a {
  color: #503291;
}

.attend-test-img {
  width: 0.7rem;
  vertical-align: middle;
}

.attend-test-content {
  width: 81%;
}
.attend-test-content p {
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 0rem;
}
.attend-test-content p.attend-totle-score, .attend-test-content p.attend-test-score {
  font-size: 0.26rem;
  color: #333333;
}
.attend-test-content .attend-test-title {
  color: #eb3c96;
  width: 100%;
}

.attend-totle-score {
  font-size: 0.32rem;
  width: 51%;
}

.attend-test-score {
  float: right;
}
.attend-test-score span {
  color: #59ce98;
}

.feedback .introduce {
  width: 100%;
}
.feedback .grade {
  width: 100%;
  float: none;
  padding: 0.4rem 0rem;
  font-size: 0px;
}
.feedback .grade .feedback-grade-txt {
  width: auto;
  font-size: 0.4rem;
}
@media (max-width: 768px) {
  .feedback .grade .feedback-grade-txt {
    font-size: 0.3rem;
  }
}
.feedback .grade .feedback-grade-img {
  width: 59%;
}
.feedback .grade .feedback-grade-img img {
  width: 13%;
}
.feedback .grade #hint {
  width: auto !important;
}
.feedback .grade #targetType-hint {
  display: none;
}
.feedback textarea {
  border: 0.03rem solid #dbdbdb;
  border-radius: 0.1rem;
  margin-bottom: 0.55rem;
}
.feedback button {
  width: 56%;
  margin: 0 auto;
  display: block;
  color: #ffffff;
  font-size: 0.35rem;
  text-align: center;
  letter-spacing: 0.1rem;
  padding: 0.4rem 0rem;
  border-radius: 0.4rem;
  background: -webkit-linear-gradient(left, rgb(70,95,216), rgb(120,26,210));
  margin-bottom: .3rem;
}
.feedback button span {
  transform: translateX(10%);
}
@media (max-width: 768px) {
  .feedback button {
    padding: 0.2rem 0rem;
  }
}

.questionnaire {
  margin: 0.3rem -0.35rem 0rem;
  padding: 0.3rem 0.35rem;
  border-top: 2px solid #dcd6e9;
  border-bottom: 2px solid #dcd6e9;
}
.questionnaire div {
  display: inline-block;
  color: #333333;
}
.questionnaire .attend-test-content {
  font-size: 0.4rem;
  padding-left: 0.3rem;
  width: 86%;
  position: relative;
}
@media (max-width: 768px) {
  .questionnaire .attend-test-content {
    font-size: 0.3rem;
  }
}
.questionnaire .attend-test-content .questionnaire-img {
  width: 0.3rem;
  position: absolute;
  top: 50%;
  right: 0px;
  transform: translateY(-50%);
}
.questionnaire .attend-test-content span {
  font-size: 0.2rem;
  color: #aeb3bd;
  padding: 0rem 0.1rem;
  border: 0.01rem solid #dbdbdb;
  border-radius: 0.1rem;
}

.banner-box .class-banner-imgd {
  height: 4rem;
  width: 100%;
}

.tian {
  color: #fff !important;
}

.myfeedback {
  margin: 0.3rem -0.35rem 0rem;
  padding: 0rem 0.35rem;
  border-top: 2px solid #dcd6e9;
}
.myfeedback h5 {
  border-left: 0.08rem solid #eb3c96;
  padding-left: 0.15rem;
  line-height: 1.2;
  color: #333333;
  margin: 0.25rem 0rem;
  font-size: 0.32rem;
}
.myfeedback li {
  padding: 0.15rem 0rem;
  border-bottom: 2px solid #dcd6e9;
}
.myfeedback li:after {
  content: " ";
  display: block;
  clear: both;
}
.myfeedback li p {
  margin: 0rem;
  font-size: 0.32rem;
  line-height: 1.5;
  color: #333333;
}
.myfeedback li .top {
  font-size: 0rem;
}
.myfeedback li .name {
  width: 40%;
  font-size: 0.36rem;
  color: #8e95a4;
}
.myfeedback li .has-grade {
  display: inline-block;
  width: 60%;
  text-align: right;
}
.myfeedback li .has-grade .grade {
  padding: 0.2rem 0rem;
}
.myfeedback li .has-grade .grade > img {
  width: 9%;
}

.like-box {
  float: right;
}
.like-box img {
  width: 0.3rem;
}
.like-box .like {
  display: none;
}
.like-box.active .like {
  display: block;
}
.like-box.active .like-empty {
  display: none;
}

.survey .top {
  position: relative;
}
.survey .myscore {
  font-size: 0.6rem;
}
.survey .myscore span {
  vertical-align: baseline;
}

.survey-body {
  background-color: rgb(206,239,230);
}

.survey-score {
  color: #ffffff;
  padding-top: 14.35185%;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  text-align: center;
}
.survey-score h2 {
  margin-bottom: 0.4rem;
}
.survey-score p {
  font-size: 0.48rem;
}

.survey-content {
  padding-top: 13%;
}
.survey-content > p {
  padding: 0rem 1.6rem;
  font-size: 0.4rem;
  line-height: 2;
  margin-bottom: 27.7778%;
}
@media (max-width: 768px) {
  .survey-content > p {
    padding: 0rem 0.8rem;
    font-size: 0.32rem;
  }
}

.yellow-btn-box {
  text-align: center;
}

.yellow-btn {
  background-color: rgb(80,134,236);
  font-size: 0.4rem;
  color: #ffffff;
  border-radius: 100%;
  width: 1.6rem;
  height: 1.6rem;
  line-height: 1.6rem;
  text-align: center;
  display: inline-block;
  vertical-align: top;
}
.yellow-btn.yellow-btn2 {
  line-height: 0.72rem;
  padding-top: 0.1rem;
}
.yellow-btn.yellow-btn3 {
  margin-right: 1.2rem;
}

.answer top {
  position: relative;
}

.answer-question {
  position: absolute;
  padding: 0rem 0.55rem;
  color: #ffffff;
  top: 0.25rem;
  left: 0px;
  width: 100%;
  height:3.1rem;
  overflow: auto;
  font-size: 0.48rem;
  text-align: center;
}
@media (max-width: 768px) {
  .answer-question {
    font-size: 0.32rem;
  }
}
.answer-question .title {
  text-align: left;
  line-height: 1.5;
  margin-top: 0.35rem;
}
.answer-question .score {
  font-size: 0.42rem;
}
@media (max-width: 768px) {
  .answer-question .score {
    font-size: 0.36rem;
  }
}

.answer-content {
  font-size: 0.46rem;
  padding: 5.0926% 11.1111% 6.9444%;
}
@media (max-width: 768px) {
  .answer-content {
    font-size: 0.32rem;
  }
}
.answer-content li {
  background-color: #ffffff;
  padding: 5.556% 12.5%;
  border-radius: 0.1rem;
  margin-bottom: 0.3rem;
}
.answer-content li.active {
  background: url("../images/answerq_03.png") no-repeat;
  background-size: 100% 100%;
  color: #ffffff;
}

.topicBlock > li {
  display: none;
}
.topicBlock > li.active {
  display: block;
}

.answerfinish-body {
  background-color: rgb(183,191,230);
}

.answerfinish {
  /*background: url("../images/answerfinish.jpg") no-repeat;*/
  background-size: contain;
}
.answerfinish h2 {
  color: rgb(88,37,213);
  text-align: center;
  margin-top: 15.277778%;
  margin-bottom: 14.12963%;
}
.answerfinish li {
  font-size: 0.46rem;
}
@media (max-width: 768px) {
  .answerfinish li {
    font-size: 0.3rem;
  }
}
.answerfinish .yellow-btn-box {
  padding-bottom: 11.667%;
}
.answerfinish .down-title img {
  width: 5rem;
  margin: 0 auto;
}

.blue {
  background-color: rgb(80,134,236);
}

.myclass .class-banner-img {
  height: auto !important;
}

.myclass-portrait-box {
  position: absolute;
  width: 100%;
  top: 0px;
  left: 0px;
  padding-top: 15.741%;
  text-align: center;
}
@media (max-width: 768px) {
  .myclass-portrait-box {
    padding-top: 14.741%;
  }
}

.myclass-portrait {
  display: inline-block;
}
.myclass-portrait > img {
  margin: 0 auto;
}
.myclass-portrait .name {
  font-size: 0.52rem;
  color: #ffffff;
  line-height: 1.5;
}
@media (max-width: 768px) {
  .myclass-portrait .name {
    font-size: 0.46rem;
  }
}
.myclass-portrait .level {
  font-size: 0.36rem;
  color: #ffffff;
}
@media (max-width: 768px) {
  .myclass-portrait .level {
    font-size: 0.3rem;
  }
}
.myclass-portrait .portrait {
  width: 2rem !important;
}
@media (max-width: 768px) {
  .myclass-portrait .portrait {
    width: 1.6rem !important;
    height: 1.6rem ;
  }
}
.myclass-portrait .portrait-small {
  width: 1.4rem !important;
  height: 1.4rem ;
}

.status-select-box {
  text-align: right;
}

.mayclass-tab-content h4 {
  padding: 0.35rem 0rem 0rem;
}
.mayclass-tab-content h4 span {
  border-left: 0.08rem solid #eb3c96;
  padding-left: 0.13rem;
}

.mayclass-ul {
  padding: 0rem;
}
.mayclass-ul li {
  border: none;
  border-bottom: 2px solid #dcd6e9;
}
.mayclass-ul h5 {
  color: #333333;
}
.mayclass-ul .class-tag {
  margin: 0rem;
  float: right;
}
.mayclass-ul .class-teacher {
  margin-top: 0.05rem;
  margin-bottom: 0rem;
}
.mayclass-ul .se2 {
  margin-bottom: 0.2rem;
}
@media (max-width: 768px) {
  .mayclass-ul .se2 {
    margin-bottom: 0.34rem;
  }
}
.mayclass-ul #progressBox, .mayclass-ul #progressBar {
  border-radius: 1rem;
}
@media (max-width: 768px) {
  .mayclass-ul #progressBox, .mayclass-ul #progressBar {
    height: 0.3rem;
    line-height: 0.3rem;
  }
}
.mayclass-ul #progressBox span {
  font-size: 0.32rem;
}
@media (max-width: 768px) {
  .mayclass-ul #progressBox span {
    font-size: 0.24rem;
  }
}
.mayclass-ul .studying .class-tag {
  background-color: #149b5f;
}
.mayclass-ul .studying #progressBox {
  background: #b8e1cf;
}
.mayclass-ul .studying #progressBox span {
  color: #3e5282;
}
.mayclass-ul .studying #progressBar {
  background-color: #149b5f;
}
.mayclass-ul .pass .class-tag {
  background-color: #2dbecd;
}
.mayclass-ul .pass #progressBox {
  background: #c0ebf0;
}
.mayclass-ul .pass #progressBox span {
  color: #455ca3;
}
.mayclass-ul .pass #progressBar {
  background-color: #2dbecd;
}
.mayclass-ul .fail .class-tag {
  background-color: #e61e50;
}
.mayclass-ul .fail #progressBox {
  background: #f7b7c6;
}
.mayclass-ul .fail #progressBox span {
  color: #7d2c7d;
}
.mayclass-ul .fail #progressBar {
  background-color: #e61e50;
}

@media (max-width: 768px) {
  .myclasslist .class-info h5 {
    margin-bottom: 0.25rem !important;
  }
}

.book-cat {
  position: relative;
}

.cat-name {
  position: absolute;
  width: 100%;
  top: 4.2rem;
  left: 0px;
}
.cat-name > div {
  height: 2.5rem;
}
.cat-name > div a:nth-of-type(2) {
  padding-left: 0.2rem;
}
.cat-name > div a > p {
  font-size: 0.42rem;
  color: #ffffff;
  display: inline-block;
  line-height: 1.5;
  text-align: center;
  height: 2.1rem;
}
.cat-name > div .related-datum a {
  font-size: 0.42rem;
  color: #ffffff;
  display: inline-block;
  line-height: 1.5;
  text-align: center;
  height: 2.1rem;
}
.cat-name .first-line {
  text-align: center;
}
.cat-name .first-line .related-datum a {
  width: 2.1rem;
  word-wrap: break-word;
}
.cat-name .first-line .cat-part {
  display: none;
  width: 77.77778%;
  margin: 0 auto;
  background-color: #0f69af;
  border-radius: 0px;
  border-top: 0.2rem solid #094676;
  border-bottom: 0.2rem solid #094676;
}
.cat-name .first-line .cat-part.active {
  display: block;
}
.cat-name .first-line .cat-part li {
  width: 33.33333%;
  float: left;
  padding-left: 3.33333%;
  padding-right: 3.33333%;
  height: 1.7rem;
}
.cat-name .first-line .cat-part li p {
  margin-bottom: 0.2rem;
  height: auto;
}
.cat-name .second-line {
  padding-left: 1.8rem;
}
.cat-name .second-line p:first-child {
  margin-right: 11.2593%;
}
.cat-name .thired-line {
  padding-left: 1.2rem;
}
.cat-name .thired-line p:first-child {
  margin-right: 18.5185%;
}

.related-datum {
  position: relative;
}
.related-datum img {
  position: absolute;
  bottom: 10px;
  right: -5px;
  width: 0.3rem;
}
.related-datum img.active {
  transform: rotate(180deg);
}

@media (max-width: 768px) {
  .mybook .myclass-portrait .portrait {
    width: 1.4rem !important;
  }
}

.book-page .search-se2 {
  background-color: #dcd6e9;
  padding: 0 0.15rem;
}

.book-list {
  padding-top: 0.12rem;
}
.book-list:after {
  content: " ";
  display: block;
  clear: both;
}
.book-list li {
  width: 50%;
  float: left;
  padding-left: 5%;
  padding-right: 5%;
  border: none;
  padding: 0px;
  margin-bottom: 0.2rem;
}
.book-list li:nth-child(odd) {
  padding-right: 1%;
}
.book-list li:nth-child(even) {
  padding-left: 1%;
}
.book-list li > div {
  background-color: #ffffff;
  width: 100%;
  padding: 0.2rem 0rem;
  border-radius: 0.1rem;
}
.book-list li > div.book-img {
  margin-bottom: 5px;
}
.book-list li img {
  width: 2.45rem;
  height: 3.9rem;
  margin: 0 auto;
}

.book-info {
  padding: 0.2rem !important;
}
.book-info h4 {
  font-family: Verdana;
  line-height: 1.2;
  overflow: hidden;
  height: 0.8rem;
  text-align: center;
  margin-bottom: 0.3rem;
}
.book-info .preview {
  margin-right: 0.05rem;
}
.book-info section img {
  display: inline-block;
  width: auto;
  height: 0.24rem;
  vertical-align: middle;
}
.book-info section span {
  font-size: 0.26rem;
  color: #61699a;
}
.book-info section span.time {
  color: #8e95a4;
  float: right;
}
.book-info section .send-email {
  margin-left: 0.1rem;
}

.bookdetails-search img {
  left: 43%;
}
.bookdetails-search input {
  text-align: center;
}

.pdfBox .close {
  position: absolute;
  top: 5px;
  right: 5px;
  background-color: #ffffff;
  color: #333333;
  font-size: 0.3rem;
  opacity: 1;
  padding: 5px 7px;
  border-radius: 50%;
  display: none;
}

#myPDF {
  position: absolute;
  top: 0px;
  padding-top: 0.8rem;
  background-color: rgba(0, 0, 0, 0.7);
  width: 100%;
  height: 100%;
}

.myinfo-portrait-box {
  top: auto;
  bottom: 0px;
  transform: translateY(50%);
  -webkit-transform: translateY(50%);
}
.myinfo-portrait-box .img-box {
  position: relative;
}
.myinfo-portrait-box .level {
  color: rgb(104,0,217);
  margin-top: 0.5rem;
  font-size: 0.38rem;
}
.myinfo-portrait-box .badge {
  width: 0.5rem;
  position: absolute;
  bottom: 0px;
  left: 50%;
  transform: translate(-50%, 50%);
}

.addbtn {
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 0.1rem 0.2rem;
  font-size: 0.38rem;
  background-color: #ed3c97;
  border-radius: 0.1rem;
  color: #fefefe;
}

.myinfo .class-banner-img {
  height: auto !important;
}
.myinfo .main-body {
  padding-top: 2rem;
  position: relative;
}

.myinfo-list {
  border-bottom: 0.1rem solid #d0d2e5;
  padding: 0rem 0.3rem;
}
.myinfo-list li {
  border-bottom: 0.02rem solid #e6f0fa;
  padding: 0.34rem .3rem;
}
.myinfo-list li:after {
  content: " ";
  display: block;
  clear: both;
}
.myinfo-list li .email {
  width: calc(100% - 1.7rem);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.myinfo-list .first {
  min-width: 2.3rem;
}
.myinfo-list div {
  font-size: 0.33rem;
  color: #8e95a4;
  float: left;
}
.myinfo-list div input {
  border: none;
  padding: 0px;
  margin: 0px;
  font-size: 0.38rem;
  height: auto;
}

.myaddress {
  padding: 0.3rem;
}
.myaddress textarea {
  padding: 0px;
  margin: 0px;
  font-size: 0.3rem;
  line-height: 1.8;
}
.myaddress section {
  margin-bottom: 0.3rem;
  font-size: 0px;
}
.myaddress section > p {
  font-size: 0.38rem;
  color: #8e95a4;
  display: inline-block;
}
.myaddress section img {
  width: 0.4rem;
  float: right;
}
.myaddress .address-details li {
  margin-top: 0.2rem;
}
.myaddress .address-details p {
  font-size: 0.3rem;
  color: #333333;
  margin-bottom: 0.3rem;
  line-height: 1.2;
}

.look-conversion {
  float: right;
  font-size: 0.3rem;
  color: #503291;
  padding-top: 0.05rem;
}

.teacher-body .class-banner-img {
  height: auto !important;
}

.teacher-body {
  background-color: #e1daf0;
}
.teacher-body .search-se2 .class-info h5 {
  margin-top: 0rem;
  line-height: 1.1;
}
.teacher-body .has-grade .class-num-box {
  margin-top: 0.01rem;
}
.teacher-body .search-se2 {
  border-radius: 0.1rem;
}
.teacher-body .class-tag {
  padding: 0rem 0.35rem;
}
.teacher-body:after {
  content: " ";
  display: block;
  clear: both;
}
.teacher-body .search-se2 {
  position: absolute;
  top: 3rem;
  padding: 0px 0.3rem;
  background-color: #fff;
  margin: 0px 0.3rem;
  padding-top: 2.5rem;
  margin-bottom: 1.2rem;
}
.teacher-body .search-se2 .img-box {
  display: inline-block;
}
.teacher-body .sclasslist > h5 {
  border-left: 0.08rem solid rgb(51,0,252);
  padding-left: 0.15rem;
  line-height: 1.2;
  color: #333333;
  margin: 0.25rem 0rem 0rem;
}
.teacher-body .sclasslist a:nth-of-type(1) li {
  border: none;
}
.teacher-body .sclasslist img {
  display: inline-block;
  vertical-align: middle;
}
.teacher-body .myclass-portrait-box {
  transform: translateY(-50%);
  top: 0px;
  bottom: auto;
}
.teacher-body .teacher-set {
  width: 0.45rem;
  height: 0.45rem;
  position: absolute;
  top: 0.4rem;
  right: 0.4rem;
  z-index: 99999;
}
.teacher-body .scorePreview {
  border-bottom: 0.04rem solid #e6f0fa;
}
.teacher-body .previewPic {
  width: 50%;
}
.teacher-body .previewPic img {
  width: 0.6rem;
}
.teacher-body .totalStar {
  width: 50%;
  float: right;
  text-align: right;
}
.teacher-body .totalStar img {
  width: 11%;
}
.teacher-body .name {
  color: #333333;
}

.teacher-brief {
  margin-bottom: 1.3rem;
}
.teacher-brief p {
  font-size: 0.36rem;
  color: #333333;
  line-height: 1.5;
}

.more-brief {
  float: right;
}
.more-brief.active img {
  transform: rotate(180deg);
}
.more-brief span {
  color: #8e95a4;
}
.more-brief img {
  display: inline-block;
  vertical-align: middle;
  width: 0.36rem;
}

.layui-layer-imgsee .layui-layer-imguide {
  display: inline-block !important;
}

.apply-teacher {
  background-color: #dcd6e9;
}
.apply-teacher .container {
  background-color: #ffffff;
}
.apply-teacher .myinfo-list {
  border: none;
}
.apply-teacher .myinfo-list div {
  font-size: 0.3rem;
}
.apply-teacher .myinfo-list .first {
  min-width: 2rem;
}
.apply-teacher .myinfo-list .second {
  width: calc(100% - 2rem );
}
.apply-teacher .myinfo-list .second input {
  font-size: 0.36rem;
}
.apply-teacher .myinfo-list li {
  padding: 0.35rem 0.3rem;
}
.apply-teacher .myinfo-list .certificateTpl {
  position: relative;
  padding-right: 1.1rem;
  margin-bottom: 0.15rem;
}
.apply-teacher .myinfo-list .certificateTpl span {
  position: absolute;
  top: 0.16rem;
  right: 0px;
}
.apply-teacher .myinfo-list .certificateTpl span img {
  width: 0.4rem;
  display: inline-block;
  margin-left: 0.1rem;
}
.apply-teacher .myinfo-list .addImg {
  margin-top: 0.2rem;
  margin-left: 0.3rem;
}
.apply-teacher .myinfo-list .addImg img {
  width: 0.6rem;
  display: inline-block;
  vertical-align: middle;
}
.apply-teacher .myinfo-list .certificate {
  background-color: #dcd6e9;
  border-radius: 4px;
  padding: 0.1rem;
}
.apply-teacher .myinfo-list .certificate::-webkit-input-placeholder {
  font-size: 0.32rem;
  color: #8e95a4;
}
.apply-teacher .feedback {
  margin-top: 0.7rem;
}

.applying-body {
  background-color: #dcd6e9;
  font-size: 0.1rem;
}

.applying {
  padding: 0.15rem;
  border-bottom: 0.1rem solid #dcd6e9;
  background-color: #ffffff;
}
.applying img {
  width: 0.4rem;
  vertical-align: middle;
  display: inline-block;
}
.applying li {
  border: none;
}
.applying .status {
  font-size: 0.42rem;
}
.applying .time {
  font-size: 0.3rem;
  float: right;
  line-height: 1.8;
}
.applying .ing {
  color: #49bcca;
}
.applying .success {
  color: #45ba5f;
}
.applying .error {
  color: #ee272e;
}

.certificatelook {
  color: #8879b0 !important;
  text-align: right;
}

.fill-again {
  margin-top: 0.4rem !important;
}
.fill-again button {
  letter-spacing: 0.1rem;
}

.layui-layer-btn a {
  font-size: 0.24rem;
}

.ranklist .tab-bar-attend {
  font-size: 0rem;
  padding-bottom: 0rem;
  position: fixed;
  width: 100%;
}
.ranklist .tab-title li {
  width: 100%;
  float: left;
  padding-left: 5%;
  padding-right: 5%;
}
.ranklist .tab-title li.active span {
  padding-top: 0.2rem;
}
.ranklist .tab-title li span {
  padding: 0.3rem 0rem 0.1rem;
}
.ranklist .column {
  background-color:rgb(9,23,123);
  font-size: 0rem;
  padding: 0.25rem 0.3rem;
}
.ranklist .column > div {
  text-align: center;
  font-size: 0.3rem;
  color: #ffc832;
  display: inline-block;
}
.ranklist .column .BU-line {
  margin-bottom: -0.1rem;
}
.ranklist .rank-line {
  text-align: left !important;
}
.ranklist .BU-line img {
  width: 0.34rem;
  display: inline-block;
  vertical-align: middle;
}
.ranklist .BU-line img.active {
  transform: rotate(180deg);
  transition: 0.4s;
}
.ranklist .integral-line {
  width: 33%;
  min-width: 1rem;
}

.rank-list-detail {
  padding-top: 1.75rem;
}
.rank-list-detail li {
  padding: 0.3rem 0.3rem 0.25rem;
  border-bottom: 0.02rem solid #ebeff1;
  font-size: 0rem;
}
.rank-list-detail li > div {
  display: inline-block;
  font-size: 0.26rem;
  white-space: nowrap;
  overflow: hidden;
  /*padding-right: 5px;*/
  padding-bottom: 0.12rem;
  text-align: center;
}
.rank-list-detail li > div.rank-line {
  font-size: 0.28rem;
}
.rank-list-detail li > div.rank-line img {
  width: 20%;
  display: inline-block;
  vertical-align: middle;
}
.rank-list-detail .name-line {
  overflow: hidden;
  padding-bottom: 0rem;
}
.rank-list-detail .name-line span {
  /*width: calc(100% - 0.75rem);*/
  margin-left: 5px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.rank-list-detail .name-line img {
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
  background: rgb(213,213,213);
}

.BU-line {
  width: 33%;
  /*overflow: hidden;*/
  /*white-space: nowrap;*/
  /*text-overflow: ellipsis;*/
}

.rank-line {
  width: 30%;
}

.name-line {
  width: 2.3rem;
}

.storelist-page .search-se1 {
  margin: 0.15rem;
}
.storelist-page .search-se1 .sale {
  margin-right: 0.3rem;
}

.storelist-header {
  position: relative;
}
.storelist-header .rule {
  position: absolute;
  bottom: 10px;
  right: 10px;
  font-size: 0.20rem;
  color: #fff;
  padding-bottom: 0.01rem;
  border-bottom: 2px solid #ffffff;
}
.storelist-header .bg-word {
  width: 100%;
  font-size: 0rem;
  position: absolute;
  top: 50%;
  left: 0rem;
  text-align: center;
  transform: translateY(-20%);
}
.storelist-header .bg-word > div {
  position: relative;
  color: #fff;
  font-size: 0.24rem;
  padding: 0.25rem 0.3rem;
  display: inline-block;
}
.storelist-header .bg-word > div .integral {
  padding-bottom: 0.3rem;
  color: #ffc832;
  font-size: 0.64rem;
}
.storelist-header .bg-word .line {
  width: 0.04rem;
  height: 0.8rem;
  display: inline-block;
  position: absolute;
  top: 10px;
  right: -0.02rem;
  background-color: #fff;
}

.integral-list .conversion {
  color: #ffffff !important;
  background-color: #eb3c96;
  padding: 0.1rem 0.2rem;
  border-radius: 0.1rem;
  letter-spacing: 0.05rem;
  font-size: 0.2rem !important;
  margin-right: -0.05rem;
}
.integral-list .book-info {
  padding-bottom: 0.55rem;
}
.integral-list .book-info section:after {
  content: " ";
  display: block;
  clear: both;
}
.integral-list .book-info section img {
  margin-top: 0.1rem;
}
.integral-list .book-info section span {
  margin-left: 0.1rem;
  padding-top: 0.1rem;
  font-size: 0.26rem;
}
.integral-list .book-info section span.word {
  color: #8e95a4;
  font-size: 0.24rem;
}

.interal-rule {
  padding: 0.1rem 0.2rem;
  font-size: 0rem;
}
.interal-rule li {
  border-bottom: 0.02rem solid #dcd6e9;
  padding: 0.4rem 0rem;
}
.interal-rule li > img {
  width: 0.8rem;
  display: inline-block;
  vertical-align: middle;
  margin-top: -0.15rem;
}
.interal-rule li > div {
  display: inline-block;
  vertical-align: top;
  width: calc(100% - 1rem);
}
.interal-rule li > div .title {
  color: #333;
  font-size: 0.32rem;
}
.interal-rule li > div .score-num {
  color: #fa4c41;
  margin-left: 0.25rem;
}
.interal-rule li > div .description {
  color: #8e95a4;
  font-size: 0.26rem;
  margin-top: 0.3rem;
}

.my-integral {
  background-color: #503291;
  text-align: center;
  padding: 0.26rem 0rem;
  font-size: 0.36rem;
}
.my-integral span {
  color: #ffffff;
}
.my-integral .num {
  color: #ffc832;
}

.goods-img {
  height: 5rem;
  margin: 0 auto;
}

.goods-info {
  border-bottom: 0.04rem solid #dcd6e9;
}
.goods-info h4 {
  font-size: 0.32rem;
  text-align: left;
  height: auto;
}
.goods-info .word {
  color: #8e95a4;
}
.goods-info .num {
  color: #e61e50;
}

.store-description {
  border-bottom: 0.04rem solid #dcd6e9;
  padding: 0.3rem 0.25rem;
}
.store-description h4 {
  margin-bottom: 0.2rem;
}
.store-description p {
  color: #949494;
  line-height: 1.6;
  font-size: 0.3rem;
}

.conversion-info {
  padding: 0.3rem 0.25rem;
}
.conversion-info > span {
  font-size: 0.32rem;
}
.conversion-info .inventory {
  float: right;
  margin-top: 0.1rem;
}

.storedetail .btn-box {
  text-align: center;
  padding: 0rem 0.45rem;
}
.storedetail .btn-box span {
  background-color: #dfdede;
  color: #333333;
  border-radius: 1rem;
  font-size: 0.36rem;
  padding: 0.3rem 0rem;
  width: 100%;
  margin-top: 0.5rem;
}
.storedetail .btn-box span.active {
  background-color: #503291;
  color: #ffffff;
}

.store-pop-box {
  display: none;
}

.store-pop-bg {
  width: 100%;
  height: 100vh;
  position: fixed;
  bottom: 0px;
  left: 0px;
  background-color: rgba(102, 102, 102, 0.5);
}

.store-pop {
  background-color: #ffffff;
  padding: 0.4rem 0.4rem 0rem;
  position: fixed;
  width: 100%;
  bottom: 0px;
  left: 0px;
  z-index: 999999;
}
.store-pop input {
  margin-bottom: 0px;
  border: none;
  color: #333333;
  padding-left: 0px;
}
.store-pop div {
  color: #8e95a4;
  position: relative;
  font-size: 0.32rem;
  border-bottom: 0.02rem solid #e6f0fa;
  padding: 0.3rem 0rem;
}
.store-pop div span:first-of-type {
  width: 24%;
}
.store-pop div .integral {
  color: #e61e50;
}
.store-pop div .addr {
  width: 60%;
}
.store-pop div .update-addr {
  position: absolute;
  top: -0.1rem;
  right: 0;
  font-size: 0.26rem;
  color: #8e95a4;
}
.store-pop .btn {
  margin-top: 0.6rem;
  color: #ffffff;
  background-color: #503291;
  font-size: 0.4rem;
  text-align: center;
  margin-left: -0.5rem;
  margin-right: -0.5rem;
  padding: 0.4rem 0rem;
  border: none;
}

.mui-numbox, .mui-numbox .mui-input-numbox, .mui-numbox .mui-numbox-input {
  border: none !important;
}

.mui-numbox {
  margin-left: 0.5rem;
}
.mui-numbox #test {
  padding: 0rem 0.5rem;
  font-size: 0.44rem;
}
.mui-numbox img {
  width: 0.4rem;
  margin: 0 auto;
}

.mui-numbox [class*=btn-numbox] {
  background-color: #ffffff;
  color: #503291;
}

.conversion-record .current-integral {
  font-size: 0.48rem;
  font-weight: 600;
  border-bottom: 0.2rem solid #dcd6e9;
  padding: 0.35rem 0.45rem;
}
.conversion-record .orange {
  color: #ffc832;
  font-weight: 400;
}
.conversion-record li {
  position: relative;
}
.conversion-record li span {
  font-size: 0.32rem;
  color: #aeb3bd;
  position: absolute;
  top: 0.4rem;
  right: 0;
  line-height: 1;
}
.conversion-record li .title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.conversion-record .alldone p {
  padding-top: 0.4rem;
}
.footer{
  width: 100%;
  font-size: 0rem;
  background: rgb(245,245,245);
}

.footer li{
  display: inline-block;
  width: 33.3%;
  font-size: .34rem;
  text-align: center;
  padding: .3rem 0;
  position: relative;
}
.footer li span{
  display: inline-block;
  width: 1px;
  background: rgba(000,000,000,.4);
  height: .55rem;
  position: absolute;
  right: 0;
  top: 22%;
  /*box-shadow: 1px 1px 1px #0C0C0C;*/
}
.d3{
  width: 0;
  height: 0;
  border-width: .13rem;
  border-style: solid;
  border-color: rgb(207,207,207) transparent transparent transparent;
  position: absolute;
  bottom: -.07rem;
  right: .05rem;
  transform: rotate(-43deg);
  -webkit-transform: rotate(-43deg);
  -moz-transform: rotate(-43deg);
  -ms-transform: rotate(-43deg);
  -o-transform: rotate(-43deg);
}
.footer ul{
  position: absolute;
  bottom: 1.2rem;
  background: rgb(245,245,245);
  z-index: 9999;
  display: none;
  width: 100%;
  border-top-left-radius: .1rem;
  border-top-right-radius: .1rem;
  box-shadow: 1px 1px 4px rgb(200,199,200);
}
.footer ul li{
  width: 120%;
  font-size: .34rem;
  padding: 0;
  border-bottom: 1px solid rgba(000,000,000,.4);
  transform: scale(.8);
  -webkit-transform: scale(.8);
  -moz-transform: scale(.8);
  -ms-transform: scale(.8);
  -o-transform: scale(.8);
  left: -10%;
  color: #000;
  position: relative;
}
.footer ul div{
  position: absolute;
  left: 40%;
  bottom: -.4rem;
  width: 0;
  height: 0;
  border-width: .2rem;
  border-style: solid;
  border-color:rgb(245,245,245) transparent transparent transparent;
}
.footer ul li a{
  color: #000;
  width: 100%;
  display: inline-block;
  padding: .2rem 0;
}
.layui-layer-tips .layui-layer-content{
  /*background: url("../images/tips.png") no-repeat center;*/
  background: rgba(0,0,0,0)!important;
  padding: 0!important;
  box-shadow:none!important;
}
.layui-layer-tips i.layui-layer-TipsB, .layui-layer-tips i.layui-layer-TipsT{
  border-right-color:rgba(0,0,0,0)!important;
}
.tipsSpan{
  line-height: 18px;
  padding: .2rem .3rem;
  border-radius: .25rem;
  /*background-image: linear-gradient(to bottom left, rgb(48,0,184),rgb(126,0,184));*/
  /*-webkit-background-image: linear-gradient(to bottom left, rgb(126,0,184), rgb(48,0,184));*/
  background: url("../images/tips.png") no-repeat center;
  position: relative;
  margin-top: .5rem;
}
.tipsSpan img{
  position: absolute;
  width: 0.8rem;
  top: -.7rem;
  left: .35rem;
}
.entry,.entrys{
  position: fixed;
  top: 0;
  left: 0;
  background:rgba(0,0,0,0.4);
  z-index: 9999999;
  width: 100%;height: 100%;
}
.entryBox{
  position: fixed;
  top: 20%;
  left: 10%;
  background: #ffffff;
  z-index: 9999999;
  width: 80%;
  padding: .3rem;
  font-size: .3rem;
  text-align: left;
  border-radius: .1rem;
  box-shadow: 1px 3px 5px #000;
}
.ifBox{
  padding: 0;
}
.ifBox>div{
  border-top: 1px solid #666666;
}
.ifBox>p{
  padding: .4rem .3rem;
  text-align: center;
}
.entry span,.entrys span{
  margin-top: .4rem;
  margin-right: 5px;
  font-size: .3rem;
  float: right;
  padding: .1rem .25rem;
  border: 1px solid #eee;
  cursor: pointer;
  border-radius: .1rem;
}
.ifBox span{
  border: 0;
  margin: 0;
  padding: .3rem 0;
  display: inline-block;
  width: 49%;
  text-align: center;
  border-radius:0;
}
.ifBox span:nth-child(1){
  float: left;
  border-right: 1px solid #666666;
}
.tip-msg {
  width: 90%;
  overflow: hidden;
  margin: 0 auto;
  /*background: url(../images/icon_tanhao.png) left center no-repeat;*/
  /*background-size: .35rem;*/
  /*padding-left: 1rem;*/
  padding-left: .46rem;
  position: relative;
  /*margin-top: .2rem;*/
  /*background-color: #ffffff;*/
}
.tip-msg img{
  width: .35rem;
  position: absolute;
  left: 0;
  top: 50%;
  background-color: #ffffff;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  z-index: 100;
}

.marquee-outer-wrapper{
  overflow: hidden;
  width: 100%;
}
.marquee-inner-wrapper{
  /*background: #eee;*/
  height: 40px;
  font-size: 14px;
  /*color: red;*/
  line-height: 40px;
  margin: 0 auto;
  white-space: nowrap;
  position: relative;
}
.marquee-inner-wrapper span{
  position: absolute;
  top: 0;
  left: 100%;
  height: 100%;
}
.first-marquee{
  -webkit-animation: 35s first-marquee linear infinite normal;
  animation: 35s first-marquee linear infinite normal;
  padding-right: 70%;
}
@keyframes first-marquee {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(-200%, 0, 0);
    transform: translate3d(-200%, 0, 0);
    display: none;
  }
}
.second-marquee{
  -webkit-animation: 35s first-marquee linear 17s infinite normal;
  animation: 35s first-marquee linear 17s infinite normal;
  padding-right: 53%;
}
@keyframes second-marquee {
  0% {
    -webkit-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
  }
  100% {
    -webkit-transform: translate3d(-200%, 0, 0);
    transform: translate3d(-200%, 0, 0);
    display: none;
  }
}
.swiper-containerT{
  height: .5rem;
  position: relative;
  width: 100%;
}
.swiper-containerT .swiper-wrapper{
    text-align: center;
}
.swiper-containerT .swiper-slide-active span{
  font-size: .33rem;
  color: rgb(80,123,206);
  border-bottom: 2px solid rgb(80,123,206);
  padding-bottom: .1rem;
}
.swiper-containerT .swiper-wrapper{
  position: relative;
  left: -39%;
}
.childSlide{
  height: 1.2rem;
  left: 0;
  top: 1.2rem;
  width: 100%;
  color: #333;
}
.childSlide .swiper-slide-active{
  color: #333;
}
.swiper-containerC img{
  width: 100%;
  height: 1.8rem;
  background: #666666;
  margin-bottom: .1rem;
}
.swiper-containerC{
  text-align: center;
    margin-top: .16rem;
}
.courseAll{
    font-size: .3rem;
    color: #999999;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.courseAll .courseAllLeft{
    display: inline-block;
    width: 30%;
    height: 100%;
    background: rgb(239,239,239);
    vertical-align: top;
    padding-top: .3rem;
   overflow-y: auto;
}

.courseAll .courseAllRight{
    display: inline-block;
    width: 67%;
    height: 100%;
    padding-top: .3rem;
    overflow-y: auto;
}
.courseAll .courseAllRight .courseAllRightUl{
    padding-left: 2%;
    /* overflow-x: auto; */
    /* white-space: nowrap; */
    padding-bottom: .3rem;
    border-bottom: 1px solid #ccc;
}
.courseAll .courseAllLeft li{
    margin: .5rem 0;
    text-align: center;
    padding: .3rem 0;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
}

.courseAll .courseAllLeft li.act{
    color: #333;
    background: #fff;
    border-bottom-left-radius: 1.3rem;
    border-top-left-radius: 1.3rem;
}
.courseAll .courseAllRightUl li{
    display: inline-block;
    padding:.1rem .15rem;
    text-align: center;
    /*width: 1.6rem;*/
    background:  rgb(239,239,239);
    border-radius: .4rem;
    /*overflow: hidden;*/
    white-space: nowrap;
    text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    margin-right: .1rem;
    font-size: .27rem;
    margin-bottom: .1rem;
}

.courseAll .courseAllRightUl li.act{
    color: #333;
}
.courseAll .rmkc{
    font-size: .4rem;
    font-weight: 500;
    color: #333333;
    text-align: center;
    position: relative;
    margin-top: .5rem;
}
.courseAll .rmkc span:nth-child(1){
    display: inline-block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 3%;
    width: 30%;
    height: 1px;
    background: #cccccc;
}
.courseAll .rmkc span:nth-child(2){
    display: inline-block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 3%;
    width: 30%;
    height: 1px;
    background: #cccccc;
}
#swiperC{
  width: 100%;
  margin-top: .1rem;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  scrollbar-width: none; /* firefox */
  -ms-overflow-style: none; /* IE 10+ */
}
#swiperC::-webkit-scrollbar {
  display: none; /* Chrome Safari */
}
#swiperC .jumpCourse{
  display: inline-block;
  width: 19%;
  margin-left:2.5%;
  text-align: center;
}
#swiperC .jumpCourse:last-child{
  margin-right:2.5%;
}
#swiperC  img{
  width: 100%;
  height: 1.1rem;
  background: #fff;
  margin-bottom: .1rem;
  border-top-left-radius: .1rem;
  border-top-right-radius: .1rem;
}
#swiperC .jumpCourse span{
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  font-size: 0.26rem;
  margin-top: .1rem;
}
#swiperC .jumpCourse span::after{
  /* content: '查看';
  color: rgb(73,120,193);
  display: block;
  font-size: 0.26rem;
  margin-top: .1rem;
  margin-bottom: .25rem; */
}

.overSubmit{
  width: 56%;
  margin: .5rem auto;
  display: block;
  color: #ffffff;
  font-size: 0.35rem;
  text-align: center;
  letter-spacing: 0.1rem;
  padding: 0.2rem 0rem;
  border-radius: 0.4rem;
  background: -webkit-linear-gradient(left, rgb(70,95,216), rgb(120,26,210));
  margin-bottom: .3rem;
}
.containerT{
  width: 100%;
  position: relative;
}
.containerT #swiperT{
  width: 93%;
  margin-left: 1%;
  /*margin: 0 auto;*/
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  scrollbar-width: none; /* firefox */
  -ms-overflow-style: none; /* IE 10+ */

}
.containerT .ifRight{
  display: none;
  position: absolute;
  top: 11%;
  right: 0;
  color: #fff;
  transform: scale(.7);
  -webkit-transform: scale(.7);
}
.containerT .slide{
  width: 24.5%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  display: inline-block;
  text-align: center;
  /*color: rgb(80,123,206);*/
  position: relative;
  padding-bottom: .15rem;
  font-weight: 500;
  color: #fff;
  /*background: #00b3ee;*/
  font-size: 0.26rem;
}
.containerT  .activeSlide{
  font-size: 0.33rem;
}
.containerT .slide span{
  display: none;
   position: absolute;
  /*border-bottom: 1px solid rgb(80,123,206);*/
  left: 0%;
  height: 1px;
  bottom: 0rem;
  width: 98%;
}