@charset "UTF-8";
/**********************
Date：2018-06-28
BuilderVersion：v3.0
CopyRight:iflytek_EUED
***********************/
/*body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  margin: 0;
  padding: 0;
}*/
body, button, input, select, textarea {
  font-family: 'Microsoft YaHei', arial, SimSun, sans-serif, tahoma; }

body {
  font-size: 14px;
  color: #666; }

input, select, textarea {
  font-size: 100%; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

textarea, input, button, a {
  outline: none; }

button {
  cursor: pointer; }

textarea {
  resize: none; }

fieldset, img {
  border: 0; }

address, cite, code, dfn, em, i, th, var {
  font-style: normal;
  font-weight: normal; }

ol, ul {
  list-style: none; }

caption, th {
  text-align: left; }

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

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

a {
  text-decoration: none; }

.clearfix:before, .clearfix:after {
  content: '';
  display: table; }

.clearfix:after {
  clear: both;
  overflow: hidden; }

.clearfix {
  *zoom: 1; }

/*
.fl {
    float: left;
}

.fr {
    float: right;
}

.hidenone {
    display: none;
}

.hide {
    visibility: hidden;
}

.mt10 {
    margin-top: 10px;
}

.mt20 {
    margin-top: 20px;
}

.ml10 {
    margin-left: 10px;
}

.mr10 {
    margin-right: 10px;
}

.pt10 {
    padding-top: 10px;
}

.pt20 {
    padding-top: 20px;
}

.pl10 {
    padding-left: 10px;
}

.pr10 {
    padding-right: 10px;
}

.tc {
    text-align: center;
}

.vm {
    display: inline-block;
    vertical-align: middle;
}*/
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent; }

html, body {
  height: 100%; }

.fl {
  float: left; }

.fr {
  float: right; }

.w100 {
  width: 1rem; }

.w180 {
  width: 1.8rem; }

.h64 {
  height: 0.64rem; }

.h100 {
  height: 1rem; }

.mt2 {
  margin-top: 2px/100rem; }

.mr2 {
  margin-right: 2px/100rem; }

.mb2 {
  margin-bottom: 2px/100rem; }

.ml2 {
  margin-left: 2px/100rem; }

.pt2 {
  padding-top: 2px/100rem; }

.pr2 {
  padding-right: 2px/100rem; }

.pb2 {
  padding-bottom: 2px/100rem; }

.pl2 {
  padding-left: 2px/100rem; }

i.iconfont {
  font-size: 0.3rem; }

.mt30 {
  margin-top: 0.3rem; }

@keyframes loading-rotate-z {
  0% {
    transform: rotateZ(0deg); }
  100% {
    transform: rotateZ(360deg); } }
.d-btn-wrap {
  position: relative;
  font-size: 0; }
  .d-btn-wrap a + a {
    margin-left: 0.28rem; }

.btn-style {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  /*overflow: hidden;*/ }
  .btn-style .iconfont {
    position: relative;
    top: 0.02rem;
    font-size: 100%;
    margin-right: 0.1rem;
    margin-left: -0.1rem; }
    .btn-style .iconfont.icon-ZK-PC-add {
      top: 1px;
      font-size: 0.24rem; }
  .btn-style.small {
    min-width: 1rem;
    padding: 0 0.2rem;
    font-size: 0.2rem;
    height: 0.4rem;
    line-height: 0.4rem;
    border-radius: 0.2rem; }
    .btn-style.small.stroke-blue:hover, .btn-style.small.full-blue:hover {
      background-color: #5AA3FF;
      border-color: #5AA3FF;
      line-height: 0.4rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.small.stroke-blue:hover, [data-theme="primary"] .btn-style.small.full-blue:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.small.stroke-blue:hover, [data-theme="secondary"] .btn-style.small.full-blue:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.small.stroke-blue:hover, [data-theme="orange"] .btn-style.small.full-blue:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.small.stroke-blue:hover, [data-theme="green"] .btn-style.small.full-blue:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.small.stroke-blue:hover, [data-theme="red"] .btn-style.small.full-blue:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.small.stroke-blue:hover, [data-theme="purple"] .btn-style.small.full-blue:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.small.stroke-blue:hover, [data-theme="primary"] .btn-style.small.full-blue:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.small.stroke-blue:hover, [data-theme="secondary"] .btn-style.small.full-blue:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.small.stroke-blue:hover, [data-theme="orange"] .btn-style.small.full-blue:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.small.stroke-blue:hover, [data-theme="green"] .btn-style.small.full-blue:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.small.stroke-blue:hover, [data-theme="red"] .btn-style.small.full-blue:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.small.stroke-blue:hover, [data-theme="purple"] .btn-style.small.full-blue:hover {
        color: #A89BFF; }
    .btn-style.small.stroke-blue:active, .btn-style.small.full-blue:active {
      background-color: #2D76D1; }
      [data-theme="primary"] .btn-style.small.stroke-blue:active, [data-theme="primary"] .btn-style.small.full-blue:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.small.stroke-blue:active, [data-theme="secondary"] .btn-style.small.full-blue:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.small.stroke-blue:active, [data-theme="orange"] .btn-style.small.full-blue:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.small.stroke-blue:active, [data-theme="green"] .btn-style.small.full-blue:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.small.stroke-blue:active, [data-theme="red"] .btn-style.small.full-blue:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.small.stroke-blue:active, [data-theme="purple"] .btn-style.small.full-blue:active {
        background-color: #A89BFF; }
    .btn-style.small.stroke-blue {
      line-height: 0.38rem; }
    .btn-style.small.full-green {
      border-radius: 0.2rem; }
      .btn-style.small.full-green:hover {
        background-color: #4BCD81;
        border-color: #4BCD81;
        line-height: 0.4rem;
        color: #fff; }
        [data-theme="primary"] .btn-style.small.full-green:hover {
          background-color: #368FFF; }
        [data-theme="secondary"] .btn-style.small.full-green:hover {
          background-color: #15C8FF; }
        [data-theme="orange"] .btn-style.small.full-green:hover {
          background-color: #FFAE00; }
        [data-theme="green"] .btn-style.small.full-green:hover {
          background-color: #24C366; }
        [data-theme="red"] .btn-style.small.full-green:hover {
          background-color: #FF543A; }
        [data-theme="purple"] .btn-style.small.full-green:hover {
          background-color: #A89BFF; }
        [data-theme="primary"] .btn-style.small.full-green:hover {
          color: #368FFF; }
        [data-theme="secondary"] .btn-style.small.full-green:hover {
          color: #15C8FF; }
        [data-theme="orange"] .btn-style.small.full-green:hover {
          color: #FFAE00; }
        [data-theme="green"] .btn-style.small.full-green:hover {
          color: #24C366; }
        [data-theme="red"] .btn-style.small.full-green:hover {
          color: #FF543A; }
        [data-theme="purple"] .btn-style.small.full-green:hover {
          color: #A89BFF; }
      .btn-style.small.full-green:active {
        background-color: #24B05C; }
        [data-theme="primary"] .btn-style.small.full-green:active {
          background-color: #368FFF; }
        [data-theme="secondary"] .btn-style.small.full-green:active {
          background-color: #15C8FF; }
        [data-theme="orange"] .btn-style.small.full-green:active {
          background-color: #FFAE00; }
        [data-theme="green"] .btn-style.small.full-green:active {
          background-color: #24C366; }
        [data-theme="red"] .btn-style.small.full-green:active {
          background-color: #FF543A; }
        [data-theme="purple"] .btn-style.small.full-green:active {
          background-color: #A89BFF; }
    .btn-style.small.stroke-orange:hover {
      background-color: #FFBC2E;
      border-color: #FFBC2E;
      line-height: 0.4rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.small.stroke-orange:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.small.stroke-orange:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.small.stroke-orange:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.small.stroke-orange:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.small.stroke-orange:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.small.stroke-orange:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.small.stroke-orange:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.small.stroke-orange:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.small.stroke-orange:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.small.stroke-orange:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.small.stroke-orange:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.small.stroke-orange:hover {
        color: #A89BFF; }
    .btn-style.small.stroke-orange:active {
      background-color: #E89F01; }
      [data-theme="primary"] .btn-style.small.stroke-orange:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.small.stroke-orange:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.small.stroke-orange:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.small.stroke-orange:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.small.stroke-orange:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.small.stroke-orange:active {
        background-color: #A89BFF; }
    .btn-style.small.full-red:hover {
      background-color: #FF735D;
      border-color: #FF735D;
      line-height: 0.4rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.small.full-red:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.small.full-red:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.small.full-red:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.small.full-red:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.small.full-red:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.small.full-red:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.small.full-red:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.small.full-red:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.small.full-red:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.small.full-red:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.small.full-red:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.small.full-red:hover {
        color: #A89BFF; }
    .btn-style.small.full-red:active {
      background-color: #E94D35; }
      [data-theme="primary"] .btn-style.small.full-red:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.small.full-red:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.small.full-red:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.small.full-red:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.small.full-red:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.small.full-red:active {
        background-color: #A89BFF; }
  .btn-style.normal, .btn-style.medium {
    min-width: 1.6rem;
    padding: 0 0.32rem; }
    .btn-style.normal.no-min, .btn-style.medium.no-min {
      min-width: auto; }
  .btn-style.normal {
    font-size: 0.22rem;
    height: 0.48rem;
    line-height: 0.48rem;
    border-radius: 0.24rem; }
    .btn-style.normal.stroke-blue:hover, .btn-style.normal.full-blue:hover {
      background-color: #5AA3FF;
      border-color: #5AA3FF;
      line-height: 0.48rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.normal.stroke-blue:hover, [data-theme="primary"] .btn-style.normal.full-blue:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.normal.stroke-blue:hover, [data-theme="secondary"] .btn-style.normal.full-blue:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.normal.stroke-blue:hover, [data-theme="orange"] .btn-style.normal.full-blue:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.normal.stroke-blue:hover, [data-theme="green"] .btn-style.normal.full-blue:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.normal.stroke-blue:hover, [data-theme="red"] .btn-style.normal.full-blue:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.normal.stroke-blue:hover, [data-theme="purple"] .btn-style.normal.full-blue:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.normal.stroke-blue:hover, [data-theme="primary"] .btn-style.normal.full-blue:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.normal.stroke-blue:hover, [data-theme="secondary"] .btn-style.normal.full-blue:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.normal.stroke-blue:hover, [data-theme="orange"] .btn-style.normal.full-blue:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.normal.stroke-blue:hover, [data-theme="green"] .btn-style.normal.full-blue:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.normal.stroke-blue:hover, [data-theme="red"] .btn-style.normal.full-blue:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.normal.stroke-blue:hover, [data-theme="purple"] .btn-style.normal.full-blue:hover {
        color: #A89BFF; }
    .btn-style.normal.stroke-blue:active, .btn-style.normal.full-blue:active {
      background-color: #2D76D1; }
      [data-theme="primary"] .btn-style.normal.stroke-blue:active, [data-theme="primary"] .btn-style.normal.full-blue:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.normal.stroke-blue:active, [data-theme="secondary"] .btn-style.normal.full-blue:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.normal.stroke-blue:active, [data-theme="orange"] .btn-style.normal.full-blue:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.normal.stroke-blue:active, [data-theme="green"] .btn-style.normal.full-blue:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.normal.stroke-blue:active, [data-theme="red"] .btn-style.normal.full-blue:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.normal.stroke-blue:active, [data-theme="purple"] .btn-style.normal.full-blue:active {
        background-color: #A89BFF; }
    .btn-style.normal.stroke-blue {
      line-height: 0.46rem; }
    .btn-style.normal.full-green {
      border-radius: 0.24rem; }
      .btn-style.normal.full-green:hover {
        background-color: #4BCD81;
        border-color: #4BCD81;
        line-height: 0.48rem;
        color: #fff; }
        [data-theme="primary"] .btn-style.normal.full-green:hover {
          background-color: #368FFF; }
        [data-theme="secondary"] .btn-style.normal.full-green:hover {
          background-color: #15C8FF; }
        [data-theme="orange"] .btn-style.normal.full-green:hover {
          background-color: #FFAE00; }
        [data-theme="green"] .btn-style.normal.full-green:hover {
          background-color: #24C366; }
        [data-theme="red"] .btn-style.normal.full-green:hover {
          background-color: #FF543A; }
        [data-theme="purple"] .btn-style.normal.full-green:hover {
          background-color: #A89BFF; }
        [data-theme="primary"] .btn-style.normal.full-green:hover {
          color: #368FFF; }
        [data-theme="secondary"] .btn-style.normal.full-green:hover {
          color: #15C8FF; }
        [data-theme="orange"] .btn-style.normal.full-green:hover {
          color: #FFAE00; }
        [data-theme="green"] .btn-style.normal.full-green:hover {
          color: #24C366; }
        [data-theme="red"] .btn-style.normal.full-green:hover {
          color: #FF543A; }
        [data-theme="purple"] .btn-style.normal.full-green:hover {
          color: #A89BFF; }
      .btn-style.normal.full-green:active {
        background-color: #24B05C; }
        [data-theme="primary"] .btn-style.normal.full-green:active {
          background-color: #368FFF; }
        [data-theme="secondary"] .btn-style.normal.full-green:active {
          background-color: #15C8FF; }
        [data-theme="orange"] .btn-style.normal.full-green:active {
          background-color: #FFAE00; }
        [data-theme="green"] .btn-style.normal.full-green:active {
          background-color: #24C366; }
        [data-theme="red"] .btn-style.normal.full-green:active {
          background-color: #FF543A; }
        [data-theme="purple"] .btn-style.normal.full-green:active {
          background-color: #A89BFF; }
    .btn-style.normal.stroke-orange:hover {
      background-color: #FFBC2E;
      border-color: #FFBC2E;
      line-height: 0.48rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.normal.stroke-orange:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.normal.stroke-orange:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.normal.stroke-orange:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.normal.stroke-orange:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.normal.stroke-orange:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.normal.stroke-orange:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.normal.stroke-orange:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.normal.stroke-orange:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.normal.stroke-orange:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.normal.stroke-orange:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.normal.stroke-orange:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.normal.stroke-orange:hover {
        color: #A89BFF; }
    .btn-style.normal.stroke-orange:active {
      background-color: #E89F01; }
      [data-theme="primary"] .btn-style.normal.stroke-orange:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.normal.stroke-orange:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.normal.stroke-orange:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.normal.stroke-orange:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.normal.stroke-orange:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.normal.stroke-orange:active {
        background-color: #A89BFF; }
    .btn-style.normal.full-red:hover {
      background-color: #FF735D;
      border-color: #FF735D;
      line-height: 0.48rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.normal.full-red:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.normal.full-red:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.normal.full-red:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.normal.full-red:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.normal.full-red:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.normal.full-red:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.normal.full-red:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.normal.full-red:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.normal.full-red:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.normal.full-red:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.normal.full-red:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.normal.full-red:hover {
        color: #A89BFF; }
    .btn-style.normal.full-red:active {
      background-color: #E94D35; }
      [data-theme="primary"] .btn-style.normal.full-red:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.normal.full-red:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.normal.full-red:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.normal.full-red:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.normal.full-red:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.normal.full-red:active {
        background-color: #A89BFF; }
  .btn-style.medium {
    font-size: 0.24rem;
    height: 0.56rem;
    line-height: 0.56rem;
    border-radius: 0.28rem; }
    .btn-style.medium.stroke-blue:hover, .btn-style.medium.full-blue:hover {
      background-color: #5AA3FF;
      border-color: #5AA3FF;
      line-height: 0.56rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.medium.stroke-blue:hover, [data-theme="primary"] .btn-style.medium.full-blue:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.medium.stroke-blue:hover, [data-theme="secondary"] .btn-style.medium.full-blue:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.medium.stroke-blue:hover, [data-theme="orange"] .btn-style.medium.full-blue:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.medium.stroke-blue:hover, [data-theme="green"] .btn-style.medium.full-blue:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.medium.stroke-blue:hover, [data-theme="red"] .btn-style.medium.full-blue:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.medium.stroke-blue:hover, [data-theme="purple"] .btn-style.medium.full-blue:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.medium.stroke-blue:hover, [data-theme="primary"] .btn-style.medium.full-blue:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.medium.stroke-blue:hover, [data-theme="secondary"] .btn-style.medium.full-blue:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.medium.stroke-blue:hover, [data-theme="orange"] .btn-style.medium.full-blue:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.medium.stroke-blue:hover, [data-theme="green"] .btn-style.medium.full-blue:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.medium.stroke-blue:hover, [data-theme="red"] .btn-style.medium.full-blue:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.medium.stroke-blue:hover, [data-theme="purple"] .btn-style.medium.full-blue:hover {
        color: #A89BFF; }
    .btn-style.medium.stroke-blue:active, .btn-style.medium.full-blue:active {
      background-color: #2D76D1; }
      [data-theme="primary"] .btn-style.medium.stroke-blue:active, [data-theme="primary"] .btn-style.medium.full-blue:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.medium.stroke-blue:active, [data-theme="secondary"] .btn-style.medium.full-blue:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.medium.stroke-blue:active, [data-theme="orange"] .btn-style.medium.full-blue:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.medium.stroke-blue:active, [data-theme="green"] .btn-style.medium.full-blue:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.medium.stroke-blue:active, [data-theme="red"] .btn-style.medium.full-blue:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.medium.stroke-blue:active, [data-theme="purple"] .btn-style.medium.full-blue:active {
        background-color: #A89BFF; }
    .btn-style.medium.stroke-blue {
      line-height: 0.54rem; }
    .btn-style.medium.full-green {
      border-radius: 0.28rem; }
      .btn-style.medium.full-green:hover {
        background-color: #4BCD81;
        border-color: #4BCD81;
        line-height: 0.56rem;
        color: #fff; }
        [data-theme="primary"] .btn-style.medium.full-green:hover {
          background-color: #368FFF; }
        [data-theme="secondary"] .btn-style.medium.full-green:hover {
          background-color: #15C8FF; }
        [data-theme="orange"] .btn-style.medium.full-green:hover {
          background-color: #FFAE00; }
        [data-theme="green"] .btn-style.medium.full-green:hover {
          background-color: #24C366; }
        [data-theme="red"] .btn-style.medium.full-green:hover {
          background-color: #FF543A; }
        [data-theme="purple"] .btn-style.medium.full-green:hover {
          background-color: #A89BFF; }
        [data-theme="primary"] .btn-style.medium.full-green:hover {
          color: #368FFF; }
        [data-theme="secondary"] .btn-style.medium.full-green:hover {
          color: #15C8FF; }
        [data-theme="orange"] .btn-style.medium.full-green:hover {
          color: #FFAE00; }
        [data-theme="green"] .btn-style.medium.full-green:hover {
          color: #24C366; }
        [data-theme="red"] .btn-style.medium.full-green:hover {
          color: #FF543A; }
        [data-theme="purple"] .btn-style.medium.full-green:hover {
          color: #A89BFF; }
      .btn-style.medium.full-green:active {
        background-color: #24B05C; }
        [data-theme="primary"] .btn-style.medium.full-green:active {
          background-color: #368FFF; }
        [data-theme="secondary"] .btn-style.medium.full-green:active {
          background-color: #15C8FF; }
        [data-theme="orange"] .btn-style.medium.full-green:active {
          background-color: #FFAE00; }
        [data-theme="green"] .btn-style.medium.full-green:active {
          background-color: #24C366; }
        [data-theme="red"] .btn-style.medium.full-green:active {
          background-color: #FF543A; }
        [data-theme="purple"] .btn-style.medium.full-green:active {
          background-color: #A89BFF; }
    .btn-style.medium.stroke-orange:hover {
      background-color: #FFBC2E;
      border-color: #FFBC2E;
      line-height: 0.56rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.medium.stroke-orange:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.medium.stroke-orange:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.medium.stroke-orange:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.medium.stroke-orange:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.medium.stroke-orange:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.medium.stroke-orange:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.medium.stroke-orange:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.medium.stroke-orange:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.medium.stroke-orange:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.medium.stroke-orange:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.medium.stroke-orange:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.medium.stroke-orange:hover {
        color: #A89BFF; }
    .btn-style.medium.stroke-orange:active {
      background-color: #E89F01; }
      [data-theme="primary"] .btn-style.medium.stroke-orange:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.medium.stroke-orange:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.medium.stroke-orange:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.medium.stroke-orange:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.medium.stroke-orange:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.medium.stroke-orange:active {
        background-color: #A89BFF; }
    .btn-style.medium.full-red:hover {
      background-color: #FF735D;
      border-color: #FF735D;
      line-height: 0.56rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.medium.full-red:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.medium.full-red:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.medium.full-red:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.medium.full-red:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.medium.full-red:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.medium.full-red:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.medium.full-red:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.medium.full-red:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.medium.full-red:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.medium.full-red:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.medium.full-red:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.medium.full-red:hover {
        color: #A89BFF; }
    .btn-style.medium.full-red:active {
      background-color: #E94D35; }
      [data-theme="primary"] .btn-style.medium.full-red:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.medium.full-red:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.medium.full-red:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.medium.full-red:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.medium.full-red:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.medium.full-red:active {
        background-color: #A89BFF; }
  .btn-style.big, .btn-style.big-xl {
    min-width: 2.08rem;
    padding: 0 0.48rem; }
    .btn-style.big.no-min, .btn-style.big-xl.no-min {
      min-width: auto; }
  .btn-style.big {
    font-size: 0.28rem;
    height: 0.72rem;
    line-height: 0.72rem;
    border-radius: 0.36rem; }
    .btn-style.big.stroke-blue:hover, .btn-style.big.full-blue:hover {
      background-color: #5AA3FF;
      border-color: #5AA3FF;
      line-height: 0.72rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.big.stroke-blue:hover, [data-theme="primary"] .btn-style.big.full-blue:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.big.stroke-blue:hover, [data-theme="secondary"] .btn-style.big.full-blue:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.big.stroke-blue:hover, [data-theme="orange"] .btn-style.big.full-blue:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.big.stroke-blue:hover, [data-theme="green"] .btn-style.big.full-blue:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.big.stroke-blue:hover, [data-theme="red"] .btn-style.big.full-blue:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.big.stroke-blue:hover, [data-theme="purple"] .btn-style.big.full-blue:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.big.stroke-blue:hover, [data-theme="primary"] .btn-style.big.full-blue:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.big.stroke-blue:hover, [data-theme="secondary"] .btn-style.big.full-blue:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.big.stroke-blue:hover, [data-theme="orange"] .btn-style.big.full-blue:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.big.stroke-blue:hover, [data-theme="green"] .btn-style.big.full-blue:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.big.stroke-blue:hover, [data-theme="red"] .btn-style.big.full-blue:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.big.stroke-blue:hover, [data-theme="purple"] .btn-style.big.full-blue:hover {
        color: #A89BFF; }
    .btn-style.big.stroke-blue:active, .btn-style.big.full-blue:active {
      background-color: #2D76D1; }
      [data-theme="primary"] .btn-style.big.stroke-blue:active, [data-theme="primary"] .btn-style.big.full-blue:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.big.stroke-blue:active, [data-theme="secondary"] .btn-style.big.full-blue:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.big.stroke-blue:active, [data-theme="orange"] .btn-style.big.full-blue:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.big.stroke-blue:active, [data-theme="green"] .btn-style.big.full-blue:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.big.stroke-blue:active, [data-theme="red"] .btn-style.big.full-blue:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.big.stroke-blue:active, [data-theme="purple"] .btn-style.big.full-blue:active {
        background-color: #A89BFF; }
    .btn-style.big.stroke-blue {
      line-height: 0.7rem; }
    .btn-style.big.full-green {
      border-radius: 0.36rem; }
      .btn-style.big.full-green:hover {
        background-color: #4BCD81;
        border-color: #4BCD81;
        line-height: 0.72rem;
        color: #fff; }
        [data-theme="primary"] .btn-style.big.full-green:hover {
          background-color: #368FFF; }
        [data-theme="secondary"] .btn-style.big.full-green:hover {
          background-color: #15C8FF; }
        [data-theme="orange"] .btn-style.big.full-green:hover {
          background-color: #FFAE00; }
        [data-theme="green"] .btn-style.big.full-green:hover {
          background-color: #24C366; }
        [data-theme="red"] .btn-style.big.full-green:hover {
          background-color: #FF543A; }
        [data-theme="purple"] .btn-style.big.full-green:hover {
          background-color: #A89BFF; }
        [data-theme="primary"] .btn-style.big.full-green:hover {
          color: #368FFF; }
        [data-theme="secondary"] .btn-style.big.full-green:hover {
          color: #15C8FF; }
        [data-theme="orange"] .btn-style.big.full-green:hover {
          color: #FFAE00; }
        [data-theme="green"] .btn-style.big.full-green:hover {
          color: #24C366; }
        [data-theme="red"] .btn-style.big.full-green:hover {
          color: #FF543A; }
        [data-theme="purple"] .btn-style.big.full-green:hover {
          color: #A89BFF; }
      .btn-style.big.full-green:active {
        background-color: #24B05C; }
        [data-theme="primary"] .btn-style.big.full-green:active {
          background-color: #368FFF; }
        [data-theme="secondary"] .btn-style.big.full-green:active {
          background-color: #15C8FF; }
        [data-theme="orange"] .btn-style.big.full-green:active {
          background-color: #FFAE00; }
        [data-theme="green"] .btn-style.big.full-green:active {
          background-color: #24C366; }
        [data-theme="red"] .btn-style.big.full-green:active {
          background-color: #FF543A; }
        [data-theme="purple"] .btn-style.big.full-green:active {
          background-color: #A89BFF; }
    .btn-style.big.stroke-orange:hover {
      background-color: #FFBC2E;
      border-color: #FFBC2E;
      line-height: 0.72rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.big.stroke-orange:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.big.stroke-orange:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.big.stroke-orange:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.big.stroke-orange:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.big.stroke-orange:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.big.stroke-orange:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.big.stroke-orange:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.big.stroke-orange:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.big.stroke-orange:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.big.stroke-orange:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.big.stroke-orange:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.big.stroke-orange:hover {
        color: #A89BFF; }
    .btn-style.big.stroke-orange:active {
      background-color: #E89F01; }
      [data-theme="primary"] .btn-style.big.stroke-orange:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.big.stroke-orange:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.big.stroke-orange:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.big.stroke-orange:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.big.stroke-orange:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.big.stroke-orange:active {
        background-color: #A89BFF; }
    .btn-style.big.full-red:hover {
      background-color: #FF735D;
      border-color: #FF735D;
      line-height: 0.72rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.big.full-red:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.big.full-red:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.big.full-red:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.big.full-red:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.big.full-red:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.big.full-red:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.big.full-red:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.big.full-red:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.big.full-red:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.big.full-red:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.big.full-red:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.big.full-red:hover {
        color: #A89BFF; }
    .btn-style.big.full-red:active {
      background-color: #E94D35; }
      [data-theme="primary"] .btn-style.big.full-red:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.big.full-red:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.big.full-red:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.big.full-red:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.big.full-red:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.big.full-red:active {
        background-color: #A89BFF; }
  .btn-style.big-xl {
    font-size: 0.28rem;
    height: 0.8rem;
    line-height: 0.8rem;
    border-radius: 0.4rem; }
    .btn-style.big-xl.stroke-blue:hover, .btn-style.big-xl.full-blue:hover {
      background-color: #5AA3FF;
      border-color: #5AA3FF;
      line-height: 0.8rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.big-xl.stroke-blue:hover, [data-theme="primary"] .btn-style.big-xl.full-blue:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.big-xl.stroke-blue:hover, [data-theme="secondary"] .btn-style.big-xl.full-blue:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.big-xl.stroke-blue:hover, [data-theme="orange"] .btn-style.big-xl.full-blue:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.big-xl.stroke-blue:hover, [data-theme="green"] .btn-style.big-xl.full-blue:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.big-xl.stroke-blue:hover, [data-theme="red"] .btn-style.big-xl.full-blue:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.big-xl.stroke-blue:hover, [data-theme="purple"] .btn-style.big-xl.full-blue:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.big-xl.stroke-blue:hover, [data-theme="primary"] .btn-style.big-xl.full-blue:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.big-xl.stroke-blue:hover, [data-theme="secondary"] .btn-style.big-xl.full-blue:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.big-xl.stroke-blue:hover, [data-theme="orange"] .btn-style.big-xl.full-blue:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.big-xl.stroke-blue:hover, [data-theme="green"] .btn-style.big-xl.full-blue:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.big-xl.stroke-blue:hover, [data-theme="red"] .btn-style.big-xl.full-blue:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.big-xl.stroke-blue:hover, [data-theme="purple"] .btn-style.big-xl.full-blue:hover {
        color: #A89BFF; }
    .btn-style.big-xl.stroke-blue:active, .btn-style.big-xl.full-blue:active {
      background-color: #2D76D1; }
      [data-theme="primary"] .btn-style.big-xl.stroke-blue:active, [data-theme="primary"] .btn-style.big-xl.full-blue:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.big-xl.stroke-blue:active, [data-theme="secondary"] .btn-style.big-xl.full-blue:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.big-xl.stroke-blue:active, [data-theme="orange"] .btn-style.big-xl.full-blue:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.big-xl.stroke-blue:active, [data-theme="green"] .btn-style.big-xl.full-blue:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.big-xl.stroke-blue:active, [data-theme="red"] .btn-style.big-xl.full-blue:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.big-xl.stroke-blue:active, [data-theme="purple"] .btn-style.big-xl.full-blue:active {
        background-color: #A89BFF; }
    .btn-style.big-xl.stroke-blue {
      line-height: 0.78rem; }
    .btn-style.big-xl.full-green {
      border-radius: 0.4rem; }
      .btn-style.big-xl.full-green:hover {
        background-color: #4BCD81;
        border-color: #4BCD81;
        line-height: 0.8rem;
        color: #fff; }
        [data-theme="primary"] .btn-style.big-xl.full-green:hover {
          background-color: #368FFF; }
        [data-theme="secondary"] .btn-style.big-xl.full-green:hover {
          background-color: #15C8FF; }
        [data-theme="orange"] .btn-style.big-xl.full-green:hover {
          background-color: #FFAE00; }
        [data-theme="green"] .btn-style.big-xl.full-green:hover {
          background-color: #24C366; }
        [data-theme="red"] .btn-style.big-xl.full-green:hover {
          background-color: #FF543A; }
        [data-theme="purple"] .btn-style.big-xl.full-green:hover {
          background-color: #A89BFF; }
        [data-theme="primary"] .btn-style.big-xl.full-green:hover {
          color: #368FFF; }
        [data-theme="secondary"] .btn-style.big-xl.full-green:hover {
          color: #15C8FF; }
        [data-theme="orange"] .btn-style.big-xl.full-green:hover {
          color: #FFAE00; }
        [data-theme="green"] .btn-style.big-xl.full-green:hover {
          color: #24C366; }
        [data-theme="red"] .btn-style.big-xl.full-green:hover {
          color: #FF543A; }
        [data-theme="purple"] .btn-style.big-xl.full-green:hover {
          color: #A89BFF; }
      .btn-style.big-xl.full-green:active {
        background-color: #24B05C; }
        [data-theme="primary"] .btn-style.big-xl.full-green:active {
          background-color: #368FFF; }
        [data-theme="secondary"] .btn-style.big-xl.full-green:active {
          background-color: #15C8FF; }
        [data-theme="orange"] .btn-style.big-xl.full-green:active {
          background-color: #FFAE00; }
        [data-theme="green"] .btn-style.big-xl.full-green:active {
          background-color: #24C366; }
        [data-theme="red"] .btn-style.big-xl.full-green:active {
          background-color: #FF543A; }
        [data-theme="purple"] .btn-style.big-xl.full-green:active {
          background-color: #A89BFF; }
    .btn-style.big-xl.stroke-orange:hover {
      background-color: #FFBC2E;
      border-color: #FFBC2E;
      line-height: 0.8rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.big-xl.stroke-orange:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.big-xl.stroke-orange:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.big-xl.stroke-orange:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.big-xl.stroke-orange:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.big-xl.stroke-orange:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.big-xl.stroke-orange:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.big-xl.stroke-orange:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.big-xl.stroke-orange:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.big-xl.stroke-orange:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.big-xl.stroke-orange:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.big-xl.stroke-orange:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.big-xl.stroke-orange:hover {
        color: #A89BFF; }
    .btn-style.big-xl.stroke-orange:active {
      background-color: #E89F01; }
      [data-theme="primary"] .btn-style.big-xl.stroke-orange:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.big-xl.stroke-orange:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.big-xl.stroke-orange:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.big-xl.stroke-orange:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.big-xl.stroke-orange:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.big-xl.stroke-orange:active {
        background-color: #A89BFF; }
    .btn-style.big-xl.full-red:hover {
      background-color: #FF735D;
      border-color: #FF735D;
      line-height: 0.8rem;
      color: #fff; }
      [data-theme="primary"] .btn-style.big-xl.full-red:hover {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.big-xl.full-red:hover {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.big-xl.full-red:hover {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.big-xl.full-red:hover {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.big-xl.full-red:hover {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.big-xl.full-red:hover {
        background-color: #A89BFF; }
      [data-theme="primary"] .btn-style.big-xl.full-red:hover {
        color: #368FFF; }
      [data-theme="secondary"] .btn-style.big-xl.full-red:hover {
        color: #15C8FF; }
      [data-theme="orange"] .btn-style.big-xl.full-red:hover {
        color: #FFAE00; }
      [data-theme="green"] .btn-style.big-xl.full-red:hover {
        color: #24C366; }
      [data-theme="red"] .btn-style.big-xl.full-red:hover {
        color: #FF543A; }
      [data-theme="purple"] .btn-style.big-xl.full-red:hover {
        color: #A89BFF; }
    .btn-style.big-xl.full-red:active {
      background-color: #E94D35; }
      [data-theme="primary"] .btn-style.big-xl.full-red:active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.big-xl.full-red:active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.big-xl.full-red:active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.big-xl.full-red:active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.big-xl.full-red:active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.big-xl.full-red:active {
        background-color: #A89BFF; }
  .btn-style.stroke-blue.disable, .btn-style.full-blue.disable {
    cursor: not-allowed;
    background-color: #C8E0FF; }
    [data-theme="primary"] .btn-style.stroke-blue.disable, [data-theme="primary"] .btn-style.full-blue.disable {
      background-color: #368FFF; }
    [data-theme="secondary"] .btn-style.stroke-blue.disable, [data-theme="secondary"] .btn-style.full-blue.disable {
      background-color: #15C8FF; }
    [data-theme="orange"] .btn-style.stroke-blue.disable, [data-theme="orange"] .btn-style.full-blue.disable {
      background-color: #FFAE00; }
    [data-theme="green"] .btn-style.stroke-blue.disable, [data-theme="green"] .btn-style.full-blue.disable {
      background-color: #24C366; }
    [data-theme="red"] .btn-style.stroke-blue.disable, [data-theme="red"] .btn-style.full-blue.disable {
      background-color: #FF543A; }
    [data-theme="purple"] .btn-style.stroke-blue.disable, [data-theme="purple"] .btn-style.full-blue.disable {
      background-color: #A89BFF; }
    .btn-style.stroke-blue.disable:hover, .btn-style.stroke-blue.disable:active, .btn-style.stroke-blue.disable.active, .btn-style.full-blue.disable:hover, .btn-style.full-blue.disable:active, .btn-style.full-blue.disable.active {
      background-color: #C8E0FF; }
      [data-theme="primary"] .btn-style.stroke-blue.disable:hover, [data-theme="primary"] .btn-style.stroke-blue.disable:active, [data-theme="primary"] .btn-style.stroke-blue.disable.active, [data-theme="primary"] .btn-style.full-blue.disable:hover, [data-theme="primary"] .btn-style.full-blue.disable:active, [data-theme="primary"] .btn-style.full-blue.disable.active {
        background-color: #368FFF; }
      [data-theme="secondary"] .btn-style.stroke-blue.disable:hover, [data-theme="secondary"] .btn-style.stroke-blue.disable:active, [data-theme="secondary"] .btn-style.stroke-blue.disable.active, [data-theme="secondary"] .btn-style.full-blue.disable:hover, [data-theme="secondary"] .btn-style.full-blue.disable:active, [data-theme="secondary"] .btn-style.full-blue.disable.active {
        background-color: #15C8FF; }
      [data-theme="orange"] .btn-style.stroke-blue.disable:hover, [data-theme="orange"] .btn-style.stroke-blue.disable:active, [data-theme="orange"] .btn-style.stroke-blue.disable.active, [data-theme="orange"] .btn-style.full-blue.disable:hover, [data-theme="orange"] .btn-style.full-blue.disable:active, [data-theme="orange"] .btn-style.full-blue.disable.active {
        background-color: #FFAE00; }
      [data-theme="green"] .btn-style.stroke-blue.disable:hover, [data-theme="green"] .btn-style.stroke-blue.disable:active, [data-theme="green"] .btn-style.stroke-blue.disable.active, [data-theme="green"] .btn-style.full-blue.disable:hover, [data-theme="green"] .btn-style.full-blue.disable:active, [data-theme="green"] .btn-style.full-blue.disable.active {
        background-color: #24C366; }
      [data-theme="red"] .btn-style.stroke-blue.disable:hover, [data-theme="red"] .btn-style.stroke-blue.disable:active, [data-theme="red"] .btn-style.stroke-blue.disable.active, [data-theme="red"] .btn-style.full-blue.disable:hover, [data-theme="red"] .btn-style.full-blue.disable:active, [data-theme="red"] .btn-style.full-blue.disable.active {
        background-color: #FF543A; }
      [data-theme="purple"] .btn-style.stroke-blue.disable:hover, [data-theme="purple"] .btn-style.stroke-blue.disable:active, [data-theme="purple"] .btn-style.stroke-blue.disable.active, [data-theme="purple"] .btn-style.full-blue.disable:hover, [data-theme="purple"] .btn-style.full-blue.disable:active, [data-theme="purple"] .btn-style.full-blue.disable.active {
        background-color: #A89BFF; }
  .btn-style.stroke-blue {
    border-width: 0.01rem;
    border-style: solid;
    border-color: #368FFF;
    color: #368FFF; }
    [data-theme="primary"] .btn-style.stroke-blue {
      border-color: #368FFF; }
    [data-theme="secondary"] .btn-style.stroke-blue {
      border-color: #15C8FF; }
    [data-theme="orange"] .btn-style.stroke-blue {
      border-color: #FFAE00; }
    [data-theme="green"] .btn-style.stroke-blue {
      border-color: #24C366; }
    [data-theme="red"] .btn-style.stroke-blue {
      border-color: #FF543A; }
    [data-theme="purple"] .btn-style.stroke-blue {
      border-color: #A89BFF; }
    [data-theme="primary"] .btn-style.stroke-blue {
      color: #368FFF; }
    [data-theme="secondary"] .btn-style.stroke-blue {
      color: #15C8FF; }
    [data-theme="orange"] .btn-style.stroke-blue {
      color: #FFAE00; }
    [data-theme="green"] .btn-style.stroke-blue {
      color: #24C366; }
    [data-theme="red"] .btn-style.stroke-blue {
      color: #FF543A; }
    [data-theme="purple"] .btn-style.stroke-blue {
      color: #A89BFF; }
  .btn-style.full-blue {
    background-color: #368FFF;
    color: #fff; }
    [data-theme="primary"] .btn-style.full-blue {
      background-color: #368FFF; }
    [data-theme="secondary"] .btn-style.full-blue {
      background-color: #15C8FF; }
    [data-theme="orange"] .btn-style.full-blue {
      background-color: #FFAE00; }
    [data-theme="green"] .btn-style.full-blue {
      background-color: #24C366; }
    [data-theme="red"] .btn-style.full-blue {
      background-color: #FF543A; }
    [data-theme="purple"] .btn-style.full-blue {
      background-color: #A89BFF; }
    [data-theme="primary"] .btn-style.full-blue {
      color: #368FFF; }
    [data-theme="secondary"] .btn-style.full-blue {
      color: #15C8FF; }
    [data-theme="orange"] .btn-style.full-blue {
      color: #FFAE00; }
    [data-theme="green"] .btn-style.full-blue {
      color: #24C366; }
    [data-theme="red"] .btn-style.full-blue {
      color: #FF543A; }
    [data-theme="purple"] .btn-style.full-blue {
      color: #A89BFF; }
  .btn-style.full-green {
    background-color: #24C366;
    color: #fff; }
    [data-theme="primary"] .btn-style.full-green {
      background-color: #368FFF; }
    [data-theme="secondary"] .btn-style.full-green {
      background-color: #15C8FF; }
    [data-theme="orange"] .btn-style.full-green {
      background-color: #FFAE00; }
    [data-theme="green"] .btn-style.full-green {
      background-color: #24C366; }
    [data-theme="red"] .btn-style.full-green {
      background-color: #FF543A; }
    [data-theme="purple"] .btn-style.full-green {
      background-color: #A89BFF; }
    [data-theme="primary"] .btn-style.full-green {
      color: #368FFF; }
    [data-theme="secondary"] .btn-style.full-green {
      color: #15C8FF; }
    [data-theme="orange"] .btn-style.full-green {
      color: #FFAE00; }
    [data-theme="green"] .btn-style.full-green {
      color: #24C366; }
    [data-theme="red"] .btn-style.full-green {
      color: #FF543A; }
    [data-theme="purple"] .btn-style.full-green {
      color: #A89BFF; }
  .btn-style.stroke-orange {
    border-width: 0.01rem;
    border-style: solid;
    border-color: #FFAE00;
    color: #FFAE00; }
    [data-theme="primary"] .btn-style.stroke-orange {
      border-color: #368FFF; }
    [data-theme="secondary"] .btn-style.stroke-orange {
      border-color: #15C8FF; }
    [data-theme="orange"] .btn-style.stroke-orange {
      border-color: #FFAE00; }
    [data-theme="green"] .btn-style.stroke-orange {
      border-color: #24C366; }
    [data-theme="red"] .btn-style.stroke-orange {
      border-color: #FF543A; }
    [data-theme="purple"] .btn-style.stroke-orange {
      border-color: #A89BFF; }
    [data-theme="primary"] .btn-style.stroke-orange {
      color: #368FFF; }
    [data-theme="secondary"] .btn-style.stroke-orange {
      color: #15C8FF; }
    [data-theme="orange"] .btn-style.stroke-orange {
      color: #FFAE00; }
    [data-theme="green"] .btn-style.stroke-orange {
      color: #24C366; }
    [data-theme="red"] .btn-style.stroke-orange {
      color: #FF543A; }
    [data-theme="purple"] .btn-style.stroke-orange {
      color: #A89BFF; }
  .btn-style.full-red {
    background-color: #FF543A;
    color: #fff; }
    [data-theme="primary"] .btn-style.full-red {
      background-color: #368FFF; }
    [data-theme="secondary"] .btn-style.full-red {
      background-color: #15C8FF; }
    [data-theme="orange"] .btn-style.full-red {
      background-color: #FFAE00; }
    [data-theme="green"] .btn-style.full-red {
      background-color: #24C366; }
    [data-theme="red"] .btn-style.full-red {
      background-color: #FF543A; }
    [data-theme="purple"] .btn-style.full-red {
      background-color: #A89BFF; }
    [data-theme="primary"] .btn-style.full-red {
      color: #368FFF; }
    [data-theme="secondary"] .btn-style.full-red {
      color: #15C8FF; }
    [data-theme="orange"] .btn-style.full-red {
      color: #FFAE00; }
    [data-theme="green"] .btn-style.full-red {
      color: #24C366; }
    [data-theme="red"] .btn-style.full-red {
      color: #FF543A; }
    [data-theme="purple"] .btn-style.full-red {
      color: #A89BFF; }

.search-wrap {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%; }
  .search-wrap input {
    width: 100%;
    color: #333;
    padding: 0 0.04rem; }
  .search-wrap input::-webkit-input-placeholder {
    font-size: 0.2rem;
    color: #d8dedf; }

.input {
  position: relative;
  width: 100%;
  border-radius: 0.04rem;
  border: 0.01rem solid #d8dedf;
  background-color: #fff; }
  [data-theme="primary"] .input {
    background-color: #368FFF; }
  [data-theme="secondary"] .input {
    background-color: #15C8FF; }
  [data-theme="orange"] .input {
    background-color: #FFAE00; }
  [data-theme="green"] .input {
    background-color: #24C366; }
  [data-theme="red"] .input {
    background-color: #FF543A; }
  [data-theme="purple"] .input {
    background-color: #A89BFF; }
  .input i.iconfont {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer; }
    .input i.iconfont.left {
      margin-left: 0.04rem; }
  .input input {
    height: 100%;
    border: 0; }
  .input.small {
    border-radius: 0.04rem;
    height: 0.4rem; }
    .input.small .search-wrap i.iconfont {
      font-size: 0.3rem;
      color: #d8dedf; }
    .input.small .search-wrap input {
      font-size: 0.2rem;
      border-radius: 0.04rem; }
  .input.normal {
    height: 0.48rem;
    border-radius: 0.24rem;
    padding: 0 0.46rem 0 0.24rem; }
    .input.normal i.iconfont {
      right: 0.1rem;
      font-size: 0.36rem;
      color: #d8dedf; }
    .input.normal .search-wrap input {
      font-size: 0.22rem;
      border-radius: 0.24rem; }
  .input.medium input {
    width: 100%;
    height: 100%; }

.select, .select-list {
  border-width: 0.01rem;
  border-style: solid;
  border-color: #d8dedf; }
  [data-theme="primary"] .select,
  [data-theme="primary"] .select-list {
    border-color: #368FFF; }
  [data-theme="secondary"] .select, [data-theme="secondary"] .select-list {
    border-color: #15C8FF; }
  [data-theme="orange"] .select, [data-theme="orange"] .select-list {
    border-color: #FFAE00; }
  [data-theme="green"] .select, [data-theme="green"] .select-list {
    border-color: #24C366; }
  [data-theme="red"] .select, [data-theme="red"] .select-list {
    border-color: #FF543A; }
  [data-theme="purple"] .select, [data-theme="purple"] .select-list {
    border-color: #A89BFF; }

.select {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  width: 100%;
  border-radius: 0.04rem;
  background-color: #fff; }
  [data-theme="primary"] .select {
    background-color: #368FFF; }
  [data-theme="secondary"] .select {
    background-color: #15C8FF; }
  [data-theme="orange"] .select {
    background-color: #FFAE00; }
  [data-theme="green"] .select {
    background-color: #24C366; }
  [data-theme="red"] .select {
    background-color: #FF543A; }
  [data-theme="purple"] .select {
    background-color: #A89BFF; }
  .select .select-list {
    padding: 0.16rem 0;
    margin-top: 0.1rem;
    max-height: 2.1rem; }
  .select.normal {
    height: 0.4rem; }
    .select.normal .iconfont-wrap {
      position: relative;
      width: 0.38rem;
      height: 0.38rem;
      overflow: hidden;
      top: 0rem; }
      .select.normal .iconfont-wrap > i {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        color: #89939f;
        font-size: 0.2rem; }
        [data-theme="primary"] .select.normal .iconfont-wrap > i {
          color: #368FFF; }
        [data-theme="secondary"] .select.normal .iconfont-wrap > i {
          color: #15C8FF; }
        [data-theme="orange"] .select.normal .iconfont-wrap > i {
          color: #FFAE00; }
        [data-theme="green"] .select.normal .iconfont-wrap > i {
          color: #24C366; }
        [data-theme="red"] .select.normal .iconfont-wrap > i {
          color: #FF543A; }
        [data-theme="purple"] .select.normal .iconfont-wrap > i {
          color: #A89BFF; }
    .select.normal .select-text-content,
    .select.normal .select-list-item {
      font-size: 0.2rem; }
    .select.normal .select-list-item {
      height: 0.4rem;
      line-height: 0.4rem; }
  .select.medium {
    height: 0.48rem; }
    .select.medium .iconfont-wrap {
      position: relative;
      width: 0.46rem;
      height: 0.46rem;
      overflow: hidden;
      top: 0rem; }
      .select.medium .iconfont-wrap > i {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        color: #89939f;
        font-size: 0.22rem; }
        [data-theme="primary"] .select.medium .iconfont-wrap > i {
          color: #368FFF; }
        [data-theme="secondary"] .select.medium .iconfont-wrap > i {
          color: #15C8FF; }
        [data-theme="orange"] .select.medium .iconfont-wrap > i {
          color: #FFAE00; }
        [data-theme="green"] .select.medium .iconfont-wrap > i {
          color: #24C366; }
        [data-theme="red"] .select.medium .iconfont-wrap > i {
          color: #FF543A; }
        [data-theme="purple"] .select.medium .iconfont-wrap > i {
          color: #A89BFF; }
    .select.medium .select-text-content,
    .select.medium .select-list-item {
      font-size: 0.22rem; }
    .select.medium .select-list-item {
      height: 0.48rem;
      line-height: 0.48rem; }

.select-text {
  position: relative;
  cursor: pointer;
  font-size: 0; }

.select-text-content {
  color: #333;
  padding: 0 0 0 0.24rem; }

.select-list {
  /*display: none;*/
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 10;
  min-width: 100%;
  border-radius: 0.04rem;
  background-color: #fff;
  overflow-y: auto; }
  [data-theme="primary"] .select-list {
    background-color: #368FFF; }
  [data-theme="secondary"] .select-list {
    background-color: #15C8FF; }
  [data-theme="orange"] .select-list {
    background-color: #FFAE00; }
  [data-theme="green"] .select-list {
    background-color: #24C366; }
  [data-theme="red"] .select-list {
    background-color: #FF543A; }
  [data-theme="purple"] .select-list {
    background-color: #A89BFF; }

.select-text-content {
  width: 0;
  flex: 1;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap; }

.select-list-item {
  cursor: pointer;
  padding: 0 0.24rem;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap; }
  .select-list-item:hover, .select-list-item:active, .select-list-item.active {
    background-color: #eff3f7;
    color: #368FFF; }
    [data-theme="primary"] .select-list-item:hover, [data-theme="primary"] .select-list-item:active, [data-theme="primary"] .select-list-item.active {
      background-color: #368FFF; }
    [data-theme="secondary"] .select-list-item:hover, [data-theme="secondary"] .select-list-item:active, [data-theme="secondary"] .select-list-item.active {
      background-color: #15C8FF; }
    [data-theme="orange"] .select-list-item:hover, [data-theme="orange"] .select-list-item:active, [data-theme="orange"] .select-list-item.active {
      background-color: #FFAE00; }
    [data-theme="green"] .select-list-item:hover, [data-theme="green"] .select-list-item:active, [data-theme="green"] .select-list-item.active {
      background-color: #24C366; }
    [data-theme="red"] .select-list-item:hover, [data-theme="red"] .select-list-item:active, [data-theme="red"] .select-list-item.active {
      background-color: #FF543A; }
    [data-theme="purple"] .select-list-item:hover, [data-theme="purple"] .select-list-item:active, [data-theme="purple"] .select-list-item.active {
      background-color: #A89BFF; }

::-webkit-scrollbar-track-piece {
  -webkit-border-radius: 0; }

::-webkit-scrollbar {
  width: 0.08rem;
  height: 0.08rem;
  background-color: transparent; }

::-webkit-scrollbar-thumb {
  height: 5px;
  background-color: #BFBFBF;
  outline-offset: 2px;
  border: .05rem solid #BFBFBF;
  border-radius: 5rem;
  cursor: pointer; }

.layout {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  height: 100%;
  max-width: 19.2rem;
  background: url("../images/layout/layout-bg.png") no-repeat center center;
  background-size: cover;
  margin: 0 auto; }

.header-wrap {
  width: 100%;
  height: 1rem; }

.content-wrap {
  width: 100%;
  height: 100%;
  overflow: hidden; }

.page {
  display: flex;
  height: 100%; }

.d-mask {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1001;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6); }

.d-wrap {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0 0.02rem 0.16rem 0 rgba(0, 0, 0, 0.4);
  border-radius: 0.04rem;
  background-color: #fff; }
  .d-wrap.has-bottom .d-content, .d-wrap.has-bottom-tool .d-content {
    height: calc(100% - 1.6rem); }

.d-wrap-new {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0 0.02rem 0.16rem 0 rgba(0, 0, 0, 0.4);
  border-radius: 0.04rem;
  background-color: #fff; }
  .d-wrap-new.has-bottom .d-content, .d-wrap-new.has-bottom-tool .d-content {
    height: calc(100% - 1.6rem); }

.d-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 0.72rem;
  background: linear-gradient(0deg, #e7e6e6, #f6f6f6);
  padding: 0 0.32rem;
  border-radius: 0.04rem 0.04rem 0 0; }
  .d-title.no-radius {
    border-radius: 0; }
  .d-title.blue {
    background: none;
    background-color: #368FFF; }
    [data-theme="primary"] .d-title.blue {
      background-color: #368FFF; }
    [data-theme="secondary"] .d-title.blue {
      background-color: #15C8FF; }
    [data-theme="orange"] .d-title.blue {
      background-color: #FFAE00; }
    [data-theme="green"] .d-title.blue {
      background-color: #24C366; }
    [data-theme="red"] .d-title.blue {
      background-color: #FF543A; }
    [data-theme="purple"] .d-title.blue {
      background-color: #A89BFF; }
    .d-title.blue > h3 {
      color: #fff; }
    .d-title.blue .d-oper-wrap i {
      color: #fff; }
  .d-title.middle {
    position: relative;
    justify-content: flex-start; }
    .d-title.middle > h3 {
      width: 100%;
      text-align: center; }
    .d-title.middle .d-oper-wrap {
      position: absolute;
      right: 0.32rem;
      top: 0.22rem; }
  .d-title.bottom {
    border-bottom: 0.01rem solid #d8dedf; }
  .d-title > h3 {
    display: flex;
    align-items: center;
    font-weight: bold;
    font-size: 0.24rem;
    color: #333; }
    .d-title > h3 .d-title-logo {
      display: inline-flex;
      width: 0.48rem;
      height: 0.48rem;
      background-position: center center;
      background-repeat: no-repeat;
      background-image: url("../images/logos/d-title-logo.png");
      background-size: 0.48rem 0.48rem;
      margin-right: 0.1rem; }

.d-oper-wrap.just-confirm {
  position: absolute;
  right: 0.32rem;
  top: 0.22rem; }
.d-oper-wrap > div {
  position: relative;
  display: inline-block;
  width: 0.24rem;
  height: 0.24rem;
  line-height: 0.24rem;
  margin-left: 0.24rem;
  cursor: pointer; }
  .d-oper-wrap > div > i {
    color: #aaa; }
    .d-oper-wrap > div > i:active {
      background-color: rgba(0, 0, 0, 0.2); }

.d-content {
  flex-grow: 1;
  width: 100%;
  height: calc(100% - 0.72rem);
  background-color: #fff;
  border-radius: 0 0 0.04rem 0.04rem; }

.d-common-content {
  height: 100%; }

.d-bottom.sky-blue, .d-bottom-tool.sky-blue {
  background-color: #EFF3F7; }
  [data-theme="primary"] .d-bottom.sky-blue,
  [data-theme="primary"] .d-bottom-tool.sky-blue {
    background-color: #368FFF; }
  [data-theme="secondary"] .d-bottom.sky-blue, [data-theme="secondary"] .d-bottom-tool.sky-blue {
    background-color: #15C8FF; }
  [data-theme="orange"] .d-bottom.sky-blue, [data-theme="orange"] .d-bottom-tool.sky-blue {
    background-color: #FFAE00; }
  [data-theme="green"] .d-bottom.sky-blue, [data-theme="green"] .d-bottom-tool.sky-blue {
    background-color: #24C366; }
  [data-theme="red"] .d-bottom.sky-blue, [data-theme="red"] .d-bottom-tool.sky-blue {
    background-color: #FF543A; }
  [data-theme="purple"] .d-bottom.sky-blue, [data-theme="purple"] .d-bottom-tool.sky-blue {
    background-color: #A89BFF; }

.d-bottom {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  height: 0.88rem;
  background-color: #fff;
  border-top: 1px solid #d8dedf;
  padding: 0 0.32rem;
  border-radius: 0 0 0.04rem 0.04rem; }
  .d-bottom.center {
    justify-content: center; }

.d-bottom-tool {
  height: 0.88rem;
  background-color: #eff3f7;
  border-radius: 0 0 0.04rem 0.04rem;
  padding: 0 0.32rem;
  background-color: #fff;
  border-top: 1px solid #d8dedf; }
  [data-theme="primary"] .d-bottom-tool {
    background-color: #368FFF; }
  [data-theme="secondary"] .d-bottom-tool {
    background-color: #15C8FF; }
  [data-theme="orange"] .d-bottom-tool {
    background-color: #FFAE00; }
  [data-theme="green"] .d-bottom-tool {
    background-color: #24C366; }
  [data-theme="red"] .d-bottom-tool {
    background-color: #FF543A; }
  [data-theme="purple"] .d-bottom-tool {
    background-color: #A89BFF; }
  [data-theme="primary"] .d-bottom-tool {
    background-color: #368FFF; }
  [data-theme="secondary"] .d-bottom-tool {
    background-color: #15C8FF; }
  [data-theme="orange"] .d-bottom-tool {
    background-color: #FFAE00; }
  [data-theme="green"] .d-bottom-tool {
    background-color: #24C366; }
  [data-theme="red"] .d-bottom-tool {
    background-color: #FF543A; }
  [data-theme="purple"] .d-bottom-tool {
    background-color: #A89BFF; }

.bottom-tool {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  font-size: 0; }
  .bottom-tool .btn-style {
    min-width: 1.6rem;
    border-radius: 0; }
    .bottom-tool .btn-style:first-child {
      border-radius: 0.24rem 0 0 0.24rem; }
    .bottom-tool .btn-style:last-child {
      border-radius: 0 0.24rem 0.24rem 0; }
    .bottom-tool .btn-style:not(:first-child):not(:last-child) {
      border-left: 0; }
    .bottom-tool .btn-style.second {
      border-right: 0; }

.dialog-xxx {
  width: 100%;
  height: 100%; }

.d-index {
  width: 8rem;
  height: 7.54rem;
  background-color: #fff; }

.d-index-content {
  position: relative;
  height: 100%;
  padding: 0 0.32rem 0.3rem; }

.index-content-mask {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 10;
  width: 100%;
  padding: 0 0.3rem;
  height: 0.3rem;
  background-image: -webkit-linear-gradient(top, white 40%, rgba(255, 255, 255, 0.8) 80%, rgba(255, 255, 255, 0) 100%); }

.tree-ul-wrap {
  height: 100%;
  overflow: auto; }
  .tree-ul-wrap.has-border {
    border: 0.01rem solid #e7e7e7;
    margin-top: 0.14rem; }

ul.tree-ul {
  height: 100%; }
  ul.tree-ul.first > li > .tree-title {
    padding-left: 1em; }
  ul.tree-ul.second > li > .tree-title {
    padding-left: 3em; }
  ul.tree-ul.third > li > .tree-title {
    padding-left: 5em; }
  ul.tree-ul.four > li > .tree-title {
    padding-left: 7em; }
  ul.tree-ul.five > li > .tree-title {
    padding-left: 9em; }
  ul.tree-ul.six > li > .tree-title {
    padding-left: 1.5rem; }
  ul.tree-ul li.parent-node {
    font-weight: bold; }
  ul.tree-ul li.selected > .tree-title {
    background-color: #f0f2f5; }
  ul.tree-ul li.selected .checked {
    display: block;
    flex: 0 0 0.34rem;
    height: 0.34rem;
    line-height: 0.34rem;
    text-align: center;
    border-radius: 50%;
    background-color: #368fff; }
    ul.tree-ul li.selected .checked > i {
      color: #fff; }
  ul.tree-ul > li {
    line-height: 0.54rem; }

.tree-title {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%; }
  .tree-title > .checked {
    display: none; }
  .tree-title > h3 {
    width: calc(100% - 0.9rem);
    height: 100%;
    line-height: 0.54rem;
    font-size: 0.2rem;
    color: #333;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap; }

.d-prepare {
  width: 10.24rem;
  height: 7.28rem; }
  .d-prepare .d-bottom .just-panel {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer; }

.d-prepare-content {
  height: 100%; }

.just-panel {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  height: 0.72rem;
  padding: 0 0.32rem;
  flex-shrink: 0; }
  .just-panel.small {
    height: 0.64rem; }
  .just-panel.medium {
    height: 0.8rem; }
  .just-panel.has-shadow {
    box-shadow: 0 0.01rem 0 0 #d8dedf; }
  .just-panel > span {
    font-size: 0.24rem;
    color: #368fff; }
  .just-panel > h3 {
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-size: 0; }
    .just-panel > h3 > span {
      font-size: 0.24rem;
      color: #368fff; }
    .just-panel > h3 > i {
      position: relative;
      top: 1px;
      color: #8794a8; }
  .just-panel.bottom {
    border-bottom: 1px solid #d8dedf; }

.just-icon-wrap {
  display: inline-block;
  width: 0.24rem;
  height: 0.24rem;
  line-height: 0.24rem;
  padding-top: 0.02rem;
  margin-right: 6px;
  text-align: center; }
  .just-icon-wrap > i {
    color: #368fff;
    font-size: 0.24rem; }

.prepare-scroll-wrap {
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto; }

ul.prepare-ul {
  display: flex;
  flex-wrap: wrap;
  padding: 0 0.32rem; }
  ul.prepare-ul > li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 25%;
    height: 2.4rem;
    margin: 0.08rem 0;
    cursor: pointer; }
    ul.prepare-ul > li:hover, ul.prepare-ul > li:active, ul.prepare-ul > li.active {
      background-color: #e0ecf4; }
    ul.prepare-ul > li.gray {
      background-color: #eee; }

.prepare-item-wrap {
  position: relative;
  width: 1.5rem;
  height: 2.12rem;
  border-radius: 0.04rem; }
  .prepare-item-wrap.border {
    border: 1px solid #529fff; }
  .prepare-item-wrap > i.current {
    position: absolute;
    left: 0;
    top: 0.19rem;
    width: 0.62rem;
    height: 0.32rem;
    line-height: 0.32rem;
    text-align: center;
    font-size: 0.18rem;
    color: #fff;
    background-color: #368fff;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    border-radius: 0 0.2rem 0.2rem 0; }

.mask-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 13;
  background-color: rgba(0, 0, 0, 0.5); }
  .mask-wrap > a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.2rem;
    height: 0.4rem;
    border-radius: 0.2rem;
    border: 1px solid #fff;
    color: #fff;
    font-size: 0.2rem; }
    .mask-wrap > a:hover, .mask-wrap > a:hover, .mask-wrap > a:hover {
      border-color: #368FFF;
      color: #368FFF; }

.prepare-item {
  position: relative;
  height: 100%;
  font-size: 0;
  margin: 0 auto; }
  .prepare-item > img {
    display: inline-block;
    width: 100%;
    height: 100%; }

.item-desc {
  position: absolute;
  left: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  font-size: 0.18rem;
  color: #fff;
  line-height: 0.28rem;
  padding: 0.04rem; }

.add-resource {
  width: 57.2916666667%;
  height: 59.2592592593%; }

.add-resource-content {
  height: 100%; }

.add-resource-ul {
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 0.18rem; }
  .add-resource-ul > li {
    width: 33.3333333333%; }
    .add-resource-ul > li:hover .add-resource-item, .add-resource-ul > li.active .add-resource-item {
      box-shadow: 0 0.02rem 0.2rem rgba(0, 0, 0, 0.2);
      background-color: #f7fcff; }

.add-resource-item {
  width: 3.2rem;
  height: 3.52rem;
  border: 1px solid #d8dedf;
  border-radius: 0.04rem;
  margin: 0 auto;
  padding: 0 0.1rem; }
  .add-resource-item > h3 {
    font-size: 0.26rem;
    color: #333;
    margin-top: 0.26rem;
    text-align: center; }
  .add-resource-item.local-upload .resource-img-wrap {
    background: url("../images/add-resource/local-upload.png") no-repeat center center;
    background-size: 1.2rem 1.2rem; }
  .add-resource-item.class-activity .resource-img-wrap {
    background: url("../images/add-resource/class-activity.png") no-repeat center center;
    background-size: 1.2rem 1.2rem; }
  .add-resource-item.course-ware .resource-img-wrap {
    background: url("../images/add-resource/course-ware.png") no-repeat center center;
    background-size: 1.2rem 1.2rem; }

.resource-img-wrap {
  width: 1.2rem;
  height: 1.2rem;
  margin: 0.64rem auto 0; }

.add-resource-desc {
  font-size: 0.18rem;
  color: #999;
  margin-top: 0.18rem;
  text-align: center; }

.d-share {
  width: 11.4rem;
  height: 6.4rem; }

.d-share-content {
  height: 100%; }

.share-content-wrap {
  height: calc(100% - 0.72rem);
  display: flex;
  justify-content: center; }

.share-summary,
.share-grade,
.share-subject,
.share-version,
.share-volume,
.share-unit {
  height: 100%;
  overflow: auto;
  flex-grow: 0;
  flex-shrink: 0;
  border-right: 1px solid #d8dedf; }
  .share-summary > ul > li,
  .share-grade > ul > li,
  .share-subject > ul > li,
  .share-version > ul > li,
  .share-volume > ul > li,
  .share-unit > ul > li {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 0.64rem;
    font-size: 0.24rem;
    color: #333;
    padding: 0.1rem 0.06rem; }
    .share-summary > ul > li:hover, .share-summary > ul > li:active, .share-summary > ul > li.active,
    .share-grade > ul > li:hover,
    .share-grade > ul > li:active,
    .share-grade > ul > li.active,
    .share-subject > ul > li:hover,
    .share-subject > ul > li:active,
    .share-subject > ul > li.active,
    .share-version > ul > li:hover,
    .share-version > ul > li:active,
    .share-version > ul > li.active,
    .share-volume > ul > li:hover,
    .share-volume > ul > li:active,
    .share-volume > ul > li.active,
    .share-unit > ul > li:hover,
    .share-unit > ul > li:active,
    .share-unit > ul > li.active {
      background-color: #eff3f7;
      color: #368fff; }
      .share-summary > ul > li:hover > i, .share-summary > ul > li:active > i, .share-summary > ul > li.active > i,
      .share-grade > ul > li:hover > i,
      .share-grade > ul > li:active > i,
      .share-grade > ul > li.active > i,
      .share-subject > ul > li:hover > i,
      .share-subject > ul > li:active > i,
      .share-subject > ul > li.active > i,
      .share-version > ul > li:hover > i,
      .share-version > ul > li:active > i,
      .share-version > ul > li.active > i,
      .share-volume > ul > li:hover > i,
      .share-volume > ul > li:active > i,
      .share-volume > ul > li.active > i,
      .share-unit > ul > li:hover > i,
      .share-unit > ul > li:active > i,
      .share-unit > ul > li.active > i {
        color: #368FFF; }
    .share-summary > ul > li > i,
    .share-grade > ul > li > i,
    .share-subject > ul > li > i,
    .share-version > ul > li > i,
    .share-volume > ul > li > i,
    .share-unit > ul > li > i {
      position: relative;
      top: 0.03rem;
      color: #b9c2d0;
      margin-right: 4px; }

.share-summary {
  flex-grow: 1;
  width: 26.6666666667%; }
  .share-summary > ul > li {
    border-bottom: 1px solid #d8dedf;
    justify-content: flex-start; }
    .share-summary > ul > li:last-child {
      border-bottom: 0; }

.share-grade {
  width: 11.2280701754%; }

.share-subject {
  width: 9.8245614035%; }

.share-version {
  width: 16.8421052632%; }

.share-volume {
  width: 15.4385964912%; }

.share-unit {
  width: 20%;
  border-right: 0; }
  .share-unit .tree-ul-wrap {
    width: 4rem; }

.prepare-store {
  width: 8.9rem;
  height: 5.7rem;
  background-color: #fff; }

.prepare-store-content {
  display: flex;
  justify-content: center;
  height: 100%; }

.store-version,
.store-unit,
.store-task {
  height: 100%;
  overflow: auto; }
  .store-version > ul > li,
  .store-unit > ul > li,
  .store-task > ul > li {
    display: flex;
    align-items: center;
    min-height: 0.64rem;
    font-size: 0.2rem;
    color: #333;
    padding: 0.1rem 0.32rem;
    cursor: pointer; }
    .store-version > ul > li:hover, .store-version > ul > li:active, .store-version > ul > li.active,
    .store-unit > ul > li:hover,
    .store-unit > ul > li:active,
    .store-unit > ul > li.active,
    .store-task > ul > li:hover,
    .store-task > ul > li:active,
    .store-task > ul > li.active {
      background-color: #eff3f7;
      color: #368fff; }
      .store-version > ul > li:hover > i, .store-version > ul > li:active > i, .store-version > ul > li.active > i,
      .store-unit > ul > li:hover > i,
      .store-unit > ul > li:active > i,
      .store-unit > ul > li.active > i,
      .store-task > ul > li:hover > i,
      .store-task > ul > li:active > i,
      .store-task > ul > li.active > i {
        color: #368FFF; }
    .store-version > ul > li > i,
    .store-unit > ul > li > i,
    .store-task > ul > li > i {
      position: relative;
      top: 0.01rem;
      color: #b9c2d0;
      margin-right: 4px; }

.store-unit,
.store-task {
  height: 100%;
  flex-grow: 0;
  flex-shrink: 0; }

.store-version > ul > li,
.store-task > ul > li {
  border-bottom: 1px solid #d8dedf; }

.store-version {
  flex-grow: 1;
  width: 3.05rem; }
  .store-version > ul > li {
    justify-content: flex-start;
    align-items: flex-start; }

.store-unit {
  width: 4.18rem;
  border-left: 1px solid #d8dedf;
  border-right: 1px solid #d8dedf; }
  .store-unit .tree-ul-wrap {
    border-top: 0;
    border-bottom: 0; }

.store-task {
  width: 1.69rem; }

.teaching-app {
  width: 53.3333333333%;
  height: 71.1111111111%; }

.teaching-app-content {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0 0.32rem; }

ul.teaching-app-ul > li > h3 {
  font-size: 0.2rem;
  color: #666;
  border-bottom: 0.01rem solid #d8dedf;
  padding: 0.26rem 0 0.14rem;
  margin-bottom: 0.1rem; }

.app-item-wrap {
  display: flex;
  align-items: center;
  flex-wrap: wrap; }

.app-item {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  flex-grow: 0;
  width: 25%;
  padding: 0.3rem 0.1rem;
  border-radius: 0.04rem;
  cursor: pointer; }
  .app-item:active, .app-item:hover {
    background-color: #eff3f7; }

.app-item-img {
  position: relative;
  flex-grow: 0;
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  border-radius: 0.16rem;
  overflow: hidden;
  font-size: 0; }
  .app-item-img > img {
    display: inline-block;
    width: 100%;
    height: 100%; }

.app-will-update {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 11;
  width: 0.32rem;
  height: 0.32rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url("../images/teaching-app/app-update.png");
  background-size: 0.32rem 0.32rem; }

.app-err-mask {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center; }
  .app-err-mask .iconfont {
    font-size: 0.4rem;
    color: #fff; }

.app-item-info {
  padding-left: 0.14rem; }

.app-item-desc {
  font-size: 0.2rem;
  color: #333;
  line-height: 1;
  margin-bottom: 0.18rem; }

.app-item-progress {
  width: 1rem;
  height: 0.4rem;
  border-radius: 0.2rem;
  overflow: hidden; }

.app-item-outer {
  position: relative;
  height: 100%;
  background-color: #d5dade; }
  [data-theme="primary"] .app-item-outer {
    background-color: #368FFF; }
  [data-theme="secondary"] .app-item-outer {
    background-color: #15C8FF; }
  [data-theme="orange"] .app-item-outer {
    background-color: #FFAE00; }
  [data-theme="green"] .app-item-outer {
    background-color: #24C366; }
  [data-theme="red"] .app-item-outer {
    background-color: #FF543A; }
  [data-theme="purple"] .app-item-outer {
    background-color: #A89BFF; }
  .app-item-outer > i {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.2rem;
    color: #fff; }

.app-item-inner {
  height: 100%; }
  .app-item-inner.blue {
    background-color: #24c366; }
    [data-theme="primary"] .app-item-inner.blue {
      background-color: #368FFF; }
    [data-theme="secondary"] .app-item-inner.blue {
      background-color: #15C8FF; }
    [data-theme="orange"] .app-item-inner.blue {
      background-color: #FFAE00; }
    [data-theme="green"] .app-item-inner.blue {
      background-color: #24C366; }
    [data-theme="red"] .app-item-inner.blue {
      background-color: #FF543A; }
    [data-theme="purple"] .app-item-inner.blue {
      background-color: #A89BFF; }
  .app-item-inner.gray {
    background-color: #89939f; }
    [data-theme="primary"] .app-item-inner.gray {
      background-color: #368FFF; }
    [data-theme="secondary"] .app-item-inner.gray {
      background-color: #15C8FF; }
    [data-theme="orange"] .app-item-inner.gray {
      background-color: #FFAE00; }
    [data-theme="green"] .app-item-inner.gray {
      background-color: #24C366; }
    [data-theme="red"] .app-item-inner.gray {
      background-color: #FF543A; }
    [data-theme="purple"] .app-item-inner.gray {
      background-color: #A89BFF; }

.d-cm {
  width: 6.28rem;
  height: 3.3rem; }

.dialog-student {
  width: 14.88rem;
  height: 8.24rem; }
  .dialog-student .d-title {
    border-radius: 0.1rem 0.1rem 0 0; }
  .dialog-student .d-bottom {
    justify-content: space-between;
    border-radius: 0 0 0.1rem 0.1rem; }

.dialog-student-content {
  height: 100%;
  background-color: #eff3f7;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0 0.32rem; }

.selected-number {
  font-size: 0.22rem;
  color: #333; }
  .selected-number > em {
    color: #368fff;
    margin-left: 0.06rem; }

.dialog-confirm {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 6.28rem;
  height: 3.3rem;
  border-radius: 0.08rem;
  box-shadow: 0 0.01rem 0.2rem 0 rgba(0, 0, 0, 0.21);
  background-color: #fff;
  padding-bottom: 1.02rem; }

.dialog-confirm-content {
  display: flex;
  height: 100%;
  padding: 0.64rem 0.64rem 0; }
  .dialog-confirm-content > p {
    margin-left: 0.24rem;
    color: #333;
    font-size: 0.28rem;
    margin-top: 0.1rem; }

.dialog-confirm-bottom {
  display: flex;
  justify-content: flex-end;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1.02rem;
  padding: 0 0.64rem; }

.just-iconfont-bg {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 0 0 0.56rem;
  height: 0.56rem;
  border-radius: 50%;
  background-color: #ffae00;
  overflow: hidden; }
  .just-iconfont-bg > i {
    position: relative;
    top: 0.02rem;
    color: #fff;
    font-size: 0.6rem; }

.d-web-confirm {
  background: rgba(0, 0, 0, 0); }
  .d-web-confirm .dialog-confirm {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 320px;
    height: 200px;
    padding-bottom: 64px;
    border-radius: 4px;
    background-color: #fff;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.2); }
  .d-web-confirm .d-oper-wrap.just-confirm.just-confirm {
    position: absolute;
    right: 10px;
    top: 10px; }
  .d-web-confirm .d-oper-wrap.just-confirm > div {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    line-height: 20px;
    margin-left: 20px;
    cursor: pointer; }
    .d-web-confirm .d-oper-wrap.just-confirm > div i.iconfont {
      font-size: 20px; }
  .d-web-confirm .dialog-confirm-content {
    display: block;
    height: 100%;
    padding: 32px 32px 0; }
    .d-web-confirm .dialog-confirm-content > p {
      margin-left: 0;
      color: #666;
      font-size: 14px;
      margin-bottom: 18px; }
      .d-web-confirm .dialog-confirm-content > p.dialog-title {
        color: #333;
        font-size: 18px; }
  .d-web-confirm .dialog-confirm-bottom {
    height: 64px;
    padding: 0 32px; }
    .d-web-confirm .dialog-confirm-bottom .btn-style.normal {
      min-width: 80px;
      height: 32px;
      line-height: 32px;
      padding: 0 20px;
      border-width: 1px;
      border-radius: 16px;
      font-size: 14px; }
      .d-web-confirm .dialog-confirm-bottom .btn-style.normal.stroke-blue {
        line-height: 32px; }
    .d-web-confirm .dialog-confirm-bottom .d-btn-wrap a + a {
      margin-left: 16px; }

.zh-resource-none {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }
  .zh-resource-none .img-none {
    display: inline-block;
    width: 2.91rem;
    height: 2.32rem;
    background: url(../images/no-data/no-resource.png) no-repeat;
    background-size: 100% 100%; }
  .zh-resource-none .txt {
    margin-top: 0.34rem;
    font-size: 0.24rem;
    color: #666;
    text-align: center; }

.update-site {
  width: 7.2rem;
  height: 5.68rem; }
  .update-site.updating {
    height: 6rem; }
    .update-site.updating .update-site-content {
      padding: 0.1rem 0.32rem; }

.update-site-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%; }

.site-logo {
  width: 2.98rem;
  height: 1.6rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url("../images/logos/logo-site.png");
  background-size: 2.98rem 1.6rem;
  margin-top: 0.52rem; }

.site-version {
  font-size: 0.22rem;
  color: #333;
  line-height: 1;
  margin: 0.25rem 0; }

.check-version-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2.2rem;
  height: 0.56rem;
  line-height: 0.54rem;
  border-width: 0.01rem;
  border-style: solid;
  border-color: #368fff;
  border-radius: 0.28rem;
  color: #368fff;
  margin-bottom: 0.85rem;
  cursor: pointer; }
  [data-theme="primary"] .check-version-btn {
    border-color: #368FFF; }
  [data-theme="secondary"] .check-version-btn {
    border-color: #15C8FF; }
  [data-theme="orange"] .check-version-btn {
    border-color: #FFAE00; }
  [data-theme="green"] .check-version-btn {
    border-color: #24C366; }
  [data-theme="red"] .check-version-btn {
    border-color: #FF543A; }
  [data-theme="purple"] .check-version-btn {
    border-color: #A89BFF; }
  [data-theme="primary"] .check-version-btn {
    color: #368FFF; }
  [data-theme="secondary"] .check-version-btn {
    color: #15C8FF; }
  [data-theme="orange"] .check-version-btn {
    color: #FFAE00; }
  [data-theme="green"] .check-version-btn {
    color: #24C366; }
  [data-theme="red"] .check-version-btn {
    color: #FF543A; }
  [data-theme="purple"] .check-version-btn {
    color: #A89BFF; }
  .check-version-btn.ha:hover, .check-version-btn.last:hover {
    background-color: #5AA3FF;
    border-color: #5AA3FF;
    line-height: 0.56rem;
    color: #fff; }
    [data-theme="primary"] .check-version-btn.ha:hover, [data-theme="primary"] .check-version-btn.last:hover {
      background-color: #368FFF; }
    [data-theme="secondary"] .check-version-btn.ha:hover, [data-theme="secondary"] .check-version-btn.last:hover {
      background-color: #15C8FF; }
    [data-theme="orange"] .check-version-btn.ha:hover, [data-theme="orange"] .check-version-btn.last:hover {
      background-color: #FFAE00; }
    [data-theme="green"] .check-version-btn.ha:hover, [data-theme="green"] .check-version-btn.last:hover {
      background-color: #24C366; }
    [data-theme="red"] .check-version-btn.ha:hover, [data-theme="red"] .check-version-btn.last:hover {
      background-color: #FF543A; }
    [data-theme="purple"] .check-version-btn.ha:hover, [data-theme="purple"] .check-version-btn.last:hover {
      background-color: #A89BFF; }
    [data-theme="primary"] .check-version-btn.ha:hover, [data-theme="primary"] .check-version-btn.last:hover {
      color: #368FFF; }
    [data-theme="secondary"] .check-version-btn.ha:hover, [data-theme="secondary"] .check-version-btn.last:hover {
      color: #15C8FF; }
    [data-theme="orange"] .check-version-btn.ha:hover, [data-theme="orange"] .check-version-btn.last:hover {
      color: #FFAE00; }
    [data-theme="green"] .check-version-btn.ha:hover, [data-theme="green"] .check-version-btn.last:hover {
      color: #24C366; }
    [data-theme="red"] .check-version-btn.ha:hover, [data-theme="red"] .check-version-btn.last:hover {
      color: #FF543A; }
    [data-theme="purple"] .check-version-btn.ha:hover, [data-theme="purple"] .check-version-btn.last:hover {
      color: #A89BFF; }
  .check-version-btn.ha:active, .check-version-btn.last:active {
    background-color: #2D76D1; }
    [data-theme="primary"] .check-version-btn.ha:active, [data-theme="primary"] .check-version-btn.last:active {
      background-color: #368FFF; }
    [data-theme="secondary"] .check-version-btn.ha:active, [data-theme="secondary"] .check-version-btn.last:active {
      background-color: #15C8FF; }
    [data-theme="orange"] .check-version-btn.ha:active, [data-theme="orange"] .check-version-btn.last:active {
      background-color: #FFAE00; }
    [data-theme="green"] .check-version-btn.ha:active, [data-theme="green"] .check-version-btn.last:active {
      background-color: #24C366; }
    [data-theme="red"] .check-version-btn.ha:active, [data-theme="red"] .check-version-btn.last:active {
      background-color: #FF543A; }
    [data-theme="purple"] .check-version-btn.ha:active, [data-theme="purple"] .check-version-btn.last:active {
      background-color: #A89BFF; }
  .check-version-btn.last {
    border-color: #ddd; }
    [data-theme="primary"] .check-version-btn.last {
      border-color: #368FFF; }
    [data-theme="secondary"] .check-version-btn.last {
      border-color: #15C8FF; }
    [data-theme="orange"] .check-version-btn.last {
      border-color: #FFAE00; }
    [data-theme="green"] .check-version-btn.last {
      border-color: #24C366; }
    [data-theme="red"] .check-version-btn.last {
      border-color: #FF543A; }
    [data-theme="purple"] .check-version-btn.last {
      border-color: #A89BFF; }
  .check-version-btn > i {
    position: relative;
    top: 0.02rem;
    width: 0.22rem;
    height: 0.22rem;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url("../images/logos/loading.png");
    background-size: 0.22rem 0.22rem;
    margin-right: 0.06rem;
    animation: loading-rotate-z .6s linear infinite;
    animation-fill-mode: both; }
  .check-version-btn > span {
    font-size: 0.24rem; }

p.bar-tip,
p.company {
  color: #999;
  font-size: 0.2rem;
  line-height: 1; }
  p.bar-tip > i,
  p.company > i {
    position: relative; }
    p.bar-tip > i:after,
    p.company > i:after {
      content: '';
      position: absolute;
      left: 0;
      bottom: -0.01rem;
      width: 100%;
      height: 0.01rem;
      background-color: #999; }

.bar-progress {
  width: 4rem;
  height: 0.16rem;
  margin-bottom: 0.33rem; }

.bar-outer,
.bar-inner {
  border-radius: 0.08rem;
  height: 100%; }

.bar-outer {
  position: relative;
  background-color: #e4ebf1; }
  [data-theme="primary"] .bar-outer {
    background-color: #368FFF; }
  [data-theme="secondary"] .bar-outer {
    background-color: #15C8FF; }
  [data-theme="orange"] .bar-outer {
    background-color: #FFAE00; }
  [data-theme="green"] .bar-outer {
    background-color: #24C366; }
  [data-theme="red"] .bar-outer {
    background-color: #FF543A; }
  [data-theme="purple"] .bar-outer {
    background-color: #A89BFF; }
  .bar-outer > i {
    position: absolute;
    right: -0.5rem;
    top: -0.02rem;
    font-size: 0.2rem;
    color: #333;
    line-height: 1; }

.bar-inner {
  background-color: #24c366;
  width: 45%; }
  [data-theme="primary"] .bar-inner {
    background-color: #368FFF; }
  [data-theme="secondary"] .bar-inner {
    background-color: #15C8FF; }
  [data-theme="orange"] .bar-inner {
    background-color: #FFAE00; }
  [data-theme="green"] .bar-inner {
    background-color: #24C366; }
  [data-theme="red"] .bar-inner {
    background-color: #FF543A; }
  [data-theme="purple"] .bar-inner {
    background-color: #A89BFF; }

.find-version {
  display: flex;
  width: 100%; }
  .find-version .find-logo {
    flex: 0 0 0.78rem;
    height: 0.78rem;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url("../images/logos/find-logo.png");
    background-size: 0.78rem 0.78rem; }
  .find-version .find-content {
    flex-grow: 1;
    padding-left: 0.15rem;
    position: relative;
    top: 0.1rem; }
    .find-version .find-content > h3 {
      font-size: 0.24rem;
      color: #333;
      font-weight: bold;
      line-height: 1;
      margin-bottom: 0.1rem; }
    .find-version .find-content > p {
      font-size: 0.2rem;
      color: #666; }

.update-content {
  border-width: 0.01rem;
  border-style: solid;
  border-color: #ddd;
  height: 2.8rem;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0.25rem;
  margin: 0.31rem 0 0.35rem; }
  [data-theme="primary"] .update-content {
    border-color: #368FFF; }
  [data-theme="secondary"] .update-content {
    border-color: #15C8FF; }
  [data-theme="orange"] .update-content {
    border-color: #FFAE00; }
  [data-theme="green"] .update-content {
    border-color: #24C366; }
  [data-theme="red"] .update-content {
    border-color: #FF543A; }
  [data-theme="purple"] .update-content {
    border-color: #A89BFF; }
  .update-content > h3 {
    color: #333;
    font-size: 0.2rem;
    margin-left: -0.08rem;
    font-weight: bold; }
  .update-content > p {
    font-size: 0.2rem;
    color: #666;
    line-height: 1.8; }

.update-site-bottom {
  display: flex;
  justify-content: flex-end;
  width: 100%; }

.update-success {
  position: absolute;
  bottom: 0.32rem;
  right: 0.32rem;
  width: 6rem;
  height: 5.6rem;
  border: 0.01rem solid #bbb;
  border-radius: 0.08rem;
  box-shadow: 0 0.02rem 0.16rem 0 rgba(0, 0, 0, 0.4);
  background-color: #fff; }
  .update-success > i {
    position: absolute;
    right: 0.2rem;
    top: 0.16rem;
    font-size: 0.4rem;
    color: rgba(255, 255, 255, 0.4);
    cursor: pointer; }

.update-success-logo {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 3.04rem;
  background: url("../images/update-site/update-success.png") no-repeat center center;
  background-size: cover; }

.product-name,
.update-complete {
  color: #fff;
  line-height: 1; }

.product-name {
  font-size: 0.24rem; }

.update-complete {
  font-size: 0.36rem;
  margin-top: 0.21rem; }

.install-time,
.manual-install,
.update-bottom {
  padding: 0 0.64rem;
  line-height: 1;
  color: #999;
  font-size: 0.2rem; }

.manual-install {
  margin-top: 0.15rem;
  margin-bottom: 0.53rem; }
  .manual-install > i {
    color: #666; }

.update-bottom {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 0.56rem; }
  .update-bottom .btn-style {
    width: 2.22rem; }
    .update-bottom .btn-style:last-child {
      margin-left: 0.24rem; }

.the-clazz {
  width: 15.5rem;
  height: 8.23rem; }

.clazz-content,
.group-content,
.honour-content {
  height: 100%; }

.on-off-line {
  display: flex;
  align-items: center;
  height: 100%; }
  .on-off-line > i {
    position: relative;
    top: 0.01rem;
    width: 0.2rem;
    height: 0.2rem;
    border-radius: 50%;
    margin-right: 0.06rem; }
    .on-off-line > i.online {
      background-color: #24c366; }
    .on-off-line > i.offline {
      background-color: #d0d0d0; }
  .on-off-line > span {
    font-size: 0;
    color: #333;
    font-size: 0.2rem; }
    .on-off-line > span.count {
      margin-left: 0.14rem; }
  .on-off-line > em {
    position: relative;
    top: 0.01rem;
    width: 0.01rem;
    height: 0.2rem;
    background-color: rgba(0, 0, 0, 0.2);
    margin: 0 0.32rem; }

.clazz-content {
  background: #eff3f7 url("../images/the-clazz/clazz-content-bg.png") no-repeat left top;
  background-size: 15.5rem 1.55rem; }

.clazz-plat {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  height: 1rem; }

.clazz-plat-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 0.47rem;
  width: 7.27rem;
  height: 0.86rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url("../images/the-clazz/clazz-plat-content.png");
  background-size: 7.27rem 0.86rem; }
  .clazz-plat-content > h3 {
    font-size: 0.24rem;
    color: #fff;
    font-weight: bold; }
  .clazz-plat-content .on-off-line > span {
    color: #fff; }

.clazz-no-data,
.clazz-content-scroll {
  height: calc(100% - 1rem); }

.clazz-no-data {
  position: relative; }

.clazz-content-scroll {
  overflow-x: hidden;
  overflow-y: auto; }

ul.clazz-content-ul {
  padding: 0 0.32rem 0.32rem; }
  ul.clazz-content-ul > li {
    display: flex;
    width: 100%;
    margin-top: 0.3rem; }
    ul.clazz-content-ul > li .desk-wrap {
      width: 25%; }

.group-no-data,
.group-content-scroll {
  height: calc(100% - 0.72rem); }

.group-no-data {
  position: relative; }

.group-content-scroll {
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0.12rem 0.32rem;
  background-color: #eff3f7; }
  [data-theme="primary"] .group-content-scroll {
    background-color: #368FFF; }
  [data-theme="secondary"] .group-content-scroll {
    background-color: #15C8FF; }
  [data-theme="orange"] .group-content-scroll {
    background-color: #FFAE00; }
  [data-theme="green"] .group-content-scroll {
    background-color: #24C366; }
  [data-theme="red"] .group-content-scroll {
    background-color: #FF543A; }
  [data-theme="purple"] .group-content-scroll {
    background-color: #A89BFF; }

.honour-content {
  background-color: #eff3f7;
  padding: 0.38rem 0; }
  [data-theme="primary"] .honour-content {
    background-color: #368FFF; }
  [data-theme="secondary"] .honour-content {
    background-color: #15C8FF; }
  [data-theme="orange"] .honour-content {
    background-color: #FFAE00; }
  [data-theme="green"] .honour-content {
    background-color: #24C366; }
  [data-theme="red"] .honour-content {
    background-color: #FF543A; }
  [data-theme="purple"] .honour-content {
    background-color: #A89BFF; }

.honor-roll-wrap,
.honour-content-scroll {
  padding: 0 1.26rem; }

.honor-roll, .honor-ul {
  background-color: #fff; }
  [data-theme="primary"] .honor-roll,
  [data-theme="primary"] .honor-ul {
    background-color: #368FFF; }
  [data-theme="secondary"] .honor-roll, [data-theme="secondary"] .honor-ul {
    background-color: #15C8FF; }
  [data-theme="orange"] .honor-roll, [data-theme="orange"] .honor-ul {
    background-color: #FFAE00; }
  [data-theme="green"] .honor-roll, [data-theme="green"] .honor-ul {
    background-color: #24C366; }
  [data-theme="red"] .honor-roll, [data-theme="red"] .honor-ul {
    background-color: #FF543A; }
  [data-theme="purple"] .honor-roll, [data-theme="purple"] .honor-ul {
    background-color: #A89BFF; }

.honor-roll {
  height: 1.66rem;
  border-radius: 0.1rem 0.1rem 0 0;
  margin-bottom: 0.24rem; }

ul.honor-roll-ul > li:first-child .medal-person, ul.honor-roll-ul > li:last-child .medal-person {
  position: relative;
  top: 0.12rem; }

.content-scroll-wrap {
  position: relative; }
  .content-scroll-wrap i.switch {
    position: absolute;
    top: 1.86rem;
    width: 0.25rem;
    height: 0.49rem;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer; }
    .content-scroll-wrap i.switch.prev {
      left: 0.5rem;
      background-image: url("../images/the-clazz/prev.png"); }
      .content-scroll-wrap i.switch.prev:hover, .content-scroll-wrap i.switch.prev:active, .content-scroll-wrap i.switch.prev.active {
        background-image: url("../images/the-clazz/prev-active.png"); }
    .content-scroll-wrap i.switch.next {
      right: 0.5rem;
      background-image: url("../images/the-clazz/next.png"); }
      .content-scroll-wrap i.switch.next:hover, .content-scroll-wrap i.switch.next:active, .content-scroll-wrap i.switch.next.active {
        background-image: url("../images/the-clazz/next-active.png"); }

.honour-content-scroll {
  height: 4.2rem;
  overflow-x: hidden;
  overflow-y: auto; }

ul.honor-ul {
  min-height: 100%;
  border-radius: 0.1rem;
  padding: 0.64rem 0; }
  ul.honor-ul > li {
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 33.3333333333%;
    height: 0.48rem;
    margin-top: 0.72rem; }
    ul.honor-ul > li:nth-of-type(1), ul.honor-ul > li:nth-of-type(2), ul.honor-ul > li:nth-of-type(3) {
      margin-top: 0; }
    ul.honor-ul > li .number {
      width: 0.48rem;
      height: 0.48rem;
      line-height: 0.48rem;
      background-color: #43b1fe;
      border-radius: 50%;
      text-align: center;
      font-size: 0.26rem;
      color: #fff; }
      [data-theme="primary"] ul.honor-ul > li .number {
        background-color: #368FFF; }
      [data-theme="secondary"] ul.honor-ul > li .number {
        background-color: #15C8FF; }
      [data-theme="orange"] ul.honor-ul > li .number {
        background-color: #FFAE00; }
      [data-theme="green"] ul.honor-ul > li .number {
        background-color: #24C366; }
      [data-theme="red"] ul.honor-ul > li .number {
        background-color: #FF543A; }
      [data-theme="purple"] ul.honor-ul > li .number {
        background-color: #A89BFF; }
      ul.honor-ul > li .number > i {
        position: relative;
        left: -0.04rem;
        font-style: italic; }
    ul.honor-ul > li .name {
      color: #333;
      font-size: 0.28rem;
      margin-left: 0.1rem; }
    ul.honor-ul > li .support {
      margin-left: 0.44rem; }

ul.honor-roll-ul {
  display: flex;
  align-content: center;
  height: 100%; }
  ul.honor-roll-ul > li {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 33.3333333333%;
    height: 100%;
    background-color: #fff; }
    [data-theme="primary"] ul.honor-roll-ul > li {
      background-color: #368FFF; }
    [data-theme="secondary"] ul.honor-roll-ul > li {
      background-color: #15C8FF; }
    [data-theme="orange"] ul.honor-roll-ul > li {
      background-color: #FFAE00; }
    [data-theme="green"] ul.honor-roll-ul > li {
      background-color: #24C366; }
    [data-theme="red"] ul.honor-roll-ul > li {
      background-color: #FF543A; }
    [data-theme="purple"] ul.honor-roll-ul > li {
      background-color: #A89BFF; }
    ul.honor-roll-ul > li:nth-of-type(2) {
      position: relative; }

.special-medal {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1.96rem;
  border-radius: 0.1rem 0.1rem 0 0;
  background-color: #fff; }
  [data-theme="primary"] .special-medal {
    background-color: #368FFF; }
  [data-theme="secondary"] .special-medal {
    background-color: #15C8FF; }
  [data-theme="orange"] .special-medal {
    background-color: #FFAE00; }
  [data-theme="green"] .special-medal {
    background-color: #24C366; }
  [data-theme="red"] .special-medal {
    background-color: #FF543A; }
  [data-theme="purple"] .special-medal {
    background-color: #A89BFF; }
  .special-medal > i {
    position: absolute;
    top: 0.29rem;
    width: 0.17rem;
    height: 1.28rem; }
    .special-medal > i.left {
      left: -0.17rem;
      width: 0.17rem;
      height: 1.28rem;
      background-position: center center;
      background-repeat: no-repeat;
      background-image: url("../images/the-clazz/left.png");
      background-size: 0.17rem 1.28rem; }
    .special-medal > i.right {
      right: -0.17rem;
      width: 0.17rem;
      height: 1.28rem;
      background-position: center center;
      background-repeat: no-repeat;
      background-image: url("../images/the-clazz/right.png");
      background-size: 0.17rem 1.28rem; }
  .special-medal .medal-person {
    position: relative;
    top: 0.2rem; }

.medal-level {
  position: relative; }
  .medal-level .medal {
    display: flex;
    width: 1rem;
    height: 0.97rem; }
    .medal-level .medal.gold {
      width: 1.33rem;
      height: 1.28rem;
      width: 1.33rem;
      height: 1.28rem;
      background-position: center center;
      background-repeat: no-repeat;
      background-image: url("../images/the-clazz/first.png");
      background-size: 1.33rem 1.28rem; }
    .medal-level .medal.silver {
      width: 1rem;
      height: 0.97rem;
      background-position: center center;
      background-repeat: no-repeat;
      background-image: url("../images/the-clazz/second.png");
      background-size: 1rem 0.97rem; }
    .medal-level .medal.bronze {
      width: 1rem;
      height: 0.97rem;
      background-position: center center;
      background-repeat: no-repeat;
      background-image: url("../images/the-clazz/third.png");
      background-size: 1rem 0.97rem; }
  .medal-level .medal-number {
    position: absolute; }
    .medal-level .medal-number.no2, .medal-level .medal-number.no3 {
      left: 0.11rem;
      bottom: -0.05rem; }
    .medal-level .medal-number.no1 {
      left: 0.15rem;
      bottom: -0.08rem;
      width: 1.06rem;
      height: 0.29rem;
      background-position: center center;
      background-repeat: no-repeat;
      background-image: url("../images/the-clazz/no1.png");
      background-size: 1.06rem 0.29rem; }
    .medal-level .medal-number.no2 {
      width: 0.79rem;
      height: 0.21rem;
      background-position: center center;
      background-repeat: no-repeat;
      background-image: url("../images/the-clazz/no2.png");
      background-size: 0.79rem 0.21rem; }
    .medal-level .medal-number.no3 {
      width: 0.79rem;
      height: 0.21rem;
      background-position: center center;
      background-repeat: no-repeat;
      background-image: url("../images/the-clazz/no3.png");
      background-size: 0.79rem 0.21rem; }

.medal-person {
  padding-left: 0.3rem; }
  .medal-person > h3 {
    font-size: 0.28rem;
    color: #333;
    line-height: 1;
    margin-bottom: 0.2rem; }

.great {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 10;
  transform: translate(-50%, -50%);
  width: 6rem;
  height: 1.65rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url("../images/the-clazz/great.png");
  background-size: 6rem 1.65rem; }
  .great > h3,
  .great .class-avatar-wrap {
    position: relative;
    top: -0.1rem; }
  .great > h3 {
    font-size: 0.3rem;
    color: #fff;
    padding-left: 0.6rem; }
    .great > h3 > i {
      color: #ffd800;
      padding: 0 0.2rem; }

.support {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0; }
  .support.active > span,
  .support.active .support-wrap > i {
    color: #43b1fe; }
  .support > span {
    margin-left: 0.1rem;
    font-size: 0.3rem; }

.support-wrap {
  width: 0.27rem;
  height: 0.27rem;
  overflow: hidden; }
  .support-wrap > i {
    color: #999; }

.to-school {
  width: 7.2rem;
  height: 5.68rem; }
  .to-school .select-list {
    max-width: 720px; }

.to-school-content {
  display: flex; }

.to-school-left,
.to-school-right {
  height: 100%; }

.to-school-left {
  flex: 0 0 3.03rem;
  border-right: 0.01rem solid #d8dedf;
  padding-right: 0.28rem;
  padding-left: 0.32rem; }
  .to-school-left.no-padding {
    padding: 0; }
    .to-school-left.no-padding .share-summary {
      width: 100%; }
      .to-school-left.no-padding .share-summary ul > li {
        padding: 0 0.1rem 0 0.16rem; }
  .to-school-left .btn-style {
    margin-top: 0.23rem; }

.to-school-right {
  flex-grow: 1;
  overflow: auto;
  padding-right: 0.32rem; }

.school-left-item {
  display: flex;
  align-items: center;
  margin-top: 0.23rem; }
  .school-left-item:first-child {
    margin-top: 0.3rem; }
  .school-left-item > span {
    font-size: 0.2rem;
    color: #666;
    flex: 0 0 0.6rem; }
  .school-left-item .select-wrap {
    flex-grow: 1; }

.g-label {
  position: absolute;
  left: 0.32rem;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-size: 0;
  cursor: pointer; }
  .g-label .iconfont-wrap {
    position: relative;
    width: 0.2rem;
    height: 0.2rem;
    overflow: hidden;
    top: 0.02rem; }
    .g-label .iconfont-wrap > i {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      color: #368FFF;
      font-size: 0.3rem; }
      [data-theme="primary"] .g-label .iconfont-wrap > i {
        color: #368FFF; }
      [data-theme="secondary"] .g-label .iconfont-wrap > i {
        color: #15C8FF; }
      [data-theme="orange"] .g-label .iconfont-wrap > i {
        color: #FFAE00; }
      [data-theme="green"] .g-label .iconfont-wrap > i {
        color: #24C366; }
      [data-theme="red"] .g-label .iconfont-wrap > i {
        color: #FF543A; }
      [data-theme="purple"] .g-label .iconfont-wrap > i {
        color: #A89BFF; }
  .g-label .iconfont-wrap {
    margin-right: 0.04rem; }

.g-label-span {
  color: #368FFF;
  font-size: 0.2rem;
  line-height: 1; }
  [data-theme="primary"] .g-label-span {
    color: #368FFF; }
  [data-theme="secondary"] .g-label-span {
    color: #15C8FF; }
  [data-theme="orange"] .g-label-span {
    color: #FFAE00; }
  [data-theme="green"] .g-label-span {
    color: #24C366; }
  [data-theme="red"] .g-label-span {
    color: #FF543A; }
  [data-theme="purple"] .g-label-span {
    color: #A89BFF; }

.common-tips {
  display: flex;
  align-items: center;
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 10;
  transform: translate(-50%, -50%);
  width: 4.74rem;
  height: 0.88rem;
  border-radius: 0.08rem;
  background-color: rgba(27, 27, 27, 0.6);
  padding: 0 0.32rem; }
  .common-tips > i {
    color: #fff;
    font-size: 0.32rem; }
    .common-tips > i.close {
      cursor: pointer;
      position: absolute;
      right: 0.28rem;
      top: 50%;
      transform: translateY(-50%); }
  .common-tips > h3 {
    color: #fff;
    font-size: 0.26rem; }

.tips-wrap {
  position: relative;
  top: 0.02rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 0 0 0.32rem;
  height: 0.32rem;
  border-radius: 50%;
  overflow: hidden;
  background-color: #ff5591;
  margin-right: 0.16rem; }
  .tips-wrap > i {
    color: #fff;
    font-size: 0.48rem;
    line-height: 1;
    text-align: center;
    border-radius: 50%;
    background-color: #56aaf8; }
    .tips-wrap > i.success {
      background-color: #6bd37b; }
    .tips-wrap > i.warning {
      background-color: #ffae00; }
    .tips-wrap > i.error {
      background-color: #eb6146;
      font-size: 0.3rem; }

.common-err-msg {
  position: relative;
  top: 0.02rem;
  display: inline-block;
  vertical-align: top;
  font-size: 0.16rem;
  line-height: 0.32rem;
  text-align: center;
  color: #fff;
  width: 0.32rem;
  height: 0.32rem;
  background-color: #ff543a;
  border-radius: 50%; }

.login-wrapper {
  height: 100%; }
  .login-wrapper .inside-size {
    width: 1000px;
    margin: 0 auto; }
  .login-wrapper .header {
    height: 60px;
    margin-bottom: -60px;
    background: #F7FBFF; }
    .login-wrapper .header .logo {
      display: inline-block;
      margin: 14px 0 0 0; }
      .login-wrapper .header .logo img {
        width: 120px;
        height: 32px; }
  .login-wrapper .content-wrap {
    height: 100%;
    padding: 60px 0 0 0;
    box-sizing: border-box; }
    .login-wrapper .content-wrap .content {
      position: relative;
      height: 100%;
      background: #46adfc;
      text-align: center; }
      .login-wrapper .content-wrap .content:after {
        content: '';
        display: inline-block;
        vertical-align: middle;
        width: 0;
        height: 100%; }
      .login-wrapper .content-wrap .content .login-bg-left {
        display: inline-block;
        position: absolute;
        top: 0;
        left: 0;
        width: 306px;
        height: 612px;
        background: url("../images/login/login-bg-left.png") no-repeat center; }
      .login-wrapper .content-wrap .content .login-bg-right {
        display: inline-block;
        position: absolute;
        top: 0;
        right: 0;
        width: 278px;
        height: 594px;
        background: url("../images/login/login-bg-right.png") no-repeat center; }
      .login-wrapper .content-wrap .content .inside-size {
        display: inline-block;
        vertical-align: middle; }
      .login-wrapper .content-wrap .content .login-pic {
        display: inline-block;
        vertical-align: middle;
        margin-right: 70px; }
        .login-wrapper .content-wrap .content .login-pic img {
          width: 582px;
          height: 532px; }
      .login-wrapper .content-wrap .content .login-form {
        position: relative;
        display: inline-block;
        vertical-align: middle;
        width: 340px;
        height: 317px;
        padding: 32px 36px 40px;
        background: #fff;
        border-radius: 4px; }
        .login-wrapper .content-wrap .content .login-form .form-title {
          margin-bottom: 32px;
          font-size: 18px;
          color: #666; }
        .login-wrapper .content-wrap .content .login-form .error-text {
          position: absolute;
          top: 62px;
          left: 36px;
          font-size: 12px;
          color: #FF543A; }
          .login-wrapper .content-wrap .content .login-form .error-text .icon-prompt {
            display: inline-block;
            vertical-align: middle;
            width: 12px;
            height: 12px;
            margin: -3px 4px 0 0;
            background: url("../images/login/jinggao.png") no-repeat center; }
        .login-wrapper .content-wrap .content .login-form input {
          width: 100%;
          height: 42px;
          line-height: 42px;
          padding: 0 10px 0 39px;
          border: 1px solid #D8DEDF;
          border-radius: 21px;
          box-sizing: border-box;
          font-size: 14px; }
          .login-wrapper .content-wrap .content .login-form input::placeholder {
            color: #ccc; }
          .login-wrapper .content-wrap .content .login-form input:focus {
            transition: border-color 0.3s;
            border-color: #368FFF; }
        .login-wrapper .content-wrap .content .login-form .user-input {
          position: relative;
          margin-bottom: 18px; }
          .login-wrapper .content-wrap .content .login-form .user-input input {
            background: url("../images/login/zk-pc-author.png") no-repeat 13px center; }
          .login-wrapper .content-wrap .content .login-form .user-input .admin-select {
            display: none;
            position: absolute;
            top: 47px;
            left: 0;
            z-index: 10;
            width: 100%;
            padding: 8px 0;
            background: #fff;
            border: #DEE5ED;
            box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.14);
            border-radius: 2px; }
            .login-wrapper .content-wrap .content .login-form .user-input .admin-select li {
              height: 42px;
              line-height: 42px;
              padding: 0 20px;
              text-align: left;
              font-size: 14px;
              cursor: pointer; }
              .login-wrapper .content-wrap .content .login-form .user-input .admin-select li .icon-close {
                display: none;
                float: right;
                font-size: 14px;
                font-weight: bold; }
              .login-wrapper .content-wrap .content .login-form .user-input .admin-select li.active {
                background: #EFF3F7;
                color: #368FFF; }
                .login-wrapper .content-wrap .content .login-form .user-input .admin-select li.active .icon-close {
                  display: block;
                  color: #666; }
                  .login-wrapper .content-wrap .content .login-form .user-input .admin-select li.active .icon-close:hover {
                    color: #368FFF; }
              .login-wrapper .content-wrap .content .login-form .user-input .admin-select li:hover {
                color: #368FFF; }
                .login-wrapper .content-wrap .content .login-form .user-input .admin-select li:hover .icon-close {
                  display: block;
                  color: #666; }
                  .login-wrapper .content-wrap .content .login-form .user-input .admin-select li:hover .icon-close:hover {
                    color: #368FFF; }
        .login-wrapper .content-wrap .content .login-form .password-input {
          position: relative;
          margin-bottom: 24px; }
          .login-wrapper .content-wrap .content .login-form .password-input input {
            background: url("../images/login/password.png") no-repeat 15px center; }
          .login-wrapper .content-wrap .content .login-form .password-input .admin-select {
            display: none;
            position: absolute;
            top: 47px;
            left: 0;
            z-index: 10;
            width: 100%;
            padding: 8px 0;
            background: #fff;
            border: #DEE5ED;
            box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.14);
            border-radius: 2px; }
            .login-wrapper .content-wrap .content .login-form .password-input .admin-select li {
              height: 42px;
              line-height: 42px;
              padding: 0 20px;
              text-align: left;
              font-size: 14px;
              cursor: pointer; }
              .login-wrapper .content-wrap .content .login-form .password-input .admin-select li .icon-close {
                display: none;
                float: right;
                font-size: 14px;
                font-weight: bold; }
              .login-wrapper .content-wrap .content .login-form .password-input .admin-select li.active {
                background: #EFF3F7;
                color: #368FFF; }
                .login-wrapper .content-wrap .content .login-form .password-input .admin-select li.active .icon-close {
                  display: block;
                  color: #666; }
                  .login-wrapper .content-wrap .content .login-form .password-input .admin-select li.active .icon-close:hover {
                    color: #368FFF; }
              .login-wrapper .content-wrap .content .login-form .password-input .admin-select li:hover {
                color: #368FFF; }
                .login-wrapper .content-wrap .content .login-form .password-input .admin-select li:hover .icon-close {
                  display: block;
                  color: #666; }
                  .login-wrapper .content-wrap .content .login-form .password-input .admin-select li:hover .icon-close:hover {
                    color: #368FFF; }
        .login-wrapper .content-wrap .content .login-form .submit {
          display: inline-block;
          width: 100%;
          height: 42px;
          line-height: 42px;
          margin-bottom: 10px;
          background: #368FFF;
          border-radius: 21px;
          color: #fff;
          font-size: 14px; }
          .login-wrapper .content-wrap .content .login-form .submit:hover {
            background: #5AA3FF; }
        .login-wrapper .content-wrap .content .login-form .checkbox-wrap {
          position: relative;
          display: inline-block;
          font-size: 12px;
          color: #666; }
          .login-wrapper .content-wrap .content .login-form .checkbox-wrap input {
            width: 12px;
            height: 12px;
            line-height: 12px;
            padding: 0;
            border-radius: 2px; }
          .login-wrapper .content-wrap .content .login-form .checkbox-wrap .iconfont {
            display: inline-block;
            vertical-align: middle;
            margin-top: 0;
            margin-bottom: 2px;
            margin-right: 0;
            font-size: 20px; }
        .login-wrapper .content-wrap .content .login-form .forget {
          font-size: 12px;
          color: #666; }
          .login-wrapper .content-wrap .content .login-form .forget:hover {
            color: #368FFF; }

.prepare {
  position: relative;
  display: flex;
  border-top: 0.01rem solid #dee5ed; }

.prepare-left,
.prepare-center,
.prepare-right {
  height: 100%;
  background-color: #fff; }

.prepare-left {
  position: relative;
  display: flex;
  flex-shrink: 0;
  flex-direction: column;
  width: 3.84rem;
  border-right: 1px solid #DEE5ED;
  background-color: #F6FAFF; }
  .prepare-left .left-title {
    display: flex;
    flex-grow: 0;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    height: 0.72rem;
    padding: 0 0.2rem 0 0.28rem;
    background-color: #fff; }
    [data-theme="primary"] .prepare-left .left-title {
      background-color: #368FFF; }
    [data-theme="secondary"] .prepare-left .left-title {
      background-color: #15C8FF; }
    [data-theme="orange"] .prepare-left .left-title {
      background-color: #FFAE00; }
    [data-theme="green"] .prepare-left .left-title {
      background-color: #24C366; }
    [data-theme="red"] .prepare-left .left-title {
      background-color: #FF543A; }
    [data-theme="purple"] .prepare-left .left-title {
      background-color: #A89BFF; }
    .prepare-left .left-title .d-btn-wrap {
      padding: 0.1rem 0; }
      .prepare-left .left-title .d-btn-wrap .btn-style {
        width: 2.28rem; }
    .prepare-left .left-title .d-btn-wrap:hover .common-panel,
    .prepare-left .left-title .d-btn-wrap.active .common-panel {
      display: block;
      top: 100%;
      left: 50%;
      margin-top: -0.02rem;
      transform: translateX(-50%); }
    .prepare-left .left-title .iconfont {
      position: relative;
      font-size: 0.32rem;
      cursor: pointer; }
    .prepare-left .left-title .left-switch-btn {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 0.72rem;
      height: 0.32rem;
      border: 1px solid #fff;
      border-radius: 0.16rem;
      font-size: 0.2rem;
      color: #fff;
      cursor: pointer; }
      .prepare-left .left-title .left-switch-btn .menu-box {
        position: absolute;
        top: 0.52rem;
        right: -0.05rem;
        width: 2.4rem;
        padding: 0.1rem 0;
        background-color: #fff;
        border-radius: 0.04rem;
        box-shadow: 0 0 0.1rem rgba(0, 0, 0, 0.2); }
        .prepare-left .left-title .left-switch-btn .menu-box:after {
          position: absolute;
          top: -0.07rem;
          right: 0.24rem;
          content: '';
          width: 0;
          height: 0;
          vertical-align: middle;
          border-left: 0.07rem solid transparent;
          border-right: 0.07rem solid transparent;
          border-bottom: 0.07rem solid #fff; }
        .prepare-left .left-title .left-switch-btn .menu-box span {
          display: flex;
          align-items: center;
          width: 100%;
          height: 0.56rem;
          line-height: 0.56rem;
          padding: 0 0.22rem;
          font-size: 0.22rem;
          color: #666; }
          .prepare-left .left-title .left-switch-btn .menu-box span .iconfont {
            margin-right: 0.15rem;
            color: #8794A8; }
          .prepare-left .left-title .left-switch-btn .menu-box span:hover {
            color: #368FFF; }
            .prepare-left .left-title .left-switch-btn .menu-box span:hover .iconfont {
              color: #368FFF; }
          .prepare-left .left-title .left-switch-btn .menu-box span.active {
            background-color: #EFF3F7;
            color: #368FFF; }
            .prepare-left .left-title .left-switch-btn .menu-box span.active .iconfont {
              color: #368FFF; }
    .prepare-left .left-title .txt-box {
      display: flex;
      align-items: center;
      font-size: 0; }
      .prepare-left .left-title .txt-box .iconfont {
        margin-top: 0.04rem;
        margin-right: 0.1rem;
        font-size: 0.4rem; }
      .prepare-left .left-title .txt-box .txt {
        font-size: 0.26rem; }
  .prepare-left .left-subject {
    display: flex;
    flex-direction: column;
    flex-grow: 0;
    flex-shrink: 0;
    justify-content: center;
    height: 0.96rem;
    padding: 0 0.24rem 0 0.32rem;
    background-color: #fff;
    color: #333; }
    [data-theme="primary"] .prepare-left .left-subject {
      background-color: #368FFF; }
    [data-theme="secondary"] .prepare-left .left-subject {
      background-color: #15C8FF; }
    [data-theme="orange"] .prepare-left .left-subject {
      background-color: #FFAE00; }
    [data-theme="green"] .prepare-left .left-subject {
      background-color: #24C366; }
    [data-theme="red"] .prepare-left .left-subject {
      background-color: #FF543A; }
    [data-theme="purple"] .prepare-left .left-subject {
      background-color: #A89BFF; }
    [data-theme="primary"] .prepare-left .left-subject {
      color: #368FFF; }
    [data-theme="secondary"] .prepare-left .left-subject {
      color: #15C8FF; }
    [data-theme="orange"] .prepare-left .left-subject {
      color: #FFAE00; }
    [data-theme="green"] .prepare-left .left-subject {
      color: #24C366; }
    [data-theme="red"] .prepare-left .left-subject {
      color: #FF543A; }
    [data-theme="purple"] .prepare-left .left-subject {
      color: #A89BFF; }
    .prepare-left .left-subject.small {
      height: 0.64rem;
      border-top: 1px solid #DEE5ED;
      border-bottom: 1px solid #DEE5ED; }
      .prepare-left .left-subject.small:hover, .prepare-left .left-subject.small:active, .prepare-left .left-subject.small.active {
        cursor: pointer; }
        .prepare-left .left-subject.small:hover > span, .prepare-left .left-subject.small:active > span, .prepare-left .left-subject.small.active > span {
          color: #368FFF; }
    .prepare-left .left-subject.blue {
      background-color: #e5effa;
      color: #fff;
      border-left: 0.04rem solid #368FFF;
      padding: 0 0.24rem 0 0.28rem; }
      [data-theme="primary"] .prepare-left .left-subject.blue {
        background-color: #368FFF; }
      [data-theme="secondary"] .prepare-left .left-subject.blue {
        background-color: #15C8FF; }
      [data-theme="orange"] .prepare-left .left-subject.blue {
        background-color: #FFAE00; }
      [data-theme="green"] .prepare-left .left-subject.blue {
        background-color: #24C366; }
      [data-theme="red"] .prepare-left .left-subject.blue {
        background-color: #FF543A; }
      [data-theme="purple"] .prepare-left .left-subject.blue {
        background-color: #A89BFF; }
      [data-theme="primary"] .prepare-left .left-subject.blue {
        color: #368FFF; }
      [data-theme="secondary"] .prepare-left .left-subject.blue {
        color: #15C8FF; }
      [data-theme="orange"] .prepare-left .left-subject.blue {
        color: #FFAE00; }
      [data-theme="green"] .prepare-left .left-subject.blue {
        color: #24C366; }
      [data-theme="red"] .prepare-left .left-subject.blue {
        color: #FF543A; }
      [data-theme="purple"] .prepare-left .left-subject.blue {
        color: #A89BFF; }
    .prepare-left .left-subject.prepare-blue {
      background-color: #368FFF;
      color: #fff; }
      [data-theme="primary"] .prepare-left .left-subject.prepare-blue {
        background-color: #368FFF; }
      [data-theme="secondary"] .prepare-left .left-subject.prepare-blue {
        background-color: #15C8FF; }
      [data-theme="orange"] .prepare-left .left-subject.prepare-blue {
        background-color: #FFAE00; }
      [data-theme="green"] .prepare-left .left-subject.prepare-blue {
        background-color: #24C366; }
      [data-theme="red"] .prepare-left .left-subject.prepare-blue {
        background-color: #FF543A; }
      [data-theme="purple"] .prepare-left .left-subject.prepare-blue {
        background-color: #A89BFF; }
      [data-theme="primary"] .prepare-left .left-subject.prepare-blue {
        color: #368FFF; }
      [data-theme="secondary"] .prepare-left .left-subject.prepare-blue {
        color: #15C8FF; }
      [data-theme="orange"] .prepare-left .left-subject.prepare-blue {
        color: #FFAE00; }
      [data-theme="green"] .prepare-left .left-subject.prepare-blue {
        color: #24C366; }
      [data-theme="red"] .prepare-left .left-subject.prepare-blue {
        color: #FF543A; }
      [data-theme="purple"] .prepare-left .left-subject.prepare-blue {
        color: #A89BFF; }
    .prepare-left .left-subject > span {
      font-size: 0.24rem;
      color: #333;
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap; }
  .prepare-left .left-subject-header,
  .prepare-left .left-subject-bottom {
    display: flex;
    align-items: center;
    line-height: 1; }
    .prepare-left .left-subject-header .iconfont,
    .prepare-left .left-subject-bottom .iconfont {
      position: relative;
      top: 0.02rem; }
    .prepare-left .left-subject-header > a,
    .prepare-left .left-subject-bottom > a {
      position: absolute;
      right: 0;
      top: 50%;
      transform: translateY(-50%);
      width: 0.8rem;
      height: 0.32rem;
      line-height: 0.3rem;
      text-align: center;
      border-radius: 0.16rem;
      font-size: 0.2rem;
      color: #fff;
      border: 1px solid #fff; }
  .prepare-left .left-subject-header {
    position: relative;
    padding-right: 0.8rem; }
    .prepare-left .left-subject-header > h3 {
      font-size: 0.26rem;
      font-weight: bold; }
    .prepare-left .left-subject-header .iconfont {
      margin-left: -0.06rem;
      margin-right: 0.06rem; }
  .prepare-left .left-subject-bottom {
    justify-content: space-between;
    margin-top: 0.12rem; }
    .prepare-left .left-subject-bottom > span {
      font-size: 0.2rem;
      opacity: .66;
      flex-grow: 1;
      width: 0;
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap;
      padding-right: 0.1rem;
      margin-left: -0.1rem; }
    .prepare-left .left-subject-bottom .iconfont {
      flex-shrink: 0;
      margin-left: -0.06rem;
      cursor: pointer; }

.left-subject-list {
  position: relative;
  display: flex;
  flex-grow: 1;
  flex-direction: column;
  overflow-y: auto; }
  .left-subject-list > dl {
    border-bottom: 1px solid #DEE5ED; }
  .left-subject-list dl:first-child > dd:last-child {
    margin-bottom: 0.15rem; }
  .left-subject-list dl dt,
  .left-subject-list dl dd {
    cursor: pointer; }
    .left-subject-list dl dt .item,
    .left-subject-list dl dd .item {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      line-height: 0.64rem;
      padding: 0 0.24rem 0 0.3rem;
      font-size: 0.24rem;
      color: #333; }
      .left-subject-list dl dt .item.active,
      .left-subject-list dl dd .item.active {
        padding-left: 0.26rem;
        background-color: #E5EFFA;
        border-left: 0.04rem solid #368FFF;
        color: #368FFF; }
        .left-subject-list dl dt .item.active .menu-icon,
        .left-subject-list dl dd .item.active .menu-icon {
          color: #368FFF; }
      .left-subject-list dl dt .item .txt,
      .left-subject-list dl dd .item .txt {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        max-width: 2.8rem; }
      .left-subject-list dl dt .item .iconfont,
      .left-subject-list dl dd .item .iconfont {
        font-size: 0.3rem;
        color: #8794A8;
        cursor: pointer; }
      .left-subject-list dl dt .item:hover,
      .left-subject-list dl dd .item:hover {
        background-color: #E5EFFA; }
    .left-subject-list dl dt dl dd .item,
    .left-subject-list dl dd dl dd .item {
      padding-left: 0.66rem; }
      .left-subject-list dl dt dl dd .item.active,
      .left-subject-list dl dd dl dd .item.active {
        padding-left: 0.62rem; }
      .left-subject-list dl dt dl dd .item .txt,
      .left-subject-list dl dd dl dd .item .txt {
        max-width: 2.44rem; }
    .left-subject-list dl dt dl dd dl dd .item,
    .left-subject-list dl dd dl dd dl dd .item {
      padding-left: 0.84rem; }
      .left-subject-list dl dt dl dd dl dd .item.active,
      .left-subject-list dl dd dl dd dl dd .item.active {
        padding-left: 0.8rem; }
      .left-subject-list dl dt dl dd dl dd .item .txt,
      .left-subject-list dl dd dl dd dl dd .item .txt {
        max-width: 2.26rem; }
    .left-subject-list dl dt dl dd dl dd dl dd .item,
    .left-subject-list dl dd dl dd dl dd dl dd .item {
      padding-left: 1.02rem; }
      .left-subject-list dl dt dl dd dl dd dl dd .item.active,
      .left-subject-list dl dd dl dd dl dd dl dd .item.active {
        padding-left: 0.98rem; }
      .left-subject-list dl dt dl dd dl dd dl dd .item .txt,
      .left-subject-list dl dd dl dd dl dd dl dd .item .txt {
        max-width: 2.08rem; }
  .left-subject-list dl dd {
    display: none; }
    .left-subject-list dl dd .item {
      padding: 0 0.24rem 0 0.48rem; }
      .left-subject-list dl dd .item.active {
        padding-left: 0.44rem; }
      .left-subject-list dl dd .item .txt {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        max-width: 2.62rem; }
  .left-subject-list dl.open {
    background-color: #fff; }
    .left-subject-list dl.open dt .icon-ZK-PC-arrow-bottom:before {
      content: "\e77b"; }
    .left-subject-list dl.open dd {
      display: block; }
      .left-subject-list dl.open dd dd {
        display: none; }
      .left-subject-list dl.open dd.open > .item .icon-ZK-PC-arrow-bottom:before {
        content: "\e77b"; }
      .left-subject-list dl.open dd.open > dl > dd {
        display: block; }

ul.review-ul {
  flex-grow: 1;
  overflow-x: hidden;
  overflow-y: auto; }
  ul.review-ul > li {
    position: relative;
    display: flex;
    height: 0.88rem;
    padding: 0 0.32rem; }
    ul.review-ul > li:after {
      content: '';
      position: absolute;
      left: 0.32rem;
      bottom: 0;
      width: calc(100% - 0.64rem);
      border-top: 0.01rem dashed #dee5ed; }
    ul.review-ul > li:hover, ul.review-ul > li:active, ul.review-ul > li.active {
      background-color: #f0f9ff; }
      [data-theme="primary"] ul.review-ul > li:hover, [data-theme="primary"] ul.review-ul > li:active, [data-theme="primary"] ul.review-ul > li.active {
        background-color: #368FFF; }
      [data-theme="secondary"] ul.review-ul > li:hover, [data-theme="secondary"] ul.review-ul > li:active, [data-theme="secondary"] ul.review-ul > li.active {
        background-color: #15C8FF; }
      [data-theme="orange"] ul.review-ul > li:hover, [data-theme="orange"] ul.review-ul > li:active, [data-theme="orange"] ul.review-ul > li.active {
        background-color: #FFAE00; }
      [data-theme="green"] ul.review-ul > li:hover, [data-theme="green"] ul.review-ul > li:active, [data-theme="green"] ul.review-ul > li.active {
        background-color: #24C366; }
      [data-theme="red"] ul.review-ul > li:hover, [data-theme="red"] ul.review-ul > li:active, [data-theme="red"] ul.review-ul > li.active {
        background-color: #FF543A; }
      [data-theme="purple"] ul.review-ul > li:hover, [data-theme="purple"] ul.review-ul > li:active, [data-theme="purple"] ul.review-ul > li.active {
        background-color: #A89BFF; }

ul.common-panel {
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 11;
  width: 2.4rem;
  box-shadow: 0 0 0.16rem 0 rgba(0, 0, 0, 0.14);
  border-radius: 0.08rem;
  background-color: #fff; }
  ul.common-panel.auto {
    width: auto; }
  ul.common-panel.normal {
    width: 2rem; }
  ul.common-panel.small {
    width: 1.2rem; }
  ul.common-panel.small-xl {
    width: 1.74rem; }
  [data-theme="primary"] ul.common-panel {
    background-color: #368FFF; }
  [data-theme="secondary"] ul.common-panel {
    background-color: #15C8FF; }
  [data-theme="orange"] ul.common-panel {
    background-color: #FFAE00; }
  [data-theme="green"] ul.common-panel {
    background-color: #24C366; }
  [data-theme="red"] ul.common-panel {
    background-color: #FF543A; }
  [data-theme="purple"] ul.common-panel {
    background-color: #A89BFF; }
  ul.common-panel > li {
    display: flex;
    align-items: center;
    height: 0.72rem; }
    ul.common-panel > li:hover > a, ul.common-panel > li:active > a, ul.common-panel > li.active > a {
      color: #368fff;
      background-color: #eff3f7; }
    ul.common-panel > li > a {
      display: flex;
      align-items: center;
      width: 100%;
      height: 0.56rem;
      padding: 0 0.32rem;
      color: #666;
      font-size: 0.22rem;
      word-break: keep-all;
      white-space: nowrap; }
    ul.common-panel > li.border-top {
      border-top: 0.01rem solid #dedede; }
    ul.common-panel > li:first-child {
      border-radius: 0.08rem 0.08rem 0 0; }
    ul.common-panel > li:last-child {
      border-radius: 0 0 0.08rem 0.08rem; }

ul.teach-ul {
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 100%; }
  ul.teach-ul.right {
    height: calc(100% - 1.52rem); }
    ul.teach-ul.right.yun .teach-item-right {
      flex: 0 0 0.88rem; }
    ul.teach-ul.right .teach-item-right {
      flex: 0 0 0.32rem;
      margin-right: -0.04rem;
      color: #abb4c2; }
      ul.teach-ul.right .teach-item-right .icon-zhengque {
        color: #24c366; }
    ul.teach-ul.right .teach-item-info {
      padding-left: 0.14rem; }
  ul.teach-ul > li {
    height: 1.12rem;
    border-bottom: 0.01rem solid #dedede;
    cursor: pointer; }
    ul.teach-ul > li:hover, ul.teach-ul > li:active, ul.teach-ul > li.active {
      background-color: #f0f9ff; }
      [data-theme="primary"] ul.teach-ul > li:hover, [data-theme="primary"] ul.teach-ul > li:active, [data-theme="primary"] ul.teach-ul > li.active {
        background-color: #368FFF; }
      [data-theme="secondary"] ul.teach-ul > li:hover, [data-theme="secondary"] ul.teach-ul > li:active, [data-theme="secondary"] ul.teach-ul > li.active {
        background-color: #15C8FF; }
      [data-theme="orange"] ul.teach-ul > li:hover, [data-theme="orange"] ul.teach-ul > li:active, [data-theme="orange"] ul.teach-ul > li.active {
        background-color: #FFAE00; }
      [data-theme="green"] ul.teach-ul > li:hover, [data-theme="green"] ul.teach-ul > li:active, [data-theme="green"] ul.teach-ul > li.active {
        background-color: #24C366; }
      [data-theme="red"] ul.teach-ul > li:hover, [data-theme="red"] ul.teach-ul > li:active, [data-theme="red"] ul.teach-ul > li.active {
        background-color: #FF543A; }
      [data-theme="purple"] ul.teach-ul > li:hover, [data-theme="purple"] ul.teach-ul > li:active, [data-theme="purple"] ul.teach-ul > li.active {
        background-color: #A89BFF; }
    ul.teach-ul > li.checked {
      background-color: #f4f7f9; }
      [data-theme="primary"] ul.teach-ul > li.checked {
        background-color: #368FFF; }
      [data-theme="secondary"] ul.teach-ul > li.checked {
        background-color: #15C8FF; }
      [data-theme="orange"] ul.teach-ul > li.checked {
        background-color: #FFAE00; }
      [data-theme="green"] ul.teach-ul > li.checked {
        background-color: #24C366; }
      [data-theme="red"] ul.teach-ul > li.checked {
        background-color: #FF543A; }
      [data-theme="purple"] ul.teach-ul > li.checked {
        background-color: #A89BFF; }

.teach-item-header {
  display: flex;
  align-items: center; }
  .teach-item-header > h3 {
    color: #333;
    font-size: 0.24rem;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap; }
    [data-theme="primary"] .teach-item-header > h3 {
      color: #368FFF; }
    [data-theme="secondary"] .teach-item-header > h3 {
      color: #15C8FF; }
    [data-theme="orange"] .teach-item-header > h3 {
      color: #FFAE00; }
    [data-theme="green"] .teach-item-header > h3 {
      color: #24C366; }
    [data-theme="red"] .teach-item-header > h3 {
      color: #FF543A; }
    [data-theme="purple"] .teach-item-header > h3 {
      color: #A89BFF; }
    .teach-item-header > h3 > em {
      color: #FF543A; }

.center-operate {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #f4f7f9;
  height: 0.8rem; }
  [data-theme="primary"] .center-operate {
    background-color: #368FFF; }
  [data-theme="secondary"] .center-operate {
    background-color: #15C8FF; }
  [data-theme="orange"] .center-operate {
    background-color: #FFAE00; }
  [data-theme="green"] .center-operate {
    background-color: #24C366; }
  [data-theme="red"] .center-operate {
    background-color: #FF543A; }
  [data-theme="purple"] .center-operate {
    background-color: #A89BFF; }
  .center-operate .left-line, .center-operate .right-line {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 0.01rem;
    height: 0.28rem;
    background-color: #dee5ed; }
    [data-theme="primary"] .center-operate .left-line,
    [data-theme="primary"] .center-operate .right-line {
      background-color: #368FFF; }
    [data-theme="secondary"] .center-operate .left-line, [data-theme="secondary"] .center-operate .right-line {
      background-color: #15C8FF; }
    [data-theme="orange"] .center-operate .left-line, [data-theme="orange"] .center-operate .right-line {
      background-color: #FFAE00; }
    [data-theme="green"] .center-operate .left-line, [data-theme="green"] .center-operate .right-line {
      background-color: #24C366; }
    [data-theme="red"] .center-operate .left-line, [data-theme="red"] .center-operate .right-line {
      background-color: #FF543A; }
    [data-theme="purple"] .center-operate .left-line, [data-theme="purple"] .center-operate .right-line {
      background-color: #A89BFF; }
  .center-operate .left-line {
    left: 0; }
  .center-operate .right-line {
    right: 0; }

.left-file-list {
  height: calc(100% - .64rem - .72rem - 1.2rem);
  overflow-y: auto;
  background: #fff; }
  .left-file-list ul li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 0.64rem;
    padding: 0 0.32rem 0 0.46rem;
    font-size: 0.24rem;
    color: #333;
    cursor: pointer; }
    .left-file-list ul li .left-file-item {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-grow: 1; }
      .left-file-list ul li .left-file-item > em {
        width: 0.34rem;
        height: 0.24rem;
        line-height: 0.24rem;
        border-radius: 0.12rem;
        background-color: #FF543A;
        color: #fff;
        font-size: 0.16rem;
        text-align: center; }
        [data-theme="primary"] .left-file-list ul li .left-file-item > em {
          background-color: #368FFF; }
        [data-theme="secondary"] .left-file-list ul li .left-file-item > em {
          background-color: #15C8FF; }
        [data-theme="orange"] .left-file-list ul li .left-file-item > em {
          background-color: #FFAE00; }
        [data-theme="green"] .left-file-list ul li .left-file-item > em {
          background-color: #24C366; }
        [data-theme="red"] .left-file-list ul li .left-file-item > em {
          background-color: #FF543A; }
        [data-theme="purple"] .left-file-list ul li .left-file-item > em {
          background-color: #A89BFF; }
        [data-theme="primary"] .left-file-list ul li .left-file-item > em {
          color: #368FFF; }
        [data-theme="secondary"] .left-file-list ul li .left-file-item > em {
          color: #15C8FF; }
        [data-theme="orange"] .left-file-list ul li .left-file-item > em {
          color: #FFAE00; }
        [data-theme="green"] .left-file-list ul li .left-file-item > em {
          color: #24C366; }
        [data-theme="red"] .left-file-list ul li .left-file-item > em {
          color: #FF543A; }
        [data-theme="purple"] .left-file-list ul li .left-file-item > em {
          color: #A89BFF; }
    .left-file-list ul li .iconfont {
      font-size: 0.3rem;
      color: #8794A8;
      cursor: pointer;
      flex: 0 0 auto; }
    .left-file-list ul li:hover {
      color: #368FFF; }
      .left-file-list ul li:hover .iconfont {
        color: #368FFF; }
    .left-file-list ul li.active {
      padding-left: 0.42rem;
      background-color: #E5EFFA;
      border-left: 0.04rem solid #368FFF; }

.zh-load-tips {
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center; }
  .zh-load-tips .error {
    display: inline-block;
    width: 0.56rem;
    height: 0.56rem;
    line-height: 0.56rem;
    background-color: #CBD1DB;
    border-radius: 50%;
    font-size: 0.3rem;
    font-weight: bold;
    color: #fff; }
  .zh-load-tips .tips-txt {
    margin-top: 0.16rem;
    font-size: 0.24rem;
    color: #666; }
  .zh-load-tips .btn-style {
    margin-top: 0.22rem;
    display: flex;
    justify-content: center;
    align-items: center; }
    .zh-load-tips .btn-style .iconfont {
      margin: 0 0.05rem 0 0; }

.header-wrap {
  height: 1.92rem; }

.task {
  background-color: #fff;
  border-top: 1px solid #DEE5ED; }

.color-blue {
  color: #368FFF !important; }

.color-red {
  color: #FF543A !important; }

.color-gray {
  color: #999 !important; }

.task-center-left {
  position: relative;
  display: flex;
  flex-shrink: 0;
  flex-direction: column;
  width: 3.84rem;
  border-right: 1px solid #DEE5ED;
  background-color: #F7FAFF; }
  .task-center-left .mask {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(246, 250, 255, 0.8); }
  .task-center-left .btn-top-box {
    position: relative;
    display: flex;
    flex-grow: 0;
    flex-shrink: 0;
    padding: 0.2rem 0.32rem; }
    .task-center-left .btn-top-box .btn-style {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      height: 0.64rem;
      line-height: 0.64rem;
      border-radius: 0.32rem;
      font-size: 0.24rem; }
      .task-center-left .btn-top-box .btn-style:hover {
        height: 0.64rem !important;
        line-height: 0.64rem !important; }
    .task-center-left .btn-top-box .iconfont {
      display: inline-block;
      width: 0.28rem;
      height: 0.28rem;
      line-height: 0.3rem;
      margin-right: 0.22rem;
      border-radius: 50%;
      background-color: #fff;
      font-size: 0.26rem;
      font-weight: bold;
      color: #368FFF;
      text-align: center; }
  .task-center-left .task-choose-subject {
    position: absolute;
    top: 0;
    right: -4.78rem;
    z-index: 1004;
    width: 4.78rem;
    max-height: 4.25rem;
    padding: 0.3rem 0 0.3rem 0.4rem;
    background-color: #fff;
    border: 1px solid #DEE5ED;
    box-shadow: 0 0.02rem 0.16rem rgba(0, 0, 0, 0.4);
    border-radius: 0.04rem;
    font-size: 0.24rem;
    color: #333; }
    .task-center-left .task-choose-subject .title {
      height: 0.3rem;
      font-size: 0.24rem; }
    .task-center-left .task-choose-subject .subject-list-wrap {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      margin-top: 0.15rem;
      padding-right: 0.4rem;
      max-height: 3.2rem;
      overflow-y: auto; }
      .task-center-left .task-choose-subject .subject-list-wrap li {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 47%;
        margin: 0.12rem 0;
        height: 0.56rem;
        background-color: #F0F2F5;
        border-radius: 0.28rem;
        cursor: pointer; }
        .task-center-left .task-choose-subject .subject-list-wrap li:hover {
          color: #368FFF; }
        .task-center-left .task-choose-subject .subject-list-wrap li.active {
          background-color: #368FFF;
          color: #fff; }
    .task-center-left .task-choose-subject.modify .title .operate {
      margin-left: 0.12rem;
      font-size: 0.2rem;
      color: #7F8893;
      vertical-align: baseline; }
      .task-center-left .task-choose-subject.modify .title .operate:hover {
        color: #368FFF; }
  .task-center-left .task-choose-subject-new {
    right: -8.32rem;
    width: 8.32rem;
    max-height: 6.7rem;
    padding: .3rem 0.24rem; }
    .task-center-left .task-choose-subject-new .task-title {
      display: flex;
      justify-content: space-between;
      margin-bottom: 0.3rem; }
      .task-center-left .task-choose-subject-new .task-title .operate {
        margin-left: 0.12rem;
        font-size: 0.2rem;
        color: #7F8893; }
        .task-center-left .task-choose-subject-new .task-title .operate:hover {
          color: #368FFF; }
    .task-center-left .task-choose-subject-new .task-choose-list {
      max-height: 5.5rem;
      overflow-y: auto; }
    .task-center-left .task-choose-subject-new .task-choose-item > h4 {
      margin-bottom: 0.07rem;
      font-size: 0.2rem;
      color: #7F8893; }
    .task-center-left .task-choose-subject-new .task-choose-item .task-choose-item-list {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap; }
      .task-center-left .task-choose-subject-new .task-choose-item .task-choose-item-list li {
        display: flex;
        width: 3.8rem;
        height: 1.1rem;
        padding: 0.22rem 0.16rem;
        margin-bottom: 0.2rem;
        background: #f7faff;
        border: 1px solid transparent;
        border-radius: 0.04rem;
        box-sizing: border-box;
        font-size: 0.24rem;
        font-weight: bold;
        cursor: pointer; }
        .task-center-left .task-choose-subject-new .task-choose-item .task-choose-item-list li:hover, .task-center-left .task-choose-subject-new .task-choose-item .task-choose-item-list li.active {
          border: 1px solid #368fff; }
        .task-center-left .task-choose-subject-new .task-choose-item .task-choose-item-list li .task-icons {
          width: 0.6rem;
          height: 0.6rem;
          margin-right: 0.08rem; }
          .task-center-left .task-choose-subject-new .task-choose-item .task-choose-item-list li .task-icons img {
            width: 100%;
            height: 100%; }
        .task-center-left .task-choose-subject-new .task-choose-item .task-choose-item-list li .tag {
          font-size: 0.2rem;
          font-weight: 400;
          color: #999; }
    .task-center-left .task-choose-subject-new.task-choose-type {
      right: -5.5rem;
      width: 5.5rem; }
    .task-center-left .task-choose-subject-new .task-subject-list {
      font-size: 0;
      margin-right: -0.24rem; }
      .task-center-left .task-choose-subject-new .task-subject-list li {
        display: inline-block;
        width: 1.5rem;
        height: 0.45rem;
        line-height: 0.43rem;
        margin: 0 0.24rem 0.36rem 0;
        border: 1px solid #DEE5ED;
        border-radius: 0.08rem;
        font-size: 0.22rem;
        color: #333;
        text-align: center;
        cursor: pointer; }
        .task-center-left .task-choose-subject-new .task-subject-list li.active {
          border-color: #368FFF;
          background: #368FFF;
          color: #fff; }
        .task-center-left .task-choose-subject-new .task-subject-list li:hover {
          color: #368FFF; }
          .task-center-left .task-choose-subject-new .task-subject-list li:hover.active {
            color: #fff; }
  .task-center-left .prepare-pan {
    position: relative;
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    height: 100%; }
    .task-center-left .prepare-pan .left-file-list {
      height: auto;
      min-height: 2rem;
      background: transparent; }
      .task-center-left .prepare-pan .left-file-list ul li {
        padding-left: 0.32rem; }
        .task-center-left .prepare-pan .left-file-list ul li:hover {
          background-color: #E5EFFA;
          color: #333; }
          .task-center-left .prepare-pan .left-file-list ul li:hover .iconfont {
            color: #8794A8; }
        .task-center-left .prepare-pan .left-file-list ul li span {
          display: inline-block;
          width: 2.7rem;
          text-overflow: ellipsis;
          overflow: hidden;
          white-space: nowrap; }
          .task-center-left .prepare-pan .left-file-list ul li span .iconfont {
            margin-right: 0.08rem;
            font-size: 0.26rem;
            vertical-align: -0.02rem;
            color: #97A7BF; }
        .task-center-left .prepare-pan .left-file-list ul li.active {
          padding-left: 0.28rem;
          color: #368FFF; }
          .task-center-left .prepare-pan .left-file-list ul li.active span .iconfont {
            color: #368FFF; }
      .task-center-left .prepare-pan .left-file-list.class-list {
        height: calc(100% - 1.28rem - 0.88rem); }
  .task-center-left .title-my-class {
    padding: 0.5rem 0 0.14rem;
    margin: 0 0.32rem;
    line-height: 0.24rem;
    font-size: 0.24rem;
    color: #7F8893;
    border-bottom: 1px solid #dee5de; }
  .task-center-left .task-code-box {
    position: relative;
    display: flex;
    flex-grow: 0;
    flex-shrink: 0;
    height: 0.98rem;
    padding: 0.32rem; }
    .task-center-left .task-code-box .code-l-box {
      position: absolute;
      left: 0.64rem;
      bottom: 0.32rem;
      width: 2.56rem;
      height: 3rem;
      background-color: #fff;
      border: 1px solid #dee5de;
      box-shadow: 0 0 0.16rem rgba(0, 0, 0, 0.14); }
      .task-center-left .task-code-box .code-l-box .close-box {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        width: 100%;
        padding: 0 0.1rem;
        height: 0.4rem; }
        .task-center-left .task-code-box .code-l-box .close-box .iconfont {
          font-size: 0.24rem;
          color: #7F8893;
          cursor: pointer; }
      .task-center-left .task-code-box .code-l-box .colde-l {
        display: flex;
        justify-content: center; }
        .task-center-left .task-code-box .code-l-box .colde-l img {
          width: 2rem;
          height: 2rem; }
      .task-center-left .task-code-box .code-l-box .code-txt {
        padding-top: 0.16rem;
        text-align: center;
        font-size: 0.2rem;
        color: #333; }
    .task-center-left .task-code-box .code-s-box {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 0.34rem;
      height: 0.34rem;
      background-color: #fff;
      border: 1px solid #dee5de;
      box-shadow: 0 0 0.08rem rgba(0, 0, 0, 0.14);
      cursor: pointer; }
      .task-center-left .task-code-box .code-s-box img {
        width: 0.26rem;
        height: 0.26rem;
        margin: 0.03rem; }

.task-center-right {
  position: relative;
  flex-grow: 1;
  padding-top: 0.72rem; }
  .task-center-right.has-bottom {
    padding-bottom: 1rem; }
  .task-center-right .task-detail-main {
    margin-left: 0; }

.task-center-breadcrumb {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  display: flex;
  align-items: center;
  height: 0.96rem;
  line-height: 0.96rem;
  padding: 0 0.28rem;
  background-color: #fff;
  border-bottom: 1px solid #DEE5ED;
  font-size: 0.24rem;
  font-weight: bold;
  color: #333; }
  .task-center-breadcrumb .num {
    color: #999; }
    .task-center-breadcrumb .num strong {
      color: #368FFF;
      font-weight: normal; }

.task .task-center-right {
  position: relative;
  padding-top: 0.96rem; }
  .task .task-center-right:after {
    position: absolute;
    bottom: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 0.32rem;
    background: linear-gradient(0deg, white 0%, rgba(255, 255, 255, 0) 100%); }
  .task .task-center-right.has-bottom:after {
    bottom: 1rem; }

.task-info-wrap {
  position: relative;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0.24rem 0.32rem 0; }
  .task-info-wrap .task-center-date {
    line-height: 0.48rem;
    padding: 0 0.32rem 0;
    font-size: 0.18rem;
    color: #999; }
  .task-info-wrap > .task-center-date:first-child {
    margin-top: -0.24rem; }
  .task-info-wrap .el-row:first-child .task-center-date {
    margin-top: -0.24rem; }
  .task-info-wrap .el-row:first-child .task-info-panel {
    margin-top: 0; }
  .task-info-wrap .task-info-panel {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 0.32rem;
    margin-top: 0.24rem;
    background-color: #fff;
    border: 1px solid #dee5de;
    border-radius: 0.04rem; }
    .task-info-wrap .task-info-panel .task-info-cont {
      padding: 0.38rem 0; }
      .task-info-wrap .task-info-panel .task-info-cont .task-title {
        display: flex;
        align-items: center;
        margin-bottom: 0.1rem; }
        .task-info-wrap .task-info-panel .task-info-cont .task-title .label {
          min-width: 0.82rem;
          height: 0.32rem;
          line-height: 0.32rem;
          padding: 0 0.14rem;
          margin-right: 0.1rem;
          text-align: center;
          font-size: 0.18rem;
          color: #fff;
          border-radius: 0.04rem;
          vertical-align: 3px; }
        .task-info-wrap .task-info-panel .task-info-cont .task-title .title {
          display: inline-block;
          font-size: 0.28rem;
          color: #333;
          font-weight: bold; }
        .task-info-wrap .task-info-panel .task-info-cont .task-title .daka-icon {
          width: 0.64rem;
          height: 0.64rem;
          margin-right: 0.24rem;
          background: url("../images/task-center/icon.png");
          background-size: 0.64rem 0.64rem; }
      .task-info-wrap .task-info-panel .task-info-cont p {
        margin-top: 0.05rem;
        font-size: 0.2rem;
        color: #666; }
        .task-info-wrap .task-info-panel .task-info-cont p span + span {
          margin-left: 0.4rem; }
    .task-info-wrap .task-info-panel .operate-box {
      display: none;
      position: absolute;
      top: 0.14rem;
      right: 0.14rem; }
      .task-info-wrap .task-info-panel .operate-box .return-back-btn {
        font-size: 0.18rem;
        color: #999;
        cursor: pointer; }
        .task-info-wrap .task-info-panel .operate-box .return-back-btn:hover {
          color: #368FFF; }
      .task-info-wrap .task-info-panel .operate-box .iconfont {
        font-size: 0.22rem;
        color: #B3BECE;
        cursor: pointer; }
        .task-info-wrap .task-info-panel .operate-box .iconfont:hover {
          color: #368FFF; }
      .task-info-wrap .task-info-panel .operate-box .operate-list {
        display: none;
        position: absolute;
        top: 0.4rem;
        right: 0.22rem;
        z-index: 1;
        width: 2.4rem;
        padding: 0.15rem 0;
        background-color: #fff;
        border: 1px solid #DEE5ED;
        box-shadow: 0 0 0.16rem rgba(0, 0, 0, 0.14);
        border-radius: 0.04rem; }
        .task-info-wrap .task-info-panel .operate-box .operate-list a {
          display: block;
          height: 0.56rem;
          line-height: 0.56rem;
          margin-top: 0.15rem;
          padding: 0 0.24rem;
          font-size: 0.22rem;
          color: #333; }
          .task-info-wrap .task-info-panel .operate-box .operate-list a:first-child {
            margin-top: 0; }
          .task-info-wrap .task-info-panel .operate-box .operate-list a:hover {
            color: #368FFF; }
          .task-info-wrap .task-info-panel .operate-box .operate-list a.active {
            color: #368FFF;
            background-color: #EFF3F7; }
    .task-info-wrap .task-info-panel .daka-arrow-right {
      display: inline-block;
      padding: 0.56rem;
      margin-right: -0.32rem;
      text-align: center; }
      .task-info-wrap .task-info-panel .daka-arrow-right .iconfont {
        display: inline-block;
        width: 0.4rem;
        height: 0.4rem;
        line-height: 0.4rem;
        border-radius: 100%;
        background: #DEE5ED;
        font-size: 0.26rem;
        color: #97A7BF; }
      .task-info-wrap .task-info-panel .daka-arrow-right:hover .iconfont {
        color: #368FFF; }
    .task-info-wrap .task-info-panel .correct-student {
      margin-right: 0.3rem;
      font-size: 0.22rem;
      color: #368FFF; }
    .task-info-wrap .task-info-panel:hover {
      background: #FAFCFE;
      box-shadow: 0 0 0.15rem rgba(0, 0, 0, 0.1); }
      .task-info-wrap .task-info-panel:hover .operate-box {
        display: block; }
  .task-info-wrap .task-center-date + .task-info-panel {
    margin-top: 0; }

.task-center-page {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 1rem;
  background-color: #fff; }
  .task-center-page a {
    display: inline-block;
    width: auto;
    height: 0.48rem;
    line-height: 0.46rem;
    padding: 0 0.18rem;
    margin: 0 0.08rem;
    background-color: #fff;
    border-radius: 0.04rem;
    border: 1px solid #D8DEDF;
    font-size: 0.2rem;
    color: #666; }
    .task-center-page a .iconfont {
      font-size: 0.2rem;
      color: #999; }
    .task-center-page a.ellip {
      line-height: normal; }
    .task-center-page a:hover {
      color: #368FFF; }
      .task-center-page a:hover .iconfont {
        color: #368FFF; }
    .task-center-page a.active {
      background: #368FFF;
      color: #fff;
      border: 1px solid #368FFF; }
  .task-center-page .skip {
    display: inline-block;
    margin-left: 0.5rem;
    font-size: 0.2rem;
    color: #666; }
    .task-center-page .skip span {
      display: inline-block;
      line-height: 0.48rem; }
    .task-center-page .skip input[type=text] {
      width: 0.64rem;
      height: 0.48rem;
      line-height: 0.46rem;
      margin: 0 0.1rem;
      background-color: #fff;
      border-radius: 0.04rem;
      border: 1px solid #D8DEDF;
      font-size: 0.2rem;
      color: #666;
      text-align: center;
      outline: none; }
      .task-center-page .skip input[type=text]:focus {
        border: 1px solid #368FFF; }

.list-common-tips {
  margin: 0.28rem 0;
  text-align: center;
  font-size: 0.24rem;
  color: #7F8893; }

.label {
  display: inline-block; }
  .label.red {
    background: linear-gradient(90deg, #fc5432, #fd6733);
    background: #9FA1F5; }
  .label.blue {
    background: linear-gradient(90deg, #368fff, #4cb5ff);
    background: #509EFF; }
  .label.green {
    background: linear-gradient(90deg, #13bc85, #02cc89);
    background: #22D4C8; }
  .label.yellow {
    background: linear-gradient(90deg, #ff9021, #ffa820);
    background: #F8A947; }
  .label.default {
    background: linear-gradient(90deg, #9bb2bf, #b8c9d0);
    background: #F8A947; }

.d-mask-transparent {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0); }

.task-read .left-subject-list dl dt .item .txt,
.task-read .left-subject-list dl dd .item .txt {
  max-width: 2rem; }
.task-read .left-subject-list dl dt .item .mark,
.task-read .left-subject-list dl dd .item .mark {
  position: absolute;
  right: 0.3rem;
  height: 0.32rem;
  line-height: 0.32rem;
  padding: 0 0.1rem;
  background: rgba(106, 136, 182, 0.2);
  border-radius: 0.16rem;
  font-size: 0.16rem;
  color: #6C7C93; }
  .task-read .left-subject-list dl dt .item .mark.multi-line,
  .task-read .left-subject-list dl dd .item .mark.multi-line {
    height: 0.52rem;
    line-height: normal;
    padding: 0.04rem 0.1rem;
    border-radius: 0.26rem; }
.task-read .left-subject-list dl dt .item .iconfont + .mark,
.task-read .left-subject-list dl dd .item .iconfont + .mark {
  right: 0.6rem; }
.task-read .left-subject-list dl dt dl dd .item .txt,
.task-read .left-subject-list dl dd dl dd .item .txt {
  max-width: 1.64rem; }
.task-read .left-subject-list dl dt dl dd dl dd .item .txt,
.task-read .left-subject-list dl dd dl dd dl dd .item .txt {
  max-width: 1.46rem; }
.task-read .left-subject-list dl dt dl dd dl dd dl dd .item .txt,
.task-read .left-subject-list dl dd dl dd dl dd dl dd .item .txt {
  max-width: 1.58rem; }
.task-read .left-subject-list dl dd .item .txt {
  max-width: 1.82rem; }
.task-read .prepare-left {
  position: relative;
  padding-bottom: 0.9rem; }
  .task-read .prepare-left:after {
    position: absolute;
    left: 0;
    bottom: 0rem;
    content: '';
    width: 100%;
    height: 0.9rem;
    background: #F6FAFF; }
  .task-read .prepare-left .left-subject {
    display: flex;
    flex-grow: 0;
    flex-shrink: 0;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: 0.64rem;
    padding: 0 0.24rem 0 0.32rem;
    border-bottom: 1px solid #dedede;
    background-color: #EBF3FE; }
    .task-read .prepare-left .left-subject .txt {
      width: 2.8rem;
      font-weight: bold; }
    .task-read .prepare-left .left-subject .iconfont {
      position: relative;
      font-size: 0.36rem;
      color: #8794A8;
      cursor: pointer; }
.task-read .form-wrap .form-item {
  display: flex;
  flex-shrink: 0;
  margin-bottom: 0.32rem; }
  .task-read .form-wrap .form-item.mt-negative {
    margin-top: -0.12rem; }
.task-read .form-wrap .form-item-label {
  display: flex;
  justify-content: flex-end;
  text-align: right;
  vertical-align: middle;
  font-size: 0.22rem;
  color: #6C7C93;
  line-height: 0.56rem;
  padding: 0 0.28rem 0 0;
  min-width: 1.38rem; }
.task-read .form-wrap .form-item-content {
  display: flex;
  flex-direction: column;
  position: relative;
  font-size: 0.22rem;
  color: #333; }
.task-read .form-wrap .form-input {
  position: relative;
  display: inline-block; }
.task-read .form-wrap .input-inner {
  display: inline-block;
  width: 3.2rem;
  height: 0.56rem;
  line-height: 0.56rem;
  padding: 0 0.2rem;
  background-color: #fff;
  border-radius: 0.04rem;
  border: 1px solid #DEE5ED;
  font-size: 0.22rem;
  color: #333;
  -webkit-appearance: none;
  outline: none; }
  .task-read .form-wrap .input-inner:focus {
    outline: none;
    border-color: #368FFF; }
  .task-read .form-wrap .input-inner:disabled {
    background-color: #F4F7F8;
    color: #ccc;
    cursor: not-allowed; }
.task-read .form-wrap .form-textarea {
  position: relative;
  display: inline-block;
  width: 100%;
  vertical-align: bottom; }
.task-read .form-wrap .textarea-inner {
  display: inline-block;
  width: 6.7rem;
  height: 1.2rem;
  line-height: 0.36rem;
  padding: 0.1rem 0.2rem;
  background-color: #fff;
  border-radius: 0.04rem;
  border: 1px solid #DEE5ED;
  font-size: 0.22rem;
  color: #333;
  -webkit-appearance: none;
  outline: none; }
  .task-read .form-wrap .textarea-inner:focus {
    outline: none;
    border-color: #368FFF; }
.task-read .form-wrap .textarea-content {
  display: inline-block;
  width: 6.7rem;
  line-height: 0.36rem;
  padding: 0.1rem 0.2rem 0.2rem;
  background-color: #fff;
  border-radius: 0.04rem;
  border: 1px solid #DEE5ED; }
  .task-read .form-wrap .textarea-content .text {
    font-size: 0.22rem;
    color: #333; }
  .task-read .form-wrap .textarea-content .task-img {
    display: flex;
    flex-wrap: wrap;
    margin-top: 0.2rem;
    font-size: 0; }
    .task-read .form-wrap .textarea-content .task-img img {
      width: 1.2rem;
      height: 1.2rem;
      margin: 0 0.16rem 0.1rem 0;
      border: 1px solid #dee5ed; }

.task-probar {
  display: inline-block;
  height: 0.56rem;
  padding: 0 0.16rem 0 0.14rem;
  margin: 0.3rem 0 0.02rem;
  background: #F3F7FB;
  overflow: hidden;
  border-radius: 0.28rem; }
  .task-probar .vm {
    display: inline-block;
    vertical-align: middle; }
  .task-probar .task-left-wrap .task-play {
    height: 0.56rem;
    line-height: 0.56rem;
    font-size: 0; }
    .task-probar .task-left-wrap .task-play .iconfont {
      margin-right: 0.12rem;
      font-size: 0.36rem;
      color: #368FFF;
      cursor: pointer; }
    .task-probar .task-left-wrap .task-play .task-text {
      font-size: 0.12rem;
      color: #666;
      vertical-align: middle; }
  .task-probar .task-pro-wrap {
    display: inline-block;
    width: 3.4rem;
    height: 0.56rem;
    line-height: 0.54rem;
    margin: 0 0.12rem; }
    .task-probar .task-pro-wrap .task-process-outer {
      position: relative;
      width: 100%;
      height: 0.06rem;
      background-color: rgba(0, 0, 0, 0.1);
      border-radius: 0.03rem; }
      .task-probar .task-pro-wrap .task-process-outer .task-process-inner {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        height: 100%;
        background-color: #368FFF;
        border-radius: 0.03rem; }
        .task-probar .task-pro-wrap .task-process-outer .task-process-inner i.task-circle-going {
          position: absolute;
          top: 0;
          left: 100%;
          margin-left: -0.12rem;
          margin-top: -0.08rem;
          width: 0.23rem;
          height: 0.23rem;
          font-style: normal;
          background: url("../images/task-center/task-circle-going.png") no-repeat center center;
          background-size: 100% 100%;
          cursor: pointer; }
    .task-probar .task-pro-wrap .el-slider {
      height: 0.56rem !important; }
      .task-probar .task-pro-wrap .el-slider .el-slider__runway {
        margin: 0.25rem 0 !important;
        height: 0.06rem !important;
        background-color: rgba(0, 0, 0, 0.1) !important;
        border-radius: 0.03rem !important; }
        .task-probar .task-pro-wrap .el-slider .el-slider__runway .el-slider__bar {
          height: 0.06rem !important;
          background-color: #368FFF !important;
          border-top-left-radius: 0.03rem !important;
          border-bottom-left-radius: 0.03rem !important; }
        .task-probar .task-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper {
          height: 0.23rem !important;
          width: 0.23rem !important;
          top: 50% !important;
          transform: translate(-50%, -50%);
          line-height: 0.21rem !important; }
          .task-probar .task-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper .el-slider__button {
            width: 0.16rem !important;
            height: 0.16rem !important;
            border: 0.03rem solid #fff !important;
            background-color: #368FFF !important;
            box-shadow: 0 0 0.1rem rgba(0, 0, 0, 0.2) !important;
            transition: 0s !important; }
            .task-probar .task-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper .el-slider__button.hover {
              transform: scale(1) !important;
              cursor: pointer !important; }
          .task-probar .task-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper.hover {
            cursor: pointer !important; }

::-webkit-input-placeholder {
  color: #ccc; }

:-moz-placeholder {
  color: #ccc; }

::-moz-placeholder {
  color: #ccc; }

:-ms-input-placeholder {
  color: #ccc; }

.btn-style.stroke-blue.disabled, .btn-style.full-blue.disabled {
  background-color: #c8e0ff;
  cursor: not-allowed;
  pointer-events: none; }

.task .btn-style.normal {
  min-width: 1.44rem; }

.zh-resource-none {
  text-align: center; }
  .zh-resource-none .img-none {
    width: 2.8rem;
    height: 2.46rem;
    background: none; }
    .zh-resource-none .img-none img {
      width: 100%;
      height: 100%; }
  .zh-resource-none .txt {
    margin-top: 0.08rem;
    font-size: 0.24rem;
    color: #7F8893;
    color: #999;
    text-align: center; }

.task .el-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 1rem !important;
  background-color: #fff; }
.task .el-pagination li,
.task .el-pagination .btn-next,
.task .el-pagination .btn-prev {
  width: auto !important;
  height: 0.48rem !important;
  line-height: 0.46rem !important;
  padding: 0 0.18rem !important;
  margin: 0 0.08rem !important;
  background-color: #fff !important;
  border-radius: 0.04rem !important;
  border: 1px solid #D8DEDF !important;
  font-size: 0.2rem !important;
  color: #666 !important;
  text-align: center !important;
  font-weight: normal !important; }
  .task .el-pagination li .iconfont,
  .task .el-pagination .btn-next .iconfont,
  .task .el-pagination .btn-prev .iconfont {
    font-size: 0.2rem !important;
    color: #666 !important; }
  .task .el-pagination li.ellip,
  .task .el-pagination .btn-next.ellip,
  .task .el-pagination .btn-prev.ellip {
    line-height: normal; }
  .task .el-pagination li:hover,
  .task .el-pagination .btn-next:hover,
  .task .el-pagination .btn-prev:hover {
    color: #368FFF !important; }
    .task .el-pagination li:hover .iconfont,
    .task .el-pagination .btn-next:hover .iconfont,
    .task .el-pagination .btn-prev:hover .iconfont {
      color: #368FFF; }
  .task .el-pagination li.active,
  .task .el-pagination .btn-next.active,
  .task .el-pagination .btn-prev.active {
    background: #368FFF !important;
    color: #fff !important;
    border: 1px solid #368FFF !important; }
.task .el-pagination .btn-next .el-icon,
.task .el-pagination .btn-prev .el-icon {
  font-size: 0.2rem !important;
  color: #666 !important; }
.task .el-pagination .btn-next:hover,
.task .el-pagination .btn-prev:hover {
  color: #368FFF !important; }
  .task .el-pagination .btn-next:hover .el-icon,
  .task .el-pagination .btn-prev:hover .el-icon {
    color: #368FFF !important; }
.task .el-pagination__editor.el-input {
  width: auto !important; }
.task .el-pagination__jump {
  height: auto !important;
  margin-left: 0.33rem !important;
  line-height: 0.48rem !important;
  font-size: 0.2rem !important;
  color: #666 !important; }
  .task .el-pagination__jump input {
    width: 0.64rem !important;
    height: 0.48rem !important;
    line-height: 0.46rem !important;
    margin: 0 0.1rem !important;
    background-color: #fff !important;
    border-radius: 0.04rem !important;
    border: 1px solid #D8DEDF !important;
    font-size: 0.2rem !important;
    color: #666 !important;
    text-align: center !important;
    outline: none !important; }
    .task .el-pagination__jump input:focus {
      border: 1px solid #368FFF !important; }

.default-graph {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 12;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0; }
  .default-graph.right {
    flex-direction: row; }
    .default-graph.right > h3 {
      margin-top: 0;
      margin-left: .2rem; }
  .default-graph > h3 {
    font-size: .16rem;
    color: #999;
    margin-top: .05rem; }
  .default-graph .default-graph-loading {
    position: relative;
    width: 1.2rem;
    height: 1.2rem; }
    .default-graph .default-graph-loading .default-circle,
    .default-graph .default-graph-loading .default-icon {
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      right: 0;
      margin: auto; }
    .default-graph .default-graph-loading .default-circle {
      width: 1.2rem;
      height: 1.2rem;
      background-image: url("../images/task-center/loading-circle.png");
      background-size: 1.2rem 1.2rem;
      background-position: center center;
      background-repeat: no-repeat; }
    .default-graph .default-graph-loading .default-icon {
      width: 0.7rem;
      height: 0.7rem;
      background-image: url("../images/task-center/loading-icon.png");
      background-size: 0.7rem 0.7rem;
      background-position: center center;
      background-repeat: no-repeat;
      z-index: 1; }
    .default-graph .default-graph-loading.little {
      width: 0.48rem;
      height: 0.48rem; }
      .default-graph .default-graph-loading.little .default-circle {
        width: 0.48rem;
        height: 0.48rem;
        background-image: url("../images/task-center/loading-circle.png");
        background-size: 0.48rem 0.48rem;
        background-position: center center;
        background-repeat: no-repeat; }
      .default-graph .default-graph-loading.little .default-icon {
        width: 0.27rem;
        height: 0.27rem;
        background-image: url("../images/task-center/loading-icon.png");
        background-size: 0.27rem 0.27rem;
        background-position: center center;
        background-repeat: no-repeat; }
    .default-graph .default-graph-loading.small {
      width: 0.72rem;
      height: 0.72rem; }
      .default-graph .default-graph-loading.small .default-circle {
        width: 0.72rem;
        height: 0.72rem;
        background-image: url("../images/task-center/loading-circle.png");
        background-size: 0.72rem 0.72rem;
        background-position: center center;
        background-repeat: no-repeat; }
      .default-graph .default-graph-loading.small .default-icon {
        width: 0.42rem;
        height: 0.42rem;
        background-image: url("../images/task-center/loading-icon.png");
        background-size: 0.42rem 0.42rem;
        background-position: center center;
        background-repeat: no-repeat; }
    .default-graph .default-graph-loading.xl {
      width: 2.4rem;
      height: 2.4rem; }
      .default-graph .default-graph-loading.xl .default-circle {
        width: 2.4rem;
        height: 2.4rem;
        background-image: url("../images/task-center/loading-circle-xl.png");
        background-size: 2.4rem 2.4rem;
        background-position: center center;
        background-repeat: no-repeat; }
      .default-graph .default-graph-loading.xl .default-icon {
        width: 1.54rem;
        height: 1.54rem;
        background-image: url("../images/task-center/loading-icon-xl.png");
        background-size: 1.54rem 1.54rem;
        background-position: center center;
        background-repeat: no-repeat; }
    .default-graph .default-graph-loading.module {
      width: 0.4rem;
      height: 0.4rem; }
      .default-graph .default-graph-loading.module .default-circle {
        width: 0.4rem;
        height: 0.4rem;
        background-image: url("../images/task-center/loading-circle.png");
        background-size: 0.4rem 0.4rem;
        background-position: center center;
        background-repeat: no-repeat; }
    .default-graph .default-graph-loading > i.loading {
      animation: loading 1.5s linear infinite; }

@keyframes loading {
  from {
    transform: rotateZ(0deg); }
  to {
    transform: rotateZ(360deg); } }
.task-center-header {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 0.96rem;
  padding: 0 0.32rem;
  background-color: #fff;
  font-size: 0.24rem;
  border-bottom: 1px solid #DEE5ED; }
  .task-center-header .task-breadcrumb-tab {
    height: 100%; }
    .task-center-header .task-breadcrumb-tab a {
      display: inline-block;
      min-width: 1.94rem;
      line-height: 0.94rem;
      padding: 0 0.32rem;
      margin-right: 0.3rem;
      /*font-weight: bold;*/
      color: #333;
      text-align: center; }
      .task-center-header .task-breadcrumb-tab a .num {
        font-weight: normal;
        color: #999; }
      .task-center-header .task-breadcrumb-tab a:hover {
        color: #368FFF; }
        .task-center-header .task-breadcrumb-tab a:hover .num {
          color: #368FFF; }
      .task-center-header .task-breadcrumb-tab a.active {
        color: #368FFF;
        border-bottom: 0.02rem solid #368FFF; }
        .task-center-header .task-breadcrumb-tab a.active .num {
          color: #368FFF; }
      .task-center-header .task-breadcrumb-tab a:first-child {
        padding-left: 0; }
  .task-center-header .task-center-choose {
    position: relative;
    display: inline-block;
    width: auto;
    height: auto;
    padding: 0; }

.calc-wrap .prepare-left.w640 {
  width: 6.4rem; }
.calc-wrap .prepare-left:after {
  height: 0.9rem; }
.calc-wrap .ques-num {
  color: #333; }
  .calc-wrap .ques-num input {
    width: 0.42rem;
    text-align: right;
    border: 0;
    background: transparent; }
.calc-wrap.task-read-content.practice .task-read-bottom {
  width: calc(100% + 6.4rem);
  left: -6.4rem;
  padding-left: 6.74rem; }
.calc-wrap .subtract {
  display: inline-block;
  width: 0.32rem;
  height: 0.32rem;
  background: url("../images/task-center/subtract.png") no-repeat center;
  background-size: 0.32rem 0.32rem;
  vertical-align: middle; }
.calc-wrap .add {
  display: inline-block;
  width: 0.32rem;
  height: 0.32rem;
  margin-left: 0.2rem;
  background: url("../images/task-center/add.png") no-repeat center;
  background-size: 0.32rem 0.32rem;
  vertical-align: middle; }
  .calc-wrap .add.dis {
    background: url("../images/task-center/add-dis.png") no-repeat center;
    background-size: 0.32rem 0.32rem;
    cursor: not-allowed; }
.calc-wrap .tag {
  display: inline-block;
  height: 0.32rem;
  line-height: 0.32rem;
  padding: 0 0.1rem;
  background: rgba(106, 136, 182, 0.2);
  border-radius: 0.16rem;
  font-size: 0.16rem;
  color: #6C7C93; }
.calc-wrap .task-tag {
  justify-content: space-between;
  align-items: center;
  font-size: 0.24rem;
  color: #333; }
  .calc-wrap .task-tag .num {
    color: #6C7C93;
    font-size: 0.22rem; }
.calc-wrap .calc-ques-list .exercise-box {
  justify-content: space-between;
  flex-direction: inherit;
  align-items: center; }
.calc-wrap .calc-ques-list .calc-ques {
  padding: 0.41rem 0; }
  .calc-wrap .calc-ques-list .calc-ques .answer {
    display: inline-block;
    position: relative;
    padding: 0 5px;
    color: #368FFF; }
    .calc-wrap .calc-ques-list .calc-ques .answer:after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 1px;
      background: #368FFF; }

.task-read .calc-wrap .left-subject-list dl dt .item .txt,
.task-read .calc-wrap .left-subject-list dl dd .item .txt {
  max-width: 3rem; }

.task .task-center-circle {
  padding-top: 0.64rem; }
  .task .task-center-circle .task-detail-main {
    margin-left: 0; }
  .task .task-center-circle .inside-size {
    width: 12rem;
    margin: 0 auto; }
  .task .task-center-circle .task-center-header {
    height: 0.64rem;
    line-height: 0.64rem;
    background: #fff;
    border-bottom: 1px solid #D8DEDF; }
    .task .task-center-circle .task-center-header .task-breadcrumb-tab {
      font-size: 0.24rem; }
      .task .task-center-circle .task-center-header .task-breadcrumb-tab a {
        min-width: 1.11rem;
        line-height: .64rem;
        padding: 0 .32rem;
        margin-right: .38rem; }
        .task .task-center-circle .task-center-header .task-breadcrumb-tab a.active {
          position: relative;
          color: #368FFF; }
          .task .task-center-circle .task-center-header .task-breadcrumb-tab a.active:after {
            position: absolute;
            content: '';
            bottom: 0;
            left: 0;
            width: 100%;
            height: 0.02rem;
            background: #368FFF; }
    .task .task-center-circle .task-center-header .inside-size {
      position: relative; }
    .task .task-center-circle .task-center-header .select-wrap {
      position: absolute;
      top: 0rem;
      right: 0; }
      .task .task-center-circle .task-center-header .select-wrap .select-active {
        width: 2rem;
        height: 0.56rem;
        padding: 0 0.35rem 0 0.16rem;
        font-size: 0.22rem; }
      .task .task-center-circle .task-center-header .select-wrap .select-btn {
        top: 0.04rem;
        right: 0.16rem; }
      .task .task-center-circle .task-center-header .select-wrap .select-list {
        top: 0.64rem; }
        .task .task-center-circle .task-center-header .select-wrap .select-list li {
          font-size: 0.22rem; }
  .task .task-center-circle .task-detail-main {
    background: #EFF3F7; }
    .task .task-center-circle .task-detail-main .tag-time {
      margin-bottom: 0.16rem;
      font-size: 0.2rem;
      color: #999; }
    .task .task-center-circle .task-detail-main .task-module {
      padding: 0 0.32rem 0.32rem; }
    .task .task-center-circle .task-detail-main .show-img ul li {
      width: 2.68rem;
      height: 2.68rem;
      margin: 0.2rem 0.2rem 0 0; }
      .task .task-center-circle .task-detail-main .show-img ul li:nth-child(4n) {
        margin-right: 0; }

.task-center-title.d-title h3 {
  justify-content: center;
  font-size: 0.32rem;
  font-weight: normal; }

.new-wrap {
  background: #EFF3F7; }
  .new-wrap .task {
    width: 12rem;
    margin: 0 auto; }

.task-read {
  width: 100%;
  height: 100%; }
  .task-read .d-title > h3 {
    font-weight: normal;
    font-size: 0.32rem;
    justify-content: center; }

.task-read-content {
  display: flex;
  height: 100%; }
  .task-read-content .prepare-left .left-subject {
    height: 0.72rem; }

.task-read-right {
  position: relative;
  flex-grow: 1;
  height: 100%;
  padding-top: 0.72rem;
  background-color: #EFF3F7; }
  .task-read-right.has-bottom {
    padding-bottom: 0.9rem; }
  .task-read-right .task-center-breadcrumb {
    height: 0.72rem;
    line-height: 0.72rem;
    font-size: 0.24rem;
    background-color: #F4F7F9; }
    .task-read-right .task-center-breadcrumb .iconfont {
      color: #8794A8;
      margin: 0.04rem 0.08rem 0 -0.07rem; }

.task-info-wrap .task-info-panel .task-info-read-cont {
  display: flex;
  padding: 0.5rem 0; }
  .task-info-wrap .task-info-panel .task-info-read-cont .type-icon {
    width: 1rem;
    height: 1rem; }
  .task-info-wrap .task-info-panel .task-info-read-cont .info-box {
    margin-left: 0.18rem; }
    .task-info-wrap .task-info-panel .task-info-read-cont .info-box h3 {
      margin-top: 0.08rem;
      font-size: 0.28rem;
      color: #333; }
    .task-info-wrap .task-info-panel .task-info-read-cont .info-box p {
      margin-top: 0.14rem;
      font-size: 0.2rem;
      color: #999; }
.task-info-wrap .task-info-panel.add {
  height: 1.2rem;
  justify-content: center;
  border: 2px dashed #dee5de;
  font-size: 0.24rem;
  color: #368FFF;
  cursor: pointer; }
  .task-info-wrap .task-info-panel.add .iconfont {
    margin: 0.05rem 0.1rem 0 0;
    font-size: 0.32rem; }
.task-info-wrap .task-info-panel.add-btn {
  height: 1.2rem;
  justify-content: center;
  border: 2px dashed #dee5de;
  font-size: 0.24rem;
  color: #368FFF;
  cursor: pointer; }
  .task-info-wrap .task-info-panel.add-btn .iconfont {
    margin: 0.05rem 0.1rem 0 0;
    font-size: 0.32rem; }

.task-read-bottom {
  position: absolute;
  left: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 0.9rem;
  padding: 0 0.32rem;
  background-color: #F4F7F9;
  border-top: 1px solid #DEE5ED; }
  .task-read-bottom .text {
    font-size: 0.24rem;
    color: #6C7C93; }
    .task-read-bottom .text .num {
      margin: 0.05rem;
      color: #368FFF; }
  .task-read-bottom .btn-style {
    width: 2.2rem;
    height: 0.56rem;
    line-height: 0.54rem !important;
    border-radius: 0.28rem !important;
    font-size: 0.24rem; }

.prepare-left .left-subject .iconfont {
  position: relative; }

.switch-textbooks-box {
  position: absolute;
  top: -0.17rem;
  right: -7.44rem;
  z-index: 1;
  display: flex;
  width: 7.2rem;
  max-height: 4.9rem;
  background-color: #fff;
  border: 1px solid #DEE5ED;
  box-shadow: 0 0 0.16rem rgba(0, 0, 0, 0.14);
  border-radius: 0.04rem;
  cursor: default; }
  .switch-textbooks-box .share-summary {
    width: 58%;
    height: inherit;
    padding-bottom: 4px;
    box-shadow: 0 0 0.16rem rgba(0, 0, 0, 0.14); }
    .switch-textbooks-box .share-summary ul li {
      min-height: 0.7rem;
      font-size: 0.22rem;
      cursor: pointer; }
      .switch-textbooks-box .share-summary ul li:last-child {
        border-bottom: 1px solid #d8dedf; }
      .switch-textbooks-box .share-summary ul li i {
        top: 0.02rem;
        margin-left: 0.24rem;
        margin-right: 0.14rem; }
      .switch-textbooks-box .share-summary ul li:hover, .switch-textbooks-box .share-summary ul li:active {
        color: #333; }
      .switch-textbooks-box .share-summary ul li.active {
        color: #368FFF; }
        .switch-textbooks-box .share-summary ul li.active i {
          color: #368FFF !important; }
  .switch-textbooks-box .share-volume {
    width: 42%;
    height: inherit;
    padding-bottom: 4px; }
    .switch-textbooks-box .share-volume .version {
      display: flex;
      align-items: center;
      min-height: 0.54rem;
      padding: 0.1rem 0.06rem;
      margin-left: 0.28rem;
      font-size: 0.18rem;
      color: #7F8893; }
    .switch-textbooks-box .share-volume ul li {
      font-size: 0.2rem;
      justify-content: flex-start;
      cursor: pointer; }
      .switch-textbooks-box .share-volume ul li span {
        margin-left: 0.28rem; }
      .switch-textbooks-box .share-volume ul li:hover, .switch-textbooks-box .share-volume ul li:active {
        color: #333; }
      .switch-textbooks-box .share-volume ul li.active {
        color: #368FFF; }
  .switch-textbooks-box.switch-new {
    right: auto;
    left: 0.6rem;
    z-index: 1;
    display: flex;
    width: auto;
    min-width: 2.4rem;
    max-width: 4rem;
    max-height: 6.9rem;
    padding: 0.09rem 0;
    overflow-y: auto; }
    .switch-textbooks-box.switch-new .share-volume {
      width: 100%;
      padding-bottom: 0;
      border: 0; }
      .switch-textbooks-box.switch-new .share-volume > ul > li {
        height: 0.56rem;
        min-height: 0;
        padding: 0; }
        .switch-textbooks-box.switch-new .share-volume > ul > li span {
          display: block;
          line-height: 0.56rem;
          min-width: 2.4rem;
          max-width: 4rem;
          padding: 0 0.34rem;
          margin: 0;
          text-overflow: ellipsis;
          overflow: hidden;
          white-space: nowrap; }

.task-info-wrap.free-read {
  display: flex;
  flex-shrink: 0;
  flex-direction: column;
  padding: 0.32rem 0.6rem 0;
  background: #fff; }
  .task-info-wrap.free-read .explain {
    margin-bottom: 0.3rem;
    line-height: 0.32rem;
    font-size: 0.22rem;
    color: #6C7C93; }
  .task-info-wrap.free-read .form-item:last-child {
    margin-top: 0; }
  .task-info-wrap.free-read .form-item-content {
    width: 100%; }
    .task-info-wrap.free-read .form-item-content .form-input {
      width: 100%; }
      .task-info-wrap.free-read .form-item-content .form-input .input-inner {
        width: 100%;
        height: 0.88rem;
        line-height: 0.88rem;
        font-size: 0.26rem; }
    .task-info-wrap.free-read .form-item-content .form-textarea {
      width: 100%; }
      .task-info-wrap.free-read .form-item-content .form-textarea .textarea-inner {
        width: 100%;
        height: 3.4rem;
        font-size: 0.26rem; }
      .task-info-wrap.free-read .form-item-content .form-textarea .num {
        position: absolute;
        bottom: 0.2rem;
        right: 0.2rem;
        font-size: 0.2rem;
        color: #999; }
        .task-info-wrap.free-read .form-item-content .form-textarea .num em {
          color: #333; }
.task-info-wrap.exercise-list {
  padding: 0.2rem 0.32rem 0; }
  .task-info-wrap.exercise-list .btn-style.stroke-gray {
    border-width: 0.01rem;
    border-style: solid;
    border-color: #DEE5ED;
    color: #333; }
  .task-info-wrap.exercise-list .center-operate {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
    flex-grow: 0;
    height: auto;
    padding: 0 0 0.22rem;
    background-color: transparent;
    font-size: 0;
    border-top: 0; }
    .task-info-wrap.exercise-list .center-operate .text {
      font-size: 0.22rem;
      color: #6C7C93; }
  .task-info-wrap.exercise-list ul {
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    padding-right: 0.32rem;
    margin-right: -0.32rem;
    overflow-y: auto; }
    .task-info-wrap.exercise-list ul li {
      position: relative;
      display: flex;
      width: 100%;
      margin: 0 0 0.32rem; }
      .task-info-wrap.exercise-list ul li input {
        position: absolute;
        top: 0.1rem;
        right: 0.1rem;
        width: 0.27rem;
        height: 0.27rem;
        opacity: 0;
        cursor: pointer;
        z-index: 2; }
      .task-info-wrap.exercise-list ul li input:checked ~ .exercise-box {
        background-color: #F6FAFF;
        border: 2px solid #368FFF; }
      .task-info-wrap.exercise-list ul li label.exercise-box.active {
        background-color: #F6FAFF;
        border: 2px solid #368FFF; }

.exercise-box {
  position: relative;
  display: flex;
  flex-shrink: 0;
  flex-direction: column;
  width: 100%;
  padding: 0 0.5rem;
  background-color: #fff;
  border: 2px solid #dee5de;
  box-shadow: 0.01rem 0.02rem 0.1rem rgba(42, 49, 57, 0.05);
  border-radius: 0.08rem;
  font-size: 0.26rem;
  color: #333; }
  .exercise-box .type {
    padding-top: 0.3rem;
    font-size: 0.24rem;
    font-weight: bold;
    color: #333; }
  .exercise-box strong.fraction {
    position: absolute;
    top: -.01rem;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 0.56rem;
    line-height: 0.56rem; }
    .exercise-box strong.fraction .num {
      position: relative;
      display: inline-block;
      top: -0.02rem;
      text-align: center; }
      .exercise-box strong.fraction .num .top,
      .exercise-box strong.fraction .num .bottom {
        position: relative;
        display: block;
        line-height: 0.28rem; }
      .exercise-box strong.fraction .num .bottom:before {
        position: absolute;
        content: '';
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 100%;
        min-width: 18px;
        padding: 0 2px;
        height: 2px;
        background: #368FFF; }
  .exercise-box .exercise {
    padding: 0.2rem 0 0.1rem;
    line-height: 0.46rem; }
    .exercise-box .exercise .title .answer {
      display: inline-block;
      color: #368FFF; }
    .exercise-box .exercise .answer {
      display: flex;
      flex-direction: column; }
      .exercise-box .exercise .answer .active {
        color: #368FFF; }
      .exercise-box .exercise .answer.quarter {
        flex-flow: row wrap;
        align-content: flex-start; }
        .exercise-box .exercise .answer.quarter p {
          flex: 0 0 25%; }
      .exercise-box .exercise .answer.half {
        flex-flow: row wrap;
        align-content: flex-start; }
        .exercise-box .exercise .answer.half p {
          flex: 0 0 50%; }
      .exercise-box .exercise .answer.judge-question {
        flex-direction: row;
        align-items: center;
        margin-top: 0.1rem; }
        .exercise-box .exercise .answer.judge-question p {
          display: flex;
          align-items: center; }
          .exercise-box .exercise .answer.judge-question p + p {
            margin-left: 0.4rem; }
        .exercise-box .exercise .answer.judge-question .icon-ZK-PC-duihao {
          font-size: 0.54rem; }
        .exercise-box .exercise .answer.judge-question .icon-close {
          font-size: 0.3rem;
          font-weight: bold; }
      .exercise-box .exercise .answer .option-list {
        margin-top: 0.2rem; }
        .exercise-box .exercise .answer .option-list li {
          display: flex;
          margin-bottom: 0.24rem;
          height: 2rem; }
          .exercise-box .exercise .answer .option-list li:last-child {
            margin-bottom: 0; }
          .exercise-box .exercise .answer .option-list li .answer-num {
            display: inline-block;
            margin-right: 0.16rem;
            line-height: 2rem; }
          .exercise-box .exercise .answer .option-list li .answer-detail {
            flex-grow: 1;
            height: 100%;
            padding: 0.16rem;
            border: 1px solid #D8DEDF; }
            .exercise-box .exercise .answer .option-list li .answer-detail .answer-img {
              display: inline-block;
              vertical-align: middle;
              width: 2.7rem;
              height: 1.68rem;
              border: 0.01rem solid #DEDEDE; }
              .exercise-box .exercise .answer .option-list li .answer-detail .answer-img img {
                width: 100%;
                height: 100%;
                object-fit: cover; }
            .exercise-box .exercise .answer .option-list li .answer-detail .answer-text {
              display: inline-block;
              vertical-align: middle;
              margin-left: 0.2rem;
              line-height: 0.36rem;
              font-size: 0.26rem; }
          .exercise-box .exercise .answer .option-list li.active .answer-detail {
            border-color: #368FFF; }
    .exercise-box .exercise .completion-img {
      width: 4rem;
      height: 2.2rem;
      margin: 0.1rem 0 0.05rem; }
      .exercise-box .exercise .completion-img img {
        width: 100%;
        height: 100%; }
    .exercise-box .exercise .completion-cont li {
      display: flex;
      align-items: center;
      margin: 0.25rem 0 0; }
      .exercise-box .exercise .completion-cont li i {
        position: relative;
        display: inline-block;
        width: 1.2rem;
        height: 0.56rem;
        line-height: 0.56rem;
        padding: 0 0.1rem;
        background: #fff;
        border: 1px solid #DEE5ED;
        border-radius: 0.04rem;
        text-align: center;
        font-size: 0.26rem;
        color: #368FFF; }
      .exercise-box .exercise .completion-cont li span {
        margin: 0 0.22rem; }
  .exercise-box .exercise-info {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 0.84rem;
    border-top: 0.01rem dashed #DEE5ED; }
    .exercise-box .exercise-info .left-info {
      display: flex;
      align-items: center;
      color: #6C7C93; }
      .exercise-box .exercise-info .left-info > div {
        position: relative;
        display: flex;
        padding-left: 0.2rem; }
        .exercise-box .exercise-info .left-info > div:before {
          position: absolute;
          left: 0;
          top: 0.09rem;
          content: '';
          width: 0.01rem;
          height: 0.2rem;
          background: #DEE5ED; }
        .exercise-box .exercise-info .left-info > div:first-child {
          align-items: center;
          padding-left: 0; }
          .exercise-box .exercise-info .left-info > div:first-child:before {
            position: absolute;
            left: 0;
            top: 0.09rem;
            content: '';
            width: 0.01rem;
            height: 0.2rem;
            background: transparent; }
      .exercise-box .exercise-info .left-info .difficulty {
        padding-right: 0.12rem;
        font-weight: normal; }
      .exercise-box .exercise-info .left-info .star-box {
        display: inline-block;
        height: 0.24rem;
        margin-right: 0.2rem;
        font-size: 0;
        position: relative;
        top: 0.02rem; }
        .exercise-box .exercise-info .left-info .star-box .star {
          display: inline-block;
          width: 0.24rem;
          height: 0.24rem;
          margin-left: 0.03rem;
          background: url("../images/task-center/star.png") no-repeat center center;
          background-size: 100% 100%; }
          .exercise-box .exercise-info .left-info .star-box .star.full {
            background: url("../images/task-center/star-full.png") no-repeat center center;
            background-size: 100% 100%; }
  .exercise-box .exercise-analysis {
    padding: 0.3rem 0.3rem 0.28rem;
    margin-bottom: 0.3rem;
    background: #EDF4FB;
    border-radius: 0.1rem; }
    .exercise-box .exercise-analysis h3 {
      color: #6C7C93;
      font-size: 0.24rem; }
    .exercise-box .exercise-analysis .exercise-analysis-main {
      margin-top: 0.24rem;
      font-size: 0.26rem;
      color: #333; }

.task-exercise-choose {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  height: 0.76rem;
  padding: 0 0.32rem; }
  .task-exercise-choose .select-wrap + .select-wrap {
    margin-left: 0.16rem; }
  .task-exercise-choose .select-wrap .select-active {
    width: auto;
    height: 0.56rem;
    padding: 0 0.5rem 0 0.2rem;
    font-size: 0.22rem; }
  .task-exercise-choose .select-wrap .select-btn {
    top: 0.12rem;
    right: 0.16rem; }
  .task-exercise-choose .select-wrap .select-list {
    top: 0.59rem;
    max-height: 4.82rem; }
    .task-exercise-choose .select-wrap .select-list li {
      font-size: 0.22rem; }

.task-read-content.practice .task-read-right {
  padding-top: 0.96rem; }
.task-read-content.practice .task-info-wrap.exercise-list {
  padding-top: 0; }
.task-read-content.practice .prepare-left {
  height: calc(100% - 0.9rem);
  padding-bottom: 0; }
  .task-read-content.practice .prepare-left:after {
    height: 0; }
.task-read-content.practice .task-read-bottom {
  justify-content: space-between;
  width: calc(100% + 3.84rem);
  left: -3.84rem;
  padding-left: 4.12rem; }
.task-read-content.practice .task-exercise-choose .select-wrap .select-active {
  width: 2.2rem; }

.blank {
  position: relative; }

.scantron-wrap .prepare-left {
  width: 6.4rem; }
  .scantron-wrap .prepare-left .left-subject {
    height: 0.9rem;
    background: #fff; }
    .scantron-wrap .prepare-left .left-subject span {
      font-size: 0.28rem; }
    .scantron-wrap .prepare-left .left-subject .sure {
      font-size: 0.24rem;
      color: #368FFF; }
    .scantron-wrap .prepare-left .left-subject .tag {
      display: inline-block;
      position: relative;
      margin-left: 0.1rem; }
      .scantron-wrap .prepare-left .left-subject .tag .tag-icon {
        display: inline-block;
        width: 0.32rem;
        height: 0.32rem;
        line-height: 0.3rem;
        background: #D8DDE4;
        border-radius: 100%;
        color: #fff;
        font-size: 0.24rem;
        text-align: center;
        cursor: pointer; }
      .scantron-wrap .prepare-left .left-subject .tag .el-button {
        border: 0;
        padding: 0;
        border-radius: 50%; }
      .scantron-wrap .prepare-left .left-subject .tag:hover .tag-icon {
        background: #5AA3FF; }
      .scantron-wrap .prepare-left .left-subject .tag:hover .tag-text {
        display: block;
        animation: opacity 0.8s;
        animation-fill-mode: forwards; }
@keyframes opacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
  .scantron-wrap .prepare-left .left-subject-list {
    height: 100%;
    padding: 0.2rem 0.32rem;
    background: #fff; }
    .scantron-wrap .prepare-left .left-subject-list .text-input {
      font-size: 0.24rem;
      color: #333;
      outline: none; }
      .scantron-wrap .prepare-left .left-subject-list .text-input .tag {
        color: #999; }
    .scantron-wrap .prepare-left .left-subject-list .task-ques {
      font-size: 0.24rem;
      line-height: 0.34rem; }
    .scantron-wrap .prepare-left .left-subject-list .task-ques-pic {
      margin-bottom: 0.24rem;
      border: 1px solid #DEDEDE; }
      .scantron-wrap .prepare-left .left-subject-list .task-ques-pic img {
        width: 100%;
        height: 100%;
        object-fit: cover; }
.scantron-wrap.task-read-content.practice .task-read-bottom {
  width: calc(100% + 6.4rem);
  left: -6.4rem;
  padding-left: 0.32rem; }
  .scantron-wrap.task-read-content.practice .task-read-bottom .text {
    margin-left: 3.92rem; }
.scantron-wrap.task-read-content.practice .task-read-right {
  padding-top: 1.79rem;
  background: #fff; }
.scantron-wrap.task-read-content.practice .scantron-task-header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1.79rem;
  padding: 0.3rem 0.32rem;
  background: #fff; }
  .scantron-wrap.task-read-content.practice .scantron-task-header .scantron-task-title {
    position: relative;
    margin-bottom: 0.3rem;
    padding-left: 0.08rem;
    font-size: 0.28rem;
    color: #333;
    font-weight: bold; }
    .scantron-wrap.task-read-content.practice .scantron-task-header .scantron-task-title:after {
      position: absolute;
      content: '';
      top: 50%;
      left: -0.12rem;
      width: 0.06rem;
      height: 0.26rem;
      border-radius: 0.03rem;
      background: #368FFF;
      transform: translate(0, -40%); }
    .scantron-wrap.task-read-content.practice .scantron-task-header .scantron-task-title .tag {
      display: inline-block;
      position: relative;
      margin-left: .1rem; }
      .scantron-wrap.task-read-content.practice .scantron-task-header .scantron-task-title .tag .el-button {
        border: 0;
        padding: 0;
        border-radius: 50%; }
      .scantron-wrap.task-read-content.practice .scantron-task-header .scantron-task-title .tag .tag-icon {
        display: inline-block;
        width: 0.32rem;
        height: 0.32rem;
        line-height: 0.3rem;
        background: #D8DDE4;
        border-radius: 100%;
        color: #fff;
        font-size: 0.24rem;
        text-align: center;
        cursor: pointer; }
      .scantron-wrap.task-read-content.practice .scantron-task-header .scantron-task-title .tag:hover .tag-icon {
        background: #5AA3FF; }
  .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add {
    position: relative; }
    .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .btn-style {
      width: 2rem;
      height: 0.56rem;
      margin-right: 0.32rem;
      line-height: 0.56rem;
      border-radius: 0.28rem; }
      .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .btn-style.active {
        background: #2D76D1;
        color: #fff; }
    .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop {
      position: absolute;
      top: 0.8rem;
      left: -0.32rem;
      z-index: 10;
      width: calc(100% + 0.64rem);
      padding: 0.32rem 0.6rem;
      background: #fff;
      border: 1px solid #D8DEDF;
      border-left: 0;
      border-right: 0;
      box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1);
      color: #333; }
      .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item {
        display: flex;
        justify-content: flex-start;
        margin-bottom: 0.24rem;
        font-size: 0.24rem; }
        .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item > label {
          margin-right: 0.12rem;
          line-height: 0.64rem;
          flex-shrink: 0; }
        .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form {
          display: flex;
          flex-grow: 1;
          align-items: center; }
          .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .title {
            width: 100%; }
          .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .num {
            width: 1.6rem;
            text-align: center; }
          .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form input {
            height: 0.64rem;
            padding: 0 0.2rem;
            line-height: 0.64rem;
            border: 1px solid #D8DEDF;
            border-radius: 0.04rem; }
          .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form > span {
            margin: 0 0.3rem;
            line-height: 0.64rem; }
          .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .num-select {
            display: flex;
            height: 0.64rem;
            line-height: 0.64rem;
            border: 1px solid #D8DEDF;
            border-radius: 0.04rem; }
            .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .num-select .subtract,
            .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .num-select .add {
              width: 0.64rem;
              text-align: center; }
              .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .num-select .subtract .iconfont,
              .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .num-select .add .iconfont {
                font-size: 0.3rem;
                color: #368FFF; }
            .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .num-select .ques-num {
              width: 1rem;
              height: 0.62rem;
              line-height: 0.62rem;
              border: 0;
              border-left: 1px solid #D8DEDF;
              border-right: 1px solid #D8DEDF;
              text-align: center;
              border-radius: 0; }
          .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select {
            position: relative;
            width: 100%; }
            .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .select-box {
              width: 100%;
              min-height: 0.64rem;
              max-height: 2.24rem;
              padding: 0 0.2rem;
              line-height: 0.64rem;
              border: 1px solid #D8DEDF;
              border-radius: 0.04rem;
              overflow-y: auto; }
              .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .select-box .placeholder {
                color: #999; }
              .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .select-box .select-tag {
                position: relative;
                display: inline-block;
                height: 0.48rem;
                line-height: 0.48rem;
                padding: 0 0.48rem 0 0.16rem;
                margin-right: 0.08rem;
                background: #EFF3F7;
                border-radius: 0.04rem; }
                .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .select-box .select-tag .del {
                  position: absolute;
                  right: 0;
                  top: 0;
                  width: 0.48rem;
                  height: 0.48rem;
                  background: url("../images/task-detail/del-icon.png") no-repeat center;
                  background-size: 0.48rem 0.48rem; }
            .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap {
              width: 100%;
              max-height: 2.04rem;
              padding: 0.2rem;
              margin-top: 0.16rem;
              background: #F3F7FB;
              overflow-y: auto; }
              .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap::-webkit-scrollbar {
                width: 0.02rem; }
              .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap ul {
                font-size: 0; }
              .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap li {
                display: inline-block;
                width: 1.5rem;
                height: 0.56rem;
                line-height: 0.56rem;
                margin: 0 0.16rem 0.16rem 0;
                background: #fff;
                border: 1px solid #D8DEDF;
                border-radius: 0.04rem;
                color: #333;
                font-size: 0.24rem;
                text-align: center;
                cursor: pointer; }
                .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap li:nth-child(6n) {
                  margin-right: 0; }
                .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap li:hover, .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap li.active {
                  background: #368FFF;
                  color: #fff; }
                  .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap li:hover span, .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap li.active span {
                    color: #fff; }
                .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap li.disable {
                  background: #D8DEDF; }
                  .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap li.disable span {
                    position: relative;
                    color: #999; }
                    .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap li.disable span:after {
                      content: '';
                      position: absolute;
                      top: 50%;
                      left: -0.28rem;
                      width: calc(100% + 0.56rem);
                      height: 2px;
                      background: #999; }
                  .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap li.disable:hover {
                    background: #D8DEDF; }
                    .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap li.disable:hover span {
                      color: #999; }
                .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .item-form .multiple-select .ques-num-list-wrap li span {
                  color: #333; }
        .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .btn-box {
          padding-left: 1.32rem; }
          .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop .ques-add-item .btn-box .normal {
            min-width: 1.4rem;
            width: 1.4rem;
            height: 0.52rem;
            line-height: 0.52rem; }
      .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop:after {
        content: '';
        position: absolute;
        top: -0.1rem;
        left: 1.19rem;
        width: 0.26rem;
        height: 0.11rem;
        background: url("../images/task-detail/arrow-top.png") no-repeat center;
        background-size: 0.26rem 0.11rem; }
      .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop.judge:after {
        left: 3.51rem; }
      .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop.fill:after {
        left: 6.02rem; }
      .scantron-wrap.task-read-content.practice .scantron-task-header .ques-add .ques-add-pop.short-answer:after {
        left: 8.3rem; }
.scantron-wrap.task-read-content.practice .scantron-task-main {
  height: 100%;
  padding: 0 0.32rem;
  overflow-y: auto;
  overflow-x: visible; }
  .scantron-wrap.task-read-content.practice .scantron-task-main .module {
    padding: 0.32rem;
    margin-bottom: 0.24rem;
    background: #fff;
    border: 1px solid #D8DEDF;
    border-radius: 0.04rem;
    color: #333; }
    .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-header {
      display: flex;
      justify-content: space-between;
      margin-bottom: 0.4rem; }
      .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-header .title {
        font-size: 0.24rem; }
      .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-header .subtitle {
        font-size: 0.2rem;
        color: #999; }
      .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-header .tag {
        display: inline-block;
        position: relative;
        margin-left: 0.1rem;
        /*.tag-text{
          display: none;
          position: absolute;
          opacity: 0;
          top: px2rem(46px);
          left: px2rem(-242px);
          width: px2rem(500px);
          height: px2rem(270px);
          padding: px2rem(30px) px2rem(32px);
          background: rgba(0,0,0,0.7);
          border-radius: px2rem(4px);
          box-sizing: border-box;
          font-size: px2rem(22px);
          line-height: px2rem(42px);
          color: #fff;
          &:after{
            content: '';
            position: absolute;
            top: px2rem(-10px);
            left: px2rem(245px);
            width: 0;
            height: 0;
            border-bottom: px2rem(10px) solid rgba(0,0,0,0.7);
            border-left: px2rem(13px) solid transparent;
            border-right: px2rem(13px) solid transparent;
          }
        }*/ }
        .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-header .tag .tag-icon {
          display: inline-block;
          width: 0.32rem;
          height: 0.32rem;
          line-height: 0.3rem;
          background: #D8DDE4;
          border-radius: 100%;
          color: #fff;
          font-size: 0.24rem;
          text-align: center;
          cursor: pointer; }
        .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-header .tag .el-button {
          border: 0;
          padding: 0;
          border-radius: 50%; }
        .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-header .tag:hover .tag-icon {
          background: #5AA3FF; }
        .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-header .tag:hover .tag-text {
          display: block;
          animation: opacity 0.8s;
          animation-fill-mode: forwards; }
@keyframes opacity {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
      .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-header .operate-btn {
        margin-left: 0.24rem;
        font-size: 0.2rem;
        color: #97A7BF; }
        .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-header .operate-btn:hover {
          color: #368FFF; }
    .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item {
      display: flex;
      margin-bottom: 0.36rem;
      font-size: 0.24rem; }
      .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item:last-child {
        margin-bottom: 0; }
      .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item label {
        margin-right: 0.2rem;
        line-height: 0.64rem; }
      .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item > i {
        width: 0.64rem;
        height: 0.64rem;
        line-height: 0.64rem;
        margin-right: 0.24rem;
        border: 1px solid #D8DEDF;
        border-radius: 100%;
        text-align: center; }
        .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item > i.active {
          background: #368FFF;
          border-color: #368FFF;
          color: #fff; }
        .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item > i.icon-ZK-PC-duihao {
          font-size: 0.45rem; }
      .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item.dis {
        color: #999;
        line-height: 0.64rem; }
      .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input {
        flex-grow: 1; }
        .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .operate-add {
          font-size: 0.24rem;
          color: #368FFF; }
          .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .operate-add .iconfont {
            display: inline-block;
            vertical-align: middle;
            margin: -0.05rem 0.08rem 0 0; }
        .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit {
          display: flex;
          justify-content: space-between;
          margin-bottom: 16px; }
          .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item {
            display: flex;
            flex-grow: 1;
            border: 1px solid #D8DEDF;
            border-radius: 0.04rem; }
            .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-title {
              display: flex;
              justify-content: center;
              align-items: center;
              flex-shrink: 0;
              width: 0.77rem;
              background: #EFF3F7;
              border-right: 1px solid #D8DEDF;
              color: #666; }
            .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main {
              flex-grow: 1;
              padding: 0 0.2rem; }
              .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main .answer-item {
                display: flex;
                padding: 0.14rem 0;
                border-bottom: 1px solid #D8DEDF; }
                .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main .answer-item:last-child {
                  border-bottom: 0; }
                .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main .answer-item .answer-title {
                  flex-shrink: 0;
                  position: relative;
                  width: 0.82rem;
                  margin-right: 0.2rem;
                  color: #666; }
                  .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main .answer-item .answer-title:after {
                    content: '';
                    position: absolute;
                    top: 0;
                    right: 0;
                    width: 1px;
                    height: 0.32rem;
                    background: #D8DEDF; }
                .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main .answer-item .answer-operate {
                  flex-shrink: 0;
                  width: 0.68rem;
                  margin-left: 0.16rem;
                  font-size: 0.22rem;
                  color: #97A7BF; }
                  .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main .answer-item .answer-operate .icon-ZK-PC-add {
                    font-size: 0.22rem;
                    color: #97A7BF; }
                  .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main .answer-item .answer-operate:hover {
                    color: #368FFF; }
                .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main .answer-item .del {
                  margin-left: 0.38rem; }
                .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main .answer-item textarea {
                  flex-grow: 1;
                  height: 0.34rem;
                  overflow-y: auto;
                  padding: 0;
                  line-height: 0.34rem;
                  border: 0;
                  font-size: 0.24rem;
                  color: #333;
                  outline: none;
                  word-break: break-all; }
                  .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main .answer-item textarea::placeholder {
                    color: #999; }
                  .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main .answer-item textarea:focus .placeholder {
                    display: none; }
                  .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .answer-edit-item .space-main .answer-item textarea.rows {
                    height: auto;
                    max-height: 1.36rem;
                    overflow-y: auto; }
          .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .del {
            flex-shrink: 0;
            width: 0.44rem;
            height: 0.44rem;
            margin-left: 0.16rem;
            background: #DEE5ED;
            border-radius: 100%;
            text-align: center;
            line-height: 0.42rem; }
            .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .del .iconfont {
              font-size: 0.22rem;
              color: #97A7BF; }
            .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .del:hover {
              background: #368FFF;
              color: #fff; }
              .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .del:hover .iconfont {
                color: #fff; }
          .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main .choose-item .answer-input .answer-edit .del-wrap {
            display: flex;
            align-items: center; }
    .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main.short-answer .choose-item {
      line-height: normal; }
      .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main.short-answer .choose-item label {
        line-height: normal; }
      .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main.short-answer .choose-item .pic-input-wrap {
        margin-top: 0; }
        .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main.short-answer .choose-item .pic-input-wrap li {
          width: 1.4rem;
          height: 1.4rem; }
          .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main.short-answer .choose-item .pic-input-wrap li .add-pic .add-icon {
            width: 0.4rem;
            height: 0.4rem;
            margin-top: 0.3rem; }
          .scantron-wrap.task-read-content.practice .scantron-task-main .module .module-main.short-answer .choose-item .pic-input-wrap li .add-pic p {
            margin-top: 0.1rem; }

.el-tooltip__popper.is-dark {
  padding: 0;
  background: rgba(0, 0, 0, 0.7); }
  .el-tooltip__popper.is-dark .tag-text {
    width: 5rem;
    padding: 0.3rem 0.32rem;
    box-sizing: border-box;
    font-size: 0.22rem;
    line-height: 0.42rem;
    color: #fff; }
    .el-tooltip__popper.is-dark .tag-text.task-tag-text {
      width: 6.4rem;
      padding: 0.3rem 0.32rem 0;
      line-height: 0.34rem; }
      .el-tooltip__popper.is-dark .tag-text.task-tag-text p {
        margin-bottom: 0.2rem; }

.character-wrap {
  display: flex;
  flex-shrink: 0;
  flex-direction: column; }
  .character-wrap .character-operate {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
    flex-grow: 0;
    height: auto;
    padding: 0 0 0.22rem;
    background-color: transparent;
    font-size: 0;
    border-top: 0; }
    .character-wrap .character-operate .text {
      font-size: 0.22rem;
      color: #6C7C93; }
    .character-wrap .character-operate .checkbox-wrap {
      padding: 0; }
      .character-wrap .character-operate .checkbox-wrap input.checkbox {
        left: 0.05rem; }
      .character-wrap .character-operate .checkbox-wrap .iconfont {
        color: #C1CDDF; }
  .character-wrap .character-list {
    display: flex;
    flex-grow: 1;
    flex-wrap: wrap;
    padding-top: 0.22rem;
    margin-right: -0.32rem;
    overflow-y: auto; }
    .character-wrap .character-list ul {
      display: flex;
      flex-wrap: wrap;
      align-self: end; }
      .character-wrap .character-list ul li {
        position: relative;
        display: flex;
        width: 1.4rem;
        height: 1.4rem;
        margin: 0 0.35rem 0.64rem; }
        .character-wrap .character-list ul li input {
          position: absolute;
          opacity: 0; }
        .character-wrap .character-list ul li .character {
          position: relative;
          display: flex;
          justify-content: center;
          align-items: center;
          width: 1.4rem;
          height: 1.4rem;
          background: url(../images/task-center/character-bg.png) no-repeat center;
          background-size: 100% 100%;
          font-size: 0.68rem;
          color: #333;
          cursor: pointer; }
        .character-wrap .character-list ul li input:checked ~ label.character {
          background: url(../images/task-center/character-bg-checked.png) no-repeat center;
          background-size: 100% 100%; }
        .character-wrap .character-list ul li input:checked ~ label.character:after {
          position: absolute;
          top: -0.12rem;
          right: -0.12rem;
          content: '';
          width: 0.32rem;
          height: 0.32rem;
          background: url(../images/task-center/checked-icon.png) no-repeat center;
          background-size: 100% 100%; }
  .character-wrap .article-list {
    display: flex;
    flex-grow: 1;
    padding-top: 0.1rem;
    padding-right: 0.32rem;
    margin-right: -0.32rem;
    overflow-y: auto; }
    .character-wrap .article-list ul {
      width: 100%; }
      .character-wrap .article-list ul li {
        position: relative;
        display: flex;
        margin: 0 0 0.24rem; }
        .character-wrap .article-list ul li .article {
          position: relative;
          display: flex;
          flex-shrink: 0;
          flex-direction: column;
          align-items: end;
          width: 100%;
          line-height: 0.44rem;
          padding: 0.25rem 0.84rem 0.25rem 0.42rem;
          background-color: #fff;
          border: 2px solid #dee5de;
          border-radius: 0.08rem;
          font-size: 0.26rem;
          color: #333;
          cursor: pointer; }
          .character-wrap .article-list ul li .article:after {
            position: absolute;
            top: -0.01rem;
            right: -0.01rem;
            content: '';
            width: 0.38rem;
            height: 0.28rem;
            background: url(../images/task-center/check-icon2.png) no-repeat center;
            background-size: 100% 100%; }
          .character-wrap .article-list ul li .article:hover {
            background: #FAFCFE;
            box-shadow: 0 0 0.15rem rgba(0, 0, 0, 0.1); }
        .character-wrap .article-list ul li input {
          position: absolute;
          top: 0.1rem;
          right: 0.1rem;
          width: 0.27rem;
          height: 0.27rem;
          opacity: 0;
          cursor: pointer;
          z-index: 2; }
        .character-wrap .article-list ul li .iconfont {
          position: absolute;
          top: 0.08rem;
          right: 0.08rem;
          font-size: 0.38rem;
          color: #C1CDDF; }
        .character-wrap .article-list ul li input:checked ~ label.article {
          background-color: #F6FAFF;
          border: 2px solid #368FFF; }
        .character-wrap .article-list ul li input:checked ~ label.article:after {
          position: absolute;
          top: -0.01rem;
          right: -0.01rem;
          content: '';
          width: 0.38rem;
          height: 0.28rem;
          background: url(../images/task-center/checked-icon2.png) no-repeat center;
          background-size: 100% 100%; }
    .character-wrap .article-list li {
      position: relative;
      display: flex;
      margin: 0 0 0.32rem; }
      .character-wrap .article-list li .article {
        position: relative;
        display: flex;
        align-items: center;
        width: 100%;
        line-height: 0.44rem;
        padding: 0.25rem 0.84rem 0.25rem 0.42rem;
        background-color: #FAFCFE;
        border: 2px solid #dee5de;
        box-shadow: 0.01rem 0.02rem 0.1rem rgba(42, 49, 57, 0.05);
        border-radius: 0.08rem;
        font-size: 0.26rem;
        color: #333;
        cursor: pointer; }
      .character-wrap .article-list li input {
        position: absolute;
        top: 0.1rem;
        right: 0.1rem;
        width: 0.27rem;
        height: 0.27rem;
        opacity: 0;
        cursor: pointer;
        z-index: 2; }
      .character-wrap .article-list li .iconfont {
        position: absolute;
        top: 0.08rem;
        right: 0.08rem;
        font-size: 0.38rem;
        color: #C1CDDF; }
      .character-wrap .article-list li input:checked ~ label.article {
        background-color: #ECF5FF;
        border: 2px solid #368FFF; }
      .character-wrap .article-list li input:checked ~ label.article:after {
        position: absolute;
        top: -0.12rem;
        right: -0.12rem;
        content: '';
        width: 0.32rem;
        height: 0.32rem;
        background: url(../images/task-center/checked-icon.png) no-repeat center;
        background-size: 100% 100%; }
  .character-wrap .word-list {
    display: flex;
    flex-grow: 1;
    flex-wrap: wrap;
    padding-top: 0.22rem;
    margin-right: -0.32rem;
    overflow-y: auto; }
    .character-wrap .word-list ul {
      display: flex;
      flex-wrap: wrap;
      align-self: end; }
      .character-wrap .word-list ul li {
        position: relative;
        display: flex;
        min-width: 1.98rem;
        height: 0.8rem;
        margin: 0 0.08rem 0.4rem 0.35rem; }
        .character-wrap .word-list ul li input {
          position: absolute;
          opacity: 0; }
        .character-wrap .word-list ul li .word {
          position: relative;
          display: flex;
          justify-content: center;
          align-items: center;
          min-width: 1.98rem;
          height: 0.8rem;
          padding: 0 0.4rem;
          background-color: #fff;
          border: 2px solid #DEE5ED;
          border-radius: 0.08rem;
          font-size: 0.26rem;
          color: #333;
          cursor: pointer; }
        .character-wrap .word-list ul li input:checked ~ label.word {
          background-color: #ECF5FF;
          border: 2px solid #368FFF; }
        .character-wrap .word-list ul li input:checked ~ label.word:after {
          position: absolute;
          top: -0.12rem;
          right: -0.12rem;
          content: '';
          width: 0.32rem;
          height: 0.32rem;
          background: url(../images/task-center/checked-icon.png) no-repeat center;
          background-size: 100% 100%; }

.task-read-bottom.right {
  justify-content: flex-end; }

.task-read .d-bottom.right {
  justify-content: flex-end; }

.task-read .d-bottom {
  justify-content: space-between;
  padding: 0 0.32rem 0 0.24rem;
  background-color: #F4F7F9; }
  .task-read .d-bottom .btn-style {
    width: 2.2rem;
    height: 0.56rem;
    line-height: 0.54rem !important;
    border-radius: 0.28rem !important;
    font-size: 0.24rem; }
  .task-read .d-bottom .back-btn {
    display: flex;
    align-items: center;
    margin-right: 0.32rem;
    font-size: 0.24rem;
    color: #6C7C93;
    color: #368FFF;
    cursor: pointer; }
    .task-read .d-bottom .back-btn .iconfont {
      margin-right: 0;
      font-size: 0.3rem;
      color: #8794A8;
      color: #368FFF; }
    .task-read .d-bottom .back-btn:hover .iconfont {
      color: #fff; }

.task-read-content.task {
  position: relative;
  display: block;
  height: 100%;
  padding: 0.8rem 0;
  background-color: #fff;
  overflow-x: hidden;
  overflow-y: auto; }
  .task-read-content.task .input-inner.input-box {
    width: 6.7rem; }
  .task-read-content.task .form-wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-height: 100%;
    padding-top: 0.6rem; }
  .task-read-content.task .form-input .fork-btn {
    position: absolute;
    right: 0.6rem;
    top: 0.16rem;
    width: 0.24rem;
    height: 0.24rem;
    line-height: 0.24rem;
    background: black;
    opacity: 0.16;
    border-radius: 50%;
    font-size: 0.24rem;
    color: #fff;
    cursor: pointer; }
  .task-read-content.task .calendar-icon {
    position: absolute;
    right: 0.2rem;
    top: 0.16rem;
    width: 0.24rem;
    height: 0.24rem;
    background: url("../images/task-center/calendar-icon.png") no-repeat center center;
    background-size: 100% 100%; }
.task-read-content.notice .form-wrap {
  position: relative;
  top: auto;
  left: auto;
  transform: none;
  padding-top: 0;
  margin: 0 0 0 5.6rem; }
  .task-read-content.notice .form-wrap .form-item {
    margin-bottom: 0.6rem; }
  .task-read-content.notice .form-wrap .textarea-inner {
    height: 1.8rem; }
.task-read-content.notice .form-item-content .operate-wrap:first-child label {
  font-weight: bold; }

.form-item:last-child {
  margin-top: -0.12rem; }

.form-item-content .operate-wrap {
  display: flex;
  align-items: center;
  line-height: 0.24rem;
  margin: 0.15rem 0 0.12rem; }
  .form-item-content .operate-wrap:last-child {
    margin-bottom: 0; }
  .form-item-content .operate-wrap .radio-wrap,
  .form-item-content .operate-wrap .checkbox-wrap {
    margin-left: -0.03rem; }
  .form-item-content .operate-wrap label {
    font-size: 0.22rem;
    color: #333;
    cursor: pointer; }
.form-item-content .range-txt {
  position: relative;
  display: inline-flex;
  margin-left: 0.16rem;
  font-size: 0.22rem;
  color: #999;
  cursor: default; }
  .form-item-content .range-txt label {
    display: inline-block;
    max-width: 3.6rem;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    vertical-align: -0.05rem;
    color: #999; }
  .form-item-content .range-txt em {
    margin-left: 0.14rem;
    color: #368FFF;
    cursor: pointer; }
  .form-item-content .range-txt .range-txt-tips {
    display: none;
    position: absolute;
    bottom: 0.4rem;
    max-width: 4.6rem;
    padding: 0.25rem;
    line-height: 0.32rem;
    background: #fff;
    border: 1px solid #DEE5ED;
    box-shadow: 0 0 0.16rem rgba(0, 0, 0, 0.14);
    border-radius: 0.04rem;
    font-size: 0.22rem;
    color: #666; }
    .form-item-content .range-txt .range-txt-tips i {
      position: absolute;
      top: 100%;
      left: 50%;
      transform: translateX(-50%);
      width: 0.5rem;
      height: 0.25rem;
      overflow: hidden; }
      .form-item-content .range-txt .range-txt-tips i:after {
        content: "";
        position: absolute;
        width: 0.15rem;
        height: 0.15rem;
        background: white;
        transform: translateX(-50%) translateY(-50%) rotate(45deg);
        top: 0;
        left: 50%;
        box-shadow: 0 0 0.16rem rgba(0, 0, 0, 0.14); }
  .form-item-content .range-txt:hover .range-txt-tips {
    display: inline-block; }
.form-item-content .range-wrap {
  position: absolute;
  right: -2.4rem;
  bottom: 0.12rem;
  z-index: 2;
  display: flex;
  flex-shrink: 0;
  flex-direction: column;
  width: 2.2rem;
  background: #fff;
  border: 1px solid #DEE5ED;
  box-shadow: 0 0 0.16rem rgba(0, 0, 0, 0.14);
  border-radius: 0.04rem; }
  .form-item-content .range-wrap.stu {
    right: -4.6rem;
    z-index: 1; }
  .form-item-content .range-wrap .range-box {
    display: flex;
    flex-grow: 0;
    flex-shrink: 0;
    flex-direction: column;
    padding: 0.28rem;
    background: #fff;
    border-bottom: 1px solid #DEE5ED;
    box-shadow: 0 0.02rem 0.03rem rgba(0, 0, 0, 0.06);
    border-radius: 0.04rem 0.04rem 0 0; }
    .form-item-content .range-wrap .range-box .range-item {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 2.22rem;
      height: 0.5rem;
      padding: 0 0.2rem 0 0.36rem;
      margin-top: 0.04rem;
      border-radius: 0.25rem;
      font-size: 0.22rem;
      color: #333; }
      .form-item-content .range-wrap .range-box .range-item:first-child {
        margin-top: 0; }
      .form-item-content .range-wrap .range-box .range-item:hover {
        color: #368FFF; }
      .form-item-content .range-wrap .range-box .range-item.active {
        background: #368FFF;
        color: #fff; }
        .form-item-content .range-wrap .range-box .range-item.active i {
          font-size: 0.38rem;
          color: #fff; }
          .form-item-content .range-wrap .range-box .range-item.active i:before {
            content: '\e78e'; }
  .form-item-content .range-wrap .range-list {
    position: relative;
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    overflow-y: auto; }
    .form-item-content .range-wrap .range-list ul li {
      padding-bottom: 0.07rem; }
      .form-item-content .range-wrap .range-list ul li h3 {
        padding: 0.2rem 0 0.1rem;
        margin: 0 0.28rem;
        font-size: 0.18rem;
        color: #7F8893;
        border-top: 1px solid #DEE5ED; }
      .form-item-content .range-wrap .range-list ul li:first-child h3 {
        border: 0; }
      .form-item-content .range-wrap .range-list ul li .operate-wrap-box {
        max-height: 2.24rem;
        overflow-y: auto; }
      .form-item-content .range-wrap .range-list ul li .operate-wrap {
        height: 0.56rem;
        padding: 0 0.12rem 0 0.28rem;
        margin: 0; }
        .form-item-content .range-wrap .range-list ul li .operate-wrap.active {
          background: #E5EFFA; }
        .form-item-content .range-wrap .range-list ul li .operate-wrap label {
          font-size: 0.2rem;
          color: #333; }
        .form-item-content .range-wrap .range-list ul li .operate-wrap .checkbox-wrap {
          display: flex;
          width: 200%;
          justify-content: space-between; }
          .form-item-content .range-wrap .range-list ul li .operate-wrap .checkbox-wrap:hover label {
            color: #368FFF; }
        .form-item-content .range-wrap .range-list ul li .operate-wrap input {
          left: auto;
          right: 0.15rem; }
        .form-item-content .range-wrap .range-list ul li .operate-wrap input:checked ~ label {
          color: #368FFF; }
  .form-item-content .range-wrap .range-student .operate-wrap {
    height: 0.56rem;
    padding: 0 0.12rem 0 0.28rem;
    margin: 0; }
    .form-item-content .range-wrap .range-student .operate-wrap.active {
      background: #E5EFFA; }
    .form-item-content .range-wrap .range-student .operate-wrap .radio-wrap {
      display: flex;
      width: 100%;
      justify-content: space-between; }
    .form-item-content .range-wrap .range-student .operate-wrap input {
      left: auto;
      right: 0.15rem; }
    .form-item-content .range-wrap .range-student .operate-wrap input:checked ~ label {
      color: #368FFF; }

.checkbox-wrap,
.radio-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 0.24rem;
  font-size: 0.22rem;
  color: #6C7C93; }
  .checkbox-wrap .iconfont,
  .radio-wrap .iconfont {
    margin-top: 0.02rem;
    margin-right: 0.08rem;
    font-size: 0.38rem;
    color: #C1CDDF; }
  .checkbox-wrap input.checkbox,
  .checkbox-wrap input.radio,
  .radio-wrap input.checkbox,
  .radio-wrap input.radio {
    position: absolute;
    top: 0;
    left: 0.08rem;
    width: 0.27rem;
    height: 0.27rem;
    opacity: 0;
    filter: alpha(opacity=0);
    cursor: pointer;
    z-index: 2; }
  .checkbox-wrap input.checkbox ~ i.iconfont:before,
  .radio-wrap input.checkbox ~ i.iconfont:before {
    content: '\e78d'; }
  .checkbox-wrap input.checkbox:checked ~ i.iconfont,
  .radio-wrap input.checkbox:checked ~ i.iconfont {
    color: #368FFF; }
    .checkbox-wrap input.checkbox:checked ~ i.iconfont:before,
    .radio-wrap input.checkbox:checked ~ i.iconfont:before {
      content: '\e78c'; }
  .checkbox-wrap input.radio ~ i.iconfont,
  .radio-wrap input.radio ~ i.iconfont {
    font-size: 0.32rem; }
    .checkbox-wrap input.radio ~ i.iconfont:before,
    .radio-wrap input.radio ~ i.iconfont:before {
      content: '\e64e'; }
  .checkbox-wrap input.radio:checked ~ i.iconfont,
  .radio-wrap input.radio:checked ~ i.iconfont {
    color: #368FFF; }
    .checkbox-wrap input.radio:checked ~ i.iconfont:before,
    .radio-wrap input.radio:checked ~ i.iconfont:before {
      content: '\e6ac'; }
  .checkbox-wrap:hover,
  .radio-wrap:hover {
    color: #368FFF; }
    .checkbox-wrap:hover .iconfont,
    .checkbox-wrap:hover label,
    .radio-wrap:hover .iconfont,
    .radio-wrap:hover label {
      color: #368FFF; }
    .checkbox-wrap:hover input.radio:disabled ~ i.iconfont,
    .radio-wrap:hover input.radio:disabled ~ i.iconfont {
      color: #ccc;
      cursor: not-allowed; }
    .checkbox-wrap:hover input.radio:disabled ~ label,
    .radio-wrap:hover input.radio:disabled ~ label {
      color: #333;
      cursor: not-allowed; }
    .checkbox-wrap:hover input.checkbox:disabled ~ i.iconfont,
    .radio-wrap:hover input.checkbox:disabled ~ i.iconfont {
      color: #ccc;
      cursor: not-allowed; }
    .checkbox-wrap:hover input.checkbox:disabled ~ label,
    .radio-wrap:hover input.checkbox:disabled ~ label {
      color: #333;
      cursor: not-allowed; }
  .checkbox-wrap input.radio:disabled ~ i.iconfont,
  .radio-wrap input.radio:disabled ~ i.iconfont {
    color: #ccc;
    cursor: not-allowed; }
  .checkbox-wrap input.checkbox:disabled ~ i.iconfont,
  .radio-wrap input.checkbox:disabled ~ i.iconfont {
    color: #ccc;
    cursor: not-allowed; }

.switch-wrap {
  position: relative;
  display: inline-block; }
  .switch-wrap input {
    position: absolute;
    top: 0;
    left: 0;
    width: 0.6rem;
    height: 0.32rem;
    opacity: 0;
    filter: alpha(opacity=0);
    cursor: pointer;
    z-index: 2; }
  .switch-wrap i {
    position: relative;
    display: inline-block;
    width: 0.6rem;
    height: 0.32rem;
    line-height: 0.32rem;
    padding: 0 0.05rem;
    font-size: 0.14rem;
    color: #fff;
    background: #ccc;
    border-radius: 0.04rem;
    cursor: pointer; }
    .switch-wrap i em {
      display: inline-block;
      width: 0.24rem;
      height: 0.24rem;
      background: #fff;
      border-radius: 0.04rem;
      position: absolute;
      top: 0.04rem;
      left: 0.03rem; }
      .switch-wrap i em:before {
        position: absolute;
        right: -0.26rem;
        top: -0.05rem;
        content: 'off'; }
  .switch-wrap input:checked ~ i {
    background: #368FFF; }
    .switch-wrap input:checked ~ i em {
      left: auto;
      right: 0.03rem; }
      .switch-wrap input:checked ~ i em:before {
        right: auto;
        left: -0.26rem;
        content: 'on'; }

.classic-wrap {
  position: relative;
  top: -0.72rem;
  height: calc(100% + 0.72rem);
  padding-top: 0; }
  .classic-wrap .character-operate {
    padding: 0.22rem 0 0.12rem; }

.task-detail-content {
  /* display: flex;*/
  height: 100%;
  background: #EFF3F7; }
  .task-detail-content .detail-side {
    /*display: flex;
    flex-shrink: 0;
    flex-direction: column;*/
    float: left;
    width: 4.8rem;
    height: 100%;
    /*margin-right: px2rem(35px);*/
    background: #FAFCFE;
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 0.06rem rgba(0, 0, 0, 0.1); }
    .task-detail-content .detail-side .detail-title {
      padding: 0.22rem 0.4rem 0.3rem 0.4rem;
      border-bottom: 1px solid #DEE5ED;
      background: #fff; }
      .task-detail-content .detail-side .detail-title h3 {
        font-size: 0.26rem;
        font-weight: bold;
        color: #333; }
      .task-detail-content .detail-side .detail-title p {
        margin: 0.1rem 0 0.2rem 0;
        color: #999;
        font-size: 0.2rem; }
      .task-detail-content .detail-side .detail-title .del {
        display: inline-block;
        width: 1rem;
        height: 0.32rem;
        margin-top: 0.27rem;
        line-height: 0.32rem;
        background: #000;
        opacity: 0.2;
        font-size: 0.18rem;
        color: #fff;
        border-radius: 0.16rem;
        text-align: center; }
      .task-detail-content .detail-side .detail-title .del-icon i {
        font-size: 0.22rem;
        color: #9CABBC; }
      .task-detail-content .detail-side .detail-title .del-icon:hover i {
        color: #368FFF; }
    .task-detail-content .detail-side .class-analysis {
      position: relative;
      padding: 0.08rem 0; }
      .task-detail-content .detail-side .class-analysis:after {
        content: '';
        position: absolute;
        left: .7rem;
        bottom: 0.1rem;
        width: 3.31rem;
        height: 0;
        border-bottom: 0.01rem dashed #E5E7EB; }
      .task-detail-content .detail-side .class-analysis .meta-analysis {
        font-size: 0;
        margin-bottom: 0.3rem; }
        .task-detail-content .detail-side .class-analysis .meta-analysis li {
          position: relative;
          display: inline-block;
          width: 33.3%;
          font-size: 0.2rem;
          color: #999;
          text-align: center; }
          .task-detail-content .detail-side .class-analysis .meta-analysis li:after {
            content: '';
            position: absolute;
            top: 0.25rem;
            left: 0;
            width: 1px;
            height: 0.32rem;
            background: #E5E7EB; }
          .task-detail-content .detail-side .class-analysis .meta-analysis li:first-child:after {
            display: none; }
          .task-detail-content .detail-side .class-analysis .meta-analysis li p {
            color: #999;
            font-size: 0.18rem; }
            .task-detail-content .detail-side .class-analysis .meta-analysis li p.num {
              color: #333;
              font-size: 0.32rem; }
      .task-detail-content .detail-side .class-analysis a {
        display: block;
        height: 0.72rem;
        padding: 0 0.68rem;
        line-height: 0.72rem;
        font-size: 0.24rem;
        margin-bottom: 0.1rem;
        color: #333; }
        .task-detail-content .detail-side .class-analysis a:hover {
          margin-bottom: 0.1rem;
          background: #E5EFFA; }
        .task-detail-content .detail-side .class-analysis a.active {
          margin-bottom: 0.1rem;
          position: relative;
          background: #E5EFFA;
          color: #368FFF; }
          .task-detail-content .detail-side .class-analysis a.active::after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 0.04rem;
            height: 100%;
            background: #368FFF; }
      .task-detail-content .detail-side .class-analysis .submit-num {
        color: #999; }
        .task-detail-content .detail-side .class-analysis .submit-num:hover {
          background: transparent;
          cursor: default; }
    .task-detail-content .detail-side .student-list {
      height: calc(100% - 3.76rem + .8rem);
      padding-top: 0;
      overflow-x: hidden;
      overflow-y: auto; }
      .task-detail-content .detail-side .student-list a {
        position: relative;
        display: block;
        height: 0.74rem;
        padding: 0 0.7rem;
        line-height: 0.74rem;
        font-size: 0.24rem;
        color: #333; }
        .task-detail-content .detail-side .student-list a.active {
          position: relative;
          background: #E5EFFA;
          color: #368FFF; }
          .task-detail-content .detail-side .student-list a.active::after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 0.04rem;
            height: 100%;
            background: #368FFF; }
          .task-detail-content .detail-side .student-list a.active .grade {
            color: #368FFF; }
        .task-detail-content .detail-side .student-list a em {
          line-height: normal;
          font-size: 0.24rem;
          color: #666; }
        .task-detail-content .detail-side .student-list a .typical {
          display: inline-block;
          position: absolute;
          top: 0.25rem;
          left: 0.15rem;
          height: 0.24rem;
          line-height: 0.24rem;
          padding: 0 0.08rem;
          background: rgba(253, 179, 50, 0.2);
          border-radius: 0.12rem;
          font-size: 0.14rem;
          color: #FDB332;
          text-align: center; }
        .task-detail-content .detail-side .student-list a .grade {
          position: relative;
          padding-right: 0.1rem;
          color: #666; }
          .task-detail-content .detail-side .student-list a .grade.color-green {
            color: #24C366; }
          .task-detail-content .detail-side .student-list a .grade.color-blue {
            color: #368FFF; }
          .task-detail-content .detail-side .student-list a .grade.excellent:after {
            position: absolute;
            content: '';
            right: -0.2rem;
            top: 50%;
            margin-top: -0.12rem;
            width: 0.26rem;
            height: 0.26rem;
            background: url("../images/task-detail/icon-excellent.png") no-repeat;
            background-size: 100% 100%; }
        .task-detail-content .detail-side .student-list a.grade-none {
          color: #999;
          cursor: default; }
        .task-detail-content .detail-side .student-list a:hover {
          background: #E5EFFA; }
          .task-detail-content .detail-side .student-list a:hover.grade-none {
            background: transparent; }
        .task-detail-content .detail-side .student-list a .student-ques-num {
          position: relative;
          padding-left: 0.12rem;
          margin-left: 0.12rem;
          font-size: 0.26rem;
          color: #666666; }
          .task-detail-content .detail-side .student-list a .student-ques-num:after {
            position: absolute;
            content: '';
            top: 0.08rem;
            left: 0;
            width: 1px;
            height: 0.2rem;
            background: #D8DEDF; }
    .task-detail-content .detail-side.clock-task-side .student-list {
      height: calc(100% - 3.76rem - 1.2rem); }
  .task-detail-content .detail-side-new .detail-title {
    padding: 0.3rem 0.4rem 0.25rem 0.4rem;
    border-bottom: 0;
    background: url("../images/task-detail/recommend-left-bg.png") no-repeat center top;
    background-size: 100% 1.4rem; }
  .task-detail-content .detail-side-new .student-list {
    height: calc(100% - 1.56rem) !important; }
  .task-detail-content .detail-side-new .student-list a {
    padding-left: 0.4rem; }
  .task-detail-content .detail-side-new + .task-detail-main-new {
    background: #fff; }
    .task-detail-content .detail-side-new + .task-detail-main-new .task-detail-breadcrumb {
      padding-left: 0.6rem;
      box-shadow: none; }
      .task-detail-content .detail-side-new + .task-detail-main-new .task-detail-breadcrumb span {
        margin-left: 0.15rem;
        font-weight: normal;
        font-size: 0.22rem;
        color: #666; }
        .task-detail-content .detail-side-new + .task-detail-main-new .task-detail-breadcrumb span em {
          margin: 0 0.03rem;
          color: #368FFF; }
      .task-detail-content .detail-side-new + .task-detail-main-new .task-detail-breadcrumb:after {
        position: absolute;
        content: '';
        top: 50%;
        left: .32rem;
        width: 0.06rem;
        height: 0.26rem;
        border-radius: 0.03rem;
        background: #368fff;
        transform: translate(0, -40%); }
    .task-detail-content .detail-side-new + .task-detail-main-new .task-detail-exercise {
      padding: 0 0.32rem; }
      .task-detail-content .detail-side-new + .task-detail-main-new .task-detail-exercise .module {
        padding: 0 0.32rem; }

.task-detail-main {
  /*display: flex;
  flex-direction: column;*/
  position: relative;
  /*flex-grow: 1;*/
  height: 100%;
  padding-right: 0.35rem;
  margin-left: 5.15rem;
  overflow-y: auto;
  overflow-x: hidden; }
  .task-detail-main .task-detail-new-style {
    height: auto !important;
    overflow-y: visible !important;
    padding: 0 !important; }
  .task-detail-main .module-legend {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 0.15rem; }
    .task-detail-main .module-legend .legend li {
      display: inline-block;
      margin-left: 0.24rem;
      font-size: 0.2rem;
      color: #666; }
      .task-detail-main .module-legend .legend li i {
        display: inline-block;
        vertical-align: middle;
        width: 0.18rem;
        height: 0.18rem;
        margin: -0.04rem 0.02rem 0 0;
        border: 1px solid;
        border-radius: 0.04rem; }
        .task-detail-main .module-legend .legend li i.green {
          background: rgba(36, 195, 102, 0.1);
          border-color: #24C366; }
        .task-detail-main .module-legend .legend li i.red {
          background: rgba(255, 84, 58, 0.1);
          border-color: #FF543A; }
        .task-detail-main .module-legend .legend li i.yellow {
          background: rgba(255, 174, 0, 0.1);
          border-color: #FFAE00; }
        .task-detail-main .module-legend .legend li i.gray {
          background: #fff;
          border-color: #D8DEDF; }
        .task-detail-main .module-legend .legend li i.not-do {
          position: relative;
          background: #EFF3F7;
          border-color: #D8DEDF; }
          .task-detail-main .module-legend .legend li i.not-do:after {
            content: '';
            position: absolute;
            top: 0.08rem;
            left: 0.03rem;
            width: 0.12rem;
            height: 1px;
            background: #999; }
  .task-detail-main .module {
    padding: 0.42rem 0.5rem 0.4rem;
    margin-bottom: 0.24rem;
    background: #fff;
    border-radius: 0.08rem;
    border: 1px solid #DEE5ED; }
    .task-detail-main .module.exercise {
      padding: 0.42rem 0.5rem 0.42rem; }
      .task-detail-main .module.exercise .module-title {
        display: flex;
        justify-content: space-between;
        padding-left: 0.35rem; }
    .task-detail-main .module .module-title {
      position: relative;
      margin-top: -0.22rem;
      font-size: 0.26rem;
      color: #333;
      font-weight: bold; }
      .task-detail-main .module .module-title em {
        margin-left: 0.2rem;
        font-size: 0.24rem;
        color: #666; }
      .task-detail-main .module .module-title > span {
        color: #999;
        font-size: 0.24rem;
        font-weight: normal; }
      .task-detail-main .module .module-title .tips {
        display: inline-block;
        position: relative;
        font-size: 0.2rem;
        font-weight: normal;
        color: #6C7C93; }
        .task-detail-main .module .module-title .tips::after {
          position: absolute;
          content: '';
          top: 0.02rem;
          left: -0.3rem;
          width: 0.24rem;
          height: 0.24rem;
          background: url("../images/task-detail/tag-icon.png") no-repeat center;
          background-size: 0.24rem 0.24rem; }
      .task-detail-main .module .module-title .tags span {
        color: #6C7C93;
        font-size: 0.24rem;
        font-weight: normal; }
        .task-detail-main .module .module-title .tags span em {
          color: #368FFF; }
      .task-detail-main .module .module-title .tags .iconfont {
        color: #7C91A8;
        font-size: 0.26rem; }
      .task-detail-main .module .module-title .num {
        display: inline-block;
        position: relative;
        padding-right: 0.3rem;
        font-size: 0.24rem;
        font-weight: normal;
        color: #6C7C93;
        font-family: 'Microsoft YaHei' !important; }
        .task-detail-main .module .module-title .num:before {
          position: absolute;
          content: "\e77a";
          top: 0.05rem;
          right: 0.02rem;
          font-size: 0.22rem;
          color: #7C91A8;
          font-family: "iconfont" !important; }
      .task-detail-main .module .module-title .play {
        display: inline-block;
        width: 1.4rem;
        height: 0.42rem;
        line-height: 0.38rem;
        margin-left: 0.19rem;
        border: 0.01rem solid #D8DEDF;
        font-size: 0.18rem;
        color: #333;
        font-weight: normal;
        border-radius: 0.21rem;
        text-align: center; }
        .task-detail-main .module .module-title .play i {
          display: inline-block;
          width: 0.24rem;
          height: 0.2rem;
          margin: 0 0.1rem 0 0;
          background: url("../images/task-detail/play3.png") no-repeat center;
          background-size: 0.24rem 0.2rem;
          vertical-align: middle; }
        .task-detail-main .module .module-title .play:hover {
          border-color: #368FFF;
          color: #368FFF; }
          .task-detail-main .module .module-title .play:hover i {
            background: url("../images/task-detail/play.png") no-repeat center;
            background-size: 0.24rem 0.2rem; }
        .task-detail-main .module .module-title .play.active {
          border-color: #368FFF;
          color: #368FFF; }
          .task-detail-main .module .module-title .play.active i {
            animation: play 1.5s infinite;
            -webkit-animation: play 1.5s infinite; }
    .task-detail-main .module .task-module-content {
      display: flex;
      display: -webkit-flex;
      justify-content: flex-start;
      align-items: center;
      flex-wrap: wrap;
      margin-left: -0.32rem; }
      .task-detail-main .module .task-module-content .item-block {
        padding: 0.18rem 0.33rem;
        color: #333;
        font-size: 0.26rem;
        background-color: #F3F7FB;
        border-radius: 0.08rem;
        margin: 0.24rem 0 0 0.32rem; }
    .task-detail-main .module .tag {
      margin: 0.17rem 0 0.24rem 0;
      font-size: 0.24rem;
      color: #999; }
      .task-detail-main .module .tag span {
        margin: 0 0.1rem 0 0.15rem; }
    .task-detail-main .module .evaluate {
      padding: 0.24rem 0.32rem;
      background: #F3F7FB;
      border-radius: 0.08rem;
      font-size: 0.24rem;
      color: #333; }
    .task-detail-main .module .pandect-list {
      margin-top: 0.2rem; }
      .task-detail-main .module .pandect-list li {
        float: left;
        width: 3.66rem;
        height: 1.6rem;
        margin-right: 0.29rem;
        border-radius: 0.04rem; }
        .task-detail-main .module .pandect-list li p {
          margin-left: 0.4rem;
          font-size: 0.24rem;
          color: #fff; }
          .task-detail-main .module .pandect-list li p.number {
            margin-top: 0.3rem;
            font-size: 0.24rem;
            font-weight: bold; }
            .task-detail-main .module .pandect-list li p.number em {
              font-size: 0.46rem;
              font-weight: bold; }
          .task-detail-main .module .pandect-list li p:nth-child(2) {
            color: rgba(255, 255, 255, 0.7); }
        .task-detail-main .module .pandect-list li:first-child {
          background: url("../images/task-detail/module-bg1.png") no-repeat right center;
          background-size: 1.68rem 1.6rem;
          background-color: #FEC676; }
        .task-detail-main .module .pandect-list li:nth-child(2) {
          background: url("../images/task-detail/module-bg2.png") no-repeat right center;
          background-size: 1.68rem 1.6rem;
          background-color: #5BD899; }
        .task-detail-main .module .pandect-list li:last-child {
          margin-right: 0;
          background: url("../images/task-detail/module-bg3.png") no-repeat right center;
          background-size: 1.68rem 1.6rem;
          background-color: #80AFFB; }
        .task-detail-main .module .pandect-list li.green-bg {
          background: #5BD899 url("../images/clock-task/bg-green.png") no-repeat right center;
          background-size: 1.68rem 1.6rem; }
        .task-detail-main .module .pandect-list li.red-bg {
          background: #FF9489 url("../images/clock-task/bg-red.png") no-repeat right center;
          background-size: 1.68rem 1.6rem; }
        .task-detail-main .module .pandect-list li.purple-bg {
          background: #80AFFB url("../images/clock-task/bg-purple.png") no-repeat right center;
          background-size: 1.68rem 1.6rem; }
    .task-detail-main .module .practise-list li {
      width: 6.15rem; }
      .task-detail-main .module .practise-list li:first-child {
        background: url("../images/task-detail/module-bg1.png") no-repeat 4rem center;
        background-size: 1.68rem 1.6rem;
        background-color: #FEC676; }
      .task-detail-main .module .practise-list li:last-child {
        background: url("../images/task-detail/module-bg4.png") no-repeat 4rem center;
        background-size: 1.68rem 1.6rem;
        background-color: #80AFFB; }
      .task-detail-main .module .practise-list li p {
        margin-left: 0.8rem; }
    .task-detail-main .module .word-list {
      margin-top: 0.3rem;
      margin-right: -0.36rem; }
      .task-detail-main .module .word-list li {
        float: left;
        width: 1.4rem;
        margin: 0 0.3rem 0.3rem 0;
        border-radius: 0.1rem;
        text-align: center; }
        .task-detail-main .module .word-list li .text {
          font-size: 0.24rem;
          color: #333;
          line-height: 0.8rem;
          background: #F3F7FB;
          border-radius: 0.1rem 0.1rem 0 0; }
          .task-detail-main .module .word-list li .text.bad {
            color: #FF543A; }
        .task-detail-main .module .word-list li .num {
          font-size: 0.22rem;
          color: #6C7C93;
          line-height: 0.6rem;
          background: #E5EFFA;
          border-radius: 0 0 0.1rem 0.1rem; }
        .task-detail-main .module .word-list li .student-grade .play {
          color: #368FFF; }
          .task-detail-main .module .word-list li .student-grade .play i {
            margin: 0 0.1rem 0 0;
            font-size: 0.24rem;
            vertical-align: middle; }
      .task-detail-main .module .word-list.word-list-type1 li {
        width: auto;
        font-size: 0; }
        .task-detail-main .module .word-list.word-list-type1 li .text {
          display: inline-block;
          width: 2.47rem;
          padding-left: 0.34rem;
          line-height: 0.88rem;
          background: #F3F7FB;
          border-radius: 0.1rem 0 0 0.1rem;
          text-align: left;
          vertical-align: middle; }
        .task-detail-main .module .word-list.word-list-type1 li .num {
          display: inline-block;
          width: 1.2rem;
          line-height: 0.88rem;
          background: #E5EFFA;
          border-radius: 0 0.1rem 0.1rem 0;
          vertical-align: middle; }
      .task-detail-main .module .word-list.word-list-type2 {
        margin-right: 0; }
        .task-detail-main .module .word-list.word-list-type2 li {
          width: 100%;
          margin-right: 0; }
          .task-detail-main .module .word-list.word-list-type2 li table {
            width: 100%; }
            .task-detail-main .module .word-list.word-list-type2 li table .text {
              padding: 0.32rem 0.34rem;
              line-height: normal;
              border-radius: 0.1rem 0 0 0.1rem;
              text-align: left; }
            .task-detail-main .module .word-list.word-list-type2 li table .title {
              border-radius: 0.1rem; }
            .task-detail-main .module .word-list.word-list-type2 li table .bold {
              font-weight: bold; }
            .task-detail-main .module .word-list.word-list-type2 li table .num {
              width: 1.2rem;
              line-height: normal;
              border-radius: 0 0.1rem 0.1rem 0; }
      .task-detail-main .module .word-list.listen-list-type li {
        position: relative; }
        .task-detail-main .module .word-list.listen-list-type li .text {
          width: 4.46rem;
          line-height: 0.88rem;
          font-size: 0.28rem; }
        .task-detail-main .module .word-list.listen-list-type li .num {
          width: 1.2rem;
          cursor: pointer; }
          .task-detail-main .module .word-list.listen-list-type li .num .icon-ZK-PC-arrow-bottom {
            margin-left: 0.1rem;
            font-size: 0.18rem; }
      .task-detail-main .module .word-list.listen-list-type .list-detail {
        display: none;
        position: absolute;
        top: 0.96rem;
        left: 0;
        z-index: 100;
        width: 100%;
        padding: 0.35rem 0.55rem 0;
        background: #E5EFFA;
        border-radius: 0.1rem; }
        .task-detail-main .module .word-list.listen-list-type .list-detail li {
          float: none;
          margin-right: 0;
          margin-bottom: 0.2rem;
          font-size: 0.22rem;
          color: #6C7C93; }
          .task-detail-main .module .word-list.listen-list-type .list-detail li span:first-child {
            font-size: 0.24rem; }
          .task-detail-main .module .word-list.listen-list-type .list-detail li .error {
            color: #FF543A; }
          .task-detail-main .module .word-list.listen-list-type .list-detail li .right {
            color: #24C366; }
      .task-detail-main .module .word-list.listen-list-type2 .text {
        font-size: 0.28rem; }
    .task-detail-main .module.module-pandect {
      position: relative;
      border-radius: 0;
      border: 1px solid #DEE5ED; }
      .task-detail-main .module.module-pandect .return-back {
        position: absolute;
        top: 0.49rem;
        right: 0.87rem; }
        .task-detail-main .module.module-pandect .return-back .normal {
          min-width: auto;
          width: auto;
          height: auto;
          padding: 0;
          line-height: 1;
          border: 0;
          border-radius: 0;
          color: #6C7C93; }
          .task-detail-main .module.module-pandect .return-back .normal:hover {
            background: transparent;
            color: #368FFF; }
      .task-detail-main .module.module-pandect .module-title {
        padding-left: 0.2rem; }
        .task-detail-main .module.module-pandect .module-title.ml20 {
          margin-left: 0.2rem; }
        .task-detail-main .module.module-pandect .module-title::after {
          position: absolute;
          content: '';
          top: 50%;
          left: 0rem;
          width: 0.04rem;
          height: 0.24rem;
          border-radius: 0.04rem;
          background: #368FFF;
          transform: translate(0, -40%); }
        .task-detail-main .module.module-pandect .module-title .title-tag {
          font-size: 0.24rem;
          color: #666; }
      .task-detail-main .module.module-pandect .arrange-practice-wrap {
        margin-top: 0.25rem;
        margin-bottom: -0.22rem;
        border-top: 1px dashed #D8DEDF;
        padding-top: 0.22rem;
        display: flex;
        justify-content: space-between; }
        .task-detail-main .module.module-pandect .arrange-practice-wrap span {
          line-height: 0.46rem;
          font-size: 0.24rem;
          color: #333; }
          .task-detail-main .module.module-pandect .arrange-practice-wrap span em {
            color: #368FFF; }
    .task-detail-main .module.practise {
      position: relative;
      padding: 0 0.5rem 0.05rem; }
      .task-detail-main .module.practise:first-child {
        padding: 0.42rem 0.5rem 0.4rem; }
      .task-detail-main .module.practise .practise-title {
        position: relative;
        padding: .36rem 0 .3rem 0.2rem;
        font-size: .24rem;
        font-weight: bold;
        color: #333; }
        .task-detail-main .module.practise .practise-title::after {
          position: absolute;
          content: '';
          top: 53%;
          left: 0.02rem;
          width: 0.04rem;
          height: 0.24rem;
          border-radius: 0.02rem;
          background: #368fff;
          transform: translate(0, -41%); }
      .task-detail-main .module.practise .practise-arrow {
        position: absolute;
        top: .35rem;
        right: .5rem;
        color: #8794A8;
        cursor: pointer; }
      .task-detail-main .module.practise .grade-wrap {
        margin-bottom: .35rem; }
        .task-detail-main .module.practise .grade-wrap .grade-chart {
          width: 4.16rem;
          height: 2.86rem; }
          .task-detail-main .module.practise .grade-wrap .grade-chart img {
            width: 100%;
            height: 100%; }
        .task-detail-main .module.practise .grade-wrap .grade-person {
          width: 7.76rem;
          height: 2.86rem;
          border: 0.01rem solid #dee5ed; }
        .task-detail-main .module.practise .grade-wrap .grade-item {
          width: 3.2rem; }
          .task-detail-main .module.practise .grade-wrap .grade-item ul li {
            position: relative;
            padding-left: .46rem;
            height: 0.71rem;
            line-height: .71rem;
            background: #f7faff;
            border-top: 0.01rem solid #dee5ed;
            border-right: 0.01rem solid #dee5ed;
            font-size: .2rem;
            color: #999;
            cursor: pointer; }
            .task-detail-main .module.practise .grade-wrap .grade-item ul li:first-child {
              border-top: 0; }
            .task-detail-main .module.practise .grade-wrap .grade-item ul li:before {
              position: absolute;
              content: '';
              top: 50%;
              margin-top: -.03rem;
              left: 0.22rem;
              width: .12rem;
              height: .12rem;
              background: #368FFF;
              border-radius: 50%; }
            .task-detail-main .module.practise .grade-wrap .grade-item ul li strong {
              margin-right: .1rem;
              font-size: .24rem;
              color: #333; }
            .task-detail-main .module.practise .grade-wrap .grade-item ul li.active {
              background: #fff;
              border-right: 0; }
            .task-detail-main .module.practise .grade-wrap .grade-item ul li.excellent:before {
              background: #24C366; }
            .task-detail-main .module.practise .grade-wrap .grade-item ul li.good:before {
              background: #368FFF; }
            .task-detail-main .module.practise .grade-wrap .grade-item ul li.qualified:before {
              background: #FFAE00; }
            .task-detail-main .module.practise .grade-wrap .grade-item ul li.unqualified:before {
              background: #FF543A; }
        .task-detail-main .module.practise .grade-wrap .grade-stu {
          position: relative;
          width: 4.54rem;
          height: 100%;
          padding: .2rem .5rem .2rem .4rem;
          overflow-y: auto;
          font-size: .24rem;
          line-height: .44rem;
          color: #333; }
        .task-detail-main .module.practise .grade-wrap .zh-resource-none .img-none {
          width: 1.1rem;
          height: 1.06rem; }
        .task-detail-main .module.practise .grade-wrap .zh-resource-none .txt {
          margin-top: -.2rem;
          font-size: 0.22rem;
          color: #999; }
      .task-detail-main .module.practise .practise-table {
        margin-bottom: .35rem; }
        .task-detail-main .module.practise .practise-table table {
          width: 100%;
          font-size: 0.24rem;
          color: #666; }
          .task-detail-main .module.practise .practise-table table tr th, .task-detail-main .module.practise .practise-table table tr td {
            line-height: 0.64rem;
            text-align: left; }
            .task-detail-main .module.practise .practise-table table tr th:first-child, .task-detail-main .module.practise .practise-table table tr td:first-child {
              width: 4.2rem;
              padding-left: 0.4rem; }
          .task-detail-main .module.practise .practise-table table tr th {
            background: #F8F8F8;
            color: #333;
            border-top: 1px solid #DEE5ED; }
          .task-detail-main .module.practise .practise-table table tr td {
            border-bottom: 1px solid #DEE5ED; }
            .task-detail-main .module.practise .practise-table table tr td p {
              line-height: .28rem;
              padding: .2rem .2rem .2rem 0; }
          .task-detail-main .module.practise .practise-table table tr .icon-ZK-PC-arrow-left {
            padding-left: .2rem;
            font-size: 0.4rem;
            color: #8794A8;
            vertical-align: middle; }
            .task-detail-main .module.practise .practise-table table tr .icon-ZK-PC-arrow-left:hover {
              color: #368FFF; }
          .task-detail-main .module.practise .practise-table table tr:hover {
            background: #F0F9FF; }
        .task-detail-main .module.practise .practise-table.table-new table tr th:nth-child(2) {
          padding-right: 0.9rem;
          text-align: left; }
        .task-detail-main .module.practise .practise-table.table-new table tr td:nth-child(2) {
          padding-right: 0.9rem;
          text-align: left; }
        .task-detail-main .module.practise .practise-table .eui-progress .eui-progress-bar {
          width: 2.2rem; }
        .task-detail-main .module.practise .practise-table .eui-progress .eui-progress-inner.excellent {
          background: #24C366; }
        .task-detail-main .module.practise .practise-table .eui-progress .eui-progress-inner.good {
          background: #368FFF; }
        .task-detail-main .module.practise .practise-table .eui-progress .eui-progress-inner.qualified {
          background: #FFAE00; }
        .task-detail-main .module.practise .practise-table .eui-progress .eui-progress-inner.unqualified {
          background: #FF543A; }
        .task-detail-main .module.practise .practise-table .eui-progress .eui-progress-text {
          width: 1.1rem; }
        .task-detail-main .module.practise .practise-table .icon-ZK-PC-arrow-left {
          font-size: .3rem !important; }
        .task-detail-main .module.practise .practise-table .icon-paixu {
          display: inline-block;
          font-size: .26rem;
          margin-left: .05rem;
          color: #FF5E61; }
          .task-detail-main .module.practise .practise-table .icon-paixu.decline {
            color: #FF5E61; }
          .task-detail-main .module.practise .practise-table .icon-paixu.ascend {
            color: #24C366;
            transform: rotate(180deg); }
      .task-detail-main .module.practise .accuracy-rate {
        position: absolute;
        top: .4rem;
        right: 1rem;
        font-size: .18rem;
        color: #999; }
        .task-detail-main .module.practise .accuracy-rate label {
          margin-right: .2rem; }
        .task-detail-main .module.practise .accuracy-rate span {
          position: relative; }
          .task-detail-main .module.practise .accuracy-rate span:before {
            position: absolute;
            content: '';
            top: 50%;
            margin-top: -.05rem;
            left: -0.18rem;
            width: .12rem;
            height: .12rem;
            background: #368FFF;
            border-radius: 50%; }
          .task-detail-main .module.practise .accuracy-rate span.excellent:before {
            background: #24C366; }
          .task-detail-main .module.practise .accuracy-rate span.good:before {
            background: #368FFF; }
          .task-detail-main .module.practise .accuracy-rate span.qualified:before {
            background: #FFAE00; }
          .task-detail-main .module.practise .accuracy-rate span.unqualified:before {
            background: #FF543A; }
        .task-detail-main .module.practise .accuracy-rate span + span {
          margin-left: .5rem; }
  .task-detail-main .task-module {
    padding: 0 0.9rem 0.32rem;
    background: #fff;
    border: 1px solid #DEE5ED;
    border-radius: 0.08rem;
    margin-bottom: 0.24rem; }
  .task-detail-main .module-header {
    position: relative;
    min-height: 1.4rem;
    padding: 0.28rem 0 0.12rem 0;
    border-bottom: 0.01rem dashed #E5E7EB; }
  .task-detail-main .student-img {
    display: inline-block;
    width: 0.8rem;
    height: 0.8rem;
    margin-right: 0.2rem;
    border-radius: 50%;
    background: #eee;
    vertical-align: middle; }
    .task-detail-main .student-img img {
      width: 100%;
      height: 100%;
      border-radius: 50%; }
  .task-detail-main .student-box {
    display: inline-block;
    vertical-align: middle; }
    .task-detail-main .student-box .tag {
      color: #666;
      font-size: 0.24rem; }
  .task-detail-main .student-name {
    font-size: 0.28rem;
    color: #333; }
  .task-detail-main .task-time {
    margin-top: 0.18rem;
    color: #999;
    font-size: 0.24rem;
    line-height: 0.23rem; }
  .task-detail-main .task-grade {
    position: static;
    transform: none;
    width: 2.35rem;
    height: 1.6rem;
    margin-top: -0.3rem;
    margin-right: -0.3rem; }
    .task-detail-main .task-grade.great {
      background: url("../images/task-detail/great.png") no-repeat center;
      background-size: 1.75rem 1rem; }
    .task-detail-main .task-grade.good {
      background: url("../images/task-detail/good.png") no-repeat center;
      background-size: 1.75rem 1rem; }
    .task-detail-main .task-grade.qualified {
      background: url("../images/task-detail/qualified.png") no-repeat center;
      background-size: 1.75rem 1rem; }
    .task-detail-main .task-grade.unqualified {
      background: url("../images/task-detail/unqualified.png") no-repeat center;
      background-size: 1.75rem 1rem; }
  .task-detail-main .task-main {
    margin: 0.23rem 0 0 0;
    color: #333;
    font-size: 0.24rem;
    line-height: 0.36rem;
    word-break: break-all; }
  .task-detail-main .submit-num {
    margin-top: 0.31rem;
    color: #666;
    font-size: 0.24rem; }
  .task-detail-main .show-text {
    margin: 0.39rem 0 0 0;
    color: #333;
    font-size: 0.24rem;
    line-height: 0.36rem;
    word-break: break-all; }
  .task-detail-main .show-img {
    margin-top: 0.23rem; }
    .task-detail-main .show-img li {
      position: relative;
      float: left;
      width: 2.75rem;
      height: 2.75rem;
      margin: 0 0.18rem 0.18rem 0;
      background: #f0f6fb;
      overflow: hidden; }
      .task-detail-main .show-img li:nth-child(4n) {
        margin-right: 0; }
      .task-detail-main .show-img li.loading img {
        width: auto;
        height: auto; }
      .task-detail-main .show-img li.pic-none {
        background: #f0f6fb url("../images/clock-task/pic-none.png") no-repeat center;
        background-size: .78rem .58rem; }
    .task-detail-main .show-img img {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 100%;
      height: 100%;
      object-fit: cover; }
    .task-detail-main .show-img.single-row li {
      width: 6rem;
      height: 4.5rem; }
    .task-detail-main .show-img.single-col li {
      width: 4.2rem;
      height: 5.6rem; }
  .task-detail-main .show-video {
    margin-top: 0.3rem; }
    .task-detail-main .show-video .video-box {
      position: relative;
      width: 4.8rem;
      height: 6.4rem; }
      .task-detail-main .show-video .video-box .video-bg {
        width: 100%;
        height: 100%; }
      .task-detail-main .show-video .video-box .video-btn {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 1.14rem;
        height: 1.14rem;
        background: url("../images/task-detail/video-btn.png") no-repeat center;
        background-size: 1.14rem 1.14rem;
        transform: translate(-50%, -50%); }
  .task-detail-main .click-num {
    display: flex;
    justify-content: flex-end;
    align-items: center; }
    .task-detail-main .click-num img {
      width: 0.28rem;
      height: 0.24rem;
      margin-right: 0.12rem; }
    .task-detail-main .click-num span {
      color: #6C7C93;
      font-size: 0.24rem; }
  .task-detail-main .return-back-wrap {
    display: flex;
    justify-content: space-between; }
  .task-detail-main .assess-box {
    padding: 0 0.26rem;
    margin: 0.29rem 0 0 0;
    background: #F3F7FB;
    border-radius: 0.08rem; }
    .task-detail-main .assess-box .assess-people {
      padding: 0.28rem 0;
      color: #6C7C93;
      font-size: 0.22rem; }
      .task-detail-main .assess-box .assess-people img {
        width: 0.28rem;
        height: 0.24rem;
        margin-right: 0.2rem;
        vertical-align: middle; }
    .task-detail-main .assess-box .assess-text {
      padding: 0.21rem 0 0.17rem 0;
      border-top: 0.01rem dashed #E5E7EB; }
      .task-detail-main .assess-box .assess-text P {
        min-height: 0.4rem;
        line-height: 0.4rem;
        padding: 0 0.08rem;
        margin-bottom: 0.05rem;
        color: #333;
        font-size: 0.22rem;
        border-radius: 0.04rem; }
        .task-detail-main .assess-box .assess-text P .name {
          font-weight: normal;
          color: #6C7C93; }
        .task-detail-main .assess-box .assess-text P.reply {
          background: rgba(54, 143, 255, 0.1); }
          .task-detail-main .assess-box .assess-text P.reply .reply-btn {
            float: right;
            color: #368FFF;
            font-size: 0.2rem; }
          .task-detail-main .assess-box .assess-text P.reply .del-btn {
            float: right;
            color: #FF543A;
            font-size: 0.2rem; }
      .task-detail-main .assess-box .assess-text .comment-input {
        margin: 0.1rem 0 0.15rem 0; }
        .task-detail-main .assess-box .assess-text .comment-input input {
          width: 100%;
          height: 0.56rem;
          padding: 0 0.16rem;
          background: #fff;
          border: 1px solid #DEE5ED;
          border-radius: 0.05rem;
          font-size: 0.22rem; }
          .task-detail-main .assess-box .assess-text .comment-input input::placeholder {
            color: #ccc; }
      .task-detail-main .assess-box .assess-text .title {
        margin-bottom: 0.02rem;
        color: #6C7C93;
        font-weight: bold; }
      .task-detail-main .assess-box .assess-text .comment {
        margin-top: 0.03rem; }
      .task-detail-main .assess-box .assess-text .comment-more {
        display: inline-block;
        margin-bottom: 0.15rem;
        font-size: 0.22rem;
        color: #368FFF; }
    .task-detail-main .assess-box .assess-comment .comment-more {
      display: inline-block;
      margin-bottom: 0.15rem;
      font-size: 0.22rem;
      color: #368FFF; }
  .task-detail-main .calc-ques .answer {
    position: relative;
    padding: 0 5px;
    color: #24C366; }
    .task-detail-main .calc-ques .answer:after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 1px;
      background: #24C366; }
    .task-detail-main .calc-ques .answer.right {
      color: #24C366; }
      .task-detail-main .calc-ques .answer.right:after {
        background: #24C366; }
    .task-detail-main .calc-ques .answer.wrong {
      color: #FF543A; }
      .task-detail-main .calc-ques .answer.wrong:after {
        background: #FF543A; }
  .task-detail-main .submit-none {
    color: #999;
    font-size: 0.24rem; }
  .task-detail-main strong.fraction {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: .56rem;
    line-height: .56rem; }
    .task-detail-main strong.fraction .num {
      position: relative;
      display: inline-block;
      top: -.02rem;
      text-align: center; }
      .task-detail-main strong.fraction .num .top {
        position: relative;
        display: block;
        line-height: .28rem; }
      .task-detail-main strong.fraction .num .bottom {
        position: relative;
        display: block;
        line-height: .28rem; }
        .task-detail-main strong.fraction .num .bottom:before {
          position: absolute;
          content: '';
          top: 0;
          left: 50%;
          transform: translateX(-50%);
          width: 100%;
          min-width: 18px;
          padding: 0 2px;
          height: 2px;
          background: #333; }
  .task-detail-main .calc-table-wrap {
    padding: .42rem 0 .5rem;
    margin-bottom: 0.4rem; }
    .task-detail-main .calc-table-wrap .table-title {
      padding: 0 .5rem;
      margin-bottom: 0.3rem;
      font-size: 0.24rem;
      color: #333; }
    .task-detail-main .calc-table-wrap .correct-table table tr th:last-child {
      text-align: right;
      padding-right: .95rem; }
    .task-detail-main .calc-table-wrap .icon-ZK-PC-tipicon-right {
      font-size: 0.4rem;
      color: #24C366; }
    .task-detail-main .calc-table-wrap .icon-ZK-PC-duihao {
      font-size: 0.5rem;
      color: #24C366; }
    .task-detail-main .calc-table-wrap .icon-ZK-PC-tipicon-wrong {
      font-size: 0.4rem;
      color: #FF543A; }
    .task-detail-main .calc-table-wrap .icon-close {
      font-size: 0.4rem;
      color: #FF543A; }
    .task-detail-main .calc-table-wrap .correct-table table tr td.nest-table {
      padding: 0; }
      .task-detail-main .calc-table-wrap .correct-table table tr td.nest-table .tips {
        color: #6C7C93;
        font-size: 0.24rem; }
      .task-detail-main .calc-table-wrap .correct-table table tr td.nest-table td {
        border-bottom: 0; }
    .task-detail-main .calc-table-wrap .multi-ques {
      padding: 0.2rem 0; }
      .task-detail-main .calc-table-wrap .multi-ques p {
        line-height: normal; }
      .task-detail-main .calc-table-wrap .multi-ques .ques-choose {
        line-height: normal; }
        .task-detail-main .calc-table-wrap .multi-ques .ques-choose > span {
          display: inline-block;
          vertical-align: middle; }
        .task-detail-main .calc-table-wrap .multi-ques .ques-choose .icon-ZK-PC-duihao {
          margin-right: 0.6rem;
          font-size: 0.4rem;
          color: #333; }
        .task-detail-main .calc-table-wrap .multi-ques .ques-choose .icon-close {
          font-size: 0.26rem;
          color: #333; }
        .task-detail-main .calc-table-wrap .multi-ques .ques-choose .iconfont.wrong {
          color: #FF543A; }
        .task-detail-main .calc-table-wrap .multi-ques .ques-choose .iconfont.right {
          color: #24C366; }
        .task-detail-main .calc-table-wrap .multi-ques .ques-choose .right {
          color: #24C366; }
          .task-detail-main .calc-table-wrap .multi-ques .ques-choose .right .icon-ZK-PC-duihao {
            color: #24C366; }
          .task-detail-main .calc-table-wrap .multi-ques .ques-choose .right .icon-close {
            color: #24C366; }
        .task-detail-main .calc-table-wrap .multi-ques .ques-choose .wrong {
          color: #FF543A; }
          .task-detail-main .calc-table-wrap .multi-ques .ques-choose .wrong .icon-ZK-PC-duihao {
            color: #FF543A; }
          .task-detail-main .calc-table-wrap .multi-ques .ques-choose .wrong .icon-close {
            color: #FF543A; }
      .task-detail-main .calc-table-wrap .multi-ques.select-ques .ques-choose {
        font-size: 0; }
        .task-detail-main .calc-table-wrap .multi-ques.select-ques .ques-choose > span {
          width: 50%;
          line-height: 0.44rem;
          font-size: 0.26rem; }
        .task-detail-main .calc-table-wrap .multi-ques.select-ques .ques-choose .iconfont.wrong {
          color: #FF543A; }
        .task-detail-main .calc-table-wrap .multi-ques.select-ques .ques-choose .iconfont.right {
          color: #24C366; }
  .task-detail-main .comment-dialog-wrap {
    position: relative; }
    .task-detail-main .comment-dialog-wrap .btn-style .iconfont {
      top: 0; }
    .task-detail-main .comment-dialog-wrap .comment-dialog {
      position: absolute;
      top: 0.8rem;
      right: -0.32rem;
      z-index: 100;
      width: 6rem;
      height: 4.45rem;
      padding: 0.4rem 0.32rem 0.24rem;
      background: #fff;
      border: 1px solid #DEE5ED;
      box-shadow: 0 0 0.15rem 0 rgba(0, 0, 0, 0.18);
      border-radius: 0.08rem;
      box-sizing: border-box; }
      .task-detail-main .comment-dialog-wrap .comment-dialog:after {
        content: '';
        position: absolute;
        top: -0.2rem;
        right: 0.96rem;
        width: 0;
        height: 0;
        border: 0.1rem solid transparent;
        border-bottom-color: #fff; }
      .task-detail-main .comment-dialog-wrap .comment-dialog:before {
        content: '';
        position: absolute;
        top: -0.22rem;
        right: 0.95rem;
        width: 0;
        height: 0;
        border: 0.11rem solid transparent;
        border-bottom-color: #DEE5ED; }
      .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list {
        font-size: 0;
        margin-right: -0.82rem; }
        .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li {
          display: inline-block;
          width: 0.8rem;
          margin: 0 0.72rem 0 0;
          font-size: 0.18rem;
          text-align: center;
          text-align: center; }
          .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li .comment-icons {
            display: inline-block;
            width: 0.72rem;
            height: 0.72rem;
            transition: background 0.2s; }
            .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li .comment-icons.great-icon {
              background: url("../images/task-detail/great-icon.png") no-repeat center;
              background-size: 100% 100%; }
            .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li .comment-icons.good-icon {
              background: url("../images/task-detail/good-icon.png") no-repeat center;
              background-size: 100% 100%; }
            .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li .comment-icons.qualified-icon {
              background: url("../images/task-detail/qualified-icon.png") no-repeat center;
              background-size: 100% 100%; }
            .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li .comment-icons.unqualified-icon {
              background: url("../images/task-detail/unqualified-icon.png") no-repeat center;
              background-size: 100% 100%; }
          .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li a {
            color: #999; }
          .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li.active a, .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li:hover a {
            color: #333; }
          .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li.active .comment-icons.great-icon, .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li:hover .comment-icons.great-icon {
            background: url("../images/task-detail/great-active.png") no-repeat center;
            background-size: 100% 100%; }
          .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li.active .comment-icons.good-icon, .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li:hover .comment-icons.good-icon {
            background: url("../images/task-detail/good-active.png") no-repeat center;
            background-size: 100% 100%; }
          .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li.active .comment-icons.qualified-icon, .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li:hover .comment-icons.qualified-icon {
            background: url("../images/task-detail/qualified-active.png") no-repeat center;
            background-size: 100% 100%; }
          .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li.active .comment-icons.unqualified-icon, .task-detail-main .comment-dialog-wrap .comment-dialog .comment-btn-list li:hover .comment-icons.unqualified-icon {
            background: url("../images/task-detail/unqualified-active.png") no-repeat center;
            background-size: 100% 100%; }
      .task-detail-main .comment-dialog-wrap .comment-dialog .mark-check {
        margin: 0.4rem 0 0.16rem 0; }
        .task-detail-main .comment-dialog-wrap .comment-dialog .mark-check .checkbox-wrap label {
          color: #666; }
          .task-detail-main .comment-dialog-wrap .comment-dialog .mark-check .checkbox-wrap label em {
            color: #999;
            font-size: 0.18rem; }
        .task-detail-main .comment-dialog-wrap .comment-dialog .mark-check .checkbox-wrap .iconfont {
          font-size: 0.36rem; }
        .task-detail-main .comment-dialog-wrap .comment-dialog .mark-check .checkbox-wrap:hover label {
          color: #368FFF; }
      .task-detail-main .comment-dialog-wrap .comment-dialog .comment-textarea textarea {
        width: 100%;
        height: 1.2rem;
        padding: 0.1rem 0.16rem;
        background: #fff;
        border: 1px solid #ccc;
        border-radius: 0.04rem;
        font-size: 0.2rem; }
        .task-detail-main .comment-dialog-wrap .comment-dialog .comment-textarea textarea::placeholder {
          color: #ccc; }
      .task-detail-main .comment-dialog-wrap .comment-dialog .comment-dialog-btn {
        margin-top: 0.2rem; }
        .task-detail-main .comment-dialog-wrap .comment-dialog .comment-dialog-btn .normal {
          min-width: 1.28rem;
          margin-left: 0.24rem; }
    .task-detail-main .comment-dialog-wrap.second-comment {
      display: none;
      position: absolute;
      top: 0.75rem;
      right: -0.3rem; }
      .task-detail-main .comment-dialog-wrap.second-comment .medium {
        min-width: auto;
        width: 0.56rem;
        padding: 0;
        background: #fff;
        border-radius: 50%;
        border-color: #DEE5ED; }
        .task-detail-main .comment-dialog-wrap.second-comment .medium .iconfont {
          margin: 0;
          color: #DEE5ED; }
        .task-detail-main .comment-dialog-wrap.second-comment .medium:hover {
          border-color: #368FFF; }
          .task-detail-main .comment-dialog-wrap.second-comment .medium:hover .iconfont {
            color: #368FFF; }
        .task-detail-main .comment-dialog-wrap.second-comment .medium:active {
          background: #E1EEFF;
          border-color: #368FFF; }
          .task-detail-main .comment-dialog-wrap.second-comment .medium:active .iconfont {
            color: #368FFF; }
      .task-detail-main .comment-dialog-wrap.second-comment .comment-dialog {
        right: -0.82rem; }

.task-grade {
  cursor: pointer; }

.task-grade:hover .second-comment {
  display: inline-block; }

.calc-ques .tea-fill-blank {
  position: relative;
  display: inline-block;
  min-width: 1.2rem;
  height: .56rem;
  line-height: .56rem;
  padding: 0 .1rem;
  margin: 0.1rem 0.08rem;
  background: #fff;
  border: 1px solid #DEE5ED;
  border-radius: .04rem;
  text-align: center;
  font-size: .26rem;
  color: #24C366; }
  .calc-ques .tea-fill-blank strong.fraction {
    display: block; }
    .calc-ques .tea-fill-blank strong.fraction .before {
      display: inline-block;
      vertical-align: middle; }
    .calc-ques .tea-fill-blank strong.fraction .num {
      vertical-align: middle; }
      .calc-ques .tea-fill-blank strong.fraction .num .bottom:before {
        background: #24C366; }

.select-wrap {
  position: relative;
  /*select{
    width: px2rem(390px);
    height: px2rem(62px);
    padding: 0 px2rem(30px);
    border: px2rem(1px) solid #D8DEDF;
    border-radius: px2rem(4px);
    color: #333;
    font-size: px2rem(24px);
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    outline: none;
    &:focus{
      border: px2rem(1px) solid #368FFF;
    }
  }*/ }
  .select-wrap .select-active {
    width: 3.9rem;
    height: 0.62rem;
    padding: 0 0.4rem 0 0.2rem;
    border: 0.01rem solid #DEE5ED;
    border-radius: 0.04rem;
    color: #333;
    font-size: 0.24rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }
    .select-wrap .select-active::placeholder {
      color: #333;
      font-size: 0.24rem; }
    .select-wrap .select-active[disabled] {
      background: #F4F7F8;
      color: #999; }
  .select-wrap .select-btn {
    position: absolute;
    top: 0.18rem;
    right: 0.2rem;
    font-size: 0.3rem;
    color: #7C91A8;
    transform: rotate(360deg);
    transition: 0.2s all; }
    .select-wrap .select-btn.down {
      transform: rotate(180deg); }
  .select-wrap .select-list {
    position: absolute;
    top: 0.72rem;
    left: 0;
    z-index: 10;
    width: 100%;
    padding: 0.16rem 0;
    background: #fff;
    border: 1px solid #DEE5ED;
    box-shadow: 0 0 0.08rem 0 rgba(0, 0, 0, 0.14);
    border-radius: 0.04rem; }
    .select-wrap .select-list li {
      height: 0.56rem;
      line-height: 0.56rem;
      padding: 0 0.24rem 0 0.24rem;
      font-size: 0.24rem;
      color: #666;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      cursor: pointer; }
      .select-wrap .select-list li:last-child {
        border-bottom: 0; }
      .select-wrap .select-list li:hover {
        background: #EFF3F7; }
      .select-wrap .select-list li.active {
        background: #EFF3F7;
        color: #368FFF;
        border-bottom: 0; }

.pic-wrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8); }
  .pic-wrap .pic-close {
    display: inline-block;
    position: absolute;
    top: 0.32rem;
    right: 0.32rem;
    width: 0.5rem;
    height: 0.5rem;
    background: url("../images/task-detail/close.png") no-repeat center;
    background-size: 0.5rem 0.5rem; }
  .pic-wrap .pic-box {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }
    .pic-wrap .pic-box .pic-list {
      position: relative;
      width: 15.24rem;
      height: 8.78rem;
      overflow: hidden; }
      .pic-wrap .pic-box .pic-list ul {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -40%);
        height: 100%; }
      .pic-wrap .pic-box .pic-list li {
        float: left;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 10.24rem;
        height: 6.78rem; }
        .pic-wrap .pic-box .pic-list li img {
          max-width: 100%;
          max-height: 100%; }
        .pic-wrap .pic-box .pic-list li .pic-none {
          width: 4.6rem;
          height: 4.6rem;
          background: #f0f6fb url("../images/task-detail/pic-none.png") no-repeat center;
          background-size: 1.46rem 1.1rem; }
        .pic-wrap .pic-box .pic-list li .loading {
          position: relative;
          width: 4.6rem;
          height: 4.6rem;
          background: #f0f6fb; }
          .pic-wrap .pic-box .pic-list li .loading img {
            position: absolute;
            top: 50%;
            left: 50%;
            width: 0.64rem;
            height: 0.64rem;
            animation: rotate 1.5s linear infinite; }
    .pic-wrap .pic-box .next,
    .pic-wrap .pic-box .prev {
      position: absolute;
      display: inline-block;
      top: 50%;
      width: 0.72rem;
      height: 0.72rem;
      line-height: 0.72rem;
      margin: -0.44rem 0 0 0;
      background: rgba(0, 0, 0, 0.15);
      border-radius: 50%;
      text-align: center; }
      .pic-wrap .pic-box .next .iconfont,
      .pic-wrap .pic-box .prev .iconfont {
        color: #fff; }
      .pic-wrap .pic-box .next.dis,
      .pic-wrap .pic-box .prev.dis {
        opacity: 0.5; }
        .pic-wrap .pic-box .next.dis:hover,
        .pic-wrap .pic-box .prev.dis:hover {
          background: rgba(0, 0, 0, 0.15); }
      .pic-wrap .pic-box .next:hover,
      .pic-wrap .pic-box .prev:hover {
        background: rgba(0, 0, 0, 0.2); }
    .pic-wrap .pic-box .prev {
      left: -1.08rem; }
    .pic-wrap .pic-box .next {
      right: -1.08rem; }
  .pic-wrap .close-left,
  .pic-wrap .close-right {
    position: absolute;
    bottom: 0;
    width: 0.88rem;
    height: 0.78rem;
    padding-top: 0.08rem;
    background: #F7F8FC;
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2);
    text-align: center;
    box-sizing: border-box;
    cursor: pointer; }
    .pic-wrap .close-left .iconfont,
    .pic-wrap .close-right .iconfont {
      color: #888D97;
      font-size: 0.36rem; }
    .pic-wrap .close-left p,
    .pic-wrap .close-right p {
      font-size: 0.14rem;
      color: #888D97; }
  .pic-wrap .close-left {
    left: 0;
    border-radius: 0 0.12rem 0 0; }
  .pic-wrap .close-right {
    right: 0;
    border-radius: 0.12rem 0 0 0; }
  .pic-wrap .paper-operate {
    position: absolute;
    bottom: 0.25rem;
    left: 50%;
    transform: translate(-50%, 0);
    padding: 0.1rem 0.24rem;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 0.28rem;
    font-size: 0;
    z-index: 1; }
    .pic-wrap .paper-operate a {
      display: inline-block; }
      .pic-wrap .paper-operate a .operate-icons {
        display: inline-block;
        width: 0.32rem;
        height: 0.32rem; }
        .pic-wrap .paper-operate a .operate-icons.fangda-icon {
          margin-right: 0.24rem;
          background: url("../images/task-detail/fangda-icon.png") no-repeat center;
          background-size: 100%; }
        .pic-wrap .paper-operate a .operate-icons.suoxiao-icon {
          background: url("../images/task-detail/suoxiao-icon.png") no-repeat center;
          background-size: 100%; }
        .pic-wrap .paper-operate a .operate-icons.down-icon {
          margin-right: 0.24rem;
          background: url("../images/task-detail/img_down.png") no-repeat center;
          background-size: 100%; }
        .pic-wrap .paper-operate a .operate-icons.rotate-icon {
          background: url("../images/task-detail/rotate.png") no-repeat center;
          background-size: 100%; }
    .pic-wrap .paper-operate .line {
      display: inline-block;
      width: 1px;
      height: 0.32rem;
      margin: 0 0.18rem;
      background: rgba(255, 255, 255, 0.1); }
  .pic-wrap .pic-name {
    position: absolute;
    top: 0;
    left: 0;
    height: 0.6rem;
    padding: 0 0.45rem 0 0.24rem;
    line-height: 0.6rem;
    background: rgba(0, 0, 0, 0.2);
    color: #fff;
    font-size: 0.24rem; }

.custom-play {
  display: flex;
  align-items: center;
  width: 2.81rem;
  height: 0.64rem;
  line-height: 0.64rem;
  font-size: 0.24rem;
  color: #fff;
  background: url("../images/task-detail/bg-voice.png") no-repeat center;
  background-size: 100% 100%; }
  .custom-play.long {
    width: 6.51rem;
    background: url("../images/task-detail/bg-voice2.png") no-repeat center;
    background-size: 100% 100%; }
  .custom-play i {
    display: inline-block;
    width: 0.32rem;
    height: 0.32rem;
    margin: 0 0.15rem 0 0.32rem;
    background: url("../images/task-detail/voice-icon3.png") no-repeat center;
    background-size: 0.32rem 0.32rem;
    vertical-align: middle; }
  .custom-play.active i {
    animation: voice 1.5s infinite;
    -webkit-animation: voice 1.5s infinite; }

.show-img li {
  position: relative;
  float: left;
  width: 1.2rem;
  height: 1.2rem;
  margin: 0.18rem 0.18rem 0 0;
  overflow: hidden; }
  .show-img li:nth-child(4n) {
    margin-right: 0; }
.show-img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  object-fit: cover; }

@-webkit-keyframes play {
  0% {
    background: url("../images/task-detail/play2.png") no-repeat center;
    background-size: 0.24rem 0.2rem; }
  50% {
    background: url("../images/task-detail/play1.png") no-repeat center;
    background-size: 0.24rem 0.2rem; }
  100% {
    background: url("../images/task-detail/play.png") no-repeat center;
    background-size: 0.24rem 0.2rem; } }
@-webkit-keyframes voice {
  0% {
    background: url("../images/task-detail/voice-icon1.png") no-repeat center;
    background-size: 0.32rem 0.32rem; }
  50% {
    background: url("../images/task-detail/voice-icon2.png") no-repeat center;
    background-size: 0.32rem 0.32rem; }
  100% {
    background: url("../images/task-detail/voice-icon3.png") no-repeat center;
    background-size: 0.32rem 0.32rem; } }
.eui-progress {
  position: relative;
  display: block;
  width: 100%; }
  .eui-progress .eui-progress-bar {
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    vertical-align: middle;
    white-space: nowrap; }
    .eui-progress .eui-progress-bar.has-txt {
      margin: 0 -1.5rem 0 -1.4rem;
      padding: 0 1.5rem 0 1.5rem; }
  .eui-progress .eui-progress-outer {
    display: inline-block;
    position: relative;
    width: 100%;
    height: 0.1rem;
    background: rgba(124, 145, 168, 0.16);
    vertical-align: middle;
    overflow: hidden;
    border-radius: 0.05rem; }
  .eui-progress .eui-progress-inner {
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
    line-height: 1;
    text-align: right;
    white-space: nowrap;
    background: #368FFF;
    transition: width .3s ease-in;
    border-radius: 0.05rem; }
  .eui-progress .eui-progress-num {
    display: inline-block;
    width: 1.4rem;
    padding-right: 0.24rem;
    line-height: 1;
    font-size: 0.24rem;
    color: #333;
    text-align: right;
    vertical-align: middle;
    font-family: 'Microsoft YaHei' !important; }
  .eui-progress .eui-progress-text {
    display: inline-block;
    width: 1.5rem;
    padding-left: 0.1rem;
    padding-right: 0.35rem;
    line-height: 1;
    font-size: 0.24rem;
    color: #333;
    text-align: left;
    vertical-align: middle;
    font-family: 'Microsoft YaHei' !important; }
  .eui-progress.error .eui-progress-inner {
    background: #FF543A; }

.answer-que-list {
  padding: 0.2rem 0 0; }
  .answer-que-list li .eui-progress {
    display: flex;
    align-items: center;
    height: 0.8rem; }
    .answer-que-list li .eui-progress .eui-progress-text {
      position: relative; }
      .answer-que-list li .eui-progress .eui-progress-text:before {
        position: absolute;
        content: "\e77a";
        top: 0;
        right: 0.15rem;
        font-size: 0.24rem;
        color: #7C91A8;
        font-family: "iconfont" !important; }
  .answer-que-list li:hover {
    background: #F0F9FF; }
    .answer-que-list li:hover .eui-progress .eui-progress-text:before {
      color: #368FFF; }

.answer-que-num {
  display: flex;
  flex-wrap: wrap;
  margin-left: 0.32rem; }
  .answer-que-num li {
    position: relative;
    margin: 0.4rem 0.32rem 0 0; }
    .answer-que-num li a {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 1rem;
      height: 1rem;
      background: rgba(36, 195, 102, 0.1);
      border-radius: 50%;
      font-size: 0.26rem;
      color: #333; }
      .answer-que-num li a:hover {
        border: 1px solid #24C366;
        color: #24C366; }
    .answer-que-num li .correct {
      position: absolute;
      right: -0.03rem;
      top: 0;
      display: inline-block;
      width: 0.34rem;
      height: 0.34rem;
      line-height: 0.32rem;
      background: #ff543a;
      border-radius: 50%;
      font-size: 0.2rem;
      color: #fff;
      text-align: center; }
    .answer-que-num li .correct-red {
      position: absolute;
      right: -0.03rem;
      top: 0;
      display: inline-block;
      width: 0.32rem;
      height: 0.32rem;
      line-height: 0.3rem;
      background: #fff;
      border: 1px solid #FF543A;
      border-radius: 50%;
      font-size: 0.2rem;
      color: #FF543A;
      text-align: center; }
    .answer-que-num li .correct-gray {
      position: absolute;
      left: 0.5rem;
      top: 0;
      display: inline-block;
      height: 0.32rem;
      line-height: 0.3rem;
      background: #ccc;
      border-radius: 0.16rem;
      font-size: 0.2rem;
      color: #fff;
      text-align: center; }
      .answer-que-num li .correct-gray.big {
        width: 0.72rem; }
      .answer-que-num li .correct-gray.normal {
        width: 0.64rem; }
    .answer-que-num li.red a {
      background: rgba(255, 84, 58, 0.1); }
      .answer-que-num li.red a:hover {
        border: 1px solid #FF543A;
        color: #FF543A; }
    .answer-que-num li.yellow a {
      background: rgba(255, 174, 0, 0.1); }
      .answer-que-num li.yellow a:hover {
        border: 1px solid #FFAE00;
        color: #FFAE00; }
    .answer-que-num li.gray a {
      background: #fff;
      border: 1px solid #D8DEDF; }
      .answer-que-num li.gray a:hover {
        color: #333;
        border-color: #666; }
    .answer-que-num li.not-do a {
      position: relative;
      background: #EFF3F7;
      border: 1px solid #D8DEDF;
      color: #999; }
      .answer-que-num li.not-do a:hover {
        color: #999; }
      .answer-que-num li.not-do a:after {
        position: absolute;
        content: '';
        top: 0.48rem;
        left: 0.26rem;
        width: 0.48rem;
        height: 0.02rem;
        background: #999; }

.task-detail-main-new {
  position: relative;
  flex-grow: 1;
  height: 100%;
  margin-left: -0.44rem;
  padding-top: 0.9rem;
  overflow-x: hidden; }

.task-detail-breadcrumb {
  position: fixed;
  z-index: 10;
  left: 25%;
  top: 0;
  width: 75%;
  display: flex;
  align-items: center;
  height: 0.9rem;
  line-height: 0.9rem;
  padding: 0 0.48rem;
  background-color: #fff;
  box-shadow: 0 0 0.05rem rgba(0, 0, 0, 0.1);
  font-size: 0.28rem;
  font-weight: bold;
  color: #333; }
  .task-detail-breadcrumb .iconfont {
    color: #8794A8;
    margin: 0.04rem 0.08rem 0 -0.07rem; }
  .task-detail-breadcrumb .tag {
    color: #666;
    font-size: 0.24rem; }

.task-detail-exercise {
  height: 100%;
  padding: 0.32rem 0.5rem 0;
  overflow-y: auto; }
  .task-detail-exercise .info {
    position: absolute;
    right: 0;
    top: 0.3rem;
    font-size: 0.22rem;
    color: #999; }
    .task-detail-exercise .info span + span {
      margin-left: 0.2rem; }
    .task-detail-exercise .info .iconfont {
      font-size: 0.22rem;
      color: #ccc;
      margin-right: 0.05rem; }
      .task-detail-exercise .info .iconfont.icon-zk-hd-poptip-success {
        font-size: 0.2rem; }
  .task-detail-exercise .module {
    padding: 0 0.5rem;
    margin-bottom: 0.24rem;
    background: #fff;
    border-radius: 0.08rem;
    border: 1px solid #DEE5ED; }
    .task-detail-exercise .module .type i {
      display: inline-block;
      vertical-align: 0.01rem;
      padding: 0 0.12rem;
      margin-left: 0.15rem;
      height: 0.32rem;
      line-height: 0.3rem;
      background: rgba(204, 204, 204, 0.3);
      border-radius: 0.04rem;
      font-size: 0.2rem;
      color: #666; }
    .task-detail-exercise .module .exercise-box strong.fraction .num .bottom:before {
      background: #24C366; }
    .task-detail-exercise .module .completion-cont li i {
      color: #24C366; }
      .task-detail-exercise .module .completion-cont li i.active, .task-detail-exercise .module .completion-cont li i.blue {
        color: #368FFF; }
        .task-detail-exercise .module .completion-cont li i.active .bottom:before, .task-detail-exercise .module .completion-cont li i.blue .bottom:before {
          background: #368FFF !important; }
      .task-detail-exercise .module .completion-cont li i.right {
        color: #24C366; }
      .task-detail-exercise .module .completion-cont li i.wrong {
        color: #FF543A; }
    .task-detail-exercise .module .exercise-box {
      padding: 0;
      border: 0;
      box-shadow: none;
      border-top: 1px solid #D8DEDF; }
      .task-detail-exercise .module .exercise-box:first-child {
        border-top: 0; }
    .task-detail-exercise .module .answer .blue {
      color: #368FFF; }
    .task-detail-exercise .module .answer .right {
      color: #24C366; }
    .task-detail-exercise .module .answer .wrong {
      color: #FF543A; }
    .task-detail-exercise .module .exercise-answer-box {
      padding: 0 0 0.5rem; }
      .task-detail-exercise .module .exercise-answer-box .tit {
        font-size: 0.22rem;
        margin-bottom: -0.1rem;
        color: #999; }
        .task-detail-exercise .module .exercise-answer-box .tit em {
          display: inline-block;
          vertical-align: middle;
          width: 0.56rem;
          height: 0.28rem;
          line-height: 0.28rem;
          margin-top: -0.02rem;
          margin-left: 0.1rem;
          text-align: center;
          border-radius: 0.02rem;
          font-size: 0.18rem; }
        .task-detail-exercise .module .exercise-answer-box .tit .right {
          background: rgba(36, 195, 102, 0.2);
          color: #24C366; }
        .task-detail-exercise .module .exercise-answer-box .tit .wrong {
          background: rgba(255, 84, 58, 0.2);
          color: #FF543A; }
        .task-detail-exercise .module .exercise-answer-box .tit .half-right {
          background: rgba(255, 174, 0, 0.2);
          color: #FFAE00; }
      .task-detail-exercise .module .exercise-answer-box .answer-list li {
        margin-top: 0.3rem;
        font-size: 0.24rem;
        color: #333; }
        .task-detail-exercise .module .exercise-answer-box .answer-list li .answer-situation {
          display: flex;
          justify-content: space-between;
          align-items: center;
          width: 100%;
          height: 0.88rem;
          border: 1px solid #D8DEDF;
          border-radius: 0.1rem; }
          .task-detail-exercise .module .exercise-answer-box .answer-list li .answer-situation > div {
            display: flex;
            align-items: center;
            height: 0.88rem;
            line-height: 0.88rem; }
          .task-detail-exercise .module .exercise-answer-box .answer-list li .answer-situation .answer {
            position: relative;
            display: inline-block;
            width: 0.8rem;
            height: 0.88rem;
            text-align: center; }
            .task-detail-exercise .module .exercise-answer-box .answer-list li .answer-situation .answer:after {
              position: absolute;
              right: 0.01rem;
              top: 0.29rem;
              content: '';
              width: 1px;
              height: 0.3rem;
              background: #D8DEDF; }
            .task-detail-exercise .module .exercise-answer-box .answer-list li .answer-situation .answer .icon-ZK-PC-duihao {
              font-size: 0.44rem; }
          .task-detail-exercise .module .exercise-answer-box .answer-list li .answer-situation .num {
            display: inline-block;
            height: 0.88rem;
            padding-left: 0.28rem; }
          .task-detail-exercise .module .exercise-answer-box .answer-list li .answer-situation .iconfont {
            display: inline-block;
            height: 0.88rem;
            line-height: 0.88rem;
            padding: 0 0.2rem;
            cursor: pointer; }
        .task-detail-exercise .module .exercise-answer-box .answer-list li .answer-name {
          display: none;
          position: relative;
          width: 100%;
          padding: 0.2rem 0.15rem;
          line-height: 0.4rem;
          margin-top: 0.2rem;
          background: #F3F7FB;
          border-radius: 0.1rem; }
          .task-detail-exercise .module .exercise-answer-box .answer-list li .answer-name:before {
            position: absolute;
            right: 0.45rem;
            top: -0.1rem;
            content: '';
            width: 0;
            height: 0;
            vertical-align: middle;
            border-left: 0.1rem solid transparent;
            border-right: 0.1rem solid transparent;
            border-bottom: 0.1rem solid #F3F7FB; }
          .task-detail-exercise .module .exercise-answer-box .answer-list li .answer-name span {
            display: inline-block;
            padding: 0 0.12rem; }
        .task-detail-exercise .module .exercise-answer-box .answer-list li.right .answer-situation {
          border: 1px solid #24C366;
          transition: all .3s; }
          .task-detail-exercise .module .exercise-answer-box .answer-list li.right .answer-situation .answer {
            background: rgba(36, 195, 102, 0.6);
            border-radius: 0.1rem 0 0 0.1rem;
            color: #fff; }
            .task-detail-exercise .module .exercise-answer-box .answer-list li.right .answer-situation .answer:after {
              width: 0; }
        .task-detail-exercise .module .exercise-answer-box .answer-list li.active .answer-situation > .iconfont {
          transition: transform .3s;
          transform: rotateZ(180deg); }
        .task-detail-exercise .module .exercise-answer-box .answer-list li.active .answer-name {
          display: block;
          transition: all .3s; }
        .task-detail-exercise .module .exercise-answer-box .answer-list li:first-child {
          margin-top: 0.28rem; }
      .task-detail-exercise .module .exercise-answer-box .answer-correct-list {
        background: #F3F7FB;
        border-radius: 0.1rem;
        padding: 0.28rem 0.3rem; }
        .task-detail-exercise .module .exercise-answer-box .answer-correct-list li {
          width: 100%;
          margin-top: 0.28rem;
          /*line-height: px2rem(48px);*/
          font-size: 0.26rem;
          color: #333; }
          .task-detail-exercise .module .exercise-answer-box .answer-correct-list li .tit {
            font-size: 0.22rem;
            color: #999; }
            .task-detail-exercise .module .exercise-answer-box .answer-correct-list li .tit .iconfont {
              display: inline-block;
              vertical-align: middle;
              margin: -0.02rem 0 0 0.1rem; }
            .task-detail-exercise .module .exercise-answer-box .answer-correct-list li .tit.active .iconfont:before {
              content: "\e77b"; }
          .task-detail-exercise .module .exercise-answer-box .answer-correct-list li .txt {
            position: relative;
            display: flex;
            align-items: center;
            line-height: normal;
            margin-top: 0.12rem; }
            .task-detail-exercise .module .exercise-answer-box .answer-correct-list li .txt > em {
              display: contents;
              color: #6C7C93;
              font-size: 0.26rem; }
          .task-detail-exercise .module .exercise-answer-box .answer-correct-list li strong.fraction {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            height: 0.56rem;
            line-height: 0.56rem; }
            .task-detail-exercise .module .exercise-answer-box .answer-correct-list li strong.fraction .num {
              position: relative;
              display: inline-block;
              top: -0.02rem;
              text-align: center; }
              .task-detail-exercise .module .exercise-answer-box .answer-correct-list li strong.fraction .num .top,
              .task-detail-exercise .module .exercise-answer-box .answer-correct-list li strong.fraction .num .bottom {
                position: relative;
                display: block;
                line-height: 0.28rem; }
              .task-detail-exercise .module .exercise-answer-box .answer-correct-list li strong.fraction .num .bottom:before {
                position: absolute;
                content: '';
                top: 0;
                left: 50%;
                transform: translateX(-50%);
                width: 100%;
                min-width: 18px;
                padding: 0 2px;
                height: 2px;
                background: #333; }
          .task-detail-exercise .module .exercise-answer-box .answer-correct-list li .icon-ZK-PC-duihao {
            font-size: 0.44rem; }
          .task-detail-exercise .module .exercise-answer-box .answer-correct-list li:first-child {
            margin-top: 0; }
        .task-detail-exercise .module .exercise-answer-box .answer-correct-list.class-detail-list {
          margin-top: 0.24rem; }
  .task-detail-exercise.task-detail-new-style .module .type {
    font-size: .24rem;
    font-weight: bold;
    color: #333; }
  .task-detail-exercise.task-detail-new-style .module .exercise-answer-box {
    padding: 0 0 0.5rem;
    border-top: 0; }

.module-load {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 0.7rem;
  font-size: 0.24rem;
  color: #666;
  background: #fff;
  border-radius: 0.08rem; }
  .module-load.no-data {
    margin-top: -0.2rem;
    background: transparent; }
  .module-load span {
    position: relative;
    font-size: 0.24rem;
    color: #999;
    cursor: default; }
    .module-load span.iconfont {
      color: #666;
      cursor: pointer; }
      .module-load span.iconfont:before {
        position: absolute;
        left: -0.3rem;
        top: 56%;
        transform: translateY(-50%);
        content: "\e941";
        font-size: 0.2rem;
        color: #666; }
    .module-load span.loading:before {
      position: absolute;
      left: -0.35rem;
      top: 50%;
      content: '';
      margin-top: -0.12rem;
      width: 0.24rem;
      height: 0.24rem;
      background: url("../images/task-detail/loading-s.png") no-repeat;
      background-size: 0.24rem 0.24rem;
      animation: rotate 1.5s linear infinite; }
  .module-load:hover span.iconfont {
    color: #368FFF; }
    .module-load:hover span.iconfont:before {
      color: #368FFF; }

.task-exercise-correct {
  padding: 0.32rem 0.5rem 0.4rem;
  height: 100%; }
  .task-exercise-correct .module {
    height: 100%;
    padding: 0.5rem 0;
    background: #fff;
    border-radius: 0.1rem; }
  .task-exercise-correct .correct-table {
    height: 100%;
    padding: 0 0.5rem;
    overflow-y: auto; }
    .task-exercise-correct .correct-table table {
      width: 100%;
      font-size: 0.24rem;
      color: #666; }
      .task-exercise-correct .correct-table table tr th, .task-exercise-correct .correct-table table tr td {
        width: 20%;
        line-height: 0.64rem;
        text-align: right;
        border-bottom: 1px solid #DEE5ED; }
        .task-exercise-correct .correct-table table tr th:first-child, .task-exercise-correct .correct-table table tr td:first-child {
          padding-left: 0.8rem;
          text-align: left; }
        .task-exercise-correct .correct-table table tr th:nth-child(2), .task-exercise-correct .correct-table table tr td:nth-child(2) {
          width: 18%; }
        .task-exercise-correct .correct-table table tr th:last-child, .task-exercise-correct .correct-table table tr td:last-child {
          width: 42%; }
      .task-exercise-correct .correct-table table tr th {
        background: #F8F8F8;
        color: #333;
        border-top: 1px solid #DEE5ED; }
        .task-exercise-correct .correct-table table tr th:last-child {
          text-align: center; }
      .task-exercise-correct .correct-table table tr td:last-child {
        padding-right: 0.95rem; }
      .task-exercise-correct .correct-table table tr .icon-ZK-PC-arrow-left {
        padding-left: 0.9rem;
        font-size: 0.4rem;
        color: #8794A8;
        vertical-align: middle; }
        .task-exercise-correct .correct-table table tr .icon-ZK-PC-arrow-left:hover {
          color: #368FFF; }
      .task-exercise-correct .correct-table table tr:hover {
        background: #F0F9FF; }

.show-video .video-box {
  position: relative;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6); }
  .show-video .video-box .video-operate-box {
    position: absolute;
    left: 3rem;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: calc(100% - 6rem);
    height: 0.96rem;
    background: rgba(243, 247, 251, 0.8);
    font-size: 0.24rem;
    color: #333;
    display: none;
    opacity: 0;
    transition: opacity 0.25s; }
    .show-video .video-box .video-operate-box .left {
      display: flex;
      align-items: center;
      padding: 0 0.46rem;
      flex-grow: 1; }
    .show-video .video-box .video-operate-box .icon {
      display: flex;
      cursor: pointer; }
      .show-video .video-box .video-operate-box .icon.play {
        width: 0.4rem;
        height: 0.46rem;
        background: url(../images/task-detail/zk-play.png) no-repeat;
        background-size: 100% 100%; }
      .show-video .video-box .video-operate-box .icon.pause {
        width: 0.4rem;
        height: 0.52rem;
        background: url(../images/task-detail/zk-pause.png) no-repeat left center;
        background-size: 0.32rem 0.52rem; }
    .show-video .video-box .video-operate-box .time {
      display: flex;
      margin-left: 0.4rem; }
    .show-video .video-box .video-operate-box .video-pro-wrap {
      display: flex;
      flex-grow: 1;
      align-items: center;
      height: 0.4rem;
      line-height: 0.4rem;
      margin-left: 0.24rem; }
      .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer {
        position: relative;
        width: 100%;
        height: 0.12rem;
        background-color: rgba(0, 0, 0, 0.2);
        border-radius: 0.06rem; }
        .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer.vm {
          display: inline-block;
          vertical-align: middle; }
        .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer .video-process-inner {
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0;
          height: 100%;
          background-color: #368FFF;
          border-radius: 0.06rem; }
          .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer .video-process-inner i.video-circle-going {
            position: absolute;
            top: 0;
            left: 100%;
            margin-left: -0.19rem;
            margin-top: -0.13rem;
            width: 0.39rem;
            height: 0.39rem;
            font-style: normal;
            background: url("../images/task-center/task-circle-going.png") no-repeat center center;
            background-size: 100% 100%;
            cursor: pointer; }
      .show-video .video-box .video-operate-box .video-pro-wrap .el-slider {
        width: 100% !important;
        height: 0.4rem !important; }
        .show-video .video-box .video-operate-box .video-pro-wrap .el-slider .el-slider__runway {
          margin: 0.15rem 0 0.13rem !important;
          height: 0.12rem !important;
          background-color: rgba(0, 0, 0, 0.2) !important;
          border-radius: 0.06rem !important; }
          .show-video .video-box .video-operate-box .video-pro-wrap .el-slider .el-slider__runway .el-slider__bar {
            height: 0.12rem !important;
            background-color: #368FFF !important;
            border-top-left-radius: 0.06rem !important;
            border-bottom-left-radius: 0.06rem !important; }
          .show-video .video-box .video-operate-box .video-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper {
            height: 0.39rem !important;
            width: 0.39rem !important;
            top: 50% !important;
            transform: translate(-50%, -50%);
            line-height: 0.35rem !important; }
            .show-video .video-box .video-operate-box .video-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper .el-slider__button {
              width: 0.27rem !important;
              height: 0.27rem !important;
              border: 0.05rem solid #fff !important;
              background-color: #368FFF !important;
              box-shadow: 0 0 0.1rem rgba(0, 0, 0, 0.2) !important;
              transition: 0s !important; }
              .show-video .video-box .video-operate-box .video-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper .el-slider__button.hover {
                transform: scale(1) !important;
                cursor: pointer !important; }
            .show-video .video-box .video-operate-box .video-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper.hover {
              cursor: pointer !important; }
    .show-video .video-box .video-operate-box .right {
      display: flex;
      align-items: center;
      padding: 0.3rem;
      border-left: 1px solid rgba(0, 0, 0, 0.1); }
      .show-video .video-box .video-operate-box .right .icon.narrow {
        width: 0.36rem;
        height: 0.36rem;
        background: url(../images/task-detail/narrow.png) no-repeat;
        background-size: 100% 100%; }
      .show-video .video-box .video-operate-box .right .icon.enlarge {
        width: 0.36rem;
        height: 0.36rem;
        background: url(../images/task-detail/enlarge.png) no-repeat;
        background-size: 100% 100%; }
  .show-video .video-box:hover .video-operate-box {
    display: flex;
    opacity: 1; }

.d-wrap.show-video {
  width: 100%;
  height: 100%; }

.task-detail-main .task-probar {
  height: 0.74rem;
  padding: 0 0.24rem 0 0.2rem;
  margin: 0.33rem 0 0;
  border-radius: 0.37rem; }
  .task-detail-main .task-probar .task-left-wrap .task-play {
    height: 0.74rem;
    line-height: 0.74rem; }
    .task-detail-main .task-probar .task-left-wrap .task-play .iconfont {
      margin-right: 0.2rem;
      font-size: 0.46rem; }
    .task-detail-main .task-probar .task-left-wrap .task-play .task-text {
      font-size: 0.2rem; }
  .task-detail-main .task-probar .task-left-wrap .download {
    margin-left: 0.2rem;
    cursor: pointer; }
    .task-detail-main .task-probar .task-left-wrap .download i.iconfont {
      color: #97A7BF;
      font-size: 0.28rem; }
    .task-detail-main .task-probar .task-left-wrap .download:active i.iconfont, .task-detail-main .task-probar .task-left-wrap .download:hover i.iconfont {
      color: #368FFF; }
  .task-detail-main .task-probar .task-pro-wrap {
    width: 4.09rem;
    height: 0.74rem;
    line-height: 0.72rem; }
    .task-detail-main .task-probar .task-pro-wrap .el-slider {
      height: 0.74rem !important; }
      .task-detail-main .task-probar .task-pro-wrap .el-slider .el-slider__runway {
        margin: 0.34rem 0 !important; }
.task-detail-main .show-video {
  margin-top: 0.3rem;
  width: 4.3rem;
  height: 5.7rem; }
  .task-detail-main .show-video .video-box {
    width: 4.3rem;
    height: 5.7rem; }
    .task-detail-main .show-video .video-box .video-operate-box {
      left: 0;
      width: 100%;
      height: 0.46rem;
      font-size: 0.16rem; }
      .task-detail-main .show-video .video-box .video-operate-box .left {
        padding: 0 0.16rem; }
      .task-detail-main .show-video .video-box .video-operate-box .icon.play {
        width: 0.18rem;
        height: 0.2rem; }
      .task-detail-main .show-video .video-box .video-operate-box .icon.pause {
        width: 0.18rem;
        height: 0.23rem;
        background-size: 0.18rem 0.23rem; }
      .task-detail-main .show-video .video-box .video-operate-box .time {
        margin-left: 0.12rem; }
      .task-detail-main .show-video .video-box .video-operate-box .video-pro-wrap {
        height: 0.23rem;
        line-height: 0.23rem;
        margin-left: 0.12rem; }
        .task-detail-main .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer {
          height: 0.06rem;
          border-radius: 0.03rem; }
          .task-detail-main .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer .video-process-inner {
            border-radius: 0.03rem; }
            .task-detail-main .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer .video-process-inner i.video-circle-going {
              margin-left: -0.12rem;
              margin-top: -0.08rem;
              width: 0.23rem;
              height: 0.23rem; }
        .task-detail-main .show-video .video-box .video-operate-box .video-pro-wrap .el-slider {
          height: 0.23rem !important; }
          .task-detail-main .show-video .video-box .video-operate-box .video-pro-wrap .el-slider .el-slider__runway {
            margin: 0.09rem 0 0.08rem !important;
            height: 0.06rem !important;
            border-radius: 0.03rem !important; }
            .task-detail-main .show-video .video-box .video-operate-box .video-pro-wrap .el-slider .el-slider__runway .el-slider__bar {
              height: 0.06rem !important;
              border-top-left-radius: 0.03rem !important;
              border-bottom-left-radius: 0.03rem !important; }
            .task-detail-main .show-video .video-box .video-operate-box .video-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper {
              height: 0.23rem !important;
              width: 0.23rem !important;
              top: 50% !important;
              transform: translate(-50%, -50%);
              line-height: 0.21rem !important; }
              .task-detail-main .show-video .video-box .video-operate-box .video-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper .el-slider__button {
                width: 0.16rem !important;
                height: 0.16rem !important;
                border: 0.03rem solid #fff !important; }
      .task-detail-main .show-video .video-box .video-operate-box .right {
        padding: 0.14rem; }
        .task-detail-main .show-video .video-box .video-operate-box .right .icon.narrow {
          width: 0.18rem;
          height: 0.18rem; }
        .task-detail-main .show-video .video-box .video-operate-box .right .icon.enlarge {
          width: 0.18rem;
          height: 0.18rem; }
      .task-detail-main .show-video .video-box .video-operate-box.full-screen {
        position: absolute;
        left: 3rem;
        bottom: 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: calc(100% - 6rem);
        height: 0.96rem;
        background: rgba(243, 247, 251, 0.8);
        font-size: 0.24rem;
        color: #333;
        display: none;
        opacity: 0;
        transition: opacity 0.25s; }
        .task-detail-main .show-video .video-box .video-operate-box.full-screen .left {
          display: flex;
          align-items: center;
          padding: 0 0.46rem;
          flex-grow: 1; }
        .task-detail-main .show-video .video-box .video-operate-box.full-screen .icon {
          display: flex;
          cursor: pointer; }
          .task-detail-main .show-video .video-box .video-operate-box.full-screen .icon.play {
            width: 0.4rem;
            height: 0.46rem;
            background: url(../images/task-detail/zk-play.png) no-repeat;
            background-size: 100% 100%; }
          .task-detail-main .show-video .video-box .video-operate-box.full-screen .icon.pause {
            width: 0.4rem;
            height: 0.52rem;
            background: url(../images/task-detail/zk-pause.png) no-repeat left center;
            background-size: 0.32rem 0.52rem; }
        .task-detail-main .show-video .video-box .video-operate-box.full-screen .time {
          display: flex;
          margin-left: 0.4rem; }
        .task-detail-main .show-video .video-box .video-operate-box.full-screen .video-pro-wrap {
          display: flex;
          flex-grow: 1;
          height: 0.4rem;
          line-height: 0.4rem;
          margin-left: 0.24rem; }
          .task-detail-main .show-video .video-box .video-operate-box.full-screen .video-pro-wrap .video-process-outer {
            position: relative;
            width: 100%;
            height: 0.12rem;
            background-color: rgba(0, 0, 0, 0.2);
            border-radius: 0.06rem; }
            .task-detail-main .show-video .video-box .video-operate-box.full-screen .video-pro-wrap .video-process-outer.vm {
              display: inline-block;
              vertical-align: middle; }
            .task-detail-main .show-video .video-box .video-operate-box.full-screen .video-pro-wrap .video-process-outer .video-process-inner {
              position: absolute;
              top: 0;
              right: 0;
              bottom: 0;
              left: 0;
              height: 100%;
              background-color: #368FFF;
              border-radius: 0.06rem; }
              .task-detail-main .show-video .video-box .video-operate-box.full-screen .video-pro-wrap .video-process-outer .video-process-inner i.video-circle-going {
                position: absolute;
                top: 0;
                left: 100%;
                margin-left: -0.19rem;
                margin-top: -0.13rem;
                width: 0.39rem;
                height: 0.39rem;
                font-style: normal;
                background: url("../images/task-center/task-circle-going.png") no-repeat center center;
                background-size: 100% 100%;
                cursor: pointer; }
          .task-detail-main .show-video .video-box .video-operate-box.full-screen .video-pro-wrap .el-slider {
            width: 100% !important;
            height: 0.4rem !important; }
            .task-detail-main .show-video .video-box .video-operate-box.full-screen .video-pro-wrap .el-slider .el-slider__runway {
              margin: 0.15rem 0 0.13rem !important;
              height: 0.12rem !important;
              background-color: rgba(0, 0, 0, 0.2) !important;
              border-radius: 0.06rem !important; }
              .task-detail-main .show-video .video-box .video-operate-box.full-screen .video-pro-wrap .el-slider .el-slider__runway .el-slider__bar {
                height: 0.12rem !important;
                background-color: #368FFF !important;
                border-top-left-radius: 0.06rem !important;
                border-bottom-left-radius: 0.06rem !important; }
              .task-detail-main .show-video .video-box .video-operate-box.full-screen .video-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper {
                height: 0.39rem !important;
                width: 0.39rem !important;
                top: 50% !important;
                transform: translate(-50%, -50%);
                line-height: 0.21rem !important; }
                .task-detail-main .show-video .video-box .video-operate-box.full-screen .video-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper .el-slider__button {
                  width: 0.27rem !important;
                  height: 0.27rem !important;
                  border: 0.05rem solid #fff !important;
                  background-color: #368FFF !important;
                  box-shadow: 0 0 0.1rem rgba(0, 0, 0, 0.2) !important;
                  transition: 0s !important; }
                  .task-detail-main .show-video .video-box .video-operate-box.full-screen .video-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper .el-slider__button.hover {
                    transform: scale(1) !important;
                    cursor: pointer !important; }
                .task-detail-main .show-video .video-box .video-operate-box.full-screen .video-pro-wrap .el-slider .el-slider__runway .el-slider__button-wrapper.hover {
                  cursor: pointer !important; }
        .task-detail-main .show-video .video-box .video-operate-box.full-screen .right {
          display: flex;
          align-items: center;
          padding: 0.3rem;
          border-left: 1px solid rgba(0, 0, 0, 0.1); }
          .task-detail-main .show-video .video-box .video-operate-box.full-screen .right .icon.narrow {
            width: 0.36rem;
            height: 0.36rem;
            background: url(../images/task-detail/narrow.png) no-repeat;
            background-size: 100% 100%; }
          .task-detail-main .show-video .video-box .video-operate-box.full-screen .right .icon.enlarge {
            width: 0.36rem;
            height: 0.36rem;
            background: url(../images/task-detail/enlarge.png) no-repeat;
            background-size: 100% 100%; }
    .task-detail-main .show-video .video-box:hover .full-screen {
      display: flex;
      opacity: 1; }
.task-detail-main .show-img .single {
  position: relative;
  width: 6.8rem;
  height: 4.5rem;
  background: #f0f6fb;
  overflow: hidden; }

.task-detail-share {
  position: relative;
  flex-grow: 0;
  height: 100%;
  padding: 0.32rem 0.32rem 0;
  overflow-y: auto;
  overflow-x: hidden; }
  .task-detail-share .task-module {
    /*min-height:0;*/
    border-radius: 0.04rem;
    padding: 0 0.48rem 0.4rem; }
  .task-detail-share .student-img {
    display: inline-block;
    width: 0.6rem;
    height: 0.6rem;
    margin-right: 0.24rem; }
  .task-detail-share .student-name {
    font-size: 0.26rem; }
  .task-detail-share .task-time {
    margin-top: 0.1rem;
    font-size: 0.2rem; }
  .task-detail-share .module-header {
    position: relative;
    padding: 0.39rem 0 0;
    border-bottom: 0;
    min-height: auto; }
  .task-detail-share .task-probar {
    height: 0.74rem;
    padding: 0 0.24rem 0 0.2rem;
    margin: 0.32rem 0 0;
    border-radius: 0.37rem; }
    .task-detail-share .task-probar .task-left-wrap .task-play {
      height: 0.74rem;
      line-height: 0.74rem; }
      .task-detail-share .task-probar .task-left-wrap .task-play .iconfont {
        margin-right: 0.2rem;
        font-size: 0.48rem; }
      .task-detail-share .task-probar .task-left-wrap .task-play .task-text {
        font-size: 0.2rem; }
    .task-detail-share .task-probar .task-pro-wrap {
      width: 4.6rem;
      height: 0.74rem;
      line-height: 0.72rem; }
  .task-detail-share .share-operate-box {
    display: flex;
    justify-content: space-between;
    font-size: 0.24rem;
    margin-top: 0.32rem; }
    .task-detail-share .share-operate-box .share-box {
      display: inline-flex;
      align-items: center;
      cursor: pointer; }
      .task-detail-share .share-operate-box .share-box img {
        width: 0.24rem;
        height: 0.24rem;
        margin-right: 0.12rem; }
      .task-detail-share .share-operate-box .share-box span {
        color: #999; }
    .task-detail-share .share-operate-box .right-box {
      display: inline-flex;
      align-items: center;
      color: #6C7C93; }
      .task-detail-share .share-operate-box .right-box .click-num {
        display: inline-flex;
        justify-content: flex-start;
        cursor: pointer; }
      .task-detail-share .share-operate-box .right-box .comment-num {
        display: inline-flex;
        align-items: center;
        margin-left: 0.24rem;
        cursor: pointer; }
        .task-detail-share .share-operate-box .right-box .comment-num img {
          width: 0.27rem;
          height: 0.24rem;
          margin-right: 0.12rem; }
      .task-detail-share .share-operate-box .right-box .notice-num {
        font-size: 0.24rem;
        color: #999;
        cursor: pointer; }
        .task-detail-share .share-operate-box .right-box .notice-num em {
          color: #333; }
        .task-detail-share .share-operate-box .right-box .notice-num .iconfont {
          font-weight: bold;
          font-size: 0.24rem; }
  .task-detail-share .assess-box {
    margin-top: 0.3rem;
    padding: 0 0.32rem; }
    .task-detail-share .assess-box .assess-people {
      padding: 0.24rem 0;
      font-size: 0.22rem;
      border-bottom: 0; }
    .task-detail-share .assess-box .assess-text {
      padding: 0.3rem 0; }
      .task-detail-share .assess-box .assess-text p {
        margin-top: 0.15rem; }
        .task-detail-share .assess-box .assess-text p .name {
          font-weight: normal;
          color: #6C7C93; }
        .task-detail-share .assess-box .assess-text p:first-child {
          margin-top: 0; }
      .task-detail-share .assess-box .assess-text .comment-more {
        display: inline-block;
        margin-top: 0.15rem;
        font-size: 0.22rem;
        color: #368FFF; }
    .task-detail-share .assess-box .assess-people + .assess-text {
      border-top: 1px solid #E5E7EB; }
  .task-detail-share .operate-box {
    position: absolute;
    right: 0;
    top: 0.45rem; }
    .task-detail-share .operate-box .iconfont {
      font-size: 0.22rem;
      color: #C2CBCE;
      cursor: pointer; }
      .task-detail-share .operate-box .iconfont:hover {
        color: #368FFF; }
  .task-detail-share .show-img ul {
    margin-top: -0.28rem; }
    .task-detail-share .show-img ul li {
      width: 3.2rem;
      height: 3.2rem;
      margin: 0.28rem 0.28rem 0 0; }
  .task-detail-share .show-video {
    width: 4.3rem;
    height: 5.7rem; }
    .task-detail-share .show-video .video-box {
      width: 4.3rem;
      height: 5.7rem; }
      .task-detail-share .show-video .video-box .video-operate-box {
        left: 0;
        width: 100%;
        height: 0.46rem;
        font-size: 0.16rem; }
        .task-detail-share .show-video .video-box .video-operate-box .left {
          padding: 0 0.16rem; }
        .task-detail-share .show-video .video-box .video-operate-box .icon.play {
          width: 0.18rem;
          height: 0.2rem; }
        .task-detail-share .show-video .video-box .video-operate-box .icon.pause {
          width: 0.18rem;
          height: 0.23rem;
          background-size: 0.18rem 0.23rem; }
        .task-detail-share .show-video .video-box .video-operate-box .time {
          margin-left: 0.12rem; }
        .task-detail-share .show-video .video-box .video-operate-box .video-pro-wrap {
          height: 0.23rem;
          line-height: 0.23rem;
          margin-left: 0.12rem; }
          .task-detail-share .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer {
            height: 0.06rem;
            border-radius: 0.03rem; }
            .task-detail-share .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer .video-process-inner {
              border-radius: 0.03rem; }
              .task-detail-share .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer .video-process-inner i.video-circle-going {
                margin-left: -0.12rem;
                margin-top: -0.08rem;
                width: 0.23rem;
                height: 0.23rem; }
        .task-detail-share .show-video .video-box .video-operate-box .right {
          padding: 0.14rem; }
          .task-detail-share .show-video .video-box .video-operate-box .right .icon.narrow {
            width: 0.18rem;
            height: 0.18rem; }
          .task-detail-share .show-video .video-box .video-operate-box .right .icon.enlarge {
            width: 0.18rem;
            height: 0.18rem; }
  .task-detail-share .show-img .single {
    position: relative;
    width: 6.8rem;
    height: 4.5rem;
    background: #f0f6fb;
    overflow: hidden; }
  .task-detail-share .notice-people-box {
    display: none;
    padding: 0 0.3rem;
    margin: 0.29rem 0 0 0;
    background: #F3F7FB;
    border-radius: 0.08rem;
    font-size: 0.22rem; }
    .task-detail-share .notice-people-box .notice-tab {
      height: 0.7rem;
      border-bottom: 1px solid #E5E7EB; }
      .task-detail-share .notice-people-box .notice-tab a {
        display: inline-block;
        line-height: 0.68rem;
        padding: 0 0.32rem;
        color: #666; }
        .task-detail-share .notice-people-box .notice-tab a:hover {
          color: #368FFF; }
        .task-detail-share .notice-people-box .notice-tab a.active {
          color: #368FFF;
          border-bottom: 0.02rem solid #368FFF; }
    .task-detail-share .notice-people-box .notice-people {
      padding: 0.15rem 0 0.18rem;
      line-height: 0.42rem;
      color: #666; }
  .task-detail-share .share-operate-box.active + .notice-people-box {
    display: block; }
  .task-detail-share .share-operate-box.active .icon-ZK-PC-arrow-bottom:before {
    content: "\e77b"; }

.task-exercise-correct .correct-table .calc-ques table {
  margin: 0.1rem 0; }

.task-exercise-correct .correct-table .calc-ques table .tea-fill-blank {
  height: 0.6rem; }

.task-exercise-correct .correct-table .calc-ques table tr th,
.task-exercise-correct .correct-table .calc-ques table tr td {
  padding: 0;
  text-align: center;
  border: 0.01rem solid #DEE5ED; }

.scantron-task-detail {
  margin-left: 4.81rem; }
  .scantron-task-detail .task-detail-require {
    width: 100%;
    padding: 0.26rem 0.5rem;
    border-top: 0.01rem solid #D8DEDF;
    border-bottom: 0.01rem solid #D8DEDF;
    background: #fff; }
    .scantron-task-detail .task-detail-require .task-require-title {
      display: flex;
      justify-content: space-between;
      font-size: 0.24rem; }
      .scantron-task-detail .task-detail-require .task-require-title.on .iconfont:before {
        content: "\e77b"; }
    .scantron-task-detail .task-detail-require .task-require-main {
      margin-top: 0.28rem;
      font-size: 0.22rem;
      line-height: 0.34rem; }
    .scantron-task-detail .task-detail-require .task-require-pic li {
      display: inline-block;
      width: 1.6rem;
      height: 1.6rem;
      margin: 0.2rem 0.2rem 0 0; }
      .scantron-task-detail .task-detail-require .task-require-pic li img {
        width: 100%;
        height: 100%;
        object-fit: cover; }
  .scantron-task-detail .task-detail-exercise {
    height: auto; }
  .scantron-task-detail .task-detail-exercise-wrap {
    height: 100%;
    overflow: auto; }
  .scantron-task-detail .module .exercise-box .type {
    font-size: 0.24rem;
    font-weight: bold;
    color: #333; }
  .scantron-task-detail .module .sub-ques-wrap {
    padding-bottom: 0.32rem;
    margin-bottom: 0.2rem;
    border-bottom: 1px dashed #DEE5ED; }
    .scantron-task-detail .module .sub-ques-wrap:last-child {
      border-bottom: 0; }
    .scantron-task-detail .module .sub-ques-wrap .correct-btn {
      width: 1.2rem;
      height: 0.48rem;
      line-height: 0.48rem;
      background: #fff;
      border: 1px solid #D8DEDF;
      border-radius: 0.24rem;
      font-size: 0.22rem;
      color: #666; }
      .scantron-task-detail .module .sub-ques-wrap .correct-btn:hover {
        border-color: #368FFF;
        color: #368FFF; }
    .scantron-task-detail .module .sub-ques-wrap .pic-input-wrap {
      margin-top: 0; }
      .scantron-task-detail .module .sub-ques-wrap .pic-input-wrap li {
        width: 1.6rem;
        height: 1.6rem; }
    .scantron-task-detail .module .sub-ques-wrap .answer-wrap {
      display: flex;
      margin-bottom: 0.2rem; }
      .scantron-task-detail .module .sub-ques-wrap .answer-wrap .answer {
        font-size: 0.26rem; }
        .scantron-task-detail .module .sub-ques-wrap .answer-wrap .answer.wrong {
          color: #FF543A; }
        .scantron-task-detail .module .sub-ques-wrap .answer-wrap .answer.right {
          color: #24C366; }
        .scantron-task-detail .module .sub-ques-wrap .answer-wrap .answer.not-do {
          color: #999; }
        .scantron-task-detail .module .sub-ques-wrap .answer-wrap .answer .icon-ZK-PC-duihao {
          display: inline-block;
          margin-top: -0.03rem;
          font-size: 0.44rem; }
        .scantron-task-detail .module .sub-ques-wrap .answer-wrap .answer .icon-close {
          display: inline-block;
          margin-top: 0.03rem; }
    .scantron-task-detail .module .sub-ques-wrap .subtype {
      display: flex;
      justify-content: space-between;
      font-size: 0.26rem;
      color: #333; }
      .scantron-task-detail .module .sub-ques-wrap .subtype.not-do {
        color: #999; }
      .scantron-task-detail .module .sub-ques-wrap .subtype .correct-btn {
        width: 1.2rem;
        height: 0.48rem;
        line-height: 0.48rem;
        border: 0.01rem solid #D8DEDF;
        border-radius: 0.24rem;
        color: #666;
        font-size: 0.22rem;
        text-align: center; }
        .scantron-task-detail .module .sub-ques-wrap .subtype .correct-btn:hover {
          color: #368FFF;
          border-color: #368FFF; }
    .scantron-task-detail .module .sub-ques-wrap .exercise {
      margin-top: 0.2rem;
      padding: 0 0 0.1rem 0; }
      .scantron-task-detail .module .sub-ques-wrap .exercise .scantron-answer li {
        display: inline-block;
        vertical-align: middle;
        width: 0.64rem;
        height: 0.64rem;
        line-height: 0.62rem;
        margin-right: 0.2rem;
        border: 1px solid #D8DEDF;
        background: #fff;
        border-radius: 50%;
        font-size: 0.24rem;
        text-align: center; }
        .scantron-task-detail .module .sub-ques-wrap .exercise .scantron-answer li.active {
          background: #24C366;
          border-color: #24C366;
          color: #fff; }
        .scantron-task-detail .module .sub-ques-wrap .exercise .scantron-answer li .icon-ZK-PC-duihao {
          font-size: 0.44rem; }
      .scantron-task-detail .module .sub-ques-wrap .exercise .fill-ques {
        font-size: 0.24rem;
        color: #333; }
    .scantron-task-detail .module .sub-ques-wrap .exercise-answer-box {
      padding: 0;
      border-top: 0; }
      .scantron-task-detail .module .sub-ques-wrap .exercise-answer-box .pic-input-wrap {
        margin-top: 0.2rem; }
        .scantron-task-detail .module .sub-ques-wrap .exercise-answer-box .pic-input-wrap li {
          width: 1.6rem;
          height: 1.6rem;
          margin: 0 0.24rem 0 0; }
      .scantron-task-detail .module .sub-ques-wrap .exercise-answer-box .answer-text {
        margin-top: 0.2rem;
        font-size: 0.24rem;
        color: #333; }

.task-read-content.task .personal-task-form {
  top: 0.6rem;
  transform: translate(-50%, 0);
  padding-top: 0; }
  .task-read-content.task .personal-task-form .personal-task-title {
    width: 8rem;
    height: 0.88rem;
    padding: 0.26rem 0.38rem;
    margin-bottom: 0.4rem;
    background: url("../images/task-detail/banner.png") no-repeat center;
    background-size: 100% 100%; }
    .task-read-content.task .personal-task-form .personal-task-title .ai-icon {
      display: inline-block;
      vertical-align: bottom;
      width: 0.44rem;
      height: 0.36rem;
      margin-right: 0.23rem; }
      .task-read-content.task .personal-task-form .personal-task-title .ai-icon img {
        width: 100%;
        height: 100%; }
    .task-read-content.task .personal-task-form .personal-task-title .title {
      display: inline-block;
      vertical-align: bottom;
      font-size: 0.24rem;
      color: #368FFF; }
  .task-read-content.task .personal-task-form .personal-task-main > h3 {
    font-size: 0.22rem;
    color: #6C7C93; }
  .task-read-content.task .personal-task-form .personal-task-main .personal-task-item {
    display: flex;
    justify-content: space-between;
    padding: 0.2rem 0;
    border-bottom: 1px solid #DEE5ED;
    font-size: 0.22rem;
    color: #333; }
    .task-read-content.task .personal-task-form .personal-task-main .personal-task-item em {
      color: #368FFF; }
    .task-read-content.task .personal-task-form .personal-task-main .personal-task-item .checkbox-wrap {
      color: #333; }
      .task-read-content.task .personal-task-form .personal-task-main .personal-task-item .checkbox-wrap.all {
        font-weight: bold; }
      .task-read-content.task .personal-task-form .personal-task-main .personal-task-item .checkbox-wrap label {
        cursor: pointer; }
    .task-read-content.task .personal-task-form .personal-task-main .personal-task-item .checkbox-wrap:hover input.checkbox:disabled ~ label {
      color: #ccc;
      cursor: not-allowed; }
    .task-read-content.task .personal-task-form .personal-task-main .personal-task-item.arranged {
      color: #ccc; }
      .task-read-content.task .personal-task-form .personal-task-main .personal-task-item.arranged .checkbox-wrap {
        color: #ccc; }
        .task-read-content.task .personal-task-form .personal-task-main .personal-task-item.arranged .checkbox-wrap:hover label {
          color: #ccc;
          cursor: default; }
        .task-read-content.task .personal-task-form .personal-task-main .personal-task-item.arranged .checkbox-wrap:hover .iconfont {
          color: #ccc;
          cursor: default; }
.task-read-content.task .personal-practise-form {
  top: 0.24rem;
  transform: translate(-50%, 0);
  padding-top: 0;
  height: calc(100% - .24rem); }
  .task-read-content.task .personal-practise-form .personal-practise-title {
    width: 8rem;
    height: 1.2rem;
    padding: 0.26rem 0.38rem;
    background: url("../images/task-detail/banner2.png") no-repeat center;
    background-size: 100% 100%;
    color: #fff;
    font-size: 0.2rem; }
    .task-read-content.task .personal-practise-form .personal-practise-title h3 {
      font-weight: bold;
      font-size: 0.24rem;
      margin-bottom: 0.07rem; }
  .task-read-content.task .personal-practise-form .personal-practise-main {
    position: relative;
    min-height: calc(100% - 1.2rem); }
  .task-read-content.task .personal-practise-form .task-info-wrap {
    overflow-y: visible;
    padding: 0; }
    .task-read-content.task .personal-practise-form .task-info-wrap .el-row {
      margin-top: 0.24rem; }
    .task-read-content.task .personal-practise-form .task-info-wrap .task-info-panel .task-info-cont {
      padding: 0.3rem 0; }
      .task-read-content.task .personal-practise-form .task-info-wrap .task-info-panel .task-info-cont p {
        margin-top: 0.02rem; }
    .task-read-content.task .personal-practise-form .task-info-wrap .module-load.no-data {
      margin-top: 0; }

.task-read .d-bottom .text {
  margin-left: 3.92rem;
  font-size: 0.24rem;
  color: #6C7C93; }
  .task-read .d-bottom .text em {
    color: #368FFF; }
.task-read .d-bottom .right {
  display: flex; }

.d-mask .dialog-arrange {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -55%);
  width: 9.56rem;
  height: 6.6rem;
  background: url("../images/task-detail/pop-bg.png") no-repeat center;
  background-size: 9.56rem 6.6rem; }
  .d-mask .dialog-arrange .arrange-animate {
    width: 4rem;
    height: 4rem;
    margin: 88px auto 0; }
    .d-mask .dialog-arrange .arrange-animate img {
      width: 100%;
      height: 100%; }
  .d-mask .dialog-arrange p {
    text-align: center; }
    .d-mask .dialog-arrange p img {
      width: 3.67rem;
      height: 0.67rem; }

.task-correct {
  position: relative;
  height: 100%;
  padding-top: 0.72rem; }
  .task-correct .task-correct-header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0.72rem;
    line-height: 0.72rem;
    padding: 0 0.4rem;
    background: #FAFCFE;
    border-bottom: 0.01rem solid #D8DEDF; }
    .task-correct .task-correct-header .correct-list {
      font-size: 0.24rem;
      color: #333; }
      .task-correct .task-correct-header .correct-list .icon-ZK-PC-arrow-left {
        display: inline-block;
        vertical-align: middle;
        width: 0.36rem;
        height: 0.36rem;
        line-height: 0.38rem;
        background: #F0F2F6;
        border-radius: 0.18rem;
        margin: 0 0 0 0.16rem;
        color: #8794A8;
        text-align: center; }
      .task-correct .task-correct-header .correct-list.active {
        margin-left: 2.3rem; }
        .task-correct .task-correct-header .correct-list.active .icon-ZK-PC-arrow-left:before {
          content: "\e779"; }
    .task-correct .task-correct-header .correct-list-main {
      position: absolute;
      top: 0.72rem;
      left: 0;
      z-index: 10;
      width: 4.29rem;
      height: calc(100vh - 0.72rem - 0.72rem);
      background: #fff;
      border-right: 1px solid #D8DEDF;
      box-shadow: 0px 0.1rem 0.16rem 0px rgba(0, 0, 0, 0.14); }
      .task-correct .task-correct-header .correct-list-main .flex {
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow-y: auto; }
      .task-correct .task-correct-header .correct-list-main .upload-wrap .item {
        height: 0.72rem;
        line-height: 0.72rem;
        padding: 0 0.24rem;
        background: #FAFCFE;
        border-bottom: 1px solid #D8DEDF; }
        .task-correct .task-correct-header .correct-list-main .upload-wrap .item span.txt {
          font-size: 0.24rem;
          color: #333; }
        .task-correct .task-correct-header .correct-list-main .upload-wrap .item .arrow-icon {
          display: inline-block;
          width: 0;
          height: 0;
          margin: 0 0 0 0.1rem;
          border: 0.06rem solid transparent;
          border-top: 0.06rem solid #666; }
          .task-correct .task-correct-header .correct-list-main .upload-wrap .item .arrow-icon.fold {
            margin: 0 0 .04rem .1rem; }
          .task-correct .task-correct-header .correct-list-main .upload-wrap .item .arrow-icon.unfold {
            margin: 0 0 0 .1rem; }
      .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main {
        display: none;
        line-height: normal;
        padding: 0 0.24rem 0.2rem; }
        .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main .upload-name {
          padding-bottom: 0.32rem;
          border-bottom: 1px dashed #DEDEDE; }
          .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main .upload-name:last-child {
            border-bottom: 0;
            padding-bottom: 0; }
          .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main .upload-name .title {
            margin: 0.32rem 0 0.14rem;
            font-size: 0.2rem;
            color: #999; }
          .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main .upload-name .student-name {
            line-height: 0.32rem;
            font-size: 0.2rem;
            color: #333;
            display: -webkit-box;
            overflow: hidden;
            text-overflow: ellipsis;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 4; }
            .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main .upload-name .student-name em {
              font-size: 0.18rem;
              color: #666; }
          .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main .upload-name .upload-fail {
            font-size: 0; }
            .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main .upload-name .upload-fail li {
              position: relative;
              display: inline-block;
              vertical-align: top;
              width: 1.8rem;
              margin: 0 0.12rem 0.12rem 0;
              padding: 0.03rem 0.12rem 0.05rem;
              border: 1px solid #D8DEDF;
              border-radius: 0.04rem;
              font-size: 0.2rem;
              color: #333;
              cursor: pointer; }
              .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main .upload-name .upload-fail li:nth-child(2n) {
                margin-right: 0; }
              .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main .upload-name .upload-fail li:hover {
                background: #FAFCFE;
                border-color: #DEE5ED; }
              .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main .upload-name .upload-fail li .ques {
                font-size: 0.18rem;
                color: #666; }
              .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main .upload-name .upload-fail li .icon {
                position: absolute;
                display: inline-block;
                top: 0.03rem;
                right: 0.03rem;
                width: 0.12rem;
                height: 0.12rem; }
                .task-correct .task-correct-header .correct-list-main .upload-wrap .item-main .upload-name .upload-fail li .icon.icon-warn {
                  background: url("../images/task-detail/warn-icon.png") no-repeat center;
                  background-size: 100%; }
      .task-correct .task-correct-header .correct-list-main .upload-wrap.open .item-main {
        display: block;
        border-bottom: 1px solid #D8DEDF; }
      .task-correct .task-correct-header .correct-list-main .upload-wrap.open .arrow-icon {
        margin: 0 0 0.04rem 0.1rem;
        border: 0.06rem solid transparent;
        border-bottom: 0.06rem solid #666; }
        .task-correct .task-correct-header .correct-list-main .upload-wrap.open .arrow-icon.fold {
          margin: 0 0 .05rem .1rem; }
        .task-correct .task-correct-header .correct-list-main .upload-wrap.open .arrow-icon.unfold {
          margin: 0 0 -0.01rem .1rem; }
      .task-correct .task-correct-header .correct-list-main .correct-tab {
        position: relative;
        flex: auto;
        line-height: normal;
        min-height: 3.72rem; }
        .task-correct .task-correct-header .correct-list-main .correct-tab .zh-resource-none {
          transform: translate(-50%, -40%); }
          .task-correct .task-correct-header .correct-list-main .correct-tab .zh-resource-none .img-none {
            width: 1.97rem;
            height: 1.62rem; }
          .task-correct .task-correct-header .correct-list-main .correct-tab .zh-resource-none .txt {
            font-size: .22rem; }
        .task-correct .task-correct-header .correct-list-main .correct-tab .tab-nav {
          height: 0.72rem;
          line-height: 0.72rem;
          padding: 0 0.24rem;
          background: #FAFCFE;
          border-bottom: 1px solid #D8DEDF; }
          .task-correct .task-correct-header .correct-list-main .correct-tab .tab-nav li {
            display: inline-block;
            height: 100%;
            margin-right: 0.48rem; }
            .task-correct .task-correct-header .correct-list-main .correct-tab .tab-nav li a {
              display: inline-block;
              font-size: 0.24rem;
              color: #666; }
            .task-correct .task-correct-header .correct-list-main .correct-tab .tab-nav li.active {
              position: relative; }
              .task-correct .task-correct-header .correct-list-main .correct-tab .tab-nav li.active:after {
                content: '';
                position: absolute;
                bottom: 0;
                left: 0;
                width: 100%;
                height: 0.02rem;
                background: #368FFF; }
              .task-correct .task-correct-header .correct-list-main .correct-tab .tab-nav li.active a {
                color: #368FFF; }
        .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel {
          padding: 0.32rem 0.24rem; }
          .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item {
            margin-bottom: 0.4rem; }
            .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item:last-child {
              margin-bottom: 0; }
            .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item .ques-title {
              font-size: 0.22rem;
              color: #333; }
            .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item .ques-info {
              border-bottom: 1px dashed #DEDEDE; }
              .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item .ques-info > dt {
                height: 0.72rem;
                line-height: 0.72rem;
                font-size: 0.24rem;
                color: #333;
                cursor: pointer; }
                .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item .ques-info > dt .student-num {
                  color: #333;
                  height: 100%; }
                  .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item .ques-info > dt .student-num span {
                    display: inline-block;
                    vertical-align: middle; }
                  .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item .ques-info > dt .student-num em {
                    color: #368FFF; }
                  .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item .ques-info > dt .student-num .iconfont {
                    display: inline-block;
                    vertical-align: middle;
                    margin: 0 0 -0.03rem 0;
                    color: #8794A8; }
              .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item .ques-info > dd {
                display: none;
                margin-right: -0.12rem;
                font-size: 0; }
                .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item .ques-info > dd a {
                  display: inline-block;
                  width: 1.16rem;
                  height: 0.4rem;
                  line-height: 0.38rem;
                  margin: 0 0.12rem 0.12rem 0;
                  background: #EDF2F6;
                  border: 0.01rem solid #EDF2F6;
                  border-radius: 0.04rem;
                  font-size: 0.2rem;
                  color: #666;
                  text-align: center; }
                  .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item .ques-info > dd a.active {
                    border-color: #368FFF;
                    background: #fff;
                    color: #368FFF; }
              .task-correct .task-correct-header .correct-list-main .correct-tab .tab-panel .ques-item .ques-info.open > dd {
                display: block; }
  .task-correct .task-correct-main {
    height: 100%;
    display: flex; }
    .task-correct .task-correct-main .task-correct-detail {
      flex-grow: 1;
      position: relative;
      height: 100%;
      padding: 0.39rem 1.35rem 0.39rem 0.39rem;
      background: #E4EBF1; }
      .task-correct .task-correct-main .task-correct-detail .task-paper-item {
        position: relative;
        height: 100%;
        background: #fff; }
        .task-correct .task-correct-main .task-correct-detail .task-paper-item .task-paper-num {
          display: inline-block;
          position: absolute;
          top: 0;
          left: 0;
          z-index: 1;
          min-width: 0.72rem;
          height: 0.36rem;
          line-height: 0.36rem;
          padding: 0 0.2rem 0 0.1rem;
          background: rgba(0, 0, 0, 0.2);
          border-radius: 0 0 0.36rem 0;
          color: #fff;
          font-size: 0.2rem;
          text-align: center; }
        .task-correct .task-correct-main .task-correct-detail .task-paper-item .duihao {
          position: absolute;
          top: 0.42rem;
          right: 0.42rem;
          z-index: 1;
          width: 1.48rem;
          height: 1.48rem; }
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .duihao img {
            width: 100%;
            height: 100%; }
        .task-correct .task-correct-main .task-correct-detail .task-paper-item .bandui {
          position: absolute;
          top: 0.42rem;
          right: 0.42rem;
          width: 1.48rem;
          height: 1.48rem; }
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .bandui img {
            width: 100%;
            height: 100%; }
        .task-correct .task-correct-main .task-correct-detail .task-paper-item .error {
          position: absolute;
          top: 0.42rem;
          right: 0.42rem;
          width: 1.48rem;
          height: 1.48rem; }
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .error img {
            width: 100%;
            height: 100%; }
        .task-correct .task-correct-main .task-correct-detail .task-paper-item .task-paper {
          position: relative;
          /*width: px2rem(703px);*/
          height: 100%;
          margin: 0 auto;
          background: #fff;
          text-align: center; }
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .task-paper:after {
            content: '';
            display: inline-block;
            vertical-align: middle;
            width: 0;
            height: 100%; }
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .task-paper img {
            display: inline-block;
            vertical-align: middle;
            max-width: 100%;
            max-height: 100%; }
        .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .prev,
        .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .next {
          position: absolute;
          top: 50%;
          width: 0.72rem;
          height: 0.72rem;
          line-height: 0.72rem;
          margin: -0.36rem 0 0 0;
          background: rgba(0, 0, 0, 0.15);
          border-radius: 50%;
          text-align: center;
          color: #fff; }
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .prev i.iconfont,
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .next i.iconfont {
            font-size: 0.48rem; }
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .prev:hover,
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .next:hover {
            background: rgba(0, 0, 0, 0.2); }
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .prev:active,
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .next:active {
            background: rgba(0, 0, 0, 0.2); }
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .prev.dis,
          .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .next.dis {
            background: rgba(0, 0, 0, 0.1); }
            .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .prev.dis:hover,
            .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .next.dis:hover {
              background: rgba(0, 0, 0, 0.1); }
            .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .prev.dis:active,
            .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .next.dis:active {
              background: rgba(0, 0, 0, 0.1); }
        .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .prev {
          left: 0.13rem; }
        .task-correct .task-correct-main .task-correct-detail .task-paper-item .paper-operate .next {
          right: 0.13rem; }
      .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar {
        position: absolute;
        top: 0;
        right: 0;
        width: 0.96rem;
        height: 100%;
        padding: 0.16rem 0;
        background: #fff; }
        .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar .paper-list {
          max-height: calc(100% - 1.7rem);
          padding: 0 0.16rem;
          overflow-y: auto; }
          .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar .paper-list li {
            position: relative;
            width: 0.64rem;
            height: 0.64rem;
            margin-bottom: 0.16rem;
            border: 0.01rem solid #D8DEDF;
            overflow: hidden;
            cursor: pointer; }
            .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar .paper-list li img {
              width: 100%;
              height: 100%;
              object-fit: cover; }
            .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar .paper-list li .num {
              position: absolute;
              left: -0.01rem;
              bottom: -0.01rem;
              width: 0.32rem;
              height: 0.32rem;
              line-height: 0.32rem;
              background: rgba(0, 0, 0, 0.4);
              color: #fff;
              font-size: 0.2rem;
              text-align: center; }
            .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar .paper-list li:hover, .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar .paper-list li.active {
              border: 0.03rem solid #368FFF; }
              .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar .paper-list li:hover .num, .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar .paper-list li.active .num {
                left: -0.03rem;
                bottom: -0.03rem;
                background: #368FFF; }
        .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar .task-paper-operate {
          position: absolute;
          bottom: 0.18rem;
          right: 0.24rem;
          width: 0.48rem; }
          .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar .task-paper-operate a {
            display: inline-block;
            width: 0.48rem;
            height: 0.48rem;
            margin-bottom: 0.16rem;
            border-radius: 50%; }
            .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar .task-paper-operate a.correct {
              background: rgba(0, 0, 0, 0.4) url("../images/task-detail/correct.png") no-repeat center;
              background-size: 0.32rem 0.32rem; }
            .task-correct .task-correct-main .task-correct-detail .task-paper-sidebar .task-paper-operate a.rotate {
              background: rgba(0, 0, 0, 0.4) url("../images/task-detail/rotate.png") no-repeat center;
              background-size: 0.32rem 0.32rem; }
    .task-correct .task-correct-main .task-correct-sidebar {
      position: relative;
      flex-shrink: 0;
      width: 2.7rem;
      height: 100%;
      border-left: 1px solid #D8DEDF; }
      .task-correct .task-correct-main .task-correct-sidebar .student-message {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 1.55rem;
        padding: 0.4rem 0 0 0.39rem;
        border-bottom: 0.01rem solid #D8DEDF;
        background: #fff url("../images/task-detail/header-bg.png") no-repeat top center;
        background-size: 2.69rem 0.9rem; }
        .task-correct .task-correct-main .task-correct-sidebar .student-message p {
          line-height: 0.32rem;
          color: #999;
          font-size: 0.2rem; }
        .task-correct .task-correct-main .task-correct-sidebar .student-message .name {
          line-height: 0.36rem;
          margin-bottom: 0.1rem;
          color: #333;
          font-size: 0.28rem;
          font-weight: bold; }
      .task-correct .task-correct-main .task-correct-sidebar .test-paper-change {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 2rem;
        padding-top: 0.08rem;
        background: #FAFCFE;
        border-top: 0.01rem solid #D8DEDF;
        text-align: center; }
        .task-correct .task-correct-main .task-correct-sidebar .test-paper-change .normal {
          width: 1.9rem;
          height: 0.56rem;
          margin-top: 0.24rem;
          line-height: 0.56rem;
          border-radius: 0.28rem; }
      .task-correct .task-correct-main .task-correct-sidebar .correct-operate {
        height: 100%;
        padding: 1.55rem 0 2rem 0;
        text-align: center;
        overflow-y: auto; }
        .task-correct .task-correct-main .task-correct-sidebar .correct-operate .correct-btn {
          display: inline-block;
          width: 1.9rem;
          height: 0.64rem;
          line-height: 0.64rem;
          margin-bottom: 0.24rem;
          border: 0.01rem solid;
          border-radius: 0.32rem;
          text-align: center; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .correct-btn .iconfont {
            margin: 0; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .correct-btn:first-child {
            margin-top: 0.66rem; }
        .task-correct .task-correct-main .task-correct-sidebar .correct-operate .handle-btn {
          display: inline-block;
          width: 1.9rem;
          height: 0.64rem;
          line-height: 0.64rem;
          margin-bottom: 0.24rem;
          border: 0.01rem solid;
          border-radius: 0.08rem;
          font-size: 0.22rem;
          text-align: center; }
        .task-correct .task-correct-main .task-correct-sidebar .correct-operate .handle-btn-wrap {
          margin-top: 0.6rem; }
        .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-green {
          border-color: #24C366; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-green .iconfont {
            color: #24C366;
            font-size: 0.5rem; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-green.active {
            background: #24C366; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-green.active .iconfont {
              color: #fff; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-green:hover {
            background: #4BCD81; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-green:hover .iconfont {
              color: #fff; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-green:active {
            background: #24B05C; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-green:active .iconfont {
              color: #fff; }
        .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-yellow {
          border-color: #FFAE00; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-yellow .iconfont {
            color: #FFAE00;
            font-size: 0.5rem; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-yellow .half-right-icon {
            display: inline-block;
            width: 0.32rem;
            height: 0.64rem;
            background: url("../images/task-detail/half-correct.png") no-repeat center;
            background-size: 0.32rem 0.32rem; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-yellow.active {
            background: #FFAE00; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-yellow.active .iconfont {
              color: #fff; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-yellow.active .half-right-icon {
              background: url("../images/task-detail/half-correct-hover.png") no-repeat center;
              background-size: 0.32rem 0.32rem; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-yellow:hover {
            background: #FFBC2E; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-yellow:hover .iconfont {
              color: #fff; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-yellow:hover .half-right-icon {
              background: url("../images/task-detail/half-correct-hover.png") no-repeat center;
              background-size: 0.32rem 0.32rem; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-yellow:active {
            background: #E89F01; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-yellow:active .iconfont {
              color: #fff; }
        .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-red {
          border-color: #FF543A; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-red .iconfont {
            color: #FF543A;
            font-size: 0.3rem; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-red.active {
            background: #FF543A; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-red.active .iconfont {
              color: #fff; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-red:hover {
            background: #FF735D; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-red:hover .iconfont {
              color: #fff; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-red:active {
            background: #E94D35; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-red:active .iconfont {
              color: #fff; }
        .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-gray {
          border-color: #D8DEDF;
          color: #333; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-gray .tab-icon {
            display: inline-block;
            vertical-align: middle;
            width: 0.27rem;
            height: 0.25rem;
            margin: -0.03rem 0.12rem 0 0;
            background: url("../images/task-detail/star.png") no-repeat center;
            background-size: 0.27rem 0.25rem; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-gray:hover {
            border-color: #368FFF;
            background: #fff;
            color: #368FFF; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-gray:hover .tab-icon {
              background: url("../images/task-detail/star-active.png") no-repeat center;
              background-size: 0.27rem 0.25rem; }
          .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-gray.active {
            border-color: #368FFF;
            background: rgba(54, 143, 255, 0.2);
            color: #368FFF; }
            .task-correct .task-correct-main .task-correct-sidebar .correct-operate .stroke-gray.active .tab-icon {
              background: url("../images/task-detail/star-active.png") no-repeat center;
              background-size: 0.27rem 0.25rem; }

.d-correct {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1001;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  text-align: right; }
  .d-correct .d-correct-main {
    position: absolute;
    top: 0.34rem;
    left: 0.39rem;
    height: calc(100% - 0.42rem - 0.28rem); }
    .d-correct .d-correct-main .task-paper-item {
      position: relative;
      width: 14.76rem;
      height: calc(100% - 0.7rem);
      padding: 0.17rem 0;
      background: #fff;
      box-sizing: border-box; }
      .d-correct .d-correct-main .task-paper-item .task-paper-num {
        display: inline-block;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        min-width: 0.72rem;
        height: 0.36rem;
        line-height: 0.36rem;
        padding: 0 0.2rem 0 0.1rem;
        background: rgba(0, 0, 0, 0.2);
        border-radius: 0 0 0.36rem 0;
        color: #fff;
        font-size: 0.2rem;
        text-align: center; }
      .d-correct .d-correct-main .task-paper-item .task-paper {
        position: relative;
        height: 100%;
        margin: 0 auto;
        background: #fff;
        text-align: center;
        overflow: hidden; }
        .d-correct .d-correct-main .task-paper-item .task-paper:after {
          content: '';
          display: inline-block;
          vertical-align: middle;
          width: 0;
          height: 100%; }
        .d-correct .d-correct-main .task-paper-item .task-paper canvas,
        .d-correct .d-correct-main .task-paper-item .task-paper img {
          display: inline-block;
          vertical-align: middle;
          max-width: 100%;
          max-height: 100%; }
      .d-correct .d-correct-main .task-paper-item .close-left,
      .d-correct .d-correct-main .task-paper-item .close-right {
        position: absolute;
        bottom: 0;
        width: 0.88rem;
        height: 0.78rem;
        padding-top: 0.08rem;
        background: #F7F8FC;
        box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2);
        text-align: center;
        box-sizing: border-box;
        cursor: pointer; }
        .d-correct .d-correct-main .task-paper-item .close-left .iconfont,
        .d-correct .d-correct-main .task-paper-item .close-right .iconfont {
          color: #888D97;
          font-size: 0.36rem; }
        .d-correct .d-correct-main .task-paper-item .close-left p,
        .d-correct .d-correct-main .task-paper-item .close-right p {
          font-size: 0.14rem;
          color: #888D97; }
      .d-correct .d-correct-main .task-paper-item .close-left {
        left: 0;
        border-radius: 0 0.12rem 0 0; }
      .d-correct .d-correct-main .task-paper-item .close-right {
        right: 0;
        border-radius: 0.12rem 0 0 0; }
      .d-correct .d-correct-main .task-paper-item .paper-operate {
        position: absolute;
        bottom: 0.75rem;
        left: 50%;
        transform: translate(-50%, 0);
        padding: 0.1rem 0.24rem;
        background: rgba(0, 0, 0, 0.6);
        border-radius: 0.28rem;
        font-size: 0; }
        .d-correct .d-correct-main .task-paper-item .paper-operate a {
          display: inline-block; }
          .d-correct .d-correct-main .task-paper-item .paper-operate a .operate-icons {
            display: inline-block;
            width: 0.32rem;
            height: 0.32rem; }
            .d-correct .d-correct-main .task-paper-item .paper-operate a .operate-icons.fangda-icon {
              margin-right: 0.24rem;
              background: url("../images/task-detail/fangda-icon.png") no-repeat center;
              background-size: 100%; }
            .d-correct .d-correct-main .task-paper-item .paper-operate a .operate-icons.suoxiao-icon {
              background: url("../images/task-detail/suoxiao-icon.png") no-repeat center;
              background-size: 100%; }
            .d-correct .d-correct-main .task-paper-item .paper-operate a .operate-icons.rotate-icon {
              background: url("../images/task-detail/rotate.png") no-repeat center;
              background-size: 100%; }
            .d-correct .d-correct-main .task-paper-item .paper-operate a .operate-icons.drag-icon {
              background: url("../images/task-detail/drag-icon.png") no-repeat center;
              background-size: 100%; }
              .d-correct .d-correct-main .task-paper-item .paper-operate a .operate-icons.drag-icon.active {
                background: url("../images/task-detail/drag-active.png") no-repeat center;
                background-size: 100%; }
        .d-correct .d-correct-main .task-paper-item .paper-operate .line {
          display: inline-block;
          width: 1px;
          height: 0.32rem;
          margin: 0 0.18rem;
          background: rgba(255, 255, 255, 0.1); }
  .d-correct .d-correct-operate {
    display: inline-block;
    height: 0.56rem;
    line-height: 0.56rem;
    margin-bottom: 0.07rem;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 0.04rem; }
    .d-correct .d-correct-operate .operate-item {
      float: left;
      height: 100%;
      padding: 0 0.24rem;
      border-left: 0.01rem solid rgba(255, 255, 255, 0.4); }
      .d-correct .d-correct-operate .operate-item:first-child {
        border-radius: 0.04rem 0 0 0.04rem; }
      .d-correct .d-correct-operate .operate-item a {
        color: #fff;
        font-size: 0.2rem; }
      .d-correct .d-correct-operate .operate-item.painting a {
        display: inline-block;
        vertical-align: middle;
        width: 0.32rem;
        height: 0.32rem;
        margin-top: -0.04rem;
        margin-right: 0.1rem;
        border-radius: 50%;
        transition: border 0.1s; }
        .d-correct .d-correct-operate .operate-item.painting a:last-child {
          margin-right: 0; }
        .d-correct .d-correct-operate .operate-item.painting a.color-black {
          background: #000;
          border: 0.01rem solid #fff; }
        .d-correct .d-correct-operate .operate-item.painting a.color-red {
          background: #FC3242;
          border: 0.01rem solid #fff; }
        .d-correct .d-correct-operate .operate-item.painting a.color-green {
          background: #42D673;
          border: 0.01rem solid #fff; }
        .d-correct .d-correct-operate .operate-item.painting a:hover, .d-correct .d-correct-operate .operate-item.painting a.active {
          border: 0.06rem solid #fff; }
      .d-correct .d-correct-operate .operate-item.btn-box .btn-style {
        width: 1rem;
        height: 0.4rem;
        line-height: 0.4rem;
        margin: 0.07rem 0.05rem 0;
        border: 1px solid #fff;
        border-radius: 0.2rem;
        font-size: 0.22rem;
        text-align: center; }
        .d-correct .d-correct-operate .operate-item.btn-box .btn-style.full-blue {
          border-color: #368FFF;
          background: #368FFF; }
          .d-correct .d-correct-operate .operate-item.btn-box .btn-style.full-blue:hover {
            background: #5AA3FF; }
          .d-correct .d-correct-operate .operate-item.btn-box .btn-style.full-blue:active {
            background: #2D76D1; }
      .d-correct .d-correct-operate .operate-item .operate-icons {
        display: inline-block;
        vertical-align: middle;
        width: 0.32rem;
        height: 0.32rem;
        margin: -0.03rem 0.12rem 0 0; }
        .d-correct .d-correct-operate .operate-item .operate-icons.cancel-icon {
          background: url("../images/task-detail/cancel-icon.png") no-repeat center;
          background-size: 100%; }
        .d-correct .d-correct-operate .operate-item .operate-icons.clear-icon {
          background: url("../images/task-detail/clear-icon.png") no-repeat center;
          background-size: 100%; }
        .d-correct .d-correct-operate .operate-item .operate-icons.rotate-icon {
          background: url("../images/task-detail/rotate.png") no-repeat center;
          background-size: 100%; }
        .d-correct .d-correct-operate .operate-item .operate-icons.fangda-icon {
          margin-right: 0;
          background: url("../images/task-detail/fangda-icon.png") no-repeat center;
          background-size: 100%; }
        .d-correct .d-correct-operate .operate-item .operate-icons.suoxiao-icon {
          margin-right: 0;
          background: url("../images/task-detail/suoxiao-icon.png") no-repeat center;
          background-size: 100%; }

/**
 * 适配规则：
 * <=1024   bottom:100px
 * >1024<2560   bottom:125px
 * >=2560   bottom:150px
 */
@media screen and (max-width: 1024px) {
  .d-correct .d-correct-main .task-paper-item .paper-operate {
    bottom: 0.65rem; }

  .pic-wrap .paper-operate {
    bottom: 1rem; } }
@media screen and (min-width: 1025px) and (max-width: 2559px) {
  .d-correct .d-correct-main .task-paper-item .paper-operate {
    bottom: 0.9rem; }

  .pic-wrap .paper-operate {
    bottom: 1.25rem; } }
@media screen and (min-width: 2560px) {
  .d-correct .d-correct-main .task-paper-item .paper-operate {
    bottom: 1.15rem; }

  .pic-wrap .paper-operate {
    bottom: 1.51rem; } }
.character-wrap .word-practice-box {
  padding-top: 0.36rem;
  margin-bottom: 0.3rem;
  background: #fff;
  border-radius: 0.08rem; }
  .character-wrap .word-practice-box .character-operate {
    padding: 0 0.39rem 0.18rem; }
  .character-wrap .word-practice-box .word-list {
    flex-grow: 0;
    margin-right: 0;
    overflow-y: visible; }
    .character-wrap .word-practice-box .word-list ul {
      margin-left: 0.1rem; }
      .character-wrap .word-practice-box .word-list ul li {
        min-width: 2.06rem;
        margin: 0 0 0.4rem 0.3rem; }
        .character-wrap .word-practice-box .word-list ul li .word {
          min-width: 2.06rem; }
  .character-wrap .word-practice-box .tab-list {
    display: flex;
    flex-wrap: wrap;
    padding-top: 0.4rem;
    margin: 0 0.4rem;
    border-top: 1px dashed #DEE5ED; }
    .character-wrap .word-practice-box .tab-list ul {
      display: flex;
      flex-wrap: wrap;
      align-self: end;
      margin: 0 -0.4rem 0 -0.3rem; }
      .character-wrap .word-practice-box .tab-list ul li {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        min-width: 2.06rem;
        height: 0.8rem;
        margin: 0 0 0.4rem 0.3rem;
        font-size: 0.26rem;
        color: #333; }
        .character-wrap .word-practice-box .tab-list ul li input {
          position: absolute;
          opacity: 0; }
        .character-wrap .word-practice-box .tab-list ul li label {
          min-width: 2.06rem;
          height: 0.8rem;
          line-height: 0.8rem;
          padding: 0 0.4rem;
          background-color: #fff;
          border: 2px solid #DEE5ED;
          border-radius: 0.4rem;
          text-align: center;
          cursor: pointer; }
        .character-wrap .word-practice-box .tab-list ul li:hover {
          color: #368FFF; }
        .character-wrap .word-practice-box .tab-list ul li.active {
          background-color: #DEEEFF;
          border: 2px solid #DEEEFF;
          color: #368FFF; }
        .character-wrap .word-practice-box .tab-list ul li input:checked ~ label.tab {
          background-color: #DEEEFF;
          border: 2px solid #DEEEFF;
          color: #368FFF; }
.character-wrap .article-list li .title {
  display: flex;
  align-items: center;
  width: 100%;
  margin-bottom: 0.1rem;
  font-size: 0.24rem;
  color: #6C7C93; }
  .character-wrap .article-list li .title em {
    height: 0.32rem;
    line-height: 0.32rem;
    margin-left: 0.18rem;
    padding: 0 0.1rem;
    background: #DEEEFF;
    border-radius: 0.16rem;
    font-size: 0.16rem;
    color: #368FFF; }
.character-wrap .article-list li .dialogue span {
  display: flex; }

.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden; }

.task-read-content.task.clock-task {
  padding: 0.33rem 0; }

.task-read .clock-task .form-wrap .form-item-label {
  min-width: 2.25rem; }

.clock-task .clock-date {
  width: 1.2rem;
  height: 0.56rem;
  padding: 0 0.2rem;
  margin-right: 0.16rem;
  background: #fff;
  border: 1px solid #dee5ed;
  border-radius: 0.04rem; }
.clock-task .form-wrap .time-wrap {
  margin: 0; }
.clock-task .form-wrap .input-inner {
  width: 2.4rem;
  margin-left: 0.2rem; }
.clock-task .form-wrap .clock-icon {
  position: absolute;
  right: 0.2rem;
  top: 0.16rem;
  width: 0.24rem;
  height: 0.24rem;
  background: url("../images/clock-task/clock.png") no-repeat center center;
  background-size: 100% 100%; }
.clock-task .form-wrap .clock-task-input {
  width: 6.7rem;
  background: #fff;
  border: 1px solid #DEE5ED; }
  .clock-task .form-wrap .clock-task-input.blue-border {
    border: 2px dashed #368FFF; }
  .clock-task .form-wrap .clock-task-input .title-input input {
    width: 100%;
    height: 0.55rem;
    line-height: 0.55rem;
    padding: 0 0.2rem;
    border: 0; }
  .clock-task .form-wrap .clock-task-input .task-input {
    padding: 0 0.2rem; }
    .clock-task .form-wrap .clock-task-input .task-input textarea {
      width: 100%;
      height: 1.2rem;
      padding-top: 0.1rem;
      border: 0;
      border-top: 1px solid #DEE5ED;
      line-height: 0.36rem; }
    .clock-task .form-wrap .clock-task-input .task-input .task-textarea-wrap {
      position: relative; }
      .clock-task .form-wrap .clock-task-input .task-input .task-textarea-wrap > span {
        position: absolute;
        top: 0.1rem;
        left: 0;
        color: #ccc;
        font-size: 0.22rem; }
    .clock-task .form-wrap .clock-task-input .task-input .textarea {
      width: 100%;
      min-height: 1.2rem;
      padding-top: 0.1rem;
      border: 0;
      border-top: 1px solid #DEE5ED;
      line-height: 0.36rem;
      outline: none; }
    .clock-task .form-wrap .clock-task-input .task-input .upload-btn {
      margin: 0.26rem 0 0.2rem 0; }
      .clock-task .form-wrap .clock-task-input .task-input .upload-btn a {
        margin-right: 0.2rem;
        color: #8794A8; }
        .clock-task .form-wrap .clock-task-input .task-input .upload-btn a i {
          font-size: 0.26rem; }

.clock-task-wrap {
  width: 13.68rem;
  margin: 0 auto; }
  .clock-task-wrap .clock-task-title {
    font-size: 0.22rem;
    color: #6C7C93; }
  .clock-task-wrap .task-info-wrap {
    display: flex;
    padding: 0;
    flex-wrap: wrap; }
    .clock-task-wrap .task-info-wrap .task-info-panel {
      width: 6.6rem;
      padding: 0 0.4rem;
      margin-right: 0.24rem; }
      .clock-task-wrap .task-info-wrap .task-info-panel .task-info-read-cont {
        padding: 0.32rem 0; }

.pic-input-wrap {
  margin-top: 0.26rem; }
  .pic-input-wrap li {
    position: relative;
    float: left;
    width: 1.76rem;
    height: 1.76rem;
    margin: 0 0.18rem 0.18rem 0; }
    .pic-input-wrap li:nth-child(3n) {
      margin-right: 0; }
    .pic-input-wrap li > div {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      overflow: hidden;
      border: 0.01rem solid #DEE5ED; }
      .pic-input-wrap li > div.upload-demo {
        border: 0; }
    .pic-input-wrap li img {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      height: 100%;
      width: 100%;
      object-fit: cover; }
    .pic-input-wrap li .del {
      position: absolute;
      top: -0.1rem;
      right: -0.1rem;
      width: 0.24rem;
      height: 0.24rem;
      background: url("../images/clock-task/del-icon.png") no-repeat center;
      background-size: 100% 100%; }
    .pic-input-wrap li .add-pic {
      display: block;
      height: 100%;
      border: 1px dashed #DEE5ED;
      text-align: center; }
      .pic-input-wrap li .add-pic p {
        margin-top: 0.1rem;
        color: #ccc;
        font-size: 0.24rem; }
      .pic-input-wrap li .add-pic .add-icon {
        display: inline-block;
        width: 0.48rem;
        height: 0.48rem;
        margin-top: 0.43rem;
        background: url("../images/clock-task/add.png") no-repeat center;
        background-size: 100% 100%; }

.file-input-wrap {
  margin-top: 0.26rem; }
  .file-input-wrap .file-item {
    position: relative;
    display: inline-block;
    width: 2.4rem;
    padding: 0.16rem 0;
    margin-bottom: 0.2rem;
    margin-right: 0.2rem;
    background: #F3F7FB;
    border-radius: 0.04rem;
    text-align: center;
    vertical-align: middle; }
    .file-input-wrap .file-item.upload-file {
      padding: 0;
      border: 1px solid #DEE5ED; }
      .file-input-wrap .file-item.upload-file .file-icon {
        padding: 0.15rem 0;
        background: rgba(231, 98, 47, 0.2); }
      .file-input-wrap .file-item.upload-file .file-name {
        display: flex;
        justify-content: space-between;
        background: #fff;
        padding: 0.05rem 0.1rem;
        border-top: 1px solid #DEE5ED;
        text-align: left; }
        .file-input-wrap .file-item.upload-file .file-name p {
          font-size: 0.2rem; }
        .file-input-wrap .file-item.upload-file .file-name .file-space {
          margin-top: 0;
          font-size: 0.18rem; }
        .file-input-wrap .file-item.upload-file .file-name .down-btn {
          margin-top: 0.06rem; }
    .file-input-wrap .file-item .icon {
      width: 0.6rem;
      height: 0.66rem; }
    .file-input-wrap .file-item .file-space {
      margin-top: 0.1rem;
      color: #999;
      font-size: 0.18rem; }
    .file-input-wrap .file-item .del {
      position: absolute;
      top: -0.1rem;
      right: -0.1rem;
      width: 0.24rem;
      height: 0.24rem;
      background: url("../images/clock-task/del-icon.png") no-repeat center;
      background-size: 100% 100%; }
    .file-input-wrap .file-item .down-btn {
      width: 0.4rem;
      height: 0.42rem; }
      .file-input-wrap .file-item .down-btn i {
        color: #DEE5ED; }
      .file-input-wrap .file-item .down-btn .icon {
        width: 0.4rem;
        height: 0.42rem; }
      .file-input-wrap .file-item .down-btn .icon.hover {
        display: none; }
      .file-input-wrap .file-item .down-btn:hover i {
        color: #368FFF; }
      .file-input-wrap .file-item .down-btn:hover .icon {
        display: none; }
      .file-input-wrap .file-item .down-btn:hover .icon.hover {
        display: block; }
    .file-input-wrap .file-item.file-item-row {
      width: 5rem;
      padding: 0.12rem;
      display: flex;
      justify-content: space-between;
      align-items: center; }
      .file-input-wrap .file-item.file-item-row .file-panel {
        display: flex; }
      .file-input-wrap .file-item.file-item-row .file-name {
        max-width: 3.7rem;
        margin-left: 0.12rem;
        text-align: left; }
        .file-input-wrap .file-item.file-item-row .file-name p {
          font-size: 0.2rem;
          color: #333; }
          .file-input-wrap .file-item.file-item-row .file-name p span {
            display: inline-block;
            vertical-align: middle; }
          .file-input-wrap .file-item.file-item-row .file-name p .ellipsis {
            max-width: 3rem;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap; }
        .file-input-wrap .file-item.file-item-row .file-name .file-space {
          margin-top: 0;
          color: #999;
          font-size: 0.18rem; }

.link-input-wrap {
  margin-top: 0.26rem; }
  .link-input-wrap .link-item {
    display: flex;
    position: relative;
    width: 5rem;
    padding: 0.12rem;
    margin-bottom: 0.2rem;
    background: #F3F7FB;
    border-radius: 0.04rem; }
    .link-input-wrap .link-item .del {
      position: absolute;
      top: -0.1rem;
      right: -0.1rem;
      width: 0.24rem;
      height: 0.24rem;
      background: url("../images/clock-task/del-icon.png") no-repeat center;
      background-size: 100% 100%; }
    .link-input-wrap .link-item .link-icon {
      display: inline-block;
      vertical-align: middle;
      width: 0.48rem;
      height: 0.48rem;
      background: #368FFF;
      border-radius: 0.02rem;
      text-align: center; }
      .link-input-wrap .link-item .link-icon .icon-pc_xx_link {
        display: inline-block;
        margin-top: 0.08rem;
        color: #fff; }
    .link-input-wrap .link-item .link-name {
      display: flex;
      vertical-align: middle;
      align-items: center;
      width: 4.05rem;
      max-height: 0.5rem;
      margin-left: 0.12rem;
      font-size: 0.2rem;
      color: #333;
      cursor: pointer;
      overflow: hidden; }
      .link-input-wrap .link-item .link-name .multi-line {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        text-overflow: ellipsis; }

.task-read .d-bottom .btn-style.clock-task-btn {
  width: 2.4rem;
  cursor: pointer; }

.form-item-content .range-wrap.date-check {
  height: 4.7rem;
  bottom: 0; }
  .form-item-content .range-wrap.date-check ul li .operate-wrap-box {
    padding-top: 0.1rem;
    max-height: 4.13rem; }
  .form-item-content .range-wrap.date-check .operate-btn {
    padding: 0 0.18rem;
    border-top: 1px solid #DEDEDE;
    line-height: 0.56rem; }
    .form-item-content .range-wrap.date-check .operate-btn a {
      margin-left: 0.3rem;
      font-size: 0.18rem;
      color: #333; }
      .form-item-content .range-wrap.date-check .operate-btn a.sure-btn {
        color: #368FFF; }

.pop-link {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 6.7rem;
  padding: 0.28rem 0.2rem 0.2rem;
  border-radius: 0.08rem;
  background-color: #fff;
  font-size: 0.22rem; }
  .pop-link > h3 {
    margin-bottom: 0.15rem;
    color: #6C7C93; }
  .pop-link .link-input {
    position: relative; }
    .pop-link .link-input input {
      width: 100%;
      height: 0.56rem;
      line-height: 0.56rem;
      padding: 0 0.18rem;
      margin-bottom: 0.16rem;
      background: #fff;
      border: 1px solid #D8DEDF;
      border-radius: 0.04rem; }
    .pop-link .link-input .clear-btn {
      position: absolute;
      right: 0.16rem;
      top: 0.16rem;
      width: 0.24rem;
      height: 0.24rem;
      line-height: 0.26rem;
      background: #000;
      opacity: 0.16;
      border-radius: 50%;
      font-size: 0.24rem;
      color: #fff;
      cursor: pointer; }
  .pop-link .btn-style.normal,
  .pop-link .btn-style.medium {
    min-width: 1.06rem; }
  .pop-link .btn-style.dis {
    background: #C8E0FF; }
    .pop-link .btn-style.dis:hover {
      background: #C8E0FF; }

.btn-style.has-border {
  border: 1px solid #368FFF;
  color: #368FFF; }
  .btn-style.has-border:hover {
    border: 1px solid #5AA3FF;
    background: #5AA3FF;
    color: #fff; }
  .btn-style.has-border:active {
    background: #2D76D1; }

.task-detail-data {
  padding: 0.32rem 0.32rem; }
  .task-detail-data .task-module {
    padding: 0 0.48rem 0.4rem; }
  .task-detail-data .task-center-date {
    margin-bottom: 0.2rem;
    font-size: 0.2rem;
    color: #999; }
  .task-detail-data .module-header {
    position: relative;
    min-height: 0;
    padding: 0.39rem 0 0;
    border-bottom: 0; }
    .task-detail-data .module-header .student-img {
      width: 0.6rem;
      height: 0.6rem; }
    .task-detail-data .module-header .student-name {
      font-size: 0.26rem; }
    .task-detail-data .module-header .student-img {
      margin-right: 0.24rem; }
    .task-detail-data .module-header .task-time {
      font-size: 0.2rem;
      margin-top: 0.1rem; }
  .task-detail-data .operate-box {
    position: absolute;
    right: 0;
    top: 0.45rem; }
    .task-detail-data .operate-box .iconfont {
      font-size: 0.22rem;
      color: #C2CBCE;
      cursor: pointer; }
  .task-detail-data .file-input-wrap {
    margin-top: 0.32rem; }
  .task-detail-data .link-input-wrap {
    margin-top: 0.32rem; }
  .task-detail-data .pic-input-wrap {
    margin-top: 0.32rem; }

.share-operate-box {
  display: flex;
  justify-content: space-between;
  font-size: 0.24rem;
  margin-top: 0.32rem; }
  .share-operate-box .share-box {
    display: inline-flex;
    align-items: center;
    cursor: pointer; }
    .share-operate-box .share-box img {
      width: 0.24rem;
      height: 0.24rem;
      margin-right: 0.12rem; }
    .share-operate-box .share-box span {
      color: #999;
      font-size: 0.24rem; }
  .share-operate-box .right-box {
    display: inline-flex;
    align-items: center;
    color: #6C7C93; }
    .share-operate-box .right-box .notice-num {
      font-size: 0.24rem;
      color: #999;
      cursor: pointer; }
      .share-operate-box .right-box .notice-num em {
        color: #333; }
      .share-operate-box .right-box .notice-num .iconfont {
        font-weight: bold;
        font-size: 0.24rem; }

.notice-people-box {
  display: none;
  padding: 0 0.3rem;
  margin: 0.32rem 0 0 0;
  background: #F3F7FB;
  border-radius: 0.08rem;
  font-size: 0.22rem; }
  .notice-people-box .notice-tab {
    height: 0.7rem;
    border-bottom: 1px solid #E5E7EB; }
    .notice-people-box .notice-tab a {
      display: inline-block;
      line-height: 0.68rem;
      padding: 0 0.32rem;
      color: #666; }
      .notice-people-box .notice-tab a.active {
        color: #368FFF;
        border-bottom: 0.02rem solid #368FFF; }
  .notice-people-box .notice-people {
    min-height: 0.7rem;
    padding: 0.15rem 0 0.18rem;
    line-height: 0.42rem;
    color: #666; }

.share-operate-box.active + .notice-people-box {
  display: block; }

.share-operate-box.active .icon-ZK-PC-arrow-bottom:before {
  content: "\e77b"; }

.task-detail-content .detail-side .detail-title .time-text {
  margin: 0.18rem 0 0.24rem 0; }
  .task-detail-content .detail-side .detail-title .time-text p {
    margin: 0; }

.clock-task-theme {
  margin: 0.23rem 0 0 0;
  color: #333; }
  .clock-task-theme h3 {
    margin-bottom: 0.1rem;
    font-size: 0.24rem;
    font-weight: bold;
    line-height: 0.36rem; }
  .clock-task-theme p {
    font-size: 0.24rem;
    line-height: 0.36rem; }

.clock-time {
  margin: 0.48rem 0 0 0;
  padding: 0.3rem 0.3rem 0.05rem;
  background: #F3F7FB;
  border-radius: 0.08rem; }
  .clock-time > p {
    margin-bottom: 0.25rem;
    font-size: 0.24rem; }
  .clock-time .time-list {
    font-size: 0; }
    .clock-time .time-list li {
      display: inline-block;
      vertical-align: middle;
      margin-right: 0.24rem;
      margin-bottom: 0.25rem; }
      .clock-time .time-list li > a {
        display: inline-block;
        width: 1.16rem;
        height: 1.16rem;
        background: #fff;
        border: 1px solid #C2CBCE;
        border-radius: 0.08rem;
        text-align: center; }
        .clock-time .time-list li > a .time-date {
          height: 0.42rem;
          line-height: 0.42rem;
          background: #C2CBCE;
          border-radius: 0.06rem 0.06rem 0 0;
          color: #fff;
          font-size: 0.24rem; }
        .clock-time .time-list li > a .num {
          margin-top: 0.14rem;
          color: #999;
          font-size: 0.24rem; }
          .clock-time .time-list li > a .num em {
            color: #368FFF;
            font-size: 0.32rem; }
        .clock-time .time-list li > a .icon-suoping {
          display: inline-block;
          margin-top: 0.14rem;
          color: #C2CBCE;
          font-size: 0.36rem; }
        .clock-time .time-list li > a .finish {
          display: inline-block;
          width: 0.4rem;
          height: 0.36rem;
          margin-top: 0.17rem;
          background: url("../images/clock-task/finish-blue.png") no-repeat center;
          background-size: 0.4rem 0.36rem; }
          .clock-time .time-list li > a .finish.gray {
            background: url("../images/clock-task/finish.png") no-repeat center;
            background-size: 0.4rem 0.36rem; }
      .clock-time .time-list li.active > a {
        border: 1px solid #368FFF; }
        .clock-time .time-list li.active > a .time-date {
          background: #368FFF; }

.task-report .show-img li {
  margin: 0 0.24rem 0.24rem 0; }
  .task-report .show-img li.pic-none {
    background: #f0f6fb url("../images/clock-task/pic-none.png") no-repeat center;
    background-size: 0.78rem 0.58rem; }
  .task-report .show-img li.loading img {
    animation: rotate 1.5s linear infinite; }

@keyframes rotate {
  0% {
    transform: translate(-50%, -50%) rotateZ(0deg); }
  100% {
    transform: translate(-50%, -50%) rotateZ(360deg); } }
.clock-task-detail-title {
  margin: -0.1rem 0 0.24rem 0;
  font-size: 0.24rem;
  color: #666; }

.share-operate-box .clock-num {
  margin-top: 0.04rem;
  font-size: 0.2rem;
  color: #999;
  cursor: pointer; }
  .share-operate-box .clock-num em {
    color: #368FFF; }
  .share-operate-box .clock-num .iconfont {
    color: #999999;
    font-size: 0.2rem; }
.share-operate-box.active .clock-num .iconfont {
  display: inline-block;
  transform: rotateZ(180deg); }

.task-operate {
  display: flex;
  justify-content: space-between;
  margin-top: 0.18rem; }
  .task-operate .del-btn {
    font-size: 0.22rem;
    color: #6C7C93; }
    .task-operate .del-btn:hover {
      color: #368FFF; }
  .task-operate .return-back-btn {
    font-size: 0.22rem;
    color: #6C7C93; }
    .task-operate .return-back-btn:hover {
      color: #368FFF; }
  .task-operate .right-box img {
    display: inline-block;
    vertical-align: middle;
    width: 0.28rem;
    height: 0.24rem;
    margin: 0 0.12rem 0 0.25rem; }
  .task-operate .right-box span {
    display: inline-block;
    vertical-align: middle;
    font-size: 0.24rem;
    color: #6C7C93; }
  .task-operate .right-box .like-btn {
    width: 0.28rem;
    height: 0.24rem;
    background: url("../images/task-detail/best.png") no-repeat center;
    background-size: 100% 100%;
    cursor: pointer; }
    .task-operate .right-box .like-btn:hover {
      background: url("../images/task-detail/best-hover.png") no-repeat center;
      background-size: 100% 100%; }
    .task-operate .right-box .like-btn.active {
      background: url("../images/task-detail/best-red.png") no-repeat center;
      background-size: 100% 100%; }
  .task-operate .right-box .comment-btn {
    width: 0.27rem;
    height: 0.24rem;
    margin-left: 0.23rem;
    background: url("../images/task-detail/comment.png") no-repeat center;
    background-size: 100% 100%;
    cursor: pointer; }
    .task-operate .right-box .comment-btn:hover {
      background: url("../images/task-detail/comment-hover.png") no-repeat center;
      background-size: 100% 100%; }

.task-detail-main .task-module.clock-none {
  position: relative;
  flex: auto;
  min-height: 3rem;
  margin-bottom: 0;
  border-bottom: 0;
  border-radius: 0.08rem 0.08rem 0 0; }

.module-pandect .clock-time {
  margin-top: 0.23rem; }

.form-item-content .clock-task-input {
  width: 6.7rem;
  background: #fff;
  border: 1px solid #DEE5ED; }
  .form-item-content .clock-task-input.blue-border {
    border: 2px dashed #368FFF; }
  .form-item-content .clock-task-input .title-input input {
    width: 100%;
    height: 0.55rem;
    line-height: 0.55rem;
    padding: 0 0.2rem;
    border: 0; }
  .form-item-content .clock-task-input .task-input {
    padding: 0 0.2rem; }
    .form-item-content .clock-task-input .task-input textarea {
      width: 100%;
      height: 1.2rem;
      padding-top: 0.1rem;
      border: 0;
      line-height: 0.36rem; }
    .form-item-content .clock-task-input .task-input .upload-btn {
      margin: 0.26rem 0 0.2rem 0; }
      .form-item-content .clock-task-input .task-input .upload-btn a {
        margin-right: 0.2rem;
        color: #8794A8; }
        .form-item-content .clock-task-input .task-input .upload-btn a i {
          font-size: 0.26rem; }

.task-detail-main .flex {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  height: 100%; }

.web-wrap {
  max-width: none;
  height: 100%; }
  .web-wrap ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    background-color: transparent; }
  .web-wrap ::-webkit-scrollbar-thumb {
    border: 1px solid #BFBFBF;
    border-radius: 6px;
    cursor: pointer; }
  .web-wrap .d-mask-transparent {
    position: inherit; }
    .web-wrap .d-mask-transparent .d-wrap {
      display: block;
      position: inherit;
      transform: translate(0, 0); }
      .web-wrap .d-mask-transparent .d-wrap .task-detail-content {
        display: block;
        background: linear-gradient(0deg, #E4F3F8, #A0E1EF); }
        .web-wrap .d-mask-transparent .d-wrap .task-detail-content .task-detail-main {
          display: block;
          padding-right: 0;
          margin-left: 0; }
          .web-wrap .d-mask-transparent .d-wrap .task-detail-content .task-detail-main .content-wrap {
            background: #EFF3F7; }
    .web-wrap .d-mask-transparent .d-content {
      height: 100%; }
  .web-wrap.layout {
    background: linear-gradient(0deg, #E4F3F8, #A0E1EF); }
  .web-wrap .task .task-center-right {
    padding-top: 50px; }
    .web-wrap .task .task-center-right .task-detail-exercise {
      padding: 12px; }
      .web-wrap .task .task-center-right .task-detail-exercise .module {
        padding: 0 24px;
        margin-bottom: 12px;
        border-radius: 4px; }
        .web-wrap .task .task-center-right .task-detail-exercise .module .type {
          padding-top: 19px;
          font-size: 14px; }
        .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box {
          font-size: 14px; }
          .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise {
            padding: 10px 0;
            line-height: 24px; }
            .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise .answer.judge-question {
              margin-top: 0; }
              .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise .answer.judge-question .icon-ZK-PC-duihao {
                font-size: 35px; }
              .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise .answer.judge-question .icon-close {
                font-size: 20px; }
            .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise .completion-img {
              width: 400px;
              height: 220px;
              margin: 10px 0 20px; }
            .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise .completion-cont li {
              display: flex;
              align-items: center;
              margin-top: 20px; }
              .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise .completion-cont li i {
                width: 60px;
                height: 34px;
                line-height: 34px;
                padding: 0 10px;
                border-radius: 4px;
                font-size: 14px;
                color: #368FFF; }
            .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise strong.fraction {
              position: absolute;
              top: -1px;
              left: 50%;
              transform: translateX(-50%);
              display: inline-flex;
              align-items: center;
              justify-content: center;
              height: 34px;
              line-height: 34px; }
              .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise strong.fraction .before {
                margin-right: 3px; }
              .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise strong.fraction .num {
                position: relative;
                display: inline-block;
                top: 0;
                text-align: center; }
                .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise strong.fraction .num .top,
                .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise strong.fraction .num .bottom {
                  position: relative;
                  display: block;
                  line-height: 20px; }
                .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise strong.fraction .num .bottom:before {
                  min-width: 12px;
                  padding: 0 2px;
                  height: 1px;
                  background: #368FFF; }
            .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise .tea-fill-blank {
              position: relative;
              display: inline-block;
              min-width: 60px;
              height: 34px;
              line-height: 32px;
              padding: 0 8px;
              margin: 0 5px;
              border: 1px solid #DEE5ED;
              border-radius: 4px;
              font-size: 14px;
              text-indent: 0;
              color: #368FFF; }
            .web-wrap .task .task-center-right .task-detail-exercise .module .exercise-box .exercise .tea-fill-blank-1 {
              position: relative;
              display: inline-block;
              min-width: 60px;
              height: 34px;
              line-height: 32px;
              padding: 0 8px;
              margin: 0 5px;
              border: 1px solid #DEE5ED;
              border-radius: 4px;
              font-size: 14px;
              text-indent: 0;
              color: #368FFF; }
        .web-wrap .task .task-center-right .task-detail-exercise .module .answer .right {
          color: #368FFF; }
      .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .exercise-answer-box {
        padding: 0 0 18px 0;
        border-top: 0; }
        .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .exercise-answer-box .answer-correct-list {
          padding: 15px 16px 1px;
          background: #F3F7FB;
          border-radius: 4px; }
          .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .exercise-answer-box .answer-correct-list li {
            padding: 0;
            margin-top: 0;
            margin-bottom: 16px;
            line-height: 24px;
            background: #F3F7FB;
            border-radius: 0;
            font-size: 14px; }
            .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .exercise-answer-box .answer-correct-list li .txt {
              margin: 0; }
            .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .exercise-answer-box .answer-correct-list li .tit {
              margin-top: 0;
              font-size: 14px; }
      .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .error-ques-info {
        height: 42px;
        line-height: 42px;
        border-top: 1px solid #DEE5ED; }
        .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .error-ques-info .star-wrap {
          display: inline-block; }
          .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .error-ques-info .star-wrap .difficulty {
            margin-right: 10px;
            font-size: 14px;
            color: #6C7C93; }
          .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .error-ques-info .star-wrap .star-box {
            position: relative;
            top: 1px;
            font-size: 0;
            height: 14px; }
            .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .error-ques-info .star-wrap .star-box .star {
              display: inline-block;
              width: 14px;
              height: 14px;
              margin-right: 3px;
              background: url("../images/task-center/star.png") no-repeat center center;
              background-size: 100% 100%; }
              .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .error-ques-info .star-wrap .star-box .star.full {
                background: url("../images/task-center/star-full.png") no-repeat center center;
                background-size: 100% 100%; }
        .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .error-ques-info .line {
          display: inline-block;
          width: 1px;
          height: 12px;
          margin: 0 10px;
          background: #DEE5ED; }
        .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .error-ques-info .error-num {
          color: #6C7C93;
          font-size: 14px; }
        .web-wrap .task .task-center-right .task-detail-exercise.error-ques-exercise .module .error-ques-info .btn-style.normal {
          min-width: 84px;
          height: 32px;
          line-height: 32px;
          margin-top: 4px;
          padding: 0 12px;
          border-radius: 16px; }
  .web-wrap .btn-style.normal.stroke-blue {
    line-height: 36px;
    border-width: 1px; }
    .web-wrap .btn-style.normal.stroke-blue.disabled {
      border: 1px solid #C8E0FF;
      background: #fff;
      color: #C8E0FF; }
  .web-wrap .btn-style.normal {
    min-width: 110px;
    font-size: 14px;
    height: 36px;
    line-height: 36px;
    border-radius: 36px;
    text-align: center; }
  .web-wrap .btn-style.normal.stroke-blue:hover,
  .web-wrap .btn-style.normal.full-blue:hover {
    line-height: 36px; }
  .web-wrap .task .el-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100px;
    background-color: #fff; }
  .web-wrap .task .el-pagination li,
  .web-wrap .task .el-pagination .btn-next,
  .web-wrap .task .el-pagination .btn-prev {
    width: auto !important;
    height: 24px !important;
    line-height: 22px !important;
    padding: 0 9px !important;
    margin: 0 3px !important;
    background-color: #fff !important;
    border-radius: 4px !important;
    border: 1px solid #D8DEDF !important;
    font-size: 12px !important;
    color: #666 !important;
    text-align: center !important;
    font-weight: normal !important; }
    .web-wrap .task .el-pagination li .iconfont,
    .web-wrap .task .el-pagination .btn-next .iconfont,
    .web-wrap .task .el-pagination .btn-prev .iconfont {
      font-size: 14px !important;
      color: #666 !important; }
    .web-wrap .task .el-pagination li.ellip,
    .web-wrap .task .el-pagination .btn-next.ellip,
    .web-wrap .task .el-pagination .btn-prev.ellip {
      line-height: normal; }
    .web-wrap .task .el-pagination li:hover,
    .web-wrap .task .el-pagination .btn-next:hover,
    .web-wrap .task .el-pagination .btn-prev:hover {
      color: #368FFF !important; }
      .web-wrap .task .el-pagination li:hover .iconfont,
      .web-wrap .task .el-pagination .btn-next:hover .iconfont,
      .web-wrap .task .el-pagination .btn-prev:hover .iconfont {
        color: #368FFF; }
    .web-wrap .task .el-pagination li.active,
    .web-wrap .task .el-pagination .btn-next.active,
    .web-wrap .task .el-pagination .btn-prev.active {
      background: #368FFF !important;
      color: #fff !important;
      border: 1px solid #368FFF !important; }
  .web-wrap .task .el-pagination .btn-next .el-icon,
  .web-wrap .task .el-pagination .btn-prev .el-icon {
    font-size: 14px !important;
    color: #666 !important; }
  .web-wrap .task .el-pagination .btn-next:hover,
  .web-wrap .task .el-pagination .btn-prev:hover {
    color: #368FFF !important; }
    .web-wrap .task .el-pagination .btn-next:hover .el-icon,
    .web-wrap .task .el-pagination .btn-prev:hover .el-icon {
      color: #368FFF !important; }
  .web-wrap .task .el-pagination__editor.el-input {
    width: auto !important; }
  .web-wrap .task .el-pagination__jump {
    height: auto !important;
    margin-left: 30px !important;
    line-height: 24px !important;
    font-size: 12px !important;
    color: #666 !important; }
    .web-wrap .task .el-pagination__jump input {
      width: 34px !important;
      height: 24px !important;
      line-height: 22px !important;
      margin: 0  6px !important;
      background-color: #fff !important;
      border-radius: 4px !important;
      border: 1px solid #D8DEDF !important;
      font-size: 12px !important;
      color: #666 !important;
      text-align: center !important;
      outline: none !important; }
      .web-wrap .task .el-pagination__jump input:focus {
        border: 1px solid #368FFF !important; }
  .web-wrap .task-detail-exercise .module .exercise-answer-box .answer-correct-list li strong.fraction .before {
    margin-right: 3px; }
  .web-wrap .task-detail-exercise .module .exercise-answer-box .answer-correct-list li strong.fraction .num .bottom:before {
    min-width: 12px;
    padding: 0 2px;
    height: 1px; }
  .web-wrap .task-detail-main strong.fraction .before {
    margin-right: 3px; }
  .web-wrap .task-detail-main strong.fraction .num .bottom:before {
    min-width: 12px;
    padding: 0 2px;
    height: 1px; }
  .web-wrap .content-wrap {
    width: 1000px;
    margin: 0 auto; }
    .web-wrap .content-wrap.clock-task-wrap {
      position: relative;
      padding-top: 50px; }
      .web-wrap .content-wrap.clock-task-wrap .task-report-header {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 50px;
        line-height: 50px;
        padding: 0 12px;
        background: #fff; }
        .web-wrap .content-wrap.clock-task-wrap .task-report-header h2 {
          font-size: 14px;
          font-weight: bold; }
        .web-wrap .content-wrap.clock-task-wrap .task-report-header .click-able {
          min-width: 300px;
          cursor: pointer; }
          .web-wrap .content-wrap.clock-task-wrap .task-report-header .click-able .icon-ZK-PC-arrow-right {
            font-size: 14px;
            margin-right: 6px; }
        .web-wrap .content-wrap.clock-task-wrap .task-report-header .clock-operate span {
          color: #333;
          font-size: 14px; }
          .web-wrap .content-wrap.clock-task-wrap .task-report-header .clock-operate span em {
            color: #368FFF; }
        .web-wrap .content-wrap.clock-task-wrap .task-report-header .clock-operate .btn-style.normal {
          margin-left: 25px;
          min-width: 84px;
          height: 32px;
          line-height: 32px;
          border-radius: 4px; }

.task-web-header {
  height: 40px;
  background: linear-gradient(-90deg, #0ba6fe 0%, #368fff 100%); }

.task-web-wrap .task-center-right.pt0 {
  padding-top: 0; }
.task-web-wrap .task-center-header {
  display: block;
  justify-content: inherit;
  align-items: inherit;
  height: 50px;
  padding: 0; }
  .task-web-wrap .task-center-header .click-able {
    line-height: 50px;
    min-width: 300px;
    margin-left: 12px;
    color: #333;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer; }
    .task-web-wrap .task-center-header .click-able .icon-ZK-PC-arrow-right {
      font-size: 14px;
      font-weight: bold;
      margin-right: 6px; }
  .task-web-wrap .task-center-header .task-breadcrumb-tab a {
    line-height: 50px;
    font-size: 14px;
    min-width: auto;
    padding: 0 18px;
    margin: 0 12px; }
    .task-web-wrap .task-center-header .task-breadcrumb-tab a.active {
      position: relative;
      border-bottom: 0; }
      .task-web-wrap .task-center-header .task-breadcrumb-tab a.active:after {
        content: '';
        position: absolute;
        bottom: 1px;
        left: 0;
        width: 100%;
        height: 2px;
        background: #368FFF; }
  .task-web-wrap .task-center-header .arrange-btn {
    width: 120px;
    height: 36px;
    line-height: 36px;
    margin: 7px 12px 0 0;
    border-radius: 18px;
    font-size: 14px; }
    .task-web-wrap .task-center-header .arrange-btn .iconfont.icon-ZK-PC-add {
      width: 16px;
      height: 16px;
      line-height: 16px;
      background: #fff;
      border-radius: 50%;
      color: #368FFF;
      font-size: 16px; }
  .task-web-wrap .task-center-header .task-title {
    float: left;
    line-height: 50px;
    padding-left: 12px;
    color: #333;
    font-size: 14px;
    font-weight: bold; }
  .task-web-wrap .task-center-header .select-wrap {
    /*position: absolute;
    top: 9px;
    right: 12px;*/
    margin: 9px 12px 0 0; }
    .task-web-wrap .task-center-header .select-wrap .select-active {
      width: 140px;
      height: 32px;
      line-height: 32px;
      padding: 0 20px 0 9px;
      font-size: 14px;
      border: 1px solid #DEE5ED;
      border-radius: 4px; }
      .task-web-wrap .task-center-header .select-wrap .select-active::placeholder {
        font-size: 14px; }
    .task-web-wrap .task-center-header .select-wrap .select-btn {
      top: 10px;
      right: 8px;
      font-size: 14px; }
    .task-web-wrap .task-center-header .select-wrap .select-list {
      top: 34px;
      padding: 4px 0; }
      .task-web-wrap .task-center-header .select-wrap .select-list li {
        font-size: 14px;
        height: 28px;
        line-height: 28px;
        padding: 0 12px; }
  .task-web-wrap .task-center-header .error-book-select {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 0; }
    .task-web-wrap .task-center-header .error-book-select .select-wrap {
      position: relative;
      display: inline-block; }
  .task-web-wrap .task-center-header .download-error-book {
    width: 100px;
    height: 32px;
    line-height: 32px;
    margin: 9px 12px 0 12px;
    border-radius: 4px;
    font-size: 14px;
    text-align: center; }
.task-web-wrap .task-detail-main {
  margin-left: 0; }
.task-web-wrap .task-detail-share {
  padding: 12px; }
  .task-web-wrap .task-detail-share .tag-time {
    margin-bottom: 12px; }
  .task-web-wrap .task-detail-share .task-module {
    border-radius: 4px;
    padding: 24px;
    margin-bottom: 12px; }
  .task-web-wrap .task-detail-share .module-header {
    padding: 0; }
    .task-web-wrap .task-detail-share .module-header .student-img {
      width: 50px;
      height: 50px;
      margin-right: 15px; }
    .task-web-wrap .task-detail-share .module-header .student-name {
      font-size: 20px; }
    .task-web-wrap .task-detail-share .module-header .task-time {
      margin-top: 12px;
      font-size: 16px;
      line-height: 16px; }
    .task-web-wrap .task-detail-share .module-header .operate-box {
      top: 0; }
      .task-web-wrap .task-detail-share .module-header .operate-box .iconfont {
        font-size: 18px; }
  .task-web-wrap .task-detail-share .module-content .show-text {
    margin: 24px 0 0 0;
    font-size: 20px;
    line-height: 30px; }
  .task-web-wrap .task-detail-share .module-content .task-probar {
    height: 60px;
    padding: 0 20px 0 17px;
    margin: 32px 0 0;
    border-radius: 30px; }
    .task-web-wrap .task-detail-share .module-content .task-probar .task-left-wrap .task-play {
      height: 60px;
      line-height: 60px; }
      .task-web-wrap .task-detail-share .module-content .task-probar .task-left-wrap .task-play .iconfont {
        margin-right: 16px;
        font-size: 36px; }
      .task-web-wrap .task-detail-share .module-content .task-probar .task-left-wrap .task-play .task-text {
        font-size: 16px; }
    .task-web-wrap .task-detail-share .module-content .task-probar .task-left-wrap .download {
      margin-left: 10px; }
      .task-web-wrap .task-detail-share .module-content .task-probar .task-left-wrap .download .iconfont {
        font-size: 20px; }
    .task-web-wrap .task-detail-share .module-content .task-probar .task-pro-wrap {
      width: 360px;
      height: 60px;
      line-height: 60px;
      margin: 0 10px; }
      .task-web-wrap .task-detail-share .module-content .task-probar .task-pro-wrap .task-process-outer {
        height: 5px;
        border-radius: 5px; }
        .task-web-wrap .task-detail-share .module-content .task-probar .task-pro-wrap .task-process-outer .task-process-inner {
          border-radius: 5px; }
          .task-web-wrap .task-detail-share .module-content .task-probar .task-pro-wrap .task-process-outer .task-process-inner i.task-circle-going {
            margin-left: -8px;
            margin-top: -7px;
            width: 19px;
            height: 19px; }
  .task-web-wrap .task-detail-share .module-content .share-operate-box {
    font-size: 18px;
    margin-top: 18px; }
    .task-web-wrap .task-detail-share .module-content .share-operate-box .share-box img {
      width: 20px;
      height: 20px;
      margin-right: 9px; }
    .task-web-wrap .task-detail-share .module-content .share-operate-box .share-box span {
      font-size: 18px; }
    .task-web-wrap .task-detail-share .module-content .share-operate-box .click-num img {
      width: 24px;
      height: 20px;
      margin-right: 7px; }
    .task-web-wrap .task-detail-share .module-content .share-operate-box .click-num span {
      font-size: 18px; }
    .task-web-wrap .task-detail-share .module-content .share-operate-box .comment-num {
      margin-left: 20px; }
      .task-web-wrap .task-detail-share .module-content .share-operate-box .comment-num img {
        width: 22px;
        height: 19px;
        margin-right: 7px; }
      .task-web-wrap .task-detail-share .module-content .share-operate-box .comment-num span {
        font-size: 18px; }
  .task-web-wrap .task-detail-share .module-content .assess-box {
    margin-top: 16px;
    padding: 0 17px; }
    .task-web-wrap .task-detail-share .module-content .assess-box .assess-people {
      padding: 18px 0;
      font-size: 18px; }
      .task-web-wrap .task-detail-share .module-content .assess-box .assess-people img {
        width: 20px;
        height: 20px;
        margin-right: 10px; }
    .task-web-wrap .task-detail-share .module-content .assess-box .assess-text {
      padding: 20px 0 5px 0; }
      .task-web-wrap .task-detail-share .module-content .assess-box .assess-text P {
        margin: 0 0 16px 0;
        font-size: 18px; }
      .task-web-wrap .task-detail-share .module-content .assess-box .assess-text .comment-more {
        margin: 0 0 15px 0;
        font-size: 18px; }
  .task-web-wrap .task-detail-share .module-content .show-img {
    margin-top: 0; }
    .task-web-wrap .task-detail-share .module-content .show-img ul {
      margin-top: 8px;
      margin-right: -28px; }
      .task-web-wrap .task-detail-share .module-content .show-img ul li {
        width: 217px;
        height: 217px;
        margin: 20px 20px 0 0; }
        .task-web-wrap .task-detail-share .module-content .show-img ul li.loading img {
          animation: rotate 1.5s linear infinite;
          object-fit: cover; }
        .task-web-wrap .task-detail-share .module-content .show-img ul li.pic-none {
          background: #f0f6fb url("../images/clock-task/pic-none.png") no-repeat center;
          background-size: 78px 58px; }
    .task-web-wrap .task-detail-share .module-content .show-img.single-row li {
      width: 480px;
      height: 360px; }
    .task-web-wrap .task-detail-share .module-content .show-img.single-col li {
      width: 336px;
      height: 448px; }
  .task-web-wrap .task-detail-share .module-content .show-video {
    width: 353px;
    height: 467px;
    margin-top: 30px; }
    .task-web-wrap .task-detail-share .module-content .show-video .video-box {
      width: 353px;
      height: 467px; }
      .task-web-wrap .task-detail-share .module-content .show-video .video-box .video-operate-box {
        height: 38px;
        font-size: 14px; }
        .task-web-wrap .task-detail-share .module-content .show-video .video-box .video-operate-box .left {
          padding: 0 10px 0 15px; }
        .task-web-wrap .task-detail-share .module-content .show-video .video-box .video-operate-box .right {
          padding: 10px; }
        .task-web-wrap .task-detail-share .module-content .show-video .video-box .video-operate-box .icon.play {
          width: 12px;
          height: 20px; }
        .task-web-wrap .task-detail-share .module-content .show-video .video-box .video-operate-box .icon.enlarge {
          width: 16px;
          height: 16px; }
        .task-web-wrap .task-detail-share .module-content .show-video .video-box .video-operate-box .time {
          margin-left: 12px; }
        .task-web-wrap .task-detail-share .module-content .show-video .video-box .video-operate-box .video-pro-wrap {
          height: 38px;
          line-height: 38px;
          margin-left: 8px; }
          .task-web-wrap .task-detail-share .module-content .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer {
            height: 5px;
            border-radius: 5px; }
            .task-web-wrap .task-detail-share .module-content .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer .video-process-inner {
              border-radius: 5px; }
              .task-web-wrap .task-detail-share .module-content .show-video .video-box .video-operate-box .video-pro-wrap .video-process-outer .video-process-inner i.video-circle-going {
                margin-left: -8px;
                margin-top: -7px;
                width: 19px;
                height: 19px; }
.task-web-wrap .task-info-wrap {
  min-height: 100%;
  padding: 12px; }
  .task-web-wrap .task-info-wrap .task-center-date {
    line-height: 35px;
    padding: 0;
    margin-top: -12px;
    font-size: 12px;
    color: #999; }
  .task-web-wrap .task-info-wrap .el-row:first-child .task-center-date {
    margin-top: -12px; }
  .task-web-wrap .task-info-wrap .task-info-panel {
    display: block;
    justify-content: inherit;
    align-items: inherit;
    padding: 0 32px 0 24px;
    margin-top: 0;
    margin-bottom: 12px;
    border-radius: 4px; }
    .task-web-wrap .task-info-wrap .task-info-panel .correct-student {
      margin-right: 30px;
      font-size: 14px;
      color: #368FFF; }
    .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont {
      padding: 26px 0 24px 0; }
      .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .book-icon {
        float: left;
        width: 48px;
        height: 54px;
        margin-right: 15px; }
        .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .book-icon img {
          width: 100%;
          height: 100%; }
      .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .book-message {
        overflow: hidden;
        padding-top: 3px; }
        .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .book-message .title {
          font-size: 18px;
          color: #333;
          font-weight: bold; }
        .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .book-message p {
          color: #666; }
      .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .vm {
        display: inline-block;
        vertical-align: middle; }
      .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .daka-icon {
        width: 64px;
        height: 64px;
        margin-right: 20px;
        background: url("../images/task-web/daka-icon.png") no-repeat center; }
      .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title {
        margin-bottom: 10px; }
        .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .title {
          font-size: 16px; }
        .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .label {
          min-width: 60px;
          height: 22px;
          line-height: 21px;
          padding: 0 12px;
          margin-right: 10px;
          text-align: center;
          font-size: 12px;
          color: #fff;
          border-radius: 22px;
          vertical-align: 3px; }
          .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .label.yellow {
            background: rgba(248, 169, 71, 0.2);
            color: #F8A947; }
          .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .label.green {
            background: rgba(34, 212, 200, 0.2);
            color: #22D4C8; }
          .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .label.blue {
            background: rgba(80, 158, 255, 0.2);
            color: #509EFF; }
          .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .label.red {
            background: rgba(159, 161, 245, 0.2);
            color: #9FA1F5; }
          .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .label.default {
            background: rgba(184, 200, 208, 0.2);
            color: #B8C8D0; }
          .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .label.subject {
            min-width: 48px;
            background: #fff; }
            .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .label.subject.yellow {
              border: 1px solid #F8A947; }
            .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .label.subject.green {
              border: 1px solid #22D4C8; }
            .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .label.subject.blue {
              border: 1px solid #509EFF; }
            .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .label.subject.red {
              border: 1px solid #9FA1F5; }
            .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-title .label.subject.default {
              border: 1px solid #B8C8D0; }
      .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont p {
        margin-top: 5px;
        font-size: 14px;
        color: #999; }
      .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-teacher {
        color: #666; }
        .task-web-wrap .task-info-wrap .task-info-panel .task-info-cont .task-teacher .cut-line {
          display: inline-block;
          width: 1px;
          height: 10px;
          margin: 0 6px;
          background: #dee5ed; }
    .task-web-wrap .task-info-wrap .task-info-panel .student-task-opera .btn-style {
      margin-top: 32px; }
    .task-web-wrap .task-info-wrap .task-info-panel .student-task-opera .rate {
      display: inline-block;
      padding: 39px 40px;
      margin-right: -38px;
      color: #368FFF;
      font-size: 18px;
      cursor: pointer; }
    .task-web-wrap .task-info-wrap .task-info-panel .student-task-opera .loading {
      display: inline-block;
      width: 36px;
      height: 36px;
      margin: 39px 0 0 0;
      background: url("../images/task-detail/loading-icon.png") no-repeat center; }
      .task-web-wrap .task-info-wrap .task-info-panel .student-task-opera .loading.active {
        animation: loadrotate 1s infinite linear; }
@keyframes loadrotate {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }
    .task-web-wrap .task-info-wrap .task-info-panel .progress-btn {
      position: relative;
      width: 110px;
      height: 36px;
      line-height: 34px;
      margin-top: 43px;
      background: #fff;
      border: 1px solid #368FFF;
      border-radius: 18px;
      color: #368FFF;
      text-align: center;
      overflow: hidden; }
      .task-web-wrap .task-info-wrap .task-info-panel .progress-btn i {
        position: absolute;
        display: inline-block;
        top: 0;
        left: 0;
        width: 0;
        height: 100%;
        background: rgba(54, 143, 255, 0.2);
        border-radius: 18px 0 0 18px;
        transition: width 0.2s; }
    .task-web-wrap .task-info-wrap .task-info-panel .arrow-right-btn {
      display: inline-block;
      width: 36px;
      height: 36px;
      padding: 57px 60px;
      margin-right: -38px;
      background: url("../images/task-web/arrow-right.png") no-repeat center; }
    .task-web-wrap .task-info-wrap .task-info-panel .btn-style {
      margin-top: 43px; }
    .task-web-wrap .task-info-wrap .task-info-panel .finish-tag {
      margin: 50px 24px 0 0;
      font-size: 14px;
      color: #999; }
    .task-web-wrap .task-info-wrap .task-info-panel .operate-box {
      display: none;
      top: 10px;
      right: 10px; }
      .task-web-wrap .task-info-wrap .task-info-panel .operate-box .iconfont {
        font-size: 16px; }
      .task-web-wrap .task-info-wrap .task-info-panel .operate-box .return-back-btn {
        font-size: 14px; }
    .task-web-wrap .task-info-wrap .task-info-panel:hover .operate-box {
      display: block; }
  .task-web-wrap .task-info-wrap .class-select-panel {
    padding: 12px 16px;
    background: #F3F7FB;
    border: 0;
    box-shadow: none; }
    .task-web-wrap .task-info-wrap .class-select-panel label {
      font-size: 14px;
      color: #666; }
    .task-web-wrap .task-info-wrap .class-select-panel .select-wrap {
      display: inline-block; }
      .task-web-wrap .task-info-wrap .class-select-panel .select-wrap .select-active {
        width: auto;
        min-width: 78px;
        height: 20px;
        padding: 0 20px 0 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #666;
        font-size: 14px;
        overflow: inherit;
        text-overflow: inherit;
        white-space: nowrap;
        cursor: pointer; }
      .task-web-wrap .task-info-wrap .class-select-panel .select-wrap .select-btn {
        position: absolute;
        top: 5px;
        right: 0;
        font-size: 14px;
        color: #7C91A8;
        transform: rotate(360deg);
        transition: 0.2s all; }
      .task-web-wrap .task-info-wrap .class-select-panel .select-wrap .select-list {
        display: block;
        position: absolute;
        top: 25px;
        left: -3px;
        z-index: 10;
        width: 120px;
        padding: 4px 0;
        background: #fff;
        border: 1px solid #DEE5ED;
        box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.2);
        border-radius: 4px; }
        .task-web-wrap .task-info-wrap .class-select-panel .select-wrap .select-list li {
          height: 32px;
          line-height: 32px;
          padding: 0 12px;
          font-size: 14px;
          color: #666;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          cursor: pointer; }
          .task-web-wrap .task-info-wrap .class-select-panel .select-wrap .select-list li.active {
            color: #368FFF; }
  .task-web-wrap .task-info-wrap .task-center-page {
    height: 24px; }
    .task-web-wrap .task-info-wrap .task-center-page a {
      height: 24px;
      line-height: 22px;
      padding: 0 9px;
      margin: 0 3px;
      border-radius: 4px;
      font-size: 12px;
      color: #333; }
      .task-web-wrap .task-info-wrap .task-center-page a.active {
        color: #fff; }
        .task-web-wrap .task-info-wrap .task-center-page a.active:hover {
          color: #fff; }
      .task-web-wrap .task-info-wrap .task-center-page a:hover {
        color: #368FFF; }
    .task-web-wrap .task-info-wrap .task-center-page .skip {
      margin-left: 30px;
      font-size: 12px;
      color: #333; }
      .task-web-wrap .task-info-wrap .task-center-page .skip input[type=text] {
        width: 34px;
        height: 24px;
        line-height: 24px;
        margin: 0 6px;
        border-radius: 4px;
        font-size: 12px;
        color: #333; }
  .task-web-wrap .task-info-wrap.error-info .task-info-cont {
    padding: 32px 0 30px 0; }
.task-web-wrap .zh-resource-none .btn-style {
  margin-top: 20px; }
.task-web-wrap .zh-resource-none .img-none {
  width: 137px;
  height: 116px; }
.task-web-wrap .zh-resource-none .txt {
  margin-top: 12px;
  font-size: 12px;
  color: #999; }
.task-web-wrap .arrange-wrap {
  position: relative; }
.task-web-wrap .task-choose-subject {
  position: absolute;
  top: 48px;
  right: 12px;
  z-index: 1004;
  width: 240px;
  max-height: 215px;
  padding: 15px 0 15px 20px;
  background-color: #fff;
  border: 1px solid #DEE5ED;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.4);
  border-radius: 4px;
  font-size: 14px;
  color: #333; }
  .task-web-wrap .task-choose-subject .title {
    height: 15px;
    font-size: 14px; }
  .task-web-wrap .task-choose-subject .subject-list-wrap {
    margin-top: 10px;
    margin-right: -6px;
    padding-right: 20px;
    max-height: 160px;
    overflow-y: auto;
    font-size: 0; }
    .task-web-wrap .task-choose-subject .subject-list-wrap li {
      display: inline-block;
      width: 46%;
      margin: 6px 6px 6px 0;
      height: 28px;
      line-height: 28px;
      background-color: #F0F2F5;
      border-radius: 14px;
      font-size: 14px;
      cursor: pointer;
      text-align: center; }
      .task-web-wrap .task-choose-subject .subject-list-wrap li:hover {
        color: #368FFF; }
      .task-web-wrap .task-choose-subject .subject-list-wrap li.active {
        background-color: #368FFF;
        color: #fff; }
  .task-web-wrap .task-choose-subject.modify .title .operate {
    margin-left: 6px;
    font-size: 12px;
    color: #7F8893;
    vertical-align: baseline; }
    .task-web-wrap .task-choose-subject.modify .title .operate:hover {
      color: #368FFF; }

.do-practice-wrap {
  height: 100%; }
  .do-practice-wrap .do-practice-ques {
    float: left;
    width: calc(100% - 220px);
    height: 100%;
    padding: 40px;
    background: #eff3f7;
    border-right: 1px solid #d8dedf;
    box-sizing: border-box;
    overflow-y: auto; }
    .do-practice-wrap .do-practice-ques .ques-item-title {
      margin-bottom: 13px;
      font-size: 14px;
      color: #6c7c93; }
    .do-practice-wrap .do-practice-ques .ques-stem {
      margin-bottom: 25px;
      font-size: 18px;
      color: #333;
      line-height: 38px; }
      .do-practice-wrap .do-practice-ques .ques-stem .ques-stem-pic {
        margin-top: 20px; }
      .do-practice-wrap .do-practice-ques .ques-stem input {
        width: 80px;
        height: 36px;
        line-height: 36px;
        margin: 0 10px;
        background: #fff;
        border: 1px solid #e0e5e5;
        border-radius: 4px;
        text-align: center;
        font-size: 18px; }
        .do-practice-wrap .do-practice-ques .ques-stem input:focus {
          border: 1px solid #368FFF; }
      .do-practice-wrap .do-practice-ques .ques-stem .fraction {
        width: 90px;
        height: 48px;
        line-height: normal;
        margin: 0 10px;
        padding: 0 10px;
        background: #fff;
        border: 1px solid #e0e5e5;
        border-radius: 4px;
        text-align: center;
        font-size: 18px; }
        .do-practice-wrap .do-practice-ques .ques-stem .fraction input {
          width: 30px;
          height: 20px;
          line-height: 20px;
          margin: 0;
          border: 0; }
        .do-practice-wrap .do-practice-ques .ques-stem .fraction .before {
          display: inline-block;
          width: 30px;
          height: 42px;
          line-height: 42px;
          vertical-align: middle; }
        .do-practice-wrap .do-practice-ques .ques-stem .fraction .num {
          position: relative;
          display: inline-block;
          vertical-align: middle;
          width: 30px; }
          .do-practice-wrap .do-practice-ques .ques-stem .fraction .num:after {
            content: '';
            position: absolute;
            top: 50%;
            left: 0;
            width: 100%;
            height: 1px;
            background: #333; }
    .do-practice-wrap .do-practice-ques .choose-item li {
      width: 320px;
      min-height: 48px;
      background: #fff;
      padding: 1px;
      margin-bottom: 20px;
      border: 1px solid #e0e5e5;
      border-radius: 8px;
      cursor: pointer; }
      .do-practice-wrap .do-practice-ques .choose-item li .choose-number {
        float: left;
        height: 100%;
        line-height: 48px;
        width: 46px;
        background: #d7e9ff;
        border-radius: 8px 0 0 8px;
        text-align: center;
        font-size: 16px; }
      .do-practice-wrap .do-practice-ques .choose-item li .choose-main {
        width: calc(100% - 46px);
        float: left;
        font-size: 16px;
        padding: 11px 0 0 20px; }
      .do-practice-wrap .do-practice-ques .choose-item li.vertical {
        width: 164px;
        margin-right: 7px;
        display: inline-block; }
        .do-practice-wrap .do-practice-ques .choose-item li.vertical .choose-number {
          float: none;
          width: 100%;
          height: 46px;
          line-height: 46px;
          border-radius: 0 0 8px 8px; }
        .do-practice-wrap .do-practice-ques .choose-item li.vertical .choose-main {
          float: none;
          width: 100%;
          padding: 0;
          border-radius: 8px 8px 0 0; }
          .do-practice-wrap .do-practice-ques .choose-item li.vertical .choose-main .text {
            min-height: 35px;
            padding-top: 6px;
            text-align: center;
            font-size: 16px; }
          .do-practice-wrap .do-practice-ques .choose-item li.vertical .choose-main .pic {
            width: 100%;
            height: 95px;
            border-radius: 8px 8px 0 0;
            overflow: hidden; }
            .do-practice-wrap .do-practice-ques .choose-item li.vertical .choose-main .pic img {
              width: 100%;
              height: 100%; }
      .do-practice-wrap .do-practice-ques .choose-item li.active {
        padding: 0;
        border: 2px solid #368FFF; }
        .do-practice-wrap .do-practice-ques .choose-item li.active .choose-number {
          color: #368FFF; }
        .do-practice-wrap .do-practice-ques .choose-item li.active .choose-main {
          color: #368FFF; }
    .do-practice-wrap .do-practice-ques .judge-item li {
      width: 320px;
      height: 48px;
      line-height: 48px;
      background: #fff;
      padding: 1px;
      margin-bottom: 20px;
      border: 1px solid #e0e5e5;
      border-radius: 8px;
      cursor: pointer;
      text-align: center; }
      .do-practice-wrap .do-practice-ques .judge-item li .icon-ZK-PC-duihao {
        font-size: 50px; }
      .do-practice-wrap .do-practice-ques .judge-item li .icon-close {
        font-size: 30px; }
      .do-practice-wrap .do-practice-ques .judge-item li.active {
        padding: 0;
        border: 2px solid #368FFF; }
        .do-practice-wrap .do-practice-ques .judge-item li.active .icon-ZK-PC-duihao {
          color: #368FFF; }
        .do-practice-wrap .do-practice-ques .judge-item li.active .icon-close {
          color: #368FFF; }
    .do-practice-wrap .do-practice-ques.practice-report {
      position: relative;
      padding: 50px 0 0 0; }
      .do-practice-wrap .do-practice-ques.practice-report .practice-report-header {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 50px;
        padding: 0;
        background: #fff;
        border-bottom: 1px solid #DEE5ED; }
        .do-practice-wrap .do-practice-ques.practice-report .practice-report-header .task-title {
          line-height: 50px;
          padding-left: 12px;
          color: #333;
          font-size: 14px;
          font-weight: bold; }
      .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise {
        padding: 12px; }
        .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .count-tag {
          margin-bottom: 11px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .count-tag span {
            color: #999;
            font-size: 12px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .count-tag .detail span {
            color: #666; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .count-tag .detail span em {
              color: #368FFF; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .count-tag .detail:active {
            color: #368FFF; }
        .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-title {
          height: 53px;
          line-height: 53px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-title span {
            font-size: 14px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-title i.iconfont {
            font-size: 14px;
            cursor: pointer; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-title.on i.iconfont:before {
            content: "\e77b"; }
        .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .colorful-task-detail {
          padding: 19px 0;
          border-top: 1px solid #DEE5ED;
          font-size: 14px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .colorful-task-detail .task-detail-pic li {
            display: inline-block;
            width: 100px;
            height: 100px;
            margin: 10px 10px 0 0; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .colorful-task-detail .task-detail-pic li img {
              width: 100%;
              height: 100%;
              object-fit: cover; }
        .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module {
          padding: 0 20px;
          margin-bottom: 12px;
          border-radius: 4px;
          border: 1px solid #DEE5ED; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module.module-pandect .tag {
            margin: 20px 0 11px 0;
            font-size: 12px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module.module-pandect .tag span {
              margin: 0 12px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module.module-pandect .evaluate {
            padding: 16px 12px 19px;
            margin-bottom: 20px;
            background: #F3F7FB;
            border-radius: 4px;
            font-size: 14px;
            color: #333; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .module-title {
            margin-top: 20px;
            font-size: 16px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .module-title .play {
              width: 106px;
              height: 30px;
              line-height: 28px;
              margin-left: 20px;
              border: 1px solid #D8DEDF;
              font-size: 14px;
              border-radius: 15px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .module-title .play i {
                width: 18px;
                height: 15px;
                margin: -2px 10px 0 0;
                background: url(../images/task-detail/play3.png) no-repeat center;
                background-size: 18px 15px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .module-title .play.active i {
                animation: webPlay 1.5s infinite;
                -webkit-animation: webPlay 1.5s infinite; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list {
            margin-bottom: 20px;
            margin-top: 20px;
            margin-right: -20px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list li {
              width: 99px;
              margin: 0 20px 20px 0;
              border-radius: 10px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list li .text {
                font-size: 14px;
                line-height: 60px;
                border-radius: 10px 10px 0 0; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list li .num {
                font-size: 14px;
                line-height: 50px;
                border-radius: 0 0 10px 10px; }
                .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list li .num .icon-ZK-PC-arrow-bottom {
                  margin-left: 10px;
                  font-size: 14px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list li .student-grade .play i {
                margin: 0 10px 0 0;
                font-size: 16px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list.listen-list-type .list-detail {
              display: none;
              position: absolute;
              top: 74px;
              padding: 20px 20px 0;
              border-radius: 10px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list.listen-list-type .list-detail li {
                margin-right: 0;
                font-size: 14px; }
                .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list.listen-list-type .list-detail li span:first-child {
                  font-size: 14px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list.word-list-type1 li {
              width: auto; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list.word-list-type1 li .text {
                width: 136px;
                padding-left: 20px;
                line-height: 70px;
                border-radius: 10px 0 0 10px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list.word-list-type1 li .num {
                width: 82px;
                line-height: 70px;
                border-radius: 0 10px 10px 0; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list.word-list-type2 {
              margin-right: 0; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list.word-list-type2 li {
                width: 100%;
                margin-right: 0; }
                .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list.word-list-type2 li table .text {
                  padding: 20px;
                  line-height: normal;
                  border-radius: 10px 0 0 10px;
                  text-align: left; }
                .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list.word-list-type2 li table .num {
                  width: 120px;
                  line-height: normal;
                  border-radius: 0 10px 10px 0; }
                .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .module .word-list.word-list-type2 li table .title {
                  border-radius: 10px; }
        .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box {
          display: block;
          width: 100%;
          padding: 0;
          background-color: #fff;
          border: 0;
          box-shadow: none;
          border-radius: 0;
          font-size: 14px;
          color: #333; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .type {
            padding-top: 20px;
            font-size: 14px;
            color: #6C7C93; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .exercise {
            padding: 13px 0 12px;
            line-height: 24px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .exercise .answer {
              display: block; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .exercise .completion-img {
              width: 400px;
              height: 220px;
              margin: 10px 0 20px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .exercise .completion-cont li {
              display: flex;
              align-items: center;
              margin-top: 20px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .exercise .completion-cont li i {
                width: 60px;
                height: 34px;
                line-height: 34px;
                padding: 0 10px;
                border-radius: 4px;
                font-size: 14px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .judge-question > p {
            display: inline-block;
            vertical-align: middle; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .judge-question .icon-ZK-PC-duihao {
            font-size: 35px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .judge-question .icon-close {
            font-size: 20px;
            font-weight: bold; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box strong.fraction {
            position: absolute;
            top: -1px;
            left: 50%;
            transform: translateX(-50%);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            height: 34px;
            line-height: 34px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box strong.fraction .num .top,
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box strong.fraction .num .bottom {
              position: relative;
              display: block;
              line-height: 20px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank {
            position: relative;
            display: inline-block;
            min-width: 60px;
            height: 34px;
            line-height: 32px;
            padding: 0 8px;
            margin: 8px 5px;
            border: 1px solid #DEE5ED;
            border-radius: 4px;
            font-size: 14px;
            text-indent: 0; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank strong.fraction {
              position: absolute;
              top: -1px;
              left: 50%;
              transform: translateX(-50%);
              display: inline-flex;
              align-items: center;
              justify-content: center;
              height: 34px;
              line-height: 34px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank strong.fraction .before {
                margin-right: 3px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank strong.fraction .num {
                position: relative;
                display: inline-block;
                top: 0;
                text-align: center; }
                .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank strong.fraction .num .top,
                .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank strong.fraction .num .bottom {
                  position: relative;
                  display: block;
                  line-height: 20px; }
                .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank strong.fraction .num .bottom:before {
                  position: absolute;
                  content: '';
                  top: 0;
                  left: 50%;
                  transform: translateX(-50%);
                  width: 100%;
                  min-width: 12px;
                  padding: 0 2px;
                  height: 1px;
                  background: #333; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank.right {
              color: #24C366; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank.right strong.fraction .bottom:before {
                background: #24C366; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank#uright {
              color: #24C366; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank#uright strong.fraction .bottom:before {
                background: #24C366; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank.wrong {
              color: #FF543A; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .tea-fill-blank.wrong strong.fraction .bottom:before {
                background: #FF543A; }
        .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box {
          padding: 0 0 20px 0;
          border-top: 1px dashed #DEE5ED; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box .answer-correct-list {
            padding: 3px 12px 15px;
            margin-top: 12px;
            background: #F3F7FB;
            border-radius: 4px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box .answer-correct-list li {
            width: 100%;
            line-height: normal;
            font-size: 14px;
            color: #333; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box .answer-correct-list li .pic-input-wrap {
              margin-top: 10px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box .answer-correct-list li .tit {
              margin-top: 14px;
              font-size: 14px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box .answer-correct-list li .tit em {
                display: inline-block;
                width: 40px;
                height: 18px;
                line-height: 16px;
                margin-left: 10px;
                text-align: center;
                border-radius: 2px;
                font-size: 12px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box .answer-correct-list li .tit .iconfont {
                font-size: 14px;
                margin: -2px 0 0 10px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box .answer-correct-list li .txt {
              /* display: block;*/
              margin-top: 10px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box .answer-correct-list li .txt > em {
                display: contents;
                margin: 0 6px;
                color: #6C7C93;
                font-size: 14px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box .answer-correct-list li .icon-ZK-PC-duihao {
              font-size: 35px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box .answer-correct-list li .icon-close {
              font-size: 20px;
              font-weight: bold; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box strong.fraction {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            height: 34px;
            line-height: 34px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box strong.fraction .num .top,
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-answer-box strong.fraction .num .bottom {
              position: relative;
              display: block;
              line-height: 20px; }
        .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct {
          height: auto;
          padding: 20px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct .correct-table {
            height: auto;
            padding: 0; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct .correct-table table {
              font-size: 14px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct .correct-table table tr th,
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct .correct-table table tr td {
                line-height: 45px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct .correct-table table tr th:first-child,
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct .correct-table table tr td:first-child {
                padding-left: 20px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct .correct-table table tr td:last-child {
                padding-right: 20px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct strong.fraction {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            height: 34px;
            line-height: 32px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct strong.fraction .before {
              margin-right: 2px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct strong.fraction .num {
              top: -1px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct strong.fraction .num .top,
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct strong.fraction .num .bottom {
                line-height: 16px; }
              .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct strong.fraction .num .bottom:before {
                height: 1px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct .calc-ques .tea-fill-blank {
            position: relative;
            display: inline-block;
            min-width: 60px;
            height: 34px;
            line-height: 32px;
            padding: 0 10px;
            margin: 8px 5px;
            border: 1px solid #DEE5ED;
            border-radius: 4px;
            font-size: 14px;
            text-indent: 0; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct.calc-table-wrap .correct-table table tr th:last-child {
            padding-right: 20px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct.calc-table-wrap .correct-table table tr td.nest-table {
            padding: 0; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct.calc-table-wrap .correct-table table tr td.nest-table .tips {
              font-size: 14px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct.calc-table-wrap .multi-ques {
            padding: 10px 0; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct.calc-table-wrap .multi-ques .ques-choose .icon-ZK-PC-duihao {
              margin-right: 6px;
              font-size: 30px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct.calc-table-wrap .multi-ques .ques-choose .icon-close {
              font-size: 20px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct.calc-table-wrap .multi-ques.select-ques .ques-choose > span {
              line-height: 30px;
              font-size: 14px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct.calc-table-wrap .icon-ZK-PC-duihao {
            font-size: 30px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct.calc-table-wrap .icon-close {
            margin-right: 5px;
            font-size: 20px; }
        .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap {
          padding-bottom: 20px;
          border-bottom: 1px dashed #DEE5ED; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap:last-child {
            border-bottom: 0; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap .subtype {
            font-size: 14px;
            color: #333; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap .answer-wrap {
            display: flex;
            margin: 16px 0 12px 0; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap .answer-wrap .answer.right span {
              color: #24C366; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap .answer-wrap .answer.wrong span {
              color: #FF543A; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap .answer-wrap .answer.not-do span {
              color: #999; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap .answer-wrap .answer.half-right span {
              color: #FFAE00; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap .answer-wrap .answer .icon-ZK-PC-duihao {
              display: inline-block;
              margin-top: -7px;
              font-size: 35px; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap .answer-wrap .answer .icon-close {
              display: inline-block;
              margin-top: 3px;
              font-size: 20px; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap .exercise-answer-box {
            padding: 0;
            border-top: 0; }
          .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap .pic-input-wrap {
            margin-top: 0; }
            .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .sub-ques-wrap .pic-input-wrap li {
              width: 100px;
              height: 100px;
              margin: 0 12px 0 0;
              padding: 0; }
    .do-practice-wrap .do-practice-ques.practice-report-type {
      width: 100%;
      border-right: 0; }
  .do-practice-wrap .do-practice-sidebar {
    float: right;
    width: 220px;
    height: 100%;
    background: #fff;
    overflow-y: auto; }
    .do-practice-wrap .do-practice-sidebar .do-sidebar-top {
      padding: 20px;
      border-bottom: 1px solid #d8dedf; }
      .do-practice-wrap .do-practice-sidebar .do-sidebar-top .submit {
        width: 100%; }
      .do-practice-wrap .do-practice-sidebar .do-sidebar-top .num {
        margin-top: 10px;
        font-size: 14px;
        color: #999;
        text-align: center; }
        .do-practice-wrap .do-practice-sidebar .do-sidebar-top .num em {
          color: #368FFF; }
    .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom {
      padding: 16px 0 0 16px; }
      .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item > h2 {
        margin-bottom: 16px;
        font-size: 14px;
        color: #666; }
      .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list {
        font-size: 0; }
        .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li {
          display: inline-block;
          font-size: 14px;
          margin: 0 16px 16px 0; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li a {
            position: relative;
            display: inline-block;
            width: 34px;
            height: 34px;
            line-height: 34px;
            border-radius: 100%;
            border: 1px solid #d9dfe0;
            text-align: center;
            color: #333; }
            .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li a em {
              display: inline-block;
              position: absolute;
              top: -7px;
              right: -7px;
              width: 18px;
              height: 18px;
              line-height: 15px;
              padding-left: 2px;
              background: #fff;
              border: 1px solid #FF543A;
              border-radius: 50%;
              text-align: center;
              font-size: 12px;
              color: #FF543A;
              box-sizing: border-box; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.finish a {
            border: 1px solid #368FFF; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.active a {
            border: 1px solid #368FFF;
            background: #368FFF;
            color: #fff; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li:hover a {
            color: #368FFF; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.right a {
            background: #d3f3e0;
            border: 1px solid #d3f3e0; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.right:hover a {
            color: #24c366; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.right.active a {
            background: #24c366;
            border: 1px solid #24c366; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.right.active:hover a {
            color: #fff; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.wrong a {
            background: #ffddd8;
            border: 1px solid #ffddd8; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.wrong:hover a {
            color: #ff543a; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.wrong.active a {
            background: #ff543a;
            border: 1px solid #ff543a; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.wrong.active:hover a {
            color: #fff; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.half-right a {
            background: #FFF0CA;
            border: 1px solid #FFF0CA; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.half-right:hover a {
            color: #FFAE00; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.half-right.active a {
            background: #FFAE00;
            border: 1px solid #FFAE00; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.half-right.active:hover a {
            color: #fff; }
          .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.not-do a {
            position: relative;
            background: #EFF3F7;
            border: 1px solid #D8DEDF;
            color: #999; }
            .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.not-do a:hover {
              color: #999; }
            .do-practice-wrap .do-practice-sidebar .do-sidebar-bottom .item .ques-list li.not-do a:after {
              position: absolute;
              content: '';
              top: 15px;
              left: 6px;
              width: 20px;
              height: 2px;
              background: #999; }

.content-main-wrap {
  position: relative;
  height: 100%;
  background: #EFF3F7; }
  .content-main-wrap.calc-match-wrap {
    background: #EFF3F7 url("../images/task-web/match-bg.png") no-repeat center bottom; }
  .content-main-wrap .progress-wrap {
    position: relative;
    height: 4px;
    background: rgba(0, 0, 0, 0.4); }
    .content-main-wrap .progress-wrap .progress-bar {
      position: absolute;
      top: 0;
      left: 0;
      width: 0;
      height: 100%;
      background: #FFAE00; }
  .content-main-wrap .match-time {
    position: absolute;
    top: 16px;
    left: 50%;
    transform: translate(-50%, 0);
    min-width: 60px;
    height: 24px;
    line-height: 24px;
    padding: 0 10px;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 4px;
    font-size: 14px;
    color: #fff;
    text-align: center;
    box-sizing: border-box; }
  .content-main-wrap .match-ques-wrap {
    padding: 39px 150px 0;
    box-sizing: border-box; }
    .content-main-wrap .match-ques-wrap .ques-item-title {
      margin-bottom: 13px;
      font-size: 14px;
      color: #6c7c93; }
    .content-main-wrap .match-ques-wrap .ques-stem {
      margin-bottom: 25px;
      font-size: 18px;
      color: #333;
      line-height: 38px; }
      .content-main-wrap .match-ques-wrap .ques-stem .ques-stem-pic {
        margin-top: 20px; }
      .content-main-wrap .match-ques-wrap .ques-stem input {
        width: 80px;
        height: 36px;
        line-height: 36px;
        margin: 0 10px;
        background: #fff;
        border: 1px solid #e0e5e5;
        border-radius: 4px;
        text-align: center;
        font-size: 18px; }
        .content-main-wrap .match-ques-wrap .ques-stem input:focus {
          border: 1px solid #368FFF; }
      .content-main-wrap .match-ques-wrap .ques-stem .fraction {
        width: 90px;
        height: 48px;
        line-height: normal;
        margin: 0 10px;
        padding: 0 10px;
        background: #fff;
        border: 1px solid #e0e5e5;
        border-radius: 4px;
        text-align: center;
        font-size: 18px; }
        .content-main-wrap .match-ques-wrap .ques-stem .fraction input {
          width: 30px;
          height: 20px;
          line-height: 20px;
          margin: 0;
          border: 0; }
        .content-main-wrap .match-ques-wrap .ques-stem .fraction .before {
          display: inline-block;
          width: 30px;
          height: 42px;
          line-height: 42px;
          vertical-align: middle; }
        .content-main-wrap .match-ques-wrap .ques-stem .fraction .num {
          position: relative;
          display: inline-block;
          vertical-align: middle;
          width: 30px; }
          .content-main-wrap .match-ques-wrap .ques-stem .fraction .num:after {
            content: '';
            position: absolute;
            top: 50%;
            left: 0;
            width: 100%;
            height: 1px;
            background: #333; }
    .content-main-wrap .match-ques-wrap .choose-item li {
      width: 320px;
      min-height: 48px;
      background: #fff;
      padding: 1px;
      margin-bottom: 20px;
      border: 1px solid #e0e5e5;
      border-radius: 8px;
      cursor: pointer; }
      .content-main-wrap .match-ques-wrap .choose-item li .choose-number {
        float: left;
        height: 100%;
        line-height: 48px;
        width: 46px;
        background: #d7e9ff;
        border-radius: 8px 0 0 8px;
        text-align: center;
        font-size: 16px; }
      .content-main-wrap .match-ques-wrap .choose-item li .choose-main {
        width: calc(100% - 46px);
        float: left;
        font-size: 16px;
        padding: 11px 0 0 20px; }
      .content-main-wrap .match-ques-wrap .choose-item li.vertical {
        width: 164px;
        margin-right: 7px;
        display: inline-block; }
        .content-main-wrap .match-ques-wrap .choose-item li.vertical .choose-number {
          float: none;
          width: 100%;
          height: 46px;
          line-height: 46px;
          border-radius: 0 0 8px 8px; }
        .content-main-wrap .match-ques-wrap .choose-item li.vertical .choose-main {
          float: none;
          width: 100%;
          padding: 0;
          border-radius: 8px 8px 0 0; }
          .content-main-wrap .match-ques-wrap .choose-item li.vertical .choose-main .text {
            min-height: 35px;
            padding-top: 6px;
            text-align: center;
            font-size: 16px; }
          .content-main-wrap .match-ques-wrap .choose-item li.vertical .choose-main .pic {
            width: 100%;
            height: 95px;
            border-radius: 8px 8px 0 0;
            overflow: hidden; }
            .content-main-wrap .match-ques-wrap .choose-item li.vertical .choose-main .pic img {
              width: 100%;
              height: 100%; }
      .content-main-wrap .match-ques-wrap .choose-item li.active {
        padding: 0;
        border: 2px solid #368FFF; }
        .content-main-wrap .match-ques-wrap .choose-item li.active .choose-number {
          color: #368FFF; }
        .content-main-wrap .match-ques-wrap .choose-item li.active .choose-main {
          color: #368FFF; }
    .content-main-wrap .match-ques-wrap .judge-item li {
      width: 320px;
      height: 48px;
      line-height: 48px;
      background: #fff;
      padding: 1px;
      margin-bottom: 20px;
      border: 1px solid #e0e5e5;
      border-radius: 8px;
      cursor: pointer;
      text-align: center; }
      .content-main-wrap .match-ques-wrap .judge-item li .icon-ZK-PC-duihao {
        font-size: 50px; }
      .content-main-wrap .match-ques-wrap .judge-item li .icon-close {
        font-size: 30px; }
      .content-main-wrap .match-ques-wrap .judge-item li.active {
        padding: 0;
        border: 2px solid #368FFF; }
        .content-main-wrap .match-ques-wrap .judge-item li.active .icon-ZK-PC-duihao {
          color: #368FFF; }
        .content-main-wrap .match-ques-wrap .judge-item li.active .icon-close {
          color: #368FFF; }
  .content-main-wrap .error-book-guide {
    position: relative;
    padding: 60px 130px 0;
    box-sizing: border-box; }
    .content-main-wrap .error-book-guide .guide-item {
      position: relative;
      z-index: 10;
      display: inline-block;
      vertical-align: middle;
      width: 275px;
      height: 180px;
      margin: 0 45px;
      padding: 32px 56px 0 32px;
      box-sizing: border-box;
      color: rgba(255, 255, 255, 0.5);
      font-size: 14px;
      line-height: 24px; }
      .content-main-wrap .error-book-guide .guide-item.math {
        background: url("../images/task-web/math-bg.png") no-repeat center; }
      .content-main-wrap .error-book-guide .guide-item.chinese {
        background: url("../images/task-web/chinese-bg.png") no-repeat center; }
      .content-main-wrap .error-book-guide .guide-item .name {
        color: #fff;
        font-size: 20px;
        line-height: 36px; }
    .content-main-wrap .error-book-guide .guide-bg {
      position: absolute;
      bottom: -19px;
      left: 50px;
      z-index: 0;
      width: 880px;
      height: 12px;
      background: #fff;
      -webkit-perspective: 200px;
      perspective: 200px;
      box-shadow: 0 6px 30px 3px rgba(0, 0, 0, 0.1); }
      .content-main-wrap .error-book-guide .guide-bg:after {
        content: '';
        position: absolute;
        top: -21px;
        left: 0;
        width: 100%;
        height: 20px;
        background: #E4E8EC;
        transform-origin: 0 100% 0;
        transform: rotateX(45deg); }

.web-header {
  position: relative;
  width: 100%;
  height: 40px;
  background: linear-gradient(-90deg, #368FFF 0%, #0BA6FE 100%); }
  .web-header .inside-size {
    position: relative;
    width: 1000px;
    margin: 0 auto; }
  .web-header .logo {
    line-height: 40px;
    color: #fff;
    font-size: 16px; }
    .web-header .logo i {
      display: inline-block;
      width: 92px;
      height: 24px;
      margin: -2px 10px 0 0;
      background: url("../images/task-web/logo.png") no-repeat center;
      vertical-align: middle; }
  .web-header .user-box {
    position: relative;
    margin-top: 6px;
    cursor: pointer; }
    .web-header .user-box .user-pic {
      display: inline-block;
      vertical-align: middle;
      width: 26px;
      height: 26px;
      border-radius: 100%;
      overflow: hidden; }
      .web-header .user-box .user-pic img {
        width: 100%;
        height: 100%; }
    .web-header .user-box .header-nav-btn {
      display: inline-block;
      vertical-align: middle;
      color: #fff;
      font-size: 14px; }
    .web-header .user-box .header-nav-list {
      position: absolute;
      top: 30px;
      right: 0;
      z-index: 10;
      width: 120px;
      padding: 4px 0;
      background: #fff;
      box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.2);
      border-radius: 4px; }
      .web-header .user-box .header-nav-list li {
        height: 32px;
        line-height: 32px;
        padding-left: 12px;
        cursor: pointer;
        color: #333; }
        .web-header .user-box .header-nav-list li a {
          color: #333;
          font-size: 14px; }
        .web-header .user-box .header-nav-list li:hover {
          background: #EFF3F7; }
        .web-header .user-box .header-nav-list li.active {
          color: #368FFF; }
          .web-header .user-box .header-nav-list li.active a {
            color: #368FFF; }
  .web-header .arrange-wrap {
    position: relative; }
    .web-header .arrange-wrap .arrange-btn {
      width: 82px;
      height: 28px;
      margin-top: 6px;
      background: transparent;
      border: 1px solid #fff;
      border-radius: 14px;
      font-size: 14px;
      color: #fff; }
      .web-header .arrange-wrap .arrange-btn .iconfont.icon-ZK-PC-add {
        margin-right: 3px;
        font-size: 14px;
        color: #fff; }
      .web-header .arrange-wrap .arrange-btn:hover {
        background: #fff;
        color: #368FFF; }
        .web-header .arrange-wrap .arrange-btn:hover .iconfont.icon-ZK-PC-add {
          color: #368FFF; }
    .web-header .arrange-wrap .task-choose-subject-new {
      position: absolute;
      top: 40px;
      right: 0;
      z-index: 1004;
      width: 506px;
      padding: 20px 0;
      background-color: #fff;
      border: 1px solid #DEE5ED;
      box-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.14);
      border-radius: 4px;
      font-size: 14px;
      color: #333; }
      .web-header .arrange-wrap .task-choose-subject-new .task-title {
        display: flex;
        justify-content: space-between;
        margin-bottom: 18px;
        padding: 0 16px; }
        .web-header .arrange-wrap .task-choose-subject-new .task-title .operate {
          margin-left: 10px;
          font-size: 12px;
          color: #7F8893; }
          .web-header .arrange-wrap .task-choose-subject-new .task-title .operate:hover {
            color: #368FFF; }
      .web-header .arrange-wrap .task-choose-subject-new .task-choose-list {
        max-height: 282px;
        padding: 0 10px 0 16px;
        overflow-y: auto; }
      .web-header .arrange-wrap .task-choose-subject-new .task-choose-item > h4 {
        margin-bottom: 5px;
        font-size: 12px;
        color: #7F8893; }
      .web-header .arrange-wrap .task-choose-subject-new .task-choose-item .task-choose-item-list {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap; }
        .web-header .arrange-wrap .task-choose-subject-new .task-choose-item .task-choose-item-list li {
          display: flex;
          align-items: center;
          width: 228px;
          height: 66px;
          padding: 14px 10px;
          margin: 0 0 10px 0;
          background: #f7faff;
          border: 1px solid transparent;
          border-radius: 4px;
          box-sizing: border-box;
          font-size: 14px;
          font-weight: bold; }
          .web-header .arrange-wrap .task-choose-subject-new .task-choose-item .task-choose-item-list li:hover, .web-header .arrange-wrap .task-choose-subject-new .task-choose-item .task-choose-item-list li.active {
            border: 1px solid #368fff; }
          .web-header .arrange-wrap .task-choose-subject-new .task-choose-item .task-choose-item-list li .task-icons {
            width: 32px;
            height: 32px;
            margin-right: 6px; }
            .web-header .arrange-wrap .task-choose-subject-new .task-choose-item .task-choose-item-list li .task-icons img {
              width: 100%;
              height: 100%; }
          .web-header .arrange-wrap .task-choose-subject-new .task-choose-item .task-choose-item-list li .tag {
            font-size: 12px;
            font-weight: 400;
            color: #999; }
      .web-header .arrange-wrap .task-choose-subject-new .task-subject-list {
        font-size: 0;
        margin-right: -14px;
        padding: 0 16px; }
        .web-header .arrange-wrap .task-choose-subject-new .task-subject-list li {
          display: inline-block;
          width: 100px;
          height: 32px;
          line-height: 30px;
          margin: 0 12px 16px 0;
          border: 1px solid #DEE5ED;
          border-radius: 4px;
          font-size: 14px;
          color: #333;
          text-align: center;
          cursor: pointer; }
          .web-header .arrange-wrap .task-choose-subject-new .task-subject-list li:hover {
            color: #368FFF; }
          .web-header .arrange-wrap .task-choose-subject-new .task-subject-list li.active {
            border-color: #368FFF;
            background: #368FFF;
            color: #fff; }
      .web-header .arrange-wrap .task-choose-subject-new.task-choose-type {
        width: 356px; }
    .web-header .arrange-wrap .line {
      display: inline-block;
      width: 1px;
      height: 16px;
      background: rgba(255, 235, 225, 0.4);
      margin: 0 12px -3px; }
  .web-header .header-nav {
    position: absolute;
    top: 0;
    left: 190px;
    text-align: center; }
    .web-header .header-nav li {
      float: left;
      min-width: 90px;
      height: 40px;
      line-height: 40px;
      padding: 0 20px; }
      .web-header .header-nav li a {
        display: block;
        color: #fff;
        opacity: 0.8; }
        .web-header .header-nav li a .iconfont {
          font-size: 14px;
          margin: 0 5px 0 0; }
          .web-header .header-nav li a .iconfont.icon-zk-pc-changyanschool {
            font-size: 16px; }
      .web-header .header-nav li:hover a {
        opacity: 1; }
      .web-header .header-nav li.active {
        background: rgba(0, 0, 0, 0.1); }
        .web-header .header-nav li.active a {
          opacity: 1;
          font-weight: bold; }
  .web-header .exit-btn {
    line-height: 40px;
    color: #fff;
    font-size: 14px; }
    .web-header .exit-btn:hover, .web-header .exit-btn:active {
      text-decoration: underline; }

.web-colorful-report {
  height: 100%;
  padding: 20px 12px 0; }
  .web-colorful-report .task-detail-exercise {
    padding: 0; }
  .web-colorful-report .task-module {
    padding: 0 20px;
    background: #fff;
    border: 1px solid #D8DEDF;
    border-radius: 4px;
    margin-bottom: 20px; }
    .web-colorful-report .task-module .task-title {
      height: 53px;
      line-height: 53px; }
      .web-colorful-report .task-module .task-title span {
        font-size: 14px; }
      .web-colorful-report .task-module .task-title i.iconfont {
        font-size: 14px;
        cursor: pointer; }
    .web-colorful-report .task-module .colorful-task-detail {
      padding: 19px 0;
      border-top: 1px solid #DEE5ED;
      font-size: 14px; }
    .web-colorful-report .task-module .module-header {
      min-height: 74px;
      padding: 20px 0 6px 0;
      border-bottom: 1px solid #E5E7EB;
      box-sizing: border-box; }
    .web-colorful-report .task-module .student-img {
      display: inline-block;
      width: 48px;
      height: 48px;
      margin-right: 6px; }
    .web-colorful-report .task-module .student-name {
      font-size: 16px; }
    .web-colorful-report .task-module .task-time {
      margin-top: 9px;
      font-size: 14px;
      line-height: 14px; }
    .web-colorful-report .task-module .show-text {
      margin: 7px 0 0 0;
      font-size: 14px;
      line-height: 29px; }
    .web-colorful-report .task-module .show-img {
      margin-top: 4px; }
      .web-colorful-report .task-module .show-img li {
        width: 219px;
        height: 219px;
        margin: 0 13px 13px 0; }
        .web-colorful-report .task-module .show-img li:nth-child(4n) {
          margin-right: 0; }
        .web-colorful-report .task-module .show-img li.loading img {
          width: auto;
          height: auto;
          animation: rotate 1.5s linear infinite;
          object-fit: cover; }
        .web-colorful-report .task-module .show-img li.pic-none {
          background: #f0f6fb url("../images/clock-task/pic-none.png") no-repeat center;
          background-size: 78px 58px; }
        .web-colorful-report .task-module .show-img li img {
          width: 100%;
          height: 100%;
          object-fit: cover; }
    .web-colorful-report .task-module .click-num img {
      width: 24px;
      height: 22px;
      margin-right: 7px; }
    .web-colorful-report .task-module .click-num span {
      font-size: 19px; }
    .web-colorful-report .task-module .assess-box {
      padding: 0 12px;
      margin: 12px 0 20px 0;
      border-radius: 8px; }
      .web-colorful-report .task-module .assess-box .assess-people {
        padding: 18px 0;
        font-size: 18px; }
        .web-colorful-report .task-module .assess-box .assess-people img {
          width: 24px;
          height: 21px;
          margin-right: 15px; }
      .web-colorful-report .task-module .assess-box .assess-text {
        padding: 25px 0 17px;
        border-top: 1px solid #E5E7EB; }
        .web-colorful-report .task-module .assess-box .assess-text P {
          margin-bottom: 0;
          font-size: 18px;
          line-height: 35px; }
        .web-colorful-report .task-module .assess-box .assess-text .title {
          margin-bottom: 10px;
          font-size: 18px;
          color: #6C7C93; }
    .web-colorful-report .task-module.clock-none {
      min-height: 280px;
      margin-bottom: 20px;
      border-radius: 4px; }
      .web-colorful-report .task-module.clock-none .zh-resource-none .img-none {
        width: 110px;
        height: 106px; }
      .web-colorful-report .task-module.clock-none .zh-resource-none .txt {
        margin-top: 6px;
        font-size: 12px;
        color: #999; }
    .web-colorful-report .task-module .clock-time {
      margin: 0;
      padding: 20px 0;
      background: #fff;
      border-radius: 0; }
      .web-colorful-report .task-module .clock-time > p {
        margin-bottom: 14px;
        font-size: 14px;
        color: #666; }
      .web-colorful-report .task-module .clock-time .time-list {
        margin-right: -18px; }
        .web-colorful-report .task-module .clock-time .time-list li {
          margin-right: 14px;
          margin-bottom: 14px; }
          .web-colorful-report .task-module .clock-time .time-list li > a {
            width: 72px;
            height: 72px;
            border-radius: 8px; }
            .web-colorful-report .task-module .clock-time .time-list li > a .time-date {
              height: 26px;
              line-height: 26px;
              border-radius: 8px 8px 0 0;
              font-size: 14px; }
            .web-colorful-report .task-module .clock-time .time-list li > a .icon-suoping {
              margin-top: 10px;
              font-size: 20px; }
            .web-colorful-report .task-module .clock-time .time-list li > a .num {
              margin-top: 10px;
              font-size: 14px; }
              .web-colorful-report .task-module .clock-time .time-list li > a .num em {
                font-size: 18px; }
            .web-colorful-report .task-module .clock-time .time-list li > a .today {
              margin-top: 8px;
              color: #C2CBCE;
              font-size: 18px; }
            .web-colorful-report .task-module .clock-time .time-list li > a .finish {
              width: 24px;
              height: 22px;
              margin-top: 10px;
              background-size: 24px 22px; }
          .web-colorful-report .task-module .clock-time .time-list li.active .today {
            color: #368FFF; }
  .web-colorful-report .task-module-title {
    position: relative;
    padding-left: 10px;
    margin-bottom: 12px;
    font-size: 14px;
    color: #666; }
    .web-colorful-report .task-module-title:after {
      content: '';
      position: absolute;
      top: 4px;
      left: 0;
      width: 4px;
      height: 14px;
      background: #368FFF;
      border-radius: 2px; }
  .web-colorful-report .task-module-data-none {
    position: relative;
    height: 280px; }
    .web-colorful-report .task-module-data-none .zh-resource-none .txt {
      margin-top: 6px;
      font-size: 12px;
      color: #999; }
    .web-colorful-report .task-module-data-none .zh-resource-none .img-none {
      width: 110px;
      height: 106px; }

@keyframes webPlay {
  0% {
    background: url(../images/task-detail/play2.png) no-repeat center;
    background-size: 18px 15px; }
  50% {
    background: url(../images/task-detail/play1.png) no-repeat center;
    background-size: 18px 15px; }
  100% {
    background: url(../images/task-detail/play.png) no-repeat center;
    background-size: 18px 15px; } }
.pop-wrap {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(0, 0, 0, 0); }
  .pop-wrap .pop-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 320px;
    padding: 30px 40px 39px;
    background: #EFF3F7;
    border: 1px solid #D8DEDF;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    box-sizing: border-box;
    text-align: center; }
    .pop-wrap .pop-content .pop-close {
      position: absolute;
      top: 18px;
      right: 20px;
      cursor: pointer; }
      .pop-wrap .pop-content .pop-close .iconfont {
        font-size: 14px; }
      .pop-wrap .pop-content .pop-close:hover .iconfont {
        color: #368FFF; }
    .pop-wrap .pop-content .pop-title {
      margin-bottom: 18px;
      font-size: 18px;
      color: #333; }
    .pop-wrap .pop-content p {
      font-size: 14px;
      color: #666;
      line-height: 24px; }
    .pop-wrap .pop-content .code-wrap {
      width: 240px;
      padding: 20px 0 16px;
      margin-top: 22px;
      background: #fff;
      border-radius: 4px;
      box-sizing: border-box; }
      .pop-wrap .pop-content .code-wrap .code {
        width: 160px;
        height: 160px; }
      .pop-wrap .pop-content .code-wrap p {
        margin-top: 10px;
        color: #999; }

.do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct .correct-table .calc-ques table {
  margin: 10px 0; }

.do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct .correct-table .calc-ques table tr th,
.do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .task-exercise-correct .correct-table .calc-ques table tr td {
  padding: 0; }

.do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .exercise .title table {
  width: 700px; }
  .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .exercise .title table th,
  .do-practice-wrap .do-practice-ques.practice-report .task-detail-exercise .exercise-box .exercise .title table td {
    text-align: center;
    border: 1px solid #DEE5ED; }

.dialog-notes {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 999;
  background: rgba(0, 0, 0, 0.4); }
  .dialog-notes .dialog-notes-main {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1000;
    transform: translate(-50%, -50%);
    width: 480px;
    padding: 32px;
    background: #fff;
    border-radius: 4px; }
    .dialog-notes .dialog-notes-main .notes-item {
      margin-bottom: 16px; }
      .dialog-notes .dialog-notes-main .notes-item > p {
        margin-bottom: 7px;
        color: #666;
        font-size: 12px; }
      .dialog-notes .dialog-notes-main .notes-item .btn-group {
        font-size: 0; }
        .dialog-notes .dialog-notes-main .notes-item .btn-group li {
          position: relative;
          z-index: 0;
          display: inline-block;
          margin-left: -1px;
          border: 1px solid #D8DEDF; }
          .dialog-notes .dialog-notes-main .notes-item .btn-group li:first-child {
            border-radius: 4px 0 0 4px; }
          .dialog-notes .dialog-notes-main .notes-item .btn-group li:last-child {
            border-radius: 0 4px 4px 0; }
          .dialog-notes .dialog-notes-main .notes-item .btn-group li a {
            display: inline-block;
            width: 80px;
            height: 32px;
            line-height: 32px;
            text-align: center;
            font-size: 14px;
            color: #333; }
          .dialog-notes .dialog-notes-main .notes-item .btn-group li.active, .dialog-notes .dialog-notes-main .notes-item .btn-group li:hover {
            border-color: #368FFF;
            z-index: 1; }
            .dialog-notes .dialog-notes-main .notes-item .btn-group li.active a, .dialog-notes .dialog-notes-main .notes-item .btn-group li:hover a {
              background: rgba(54, 143, 255, 0.2);
              color: #368FFF; }
    .dialog-notes .dialog-notes-main .d-btn-wrap {
      margin-top: 32px; }
      .dialog-notes .dialog-notes-main .d-btn-wrap .btn-style.normal {
        width: 80px;
        height: 32px;
        line-height: 32px;
        margin-left: 16px;
        font-size: 14px;
        border-radius: 16px;
        border-width: 1px; }

.app-wrap {
  position: relative;
  height: 100%;
  background: #F2F6F9; }
  .app-wrap .zh-resource-none {
    margin-top: -0.9rem; }
    .app-wrap .zh-resource-none .img-none {
      width: 7rem;
      height: 3.8rem; }
    .app-wrap .zh-resource-none .txt {
      margin-top: 0.27rem;
      font-size: .28rem;
      color: #A1ABAE; }
    .app-wrap .zh-resource-none .btn-style {
      width: 3rem;
      height: 0.84rem;
      line-height: 0.84rem;
      margin-top: 0.48rem;
      border: 0.02rem solid #00BAFF;
      border-radius: 0.42rem;
      font-size: 0.32rem;
      color: #00BAFF; }

.app-top {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%; }

.app-header {
  position: relative;
  height: 0.9rem;
  background: #fff;
  border-bottom: 0.01rem solid #E2EDEC; }
  .app-header .app-back {
    position: absolute;
    top: 0.18rem;
    left: 0.36rem; }
    .app-header .app-back .iconfont {
      font-size: 0.5rem;
      color: #333; }
  .app-header .app-header-nav {
    text-align: center; }
    .app-header .app-header-nav li {
      display: inline-block;
      margin: 0 0.25rem; }
      .app-header .app-header-nav li a {
        display: inline-block;
        line-height: 0.9rem;
        color: #7D8385;
        font-size: 0.34rem; }
      .app-header .app-header-nav li.active {
        position: relative; }
        .app-header .app-header-nav li.active a {
          color: #1E1E1E;
          font-size: 0.36rem; }
        .app-header .app-header-nav li.active:after {
          content: '';
          position: absolute;
          bottom: 0;
          left: 50%;
          width: 0.6rem;
          height: 0.06rem;
          margin-left: -0.3rem;
          background: #00BAFF;
          border-radius: 0.03rem; }
  .app-header .app-header-title {
    line-height: 0.9rem;
    color: #1E1E1E;
    font-size: 0.36rem;
    text-align: center; }

.app-screen {
  height: 0.9rem;
  padding: 0 0.32rem;
  background: #fff;
  font-size: 0; }
  .app-screen .app-select-item {
    display: inline-block;
    width: 33%;
    font-size: 0.3rem;
    text-align: center;
    /*&:first-child{
      text-align: left;
    }
    &:last-child{
      text-align: right;
    }*/ }
  .app-screen .select-wrap {
    display: inline-block; }
    .app-screen .select-wrap .select-active {
      width: 2rem;
      height: .9rem;
      line-height: 0.9rem;
      padding: 0 .4rem 0 0;
      border: 0;
      border-radius: 0;
      color: #1B1B1B;
      font-size: 0.36rem;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap; }
    .app-screen .select-wrap .select-btn {
      top: .2rem;
      right: 0;
      font-size: .4rem;
      color: #333; }
      .app-screen .select-wrap .select-btn.active {
        top: .16rem;
        transform: rotate(180deg);
        color: #00BAFF; }
    .app-screen .select-wrap .select-list {
      display: block;
      position: fixed;
      top: 0.9rem;
      height: calc(100% - 0.9rem);
      padding: 0;
      border: 0;
      background: rgba(0, 0, 0, 0.5);
      box-shadow: none;
      text-align: left; }
      .app-screen .select-wrap .select-list li {
        height: 1.02rem;
        line-height: 1.02rem;
        border-top: 1px solid #E3EDF3;
        background: #fff;
        padding: 0 0.32rem;
        font-size: 16px; }
        .app-screen .select-wrap .select-list li.active {
          position: relative;
          color: #00BAFF; }
          .app-screen .select-wrap .select-list li.active:after {
            content: "\e77c";
            position: absolute;
            top: 0;
            right: 0.5rem;
            font-size: 0.6rem;
            font-family: "iconfont" !important;
            font-style: normal;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            color: #00BAFF; }

.app-content {
  height: 100%;
  padding: 0.9rem 0.36rem 0.53rem;
  background: #F2F6F9;
  overflow-y: auto; }
  .app-content .time-tag {
    margin-top: 0.24rem;
    font-size: 0.28rem;
    color: #7D8385; }
  .app-content .app-module {
    margin-top: 0.24rem;
    background: #fff;
    border-radius: 0.24rem; }
    .app-content .app-module .app-module-header {
      height: 0.84rem;
      line-height: 0.84rem;
      padding: 0 0.3rem;
      border-bottom: 1px solid #E3EDF3;
      color: #7D8385;
      font-size: 0.28rem; }
    .app-content .app-module .app-module-main {
      padding: 0.3rem; }
    .app-content .app-module .app-ques {
      line-height: 1.5;
      font-size: 0.38rem;
      color: #1E1E1E; }
      .app-content .app-module .app-ques .app-ques-select .icon-ZK-PC-duihao {
        font-size: 0.5rem; }
      .app-content .app-module .app-ques .app-ques-select .icon-close {
        margin: 0 0 0 0.1rem;
        font-size: 0.3rem; }
      .app-content .app-module .app-ques .app-ques-select .right em {
        color: #00BAFF; }
      .app-content .app-module .app-ques .app-ques-select .right .icon-ZK-PC-duihao {
        color: #00BAFF; }
      .app-content .app-module .app-ques .app-ques-select .right .icon-close {
        color: #00BAFF; }
      .app-content .app-module .app-ques .app-ques-select.select-detail > p {
        position: relative;
        display: flex;
        align-items: center;
        margin-bottom: 0.24rem;
        min-height: 0.9rem;
        /*height: 0.9rem;
        line-height: 0.9rem;*/
        padding: 0.1rem 0 0.1rem 1.2rem;
        background: #fff;
        border: 1px solid #E3EDF3;
        border-radius: 0.12rem; }
        .app-content .app-module .app-ques .app-ques-select.select-detail > p em {
          position: absolute;
          top: 0;
          left: 0;
          display: flex;
          justify-content: center;
          align-items: center;
          width: 0.9rem;
          height: 100%;
          background: #F8FBFD;
          text-align: center;
          color: #1E1E1E;
          font-size: 16px;
          border-radius: 0.12rem 0 0 0.12rem; }
          .app-content .app-module .app-ques .app-ques-select.select-detail > p em i.icon-right {
            display: inline-block;
            width: 0.31rem;
            height: 0.31rem;
            background: url("../images/task-h5/ques-icon-right.png") no-repeat center;
            background-size: 0.31rem 0.31rem; }
          .app-content .app-module .app-ques .app-ques-select.select-detail > p em i.icon-wrong {
            display: inline-block;
            width: 0.23rem;
            height: 0.22rem;
            background: url("../images/task-h5/ques-icon-wrong.png") no-repeat center;
            background-size: 0.23rem 0.22rem; }
        .app-content .app-module .app-ques .app-ques-select.select-detail > p.right {
          position: relative;
          padding-right: 0.66rem; }
          .app-content .app-module .app-ques .app-ques-select.select-detail > p.right:after {
            content: '';
            display: inline-block;
            position: absolute;
            top: 50%;
            right: 0.3rem;
            width: 0.36rem;
            height: 0.36rem;
            margin-top: -0.18rem;
            background: url("../images/task-h5/icon-right.png") no-repeat center;
            background-size: 0.36rem 0.36rem; }
          .app-content .app-module .app-ques .app-ques-select.select-detail > p.right.active {
            border-color: #00CC56; }
            .app-content .app-module .app-ques .app-ques-select.select-detail > p.right.active em {
              background: #00CC56;
              color: #fff; }
              .app-content .app-module .app-ques .app-ques-select.select-detail > p.right.active em i.icon-right {
                background: url("../images/task-h5/icon-right-active.png") no-repeat center;
                background-size: 0.31rem 0.31rem; }
              .app-content .app-module .app-ques .app-ques-select.select-detail > p.right.active em i.icon-wrong {
                background: url("../images/task-h5/icon-wrong-active.png") no-repeat center;
                background-size: 0.31rem 0.31rem; }
        .app-content .app-module .app-ques .app-ques-select.select-detail > p.wrong {
          position: relative;
          padding-right: 0.66rem; }
          .app-content .app-module .app-ques .app-ques-select.select-detail > p.wrong.active {
            border-color: rgba(255, 94, 97, 0.6); }
            .app-content .app-module .app-ques .app-ques-select.select-detail > p.wrong.active em {
              background: rgba(255, 94, 97, 0.6);
              color: #fff; }
              .app-content .app-module .app-ques .app-ques-select.select-detail > p.wrong.active em i.icon-right {
                background: url("../images/task-h5/icon-right-active.png") no-repeat center;
                background-size: 0.31rem 0.31rem; }
              .app-content .app-module .app-ques .app-ques-select.select-detail > p.wrong.active em i.icon-wrong {
                background: url("../images/task-h5/icon-wrong-active.png") no-repeat center;
                background-size: 0.31rem 0.31rem; }
          .app-content .app-module .app-ques .app-ques-select.select-detail > p.wrong:after {
            content: '';
            position: absolute;
            display: inline-block;
            top: 50%;
            right: 0.3rem;
            width: 0.37rem;
            height: 0.37rem;
            margin-top: -0.18rem;
            background: url("../images/task-h5/icon-wrong.png") no-repeat center;
            background-size: 0.37rem 0.37rem; }
      .app-content .app-module .app-ques .app-ques-input {
        margin-top: 0.25rem; }
        .app-content .app-module .app-ques .app-ques-input .num-wrap {
          display: inline-block;
          vertical-align: middle;
          width: 1rem;
          height: 0.6rem;
          line-height: 0.6rem;
          background: #fff;
          border: 0.02rem solid #E3EDF3;
          border-radius: 0.1rem;
          text-align: center;
          color: #00BAFF;
          font-size: 0.3rem; }
        .app-content .app-module .app-ques .app-ques-input > span {
          display: inline-block;
          vertical-align: middle;
          color: #1E1E1E;
          font-size: 0.32rem; }
    .app-content .app-module .app-ques-message {
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      height: 0.6rem;
      margin-top: 0.3rem; }
      .app-content .app-module .app-ques-message .detail-btn {
        display: inline-block;
        width: 1.2rem;
        height: 0.7rem;
        line-height: 0.68rem;
        border: 0.02rem solid #00BAFF;
        border-radius: 0.35rem;
        color: #00BAFF;
        font-size: 0.28rem;
        text-align: center; }
    .app-content .app-module .difficulty {
      padding-right: 0.12rem;
      font-weight: normal;
      font-size: 0.3rem;
      color: #A1ABAE; }
    .app-content .app-module .star-box {
      display: inline-block;
      height: 0.24rem;
      margin-right: 0.2rem;
      font-size: 0;
      position: relative;
      top: 0.02rem; }
      .app-content .app-module .star-box .star {
        display: inline-block;
        width: 0.3rem;
        height: 0.3rem;
        margin-left: 0.03rem;
        background: url("../images/task-center/star.png") no-repeat center center;
        background-size: 100% 100%; }
        .app-content .app-module .star-box .star.full {
          background: url("../images/task-center/star-full.png") no-repeat center center;
          background-size: 100% 100%; }
  .app-content .ques-detail-box {
    margin-top: 0.24rem;
    background: #fff; }
    .app-content .ques-detail-box .ques-detail-item {
      padding: 0.42rem 0.35rem 0.41rem;
      border-bottom: 1px solid #E3EDF3; }
      .app-content .ques-detail-box .ques-detail-item:last-child {
        border-bottom: 0; }
      .app-content .ques-detail-box .ques-detail-item .item-title {
        color: #7D8385;
        font-size: 0.34rem; }
      .app-content .ques-detail-box .ques-detail-item .item-main {
        margin-top: 0.35rem;
        padding-left: 0.1rem;
        color: #1E1E1E;
        font-size: 0.32rem; }
        .app-content .ques-detail-box .ques-detail-item .item-main p {
          color: #1E1E1E;
          font-size: 0.38rem; }
  .app-content.app-content-type {
    padding: 0 0 1.76rem 0; }
    .app-content.app-content-type .star-wrap {
      margin-bottom: 0.4rem; }
    .app-content.app-content-type .app-module {
      padding: 0.47rem 0.35rem;
      border-radius: 0; }
    .app-content.app-content-type .app-module-header {
      height: auto;
      line-height: normal;
      padding-left: 0;
      border-bottom: 0;
      color: #1E1E1E;
      font-size: 0.38rem; }
    .app-content.app-content-type .app-module-main {
      padding: 0.22rem 0 0 0; }
    .app-content.app-content-type .app-ques-pic {
      margin-top: 0.23rem; }
      .app-content.app-content-type .app-ques-pic img {
        max-width: 100%; }

.app-ques-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1.26rem;
  padding-top: 0.18rem;
  background: #fff;
  text-align: center;
  box-sizing: border-box; }
  .app-ques-footer .btn {
    display: inline-block;
    width: 3.27rem;
    height: 0.9rem;
    margin: 0 0.1rem;
    line-height: 0.8rem;
    font-size: 0.38rem;
    border-radius: 0.45rem; }
    .app-ques-footer .btn.full-blue {
      background: #00BAFF;
      border: 0.02rem solid #00BAFF;
      box-shadow: 4px 0px 4px rgba(0, 186, 255, 0.2);
      color: #fff; }
    .app-ques-footer .btn.border-btn {
      background: #fff;
      border: 0.02rem solid #E3EDF3;
      color: #4B4C4D; }
    .app-ques-footer .btn.tab-btn i {
      display: inline-block;
      width: 0.42rem;
      height: 0.42rem;
      margin: -0.04rem 0.1rem 0 0;
      background: url("../images/task-h5/btn-icon.png") no-repeat center;
      background-size: 0.42rem 0.42rem;
      vertical-align: middle; }
    .app-ques-footer .btn.tab-btn.active i {
      background: url("../images/task-h5/btn-icon-active.png") no-repeat center;
      background-size: 0.42rem 0.42rem; }

/*# sourceMappingURL=common.css.map */