@charset "UTF-8";
/*  precon.less*/
/* base color */
.word-break {
  word-break: break-all;
  word-wrap: break-word;
}
.keep-word {
  white-space: nowrap;
  word-break: keep-all;
}
/* CSS reset */
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
button,
textarea,
p,
blockquote,
th,
td {
  margin: 0;
  padding: 0;
}
fieldset,
img {
  border: 0;
}
:focus {
  outline: 0;
}
address,
caption,
cite,
code,
dfn,
th,
var,
optgroup {
  font-style: normal;
  font-weight: normal;
}
strong {
  font-weight: normal;
}
em {
  font-style: normal;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
  font-family: "Microsoft YaHei";
}
abbr,
acronym {
  border: 0;
  font-variant: normal;
}
code,
kbd,
samp,
tt {
  font-size: 100%;
}
input,
button,
textarea,
select {
  *font-size: 100%;
  border: none;
}
body {
  background: #fff;
  color: #5e5e5e;
  font: 14px/2em Microsoft YaHei, SimSun, Arial;
}
ol,
ul {
  list-style: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
caption,
th {
  text-align: left;
}
sup,
sub {
  font-size: 100%;
  vertical-align: baseline;
}
:link,
:visited,
ins {
  text-decoration: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
a:link,
a:visited {
  color: #5e5e5e;
}
a:hover {
  color: #c9394a;
}
a:active {
  color: #666;
}
.clearfix:after {
  content: '\0020';
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  *zoom: 1;
}
.l {
  float: left;
}
.r {
  float: right;
}
.clear {
  height: 0;
  overflow: hidden;
  clear: both;
}
.hide {
  display: none;
}
.btn.hide {
  display: none;
}
a.hidefocus {
  outline: none;
}
button.hidefocus::-moz-focus-inner {
  border: none;
}
a:focus {
  outline: none;
  -moz-outline: none;
}
input,
textarea {
  outline: none;
}
/*border && padding*/
html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
[hidden],
template {
  display: none;
}
a {
  background-color: transparent;
}
a:focus,
a:active,
a:hover {
  outline: 0;
  -moz-outline: none;
}
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}
button {
  overflow: visible;
}
button,
select {
  text-transform: none;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}
button[disabled],
html input[disabled] {
  cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
input {
  line-height: normal;
}
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}
textarea {
  overflow: auto;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
.mr60 {
  margin-right: 60px;
}
.pa {
  position: absolute;
}
.color-red {
  color: #EF1300!important;
}
.rl-modal {
  position: fixed;
  background: #fff;
  z-index: 100000;
  width: 360px;
  padding-bottom: 30px;
  left: 50%;
  top: 50%;
  margin: -218px 0 0 -180px;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
  transition: all 0.2s;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
}
.rl-modal.in {
  opacity: 1;
  filter: alpha(opacity=100);
}
.rl-modal-header {
  position: relative;
  padding: 0 20px;
}
.rl-modal-header h1 {
  font-size: 16px;
  line-height: 49px;
  height: 49px;
  color: #787d82;
  border-bottom: 1px solid #d0d6d9;
}
.rl-modal-header h1 span {
  float: left;
  width: 80px;
  text-align: center;
  height: 49px;
  line-height: 49px;
  cursor: pointer;
}
.rl-modal-header .active-title,
.rl-modal-header span:hover {
  border-bottom: 1px solid #f01400;
  color: #f01400;
}
.rl-close {
  position: absolute;
  top: 17px;
  right: 20px;
  width: 17px;
  height: 17px;
  cursor: pointer;
  background: url(/static/module/common/img/nlogin.png) no-repeat 0 0;
  transition: transform 0.2s;
  -webkit-transition: transform 0.2s;
  -moz-transition: transform 0.2s;
  -o-transition: transform 0.2s;
}
.rl-close:hover {
  background-position: 0 -21px;
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
}
.rl-modal-body {
  padding: 0 30px;
}
.error-erea {
  font-size: 14px;
  color: #f01400;
  padding-bottom: 5px;
  height: 20px;
}
.modal-backdrop {
  background-color: #ffffff;
}
.modal-backdrop.fade {
  opacity: 0;
}
.modal-backdrop,
.modal-backdrop.fade.in {
  opacity: 0.75;
  filter: alpha(opacity=75);
}
.modal-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000;
}
.fade {
  opacity: 0;
  -webkit-transition: opacity .15s linear;
  -moz-transition: opacity .15s linear;
  -o-transition: opacity .15s linear;
  transition: opacity .15s linear;
}
.rl-model-footer {
  padding: 20px 30px 4px;
}
.rlf-appendix {
  line-height: 1em;
  margin-bottom: 20px;
}
.rlf-appendix .rlf-autoin,
.rlf-appendix .rlf-forget {
  color: #787d82;
}
.rlf-appendix .rlf-forget:hover {
  color: #f01400;
}
.rlf-appendix .auto-cbx {
  margin-right: 10px;
  vertical-align: -1px;
}
.rl-modal .ipt {
  width: 270px;
  padding: 12px 14px;
  background-color: #fff;
  box-shadow: 2px 0px 5px 0px #fff;
  border: 1px solid rgba(84, 92, 99, 0.6);
  border-radius: 6px;
}
.rl-modal .ipt:focus {
  border-color: #98a1a6;
}
.ipt-email {
  background-position: 0 0;
}
.ipt-pwd {
  background-position: 0 -48px;
}
.ipt-nick {
  background-position: 0 -96px;
}
.rlf-verify-group .rlf-input {
  background: #fff;
  padding-left: 7px;
  width: 120px;
  vertical-align: top;
}
.rlf-verify-group img {
  height: 38px;
  width: 70px;
  margin: 0 10px;
  vertical-align: top;
  display: inline-block;
}
.rlf-verify-group span {
  display: inline-block;
  color: #39b94e;
  cursor: pointer;
  height: 40px;
  vertical-align: top;
  line-height: 150%;
  margin-top: -4px;
}
.rlf-tip-wrap {
  font-size: 12px;
  height: 20px;
  line-height: 20px;
}
.rlf-g-tip {
  height: 20px;
}
.rlf-tip-globle {
  font-size: 14px;
  height: 30px;
  line-height: 30px;
}
.rlf-tip-error {
  color: #cc0000;
}
.btn-full {
  width: 300px;
}
.btn-block {
  display: block;
  width: auto;
}
.forgetpwd-resultwrap {
  text-align: center;
  display: none;
  width: 260px;
}
.pop-login-sns {
  text-align: center;
  font-size: 14px;
}
.pop-login-sns span {
  color: #b5b9bc;
  display: inline-block;
  margin-top: 4px;
}
.pop-login-sns a {
  font-size: 14px;
  margin-left: 21px;
  height: 20px;
  line-height: 20px;
  color: #c8cdd2;
  transition: color .2s;
}
.pop-login-sns i {
  font-size: 29px;
  vertical-align: -3px;
  transition: color .2s;
  color: #b5b9bc;
}
.pop-login-sns .pop-sns-weixin:hover i {
  color: #00b33b;
}
.pop-login-sns .pop-sns-qq:hover i {
  color: #0088cc;
}
.pop-login-sns .pop-sns-weibo:hover i {
  color: #f01400;
}
.rl-modal .ipt-verify {
  margin-right: 10px;
  width: 120px;
  padding-left: 9px;
  background-image: none;
}
.rl-modal .icon-refresh {
  color: #b5b9bc;
  font-size: 24px;
  display: inline-block;
  margin: 8px 0 0 10px;
  -webkit-transition: 0.4s linear;
  transition: 0.4s ease-in;
}
.rl-modal .icon-refresh:hover {
  color: #787d82;
  transform: rotate(360deg);
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
}
.rl-modal {
  /*.ipt{
        .placeholder(@color-gray);
    }*/
  /* don't show the x for text inputs */
  /* don't show the eye for password inputs */
}
.rl-modal .proclaim-loc {
  position: relative;
}
.rl-modal .proclaim-btn {
  font-size: 23px;
  color: #b5b9bc;
  position: absolute;
  top: 8px;
  right: 8px;
}
.rl-modal .proclaim-btn:hover {
  color: #787d82;
}
.rl-modal .verify-img {
  width: 70px;
  height: 40px;
  vertical-align: top;
}
.rl-modal .verify-extra {
  line-height: 20px;
}
.rl-modal .verify-extra a {
  color: #00b33b;
}
.rl-modal .btn-red {
  background-color: #f01400;
  border-color: #f01400;
}
.rl-modal .btn-red:hover {
  background-color: #ff6464;
  border-color: #ff6464;
}
.rl-modal .ipt-error,
.rl-modal .rlf-tip-error {
  color: #f01400;
}
.rl-modal .rlf-tip-error {
  height: 30px;
  line-height: 30px;
}
.rl-modal .js-proclaim-on .js-txt-pwd {
  display: none;
}
.rl-modal .js-proclaim-off .js-pass-pwd {
  display: none !important;
}
.rl-modal input[type=text]::-ms-clear {
  width: 0;
  height: 0;
}
.rl-modal input[type=password]::-ms-reveal {
  width: 0;
  height: 0;
}
.verify-img-wrap {
  float: left;
  height: 40px;
  width: 84px;
}
.rlf-tip-wrap {
  clear: both;
}
/*down inputs*/
.autoul {
  width: 298px;
  padding: 0px;
  border: 1px solid #98a1a6;
  border-top: 0 none;
  position: absolute;
  height: 156px;
  overflow: hidden;
  background-color: #fff;
  z-index: 10000;
}
.autoul .autoli {
  color: #787d82;
  height: 39px;
  line-height: 39px;
  text-align: left;
  cursor: pointer;
  font-size: 14px;
  padding: 0 10px;
  overflow: hidden;
  display: none;
  text-overflow: ellipsis;
}
.autoul .lihover {
  background-color: #edf1f2;
}
.autoul .showli {
  display: block;
}
.form-control .autoul {
  width: 318px;
}
.erweima {
  background: url(/static/module/common/img/erweima.png) no-repeat 0 0;
  width: 60px;
  height: 60px;
  position: absolute;
  bottom: 0px;
  right: 0px;
  cursor: pointer;
}
.pcLogin {
  background: url(/static/module/common/img/pcLogin.png) no-repeat 0 0;
  width: 60px;
  height: 60px;
  position: absolute;
  bottom: 0px;
  right: 0px;
  cursor: pointer;
}
.qrcode {
  margin: 50px 70px 20px 70px;
  position: relative;
}
.qrcode_title {
  color: #13181E;
  font-family: "微软雅黑";
  font-size: 18px;
  text-align: center;
}
.qrcode_mark {
  color: #777D81;
  font-size: 14px;
  text-align: center;
}
.qrcode-inner {
  position: absolute;
  background-color: #fff;
  height: 150px;
  width: 150px;
  opacity: 0.95;
}
.qrcode_state_scaned {
  background: url(/static/module/common/img/scaned.png) no-repeat 0 0;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 45px;
  top: 40px;
}
.qrcode_state_validate {
  background: url(/static/module/common/img/code_validate.png) no-repeat 0 0;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 28px;
  top: 42px;
}
.phoneVerityBox {
  font-family: "微软雅黑";
}
.phoneVerityBox .title,
.phoneVerityBox .subtitle,
.backNotify {
  text-align: center;
}
.phoneVerityBox .title {
  margin-top: 27px;
  margin-bottom: 12px;
  color: #13181E;
  font-size: 18px;
  font-family: "微软雅黑";
}
.phoneVerityBox .rlf-tip-wrap {
  height: 30px;
  line-height: 30px;
}
.phoneVerityBox .subtitle {
  color: #777C81;
  font-size: 14px;
  margin-bottom: 25px;
  font-family: "微软雅黑";
}
.phoneVerityBox .reSend {
  top: 12px;
  right: 14px;
  font-size: 14px;
  color: #9199A1;
  line-height: 24px;
}
.phoneVerityBox .reSend.active {
  right: 102px;
  color: #1481B8 !important;
  cursor: pointer;
}
.phoneVerityBox .reSend.active:hover {
  color: #19A1E6 !important;
}
.phoneVerityBox .voicecode-send {
  position: absolute;
  right: 14px;
  top: 12px;
  padding-left: 8px;
  font-size: 14px;
  color: #1481B8;
  line-height: 24px;
  cursor: pointer;
  border-left: 1px solid #D3D6D9;
}
.phoneVerityBox .voicecode-send:hover {
  color: #19A1E6;
}
.phoneVerityBox .voicesend i {
  display: inline-block;
  margin-right: 4px;
}
.rl-modal-body .backNotify {
  color: #777C81;
  margin-top: 15px;
  cursor: pointer;
}
.rl-modal-body .user_header {
  width: 76px;
  background: url(/static/module/common/img/default_user.png) no-repeat 0 0;
  height: 76px;
  margin: auto;
  margin-top: 40px;
}
.rl-modal-body .btn-finished {
  width: 160px;
  height: 50px;
}
.rl-modal-body .finished_wrap {
  text-align: center;
}
.rl-modal-body .active {
  color: #13181E !important;
  cursor: pointer;
}
.rl-modal-body .active:hover {
  color: #ff6464 !important;
}
@media screen and (max-width: 480px) {
  .rl-modal {
    margin: -218px 0 0 -150px;
    width: 300px;
  }
  .rl-modal .ipt {
    width: 249px;
    font-size: 12px;
  }
  .rl-modal-header,
  .rl-modal-body {
    padding: 0 15px;
  }
  .btn-full {
    width: 260px;
  }
  .rl-model-footer {
    padding: 20px 15px 4px;
  }
  .rl-model-footer .mr60 {
    margin-right: 0;
  }
}
.btn {
  display: inline-block;
  margin-bottom: 0;
  font-weight: 200;
  text-align: center;
  vertical-align: middle;
  touch-action: manipulation;
  cursor: pointer;
  text-decoration: none;
  box-sizing: content-box;
  background-image: none;
  border: 1px solid transparent;
  -webkit-appearance: none;
  white-space: nowrap;
  outline: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.btn:hover,
.btn:focus,
.btn.focus {
  color: #fff;
  text-decoration: none;
}
.btn:active,
.btn.active {
  outline: 0;
  background-image: none;
}
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
  pointer-events: none;
  opacity: 0.65;
  filter: alpha(opacity=65);
  box-shadow: none;
}
.btn-red {
  color: #ffffff;
  background-color: #f20d0d;
  border-color: #f20d0d;
  border-style: solid;
  border-width: 1px;
  cursor: pointer;
  -weibkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  width: 138px;
  height: 38px;
  line-height: 38px;
  font-size: 14px;
}
.btn-red:link,
.btn-red:visited {
  color: #ffffff;
}
.btn-red:hover,
.btn-red:focus,
.btn-red.focus {
  color: #ffffff;
  background-color: #f42f2f;
  border-color: #f42f2f;
}
.btn-red:active,
.btn-red.active {
  background-color: #da0b0b;
  border-color: #da0b0b;
}
.btn-red.disabled,
.btn-red[disabled],
.btn-red.disabled:hover,
.btn-red[disabled]:hover,
.btn-red.disabled:focus,
.btn-red[disabled]:focus,
.btn-red.disabled.focus,
.btn-red[disabled].focus,
.btn-red.disabled:active,
.btn-red[disabled]:active,
.btn-red.disabled.active,
.btn-red[disabled].active {
  cursor: default;
  box-shadow: none;
  background-color: #f20d0d;
  border-color: #f20d0d;
}
.btn-blue {
  color: #ffffff;
  background-color: #1481b8;
  border-color: #1481b8;
  border-style: solid;
  border-width: 1px;
  cursor: pointer;
  -weibkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  width: 138px;
  height: 38px;
  line-height: 38px;
  font-size: 14px;
}
.btn-blue:link,
.btn-blue:visited {
  color: #ffffff;
}
.btn-blue:hover,
.btn-blue:focus,
.btn-blue.focus {
  color: #ffffff;
  background-color: #1898d8;
  border-color: #1898d8;
}
.btn-blue:active,
.btn-blue.active {
  background-color: #1271a1;
  border-color: #1271a1;
}
.btn-blue.disabled,
.btn-blue[disabled],
.btn-blue.disabled:hover,
.btn-blue[disabled]:hover,
.btn-blue.disabled:focus,
.btn-blue[disabled]:focus,
.btn-blue.disabled.focus,
.btn-blue[disabled].focus,
.btn-blue.disabled:active,
.btn-blue[disabled]:active,
.btn-blue.disabled.active,
.btn-blue[disabled].active {
  cursor: default;
  box-shadow: none;
  background-color: #1481b8;
  border-color: #1481b8;
}
.btn-green {
  color: #ffffff;
  background-color: #17823b;
  border-color: #17823b;
  border-style: solid;
  border-width: 1px;
  cursor: pointer;
  -weibkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  width: 138px;
  height: 38px;
  line-height: 38px;
  font-size: 14px;
}
.btn-green:link,
.btn-green:visited {
  color: #ffffff;
}
.btn-green:hover,
.btn-green:focus,
.btn-green.focus {
  color: #ffffff;
  background-color: #1ca048;
  border-color: #1ca048;
}
.btn-green:active,
.btn-green.active {
  background-color: #136c31;
  border-color: #136c31;
}
.btn-green.disabled,
.btn-green[disabled],
.btn-green.disabled:hover,
.btn-green[disabled]:hover,
.btn-green.disabled:focus,
.btn-green[disabled]:focus,
.btn-green.disabled.focus,
.btn-green[disabled].focus,
.btn-green.disabled:active,
.btn-green[disabled]:active,
.btn-green.disabled.active,
.btn-green[disabled].active {
  cursor: default;
  box-shadow: none;
  background-color: #17823b;
  border-color: #17823b;
}
.btn-normal {
  color: #787d82;
  background-color: #ffffff;
  border-color: #d0d6d9;
  border-style: solid;
  border-width: 1px;
  cursor: pointer;
  -weibkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  width: 138px;
  height: 38px;
  line-height: 38px;
  font-size: 14px;
}
.btn-normal:link,
.btn-normal:visited {
  color: #787d82;
}
.btn-normal:hover,
.btn-normal:focus,
.btn-normal.focus {
  color: #787d82;
  background-color: #edf1f2;
  border-color: #98a1a6;
}
.btn-normal:active,
.btn-normal.active {
  background-color: #f2f2f2;
  border-color: #c2cace;
}
.btn-normal.disabled,
.btn-normal[disabled],
.btn-normal.disabled:hover,
.btn-normal[disabled]:hover,
.btn-normal.disabled:focus,
.btn-normal[disabled]:focus,
.btn-normal.disabled.focus,
.btn-normal[disabled].focus,
.btn-normal.disabled:active,
.btn-normal[disabled]:active,
.btn-normal.disabled.active,
.btn-normal[disabled].active {
  cursor: default;
  box-shadow: none;
  background-color: #ffffff;
  border-color: #d0d6d9;
}
.btn-sm {
  width: 78px;
  height: 28px;
  line-height: 28px;
  font-size: 12px;
}
/**
    * 用户身份图标
**/
.id_icon_imoocs {
  background-image: url(/static/module/common/img/id_icon/imoocs.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
.id_icon_lecturer {
  background-image: url(/static/module/common/img/id_icon/lecturer.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
.id_icon_writer {
  background-image: url(/static/module/common/img/id_icon/writer.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
.id_icon_teaching_design {
  background-image: url(/static/module/common/img/id_icon/teaching_design.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
.id_icon_assistant {
  background-image: url(/static/module/common/img/id_icon/assistant.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
.pad9 {
  padding: 0 9px;
}
.w298 {
  width: 278px;
  padding: 0 9px;
}
.w200 {
  width: 180px;
  padding: 0 9px;
}
.statement {
  margin-bottom: 12px;
}
#improve-mode {
  width: 430px;
  box-sizing: border-box;
}
.moco-modal-layer #improve-mode {
  display: block !important;
}
.improve .wfbd {
  position: absolute;
  _left: 230px;
  left: 330px;
  bottom: 48px;
  font-size: 12px;
  color: #727679;
}
.improve .wfbd:hover {
  text-decoration: underline;
}
.improve label {
  display: inline-block;
  width: 104px;
  font-weight: bold;
  color: #07111b;
  text-align: right;
}
.improve .help-inline {
  left: 120px;
  width: 298px;
  position: absolute;
  line-height: 24px;
  bottom: -24px;
  font-size: 12px;
  color: #f01414;
}
.improve .help-inline label.error {
  color: inherit;
  text-align: left;
  font-weight: normal;
  width: auto;
}
.improve .help-inline i {
  display: inline-block;
  color: #fff;
  width: 20px;
  background: #00a0dc;
  border-radius: 2px;
  cursor: pointer;
  font-style: normal;
  text-align: center;
}
.improve .box {
  line-height: 36px;
  position: relative;
  margin-bottom: 8px;
}
.improve .box input[type='text'],
.improve .box input[type='password'] {
  box-sizing: border-box;
  padding: 0px 12px;
  height: 36px;
  border: 1px solid rgba(84, 92, 99, 0.6);
  border-radius: 6px;
  margin-left: 16px;
}
.improve .box .getCode {
  position: absolute;
  padding: 0 9px;
  top: 8px;
  right: 12px;
  font-size: 12px;
  color: #9199A1;
  line-height: 20px;
}
.improve .box .getCode.active {
  right: 85px;
  color: #1481B8;
  cursor: pointer;
}
.improve .box .getCode.active:hover {
  color: #19A1E6;
}
.improve .box .voicecode-send {
  position: absolute;
  right: 12px;
  top: 8px;
  padding-left: 8px;
  font-size: 12px;
  color: #1481B8;
  line-height: 20px;
  cursor: pointer;
  border-left: 1px solid #D3D6D9;
}
.improve .box .voicecode-send i {
  display: inline-block;
  margin-right: 4px;
}
.improve .box .voicecode-send:hover {
  color: #19A1E6;
}
.improve .box .l {
  position: relative;
}
.improve .box .l .icon-pw {
  position: absolute;
  top: 0;
  right: 0;
  color: #b7bbbf;
  line-height: 38px;
  font-size: 24px;
  margin-right: 7px;
}
.improve .box .l .icon-pw:hover {
  color: #71777d;
}
.improve .box .submitBtn,
.improve .box .cancelBtn {
  display: inline-block;
  text-align: center;
}
.improve .box .submitBtn {
  margin-left: 120px;
  vertical-align: top;
}
.improve .box .cancelBtn {
  margin-left: 12px;
}
.improve .edit {
  margin-bottom: 24px;
}
.improve .edit p.w298 {
  margin: 10px 0 30px 111px;
  font-size: 12px;
  color: #93999f;
  line-height: 22px;
}
.improve .info-val {
  margin-left: 16px;
  color: #07111b;
}
@font-face {
  font-family: 'sz';
  src: url('/static/module/common/fonts/sz/fonts/sz.eot?jftt07');
  src: url('/static/module/common/fonts/sz/fonts/sz.eot?jftt07#iefix') format('embedded-opentype'), url('/static/module/common/fonts/sz/fonts/sz.ttf?jftt07') format('truetype'), url('/static/module/common/fonts/sz/fonts/sz.woff?jftt07') format('woff'), url('/static/module/common/fonts/sz/fonts/sz.svg?jftt07#sz') format('svg');
  font-weight: normal;
  font-style: normal;
}
[class^="sz-"],
[class*=" sz-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'sz' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.sz-tips:before {
  content: "\e91e";
}
.sz-class:before {
  content: "\e91b";
}
.sz-score_shop:before {
  content: "\e918";
}
.sz-feedback:before {
  content: "\e917";
}
.sz-weixigzh:before {
  content: "\e919";
}
.sz-arrow-up:before {
  content: "\e91a";
}
.sz-receipt:before {
  content: "\e914";
}
.sz-shopping-cart:before {
  content: "\e915";
}
.sz-add-shopping-cart:before {
  content: "\e916";
}
.sz-hourglass_empty:before {
  content: "\e913";
}
.sz-play:before {
  content: "\e912";
}
.sz-add_question:before {
  content: "\e90a";
}
.sz-webide:before {
  content: "\e90b";
}
.sz-continue:before {
  content: "\e90c";
}
.sz-error:before {
  content: "\e600";
}
.sz-done:before {
  content: "\e601";
}
.sz-close:before {
  content: "\e602";
}
.sz-help:before {
  content: "\e603";
}
.sz-event:before {
  content: "\e604";
}
.sz-answer:before {
  content: "\e605";
}
.sz-thumb:before {
  content: "\e606";
}
.sz-thumb-o:before {
  content: "\e607";
}
.sz-imooc:before {
  content: "\e608";
}
.sz-weibo:before {
  content: "\e609";
}
.sz-weixin:before {
  content: "\e60a";
}
.sz-qq:before {
  content: "\e60b";
}
.sz-delete:before {
  content: "\e60c";
}
.sz-edit:before {
  content: "\e60d";
}
.sz-folder:before {
  content: "\e60e";
}
.sz-code:before {
  content: "\e60f";
}
.sz-image:before {
  content: "\e62d";
}
.sz-unknown:before {
  content: "\e62e";
}
.sz-antenna:before {
  content: "\e610";
}
.sz-cloud-on:before {
  content: "\e611";
}
.sz-cloud-off:before {
  content: "\e612";
}
.sz-vpn-lock:before {
  content: "\e613";
}
.sz-check:before {
  content: "\e614";
}
.sz-check-o:before {
  content: "\e615";
}
.sz-radio-on:before {
  content: "\e616";
}
.sz-radio-off:before {
  content: "\e617";
}
.sz-star:before {
  content: "\e618";
}
.sz-star-h:before {
  content: "\e619";
}
.sz-star-o:before {
  content: "\e61a";
}
.sz-video-c:before {
  content: "\e61b";
}
.sz-practice-c:before {
  content: "\e61c";
}
.sz-code-c:before {
  content: "\e61d";
}
.sz-chapter:before {
  content: "\e61e";
}
.sz-add:before {
  content: "\e61f";
}
.sz-remove:before {
  content: "\e620";
}
.sz-empty:before {
  content: "\e621";
}
.sz-half:before {
  content: "\e622";
}
.sz-full:before {
  content: "\e623";
}
.sz-refresh:before {
  content: "\e624";
}
.sz-list-o:before {
  content: "\e628";
}
.sz-list-c:before {
  content: "\e629";
}
.sz-arrow-r:before {
  content: "\e625";
}
.sz-arrow-d:before {
  content: "\e626";
}
.sz-close-s:before {
  content: "\e62a";
}
.sz-close-h:before {
  content: "\e627";
}
.sz-unsave:before {
  content: "\e62b";
}
.sz-loading:before {
  content: "\e62c";
}
.sz-course:before {
  content: "\e62f";
}
.sz-project:before {
  content: "\e630";
}
.sz-student:before {
  content: "\e631";
}
.sz-evaluation:before {
  content: "\e632";
}
.sz-top:before {
  content: "\e633";
}
.sz-back:before {
  content: "\e634";
}
.sz-list:before {
  content: "\e635";
}
.sz-question:before {
  content: "\e636";
}
.sz-pen:before {
  content: "\e637";
}
.sz-message:before {
  content: "\e638";
}
.sz-clock:before {
  content: "\e639";
}
.sz-replay:before {
  content: "\e63a";
}
.sz-weixin-y:before {
  content: "\e63b";
}
.sz-qq-y:before {
  content: "\e63c";
}
.sz-weibo-y:before {
  content: "\e63d";
}
.sz-show-pw:before {
  content: "\e63e";
}
.sz-up:before {
  content: "\e800";
}
.sz-arrow-drop-right:before {
  content: "\e900";
}
.sz-done2:before {
  content: "\e901";
}
.sz-terminal:before {
  content: "\e902";
}
.sz-qr:before {
  content: "\e903";
}
.sz-settings:before {
  content: "\e904";
}
.sz-arrow_drop_down:before {
  content: "\e905";
}
.sz-content-copy:before {
  content: "\e906";
}
.sz-schedule:before {
  content: "\e907";
}
.sz-run:before {
  content: "\e908";
}
.sz-keyboard-control:before {
  content: "\e909";
}
.sz-group:before {
  content: "\e90d";
}
.sz-mail:before {
  content: "\e90e";
}
.sz-notifi:before {
  content: "\e90f";
}
.sz-search:before {
  content: "\e910";
}
.sz-appdownload:before {
  content: "\e911";
}
.sz-help_outline:before {
  content: "\e91c";
}
.sz-back:before {
  content: "\e634";
}
.sz-forward:before {
  content: "\e91d";
}
@font-face {
  font-family: 'imv2';
  src: url('/static/module/common/fonts/imv2/fonts/imv2.eot?5yqf6o6');
  src: url('/static/module/common/fonts/imv2/fonts/imv2.eot?5yqf6o6#iefix') format('embedded-opentype'), url('/static/module/common/fonts/imv2/fonts/imv2.ttf?5yqf6o6') format('truetype'), url('/static/module/common/fonts/imv2/fonts/imv2.woff?5yqf6o6') format('woff'), url('/static/module/common/fonts/imv2/fonts/imv2.svg?5yqf6o6#imv2') format('svg');
  font-weight: normal;
  font-style: normal;
}
[class^="imv2-"],
[class*=" imv2-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'imv2' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.imv2-head1:before {
  content: "\e928";
}
.imv2-head2:before {
  content: "\e929";
}
.imv2-cloud_webide:before {
  content: "\e926";
}
.imv2-open_code:before {
  content: "\e927";
}
.imv2-dot_normal:before {
  content: "\e924";
}
.imv2-dot_samll:before {
  content: "\e925";
}
.imv2-code_circle:before {
  content: "\e920";
}
.imv2-exercise_circle:before {
  content: "\e921";
}
.imv2-homework_circle:before {
  content: "\e922";
}
.imv2-video_circle:before {
  content: "\e923";
}
.imv2-line:before {
  content: "\e91e";
}
.imv2-school:before {
  content: "\e91d";
}
.imv2-pin:before {
  content: "\e91c";
}
.imv2-path:before {
  content: "\e91a";
}
.imv2-war:before {
  content: "\e91b";
}
.imv2-score_shop:before {
  content: "\e563";
}
.imv2-receipt:before {
  content: "\e8b0";
}
.imv2-loading:before {
  content: "\e918";
}
.imv2-play_circle:before {
  content: "\e038";
}
.imv2-cloud_upload:before {
  content: "\e2c3";
}
.imv2-cloud_download:before {
  content: "\e2c0";
}
.imv2-cloud_done:before {
  content: "\e2bf";
}
.imv2-cloud:before {
  content: "\e42d";
}
.imv2-alarm:before {
  content: "\e855";
}
.imv2-nav_chapter:before {
  content: "\e916";
}
.imv2-nav_qa:before {
  content: "\e917";
}
.imv2-nav_note:before {
  content: "\e22b";
}
.imv2-set-key:before {
  content: "\e903";
}
.imv2-set-sns:before {
  content: "\e904";
}
.imv2-set-email:before {
  content: "\e905";
}
.imv2-feedback:before {
  content: "\e906";
}
.imv2-appdownload:before {
  content: "\e907";
}
.imv2-weixigzh:before {
  content: "\e908";
}
.imv2-lock:before {
  content: "\e897";
}
.imv2-chapter:before {
  content: "\e900";
}
.imv2-half:before {
  content: "\e901";
}
.imv2-empty:before {
  content: "\e902";
}
.imv2-video:before {
  content: "\e037";
}
.imv2-code:before {
  content: "\e86f";
}
.imv2-exercise:before {
  content: "\e164";
}
.imv2-homework:before {
  content: "\e909";
}
.imv2-arrow1_l:before {
  content: "\e5c6";
}
.imv2-arrow1_r:before {
  content: "\e5cb";
}
.imv2-arrow1_u:before {
  content: "\e5c7";
}
.imv2-arrow1_d:before {
  content: "\e5c5";
}
.imv2-arrow2_l:before {
  content: "\e408";
}
.imv2-arrow2_r:before {
  content: "\e409";
}
.imv2-arrow2_u:before {
  content: "\e5ce";
}
.imv2-arrow2_d:before {
  content: "\e5cf";
}
.imv2-arrow3_l:before {
  content: "\e5c4";
}
.imv2-arrow3_r:before {
  content: "\e5c8";
}
.imv2-arrow3_u:before {
  content: "\e5d8";
}
.imv2-arrow3_d:before {
  content: "\e5db";
}
.imv2-checkbox:before {
  content: "\e834";
}
.imv2-checkbox_onk:before {
  content: "\e835";
}
.imv2-radiobox:before {
  content: "\e837";
}
.imv2-radiobxo_o:before {
  content: "\e836";
}
.imv2-check:before {
  content: "\e5ca";
}
.imv2-check_c:before {
  content: "\e86c";
}
.imv2-close:before {
  content: "\e5cd";
}
.imv2-close_c:before {
  content: "\e5c9";
}
.imv2-error_c:before {
  content: "\e000";
}
.imv2-info:before {
  content: "\e88e";
}
.imv2-add_circle_o:before {
  content: "\e3ba";
}
.imv2-add_circle:before {
  content: "\e147";
}
.imv2-help_outline:before {
  content: "\e8fd";
}
.imv2-help:before {
  content: "\e887";
}
.imv2-thumb_up:before {
  content: "\e8dc";
}
.imv2-thumb_down:before {
  content: "\e8db";
}
.imv2-history:before {
  content: "\e8b5";
}
.imv2-cart:before {
  content: "\e8cc";
}
.imv2-add_cart:before {
  content: "\e854";
}
.imv2-star:before {
  content: "\e838";
}
.imv2-star_h:before {
  content: "\e919";
}
.imv2-delete:before {
  content: "\e872";
}
.imv2-edit:before {
  content: "\e254";
}
.imv2-replay:before {
  content: "\e042";
}
.imv2-refresh:before {
  content: "\e90a";
}
.imv2-set_1:before {
  content: "\e8b8";
}
.imv2-set_2:before {
  content: "\e429";
}
.imv2-folder:before {
  content: "\e2c7";
}
.imv2-share:before {
  content: "\e80d";
}
.imv2-visibility:before {
  content: "\e8f4";
}
.imv2-visibility_off:before {
  content: "\e8f5";
}
.imv2-search:before {
  content: "\e8b6";
}
.imv2-message:before {
  content: "\e159";
}
.imv2-notifications:before {
  content: "\e7f4";
}
.imv2-home:before {
  content: "\e88a";
}
.imv2-kecheng:before {
  content: "\e86e";
}
.imv2-shizhan:before {
  content: "\e1e2";
}
.imv2-lujing:before {
  content: "\e14f";
}
.imv2-yuanwen:before {
  content: "\e90b";
}
.imv2-shouji:before {
  content: "\e90c";
}
.imv2-wiki:before {
  content: "\e90d";
}
.imv2-follow_user:before {
  content: "\e7f0";
}
.imv2-photo:before {
  content: "\e412";
}
.imv2-tag_faces:before {
  content: "\e420";
}
.imv2-pause:before {
  content: "\e034";
}
.imv2-fullscreen:before {
  content: "\e5d0";
}
.imv2-fullscreen_exit:before {
  content: "\e5d1";
}
.imv2-vol_up:before {
  content: "\e050";
}
.imv2-vol_down:before {
  content: "\e04d";
}
.imv2-vol_mute:before {
  content: "\e04e";
}
.imv2-vol_off:before {
  content: "\e04f";
}
.imv2-ios:before {
  content: "\e90e";
}
.imv2-android:before {
  content: "\e859";
}
.imv2-weixin:before {
  content: "\e90f";
}
.imv2-qq:before {
  content: "\e910";
}
.imv2-weibo:before {
  content: "\e911";
}
.imv2-weixin_c:before {
  content: "\e912";
}
.imv2-qq_c:before {
  content: "\e913";
}
.imv2-weibo_c:before {
  content: "\e914";
}
.imv2-imooc:before {
  content: "\e915";
}
.imv2-load_o:before {
  content: "\e88b";
}
.imv2-textsms:before {
  content: "\e0d8";
}
.imv2-follow_o:before {
  content: "\e87e";
}
.imv2-follow:before {
  content: "\e87d";
}
.imv2-add:before {
  content: "\e145";
}
.imv2-assignment_ind:before {
  content: "\e85e";
}
.imv2-flag:before {
  content: "\e153";
}
.imv2-finish:before {
  content: "\e3a6";
}
.imv2-build:before {
  content: "\e869";
}
.imv2-chat_bubble:before {
  content: "\e0ca";
}
.imv2-cloud_off:before {
  content: "\e2c1";
}
.imv2-description:before {
  content: "\e873";
}
.imv2-insert_invitation:before {
  content: "\e24f";
}
.imv2-event_busy:before {
  content: "\e615";
}
.imv2-filter_drama:before {
  content: "\e3dd";
}
.imv2-format_size:before {
  content: "\e245";
}
.imv2-bold:before {
  content: "\e238";
}
.imv2-italic:before {
  content: "\e23f";
}
.imv2-list_bulleted:before {
  content: "\e241";
}
.imv2-list_numbered:before {
  content: "\e242";
}
.imv2-link:before {
  content: "\e157";
}
.imv2-quote:before {
  content: "\e244";
}
.imv2-undo:before {
  content: "\e166";
}
.imv2-redo:before {
  content: "\e15a";
}
.imv2-import_image:before {
  content: "\e3c4";
}
.imv2-photo_image:before {
  content: "\e410";
}
.imv2-lightbulb_outline:before {
  content: "\e91f";
}
.imv2-memory:before {
  content: "\e322";
}
.imv2-more_horiz:before {
  content: "\e5d3";
}
.imv2-forward:before {
  content: "\e040";
}
.imv2-sim_card:before {
  content: "\e32b";
}
.imv2-stars:before {
  content: "\e8d0";
}
.imv2-straighten:before {
  content: "\e41c";
}
.imv2-invoice:before {
  content: "\e048";
}
.imv2-voicemail:before {
  content: "\e0d9";
}
.imv2-bright:before {
  content: "\e42e";
}
.w {
  width: 1200px;
  margin: 0 auto;
}
.pr {
  position: relative;
}
.mt40 {
  margin-top: 40px;
}
.mt60 {
  margin-top: 60px;
}
html,
html,
body {
  color: #1c1f21;
}
body {
  font: 14px/1.5 "PingFang SC", "微软雅黑", "Microsoft YaHei", Helvetica, "Helvetica Neue", Tahoma, Arial, sans-serif;
  background-color: #ffffff;
  min-width: 1200px;
  overflow-y: scroll;
  position: relative;
}
a:link,
a:visited {
  color: #1c1f21;
}
a:hover,
a:active {
  color: #f20d0d;
}
.clearfix:after {
  content: '\0020';
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  *zoom: 1;
}
.l {
  float: left;
}
.r {
  float: right;
}
.hide {
  display: none;
}
.hide-text {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.newcontainer,
.page-container {
  margin: 0 auto;
  width: 1152px;
}
.container {
  margin: 0 auto;
}
.container {
  width: 1152px;
}
#main {
  min-height: 750px;
  padding: 20px 0;
}
.text-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#header {
  background: #07111b;
}
#nav {
  width: auto;
  padding-right: 20px;
  height: 72px;
  margin: 0 auto;
  position: relative;
}
.addZ-index {
  z-index: 9999;
}
.addZ-indexCode {
  z-index: 9999;
}
.logo {
  float: left;
}
#logo {
  margin: 0 20px;
}
#logo a,
.logo a {
  display: block;
  height: 72px;
  width: 140px;
  background: url(/static/module/common/img/logo.png?t=2.3) no-repeat center center;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.logo a {
  -webkit-transition: background-color 0.2s;
  -moz-transition: background-color 0.2s;
  transition: background-color 0.2s;
}
.logo a:hover {
  background-color: #363c41;
}
.nav-item li {
  float: left;
}
.nav-item a {
  position: relative;
  padding: 0 25px;
  display: block;
  color: rgba(255, 255, 255, 0.6);
  text-align: center;
  font-size: 16px;
  height: 72px;
  line-height: 72px;
  -webkit-transition: background-color 0.3s;
  -moz-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.nav-item a .icn-new {
  position: relative;
  display: inline-block;
  *display: inline;
  *zoom: 1;
  top: -10px;
  width: 16px;
  height: 16px;
  background: url(/static/module/common/img/new.png) no-repeat 0 0;
}
.nav-item a:hover,
.nav-item .active a,
.nav-item a.active {
  color: #fff;
  /* background-color: rgba(77,85,93,.4); */
}
.header-app {
  position: relative;
}
.header-app:hover .QR-download {
  display: block;
}
.header-app:hover .icon-appdownload {
  color: #fff;
}
.header-app a {
  font-size: 22px;
  display: block;
  width: 60px;
  text-align: center;
  height: 60px;
  line-height: 60px;
  color: #787d82;
  -webkit-transition: background-color 0.2s;
  -moz-transition: background-color 0.2s;
  transition: background-color 0.2s;
}
.header-app a:hover {
  color: #fff;
  background-color: #363c41;
}
.header-app .QR-download {
  display: none;
  position: absolute;
  top: 72px;
  left: -57px;
  width: 140px;
  height: 166px;
  background: #fff;
  padding: 16px 20px 18px 20px;
  text-align: center;
  webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  z-index: 9999;
}
.header-app .QR-download #app-text {
  margin: 0px;
  height: 0px;
  color: #14191e;
  font: bold 14px/15px "微软雅黑";
  height: 15px;
}
.header-app .QR-download #app-type {
  margin: 0px;
  height: 0px;
  color: #787d82;
  font: 12px/20px "微软雅黑";
  height: 30px;
}
.header-app .QR-download:before {
  content: " ";
  display: block;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid #fff;
  position: absolute;
  top: -8px;
  left: 79px;
}
.header-app-icon {
  display: inline-block;
  width: 11px;
  height: 16px;
  background: url(/static/module/common/img/head-app-icon.png) no-repeat 0 0;
  vertical-align: -3px;
  margin-right: 5px;
  transition: .3s;
  -moz-transition: .3s;
  -webkit-transition: .3s;
  -o-transition: .3s;
}
#header .app-down-area a {
  display: block;
  padding: 0 8px;
  height: 60px;
  line-height: 60px;
  color: #656e73;
}
#header .app-down-area a:hover {
  color: #fff;
  background-color: #363c41;
}
#header .app-down-area a:hover i {
  background-position: 0 -16px;
}
/*.nav-item-mycourse a {
  width: 120px;
}*/
/*全局搜索*/
.search-warp {
  float: left;
  position: relative;
  margin-left: 24px;
  height: 72px;
}
.search-warp i {
  display: block;
  height: 24px;
  color: #757a7e;
  cursor: pointer;
  font-size: 20px;
  line-height: 24px;
  width: 20px;
}
.search-warp i:hover {
  color: #F01414;
}
.search-warp .showhide-search {
  width: 20px;
  height: 24px;
  text-align: right;
  position: absolute;
  display: inline-block;
  right: 0;
  bottom: 24px;
  padding: 0 8px;
  border-radius: 18px;
}
.search-warp .showhide-search:hover {
  background: rgba(240, 20, 20, 0.4);
}
.search-warp .showhide-search:hover i {
  color: #F01414;
}
.search-warp .search-area.suggest-active {
  border-bottom-color: #F01414;
}
.search-warp .searchTags {
  display: none;
  z-index: 100;
  right: 40px;
  bottom: 24px;
}
.search-warp .searchTags a {
  padding: 3px 8px;
  margin-left: 8px;
  color: rgba(255, 255, 255, 0.6);
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  font-size: 12px;
  line-height: 24px;
  font-weight: 200;
}
.search-warp .searchTags a:hover,
.search-warp .searchTags a:active {
  background-color: rgba(255, 255, 255, 0.2);
  color: #fff;
}
.search-active .showhide-search {
  background: rgba(240, 20, 20, 0.2);
}
.search-active i {
  color: #F01414;
}
.search-area {
  float: right;
  position: relative;
  height: 46px;
  width: 260px;
  margin-top: 12px;
  margin-bottom: 12px;
  padding-right: 40px;
  border-bottom: 1px solid #000;
  border-bottom-color: rgba(255, 255, 255, 0.4);
  zoom: 1;
  -webkit-transition: width 0.3s;
  -moz-transition: width 0.3s;
  transition: width 0.3s;
}
.search-area.min {
  width: 0px;
  border-color: #000;
}
.search-area .search-input {
  padding: 12px 0;
  width: 100%;
  height: 46px;
  line-height: 46px;
  font-size: 12px;
  float: left;
  border: 0;
  color: #fff;
  -webkit-transition: background-color 0.3s;
  -moz-transition: background-color 0.3s;
  transition: background-color 0.3s;
  background-color: #07111B;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
.search-area .search-input:-moz-placeholder {
  color: #787d82;
}
.search-area .search-input::-moz-placeholder {
  color: #787d82;
  opacity: 1;
}
.search-area .search-input:-ms-input-placeholder {
  color: #787d82;
}
.search-area .search-input::-webkit-input-placeholder {
  color: #787d82;
}
.search-area .search-input.placeholder {
  color: #787d82;
}
.search-area .search-input::-moz-placeholder {
  color: #787d82;
  opacity: 1;
}
.search-area .search-input:-ms-input-placeholder {
  color: #787d82;
}
.search-area .search-input::-webkit-input-placeholder {
  color: #787d82;
}
.search-area .search-input.placeholder {
  color: #787d82;
}
.search-area .btn_search {
  float: left;
  cursor: pointer;
  width: 30px;
  height: 38px;
  text-align: center;
  -webkit-transition: background-color 0.3s;
  -moz-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.search-area .search-area-result {
  position: absolute;
  left: 0px;
  top: 60px;
  width: 300px;
  margin-bottom: 20px;
  /* border: 1px solid #d3d3d3; */
  border-top: none;
  background-color: #fff;
  box-shadow: 0 8px 16px 0 rgba(7, 17, 27, 0.2);
  font-size: 12px;
  overflow: hidden;
  display: none;
  z-index: 800;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
}
.search-area .search-area-result li {
  height: 40px;
  line-height: 40px;
  padding: 0 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #787d82;
  cursor: pointer;
}
.search-area .search-area-result li:hover,
.search-area .search-area-result .light {
  color: #1c1f21;
  background-color: #edf0f2;
}
#login-area {
  float: right;
  position: relative;
}
.header-unlogin li {
  float: left;
}
.header-signin a,
.header-signup a {
  display: block;
  width: 60px;
  font-size: 14px;
  text-align: center;
  height: 72px;
  line-height: 72px;
  color: #787d82;
  -webkit-transition: background-color 0.2s;
  -moz-transition: background-color 0.2s;
  transition: background-color 0.2s;
}
.header-signin {
  color: rgba(255, 255, 255, 0.6);
}
.header-signin a {
  display: inline-block;
  width: auto;
  padding: 0 12px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
}
.header-signin a:hover {
  color: #f01414;
}
.header-signup a:hover {
  color: #f01414;
  /* background-color: rgba(77,85,93,.4); */
}
.logined > li {
  float: left;
  position: relative;
}
.logined li > a {
  display: block;
  height: 72px;
  line-height: 72px;
  width: 60px;
  color: rgba(255, 255, 255, 0.6);
  text-align: center;
  -webkit-transition: background-color 0.2s;
  -moz-transition: background-color 0.2s;
  transition: background-color 0.2s;
}
.logined li > a:hover {
  color: #fff;
}
.logined li > a > i {
  font-size: 22px;
  line-height: 60px;
  text-align: center;
  cursor: pointer;
}
.logined li .msg_icon {
  display: none;
  position: absolute;
  padding: 0px 4px;
  height: 16px;
  left: 32px;
  top: 10px;
  line-height: 16px;
  background: #f01414;
  border-radius: 50%;
  color: #fff;
  font-style: normal;
  font-size: 10px;
}
.remind_warp {
  width: 60px;
  height: 48px;
  position: relative;
  margin-top: 12px;
  margin-bottom: 12px;
}
.remind_warp a {
  height: 48px!important;
  line-height: 48px!important;
}
.remind_warp .msg_remind {
  display: none;
  position: absolute;
  width: 8px;
  height: 8px;
  background-color: #f01414;
  right: 14px;
  top: 14px;
  border-radius: 50%;
}
.remind_warp .sz-notifi {
  display: block;
  line-height: 48px;
  font-size: 22px;
  text-align: center;
  cursor: pointer;
  transition: color 0.2s;
}
.remind_warp .sz-notifi:hover {
  color: #fff!important;
}
.my_message .msg_remind {
  display: none;
  position: absolute;
  width: 6px;
  height: 6px;
  background-color: #f01414;
  right: 14px;
  top: 14px;
  border-radius: 50%;
}
.my_mp span {
  display: block;
  line-height: 16px;
  color: #6c7072;
}
.my_mp .mp {
  padding-top: 12px;
  font-size: 12px;
}
.my_mp a:hover .mp_num {
  color: #fff;
}
.set_btn {
  right: 0px;
}
.set_btn a.hover {
  background-color: #363d40;
}
.set_btn img {
  border-radius: 50%;
  vertical-align: middle;
  display: inline-block;
  background: url(/static/module/common/img/menu_icon.png) no-repeat 0 0;
}
#nav_list {
  display: none;
  z-index: 999;
  width: 140px;
  position: absolute;
  top: 60px;
  right: 0px;
  background: #363c41;
  list-style: none;
}
#nav_list li a {
  border-top: 1px solid #4a5153;
  height: 39px;
  line-height: 39px;
  font-size: 14px;
  background-image: url(/static/module/common/img/menu_icon.png?t=10);
  background-repeat: no-repeat;
  display: block;
  color: #fff;
  text-align: left;
  padding: 0;
  padding-left: 47px;
  width: auto;
}
#nav_list a:hover {
  color: #fff;
  background-color: #4d5559;
}
#nav_list #my_space {
  padding: 0 18px;
  background-image: none;
  border: 0;
  height: 49px;
  line-height: 49px;
  text-align: center;
}
#nav_list .my_message {
  background-position: 19px -46px;
}
#nav_list #my_note {
  background-position: 19px -90px;
}
#nav_list #my_question {
  background-position: 19px -128px;
}
#nav_list #my_setting {
  background-position: 19px -167px;
}
#nav_list #my_logout {
  background-position: 19px -207px;
}
.myspace_remind {
  width: 10px;
  height: 10px;
  background: url(/static/module/common/img/space-remind.png) no-repeat 0 0;
  position: absolute;
  top: 10px;
  right: 10px;
}
/*footer*/
#footer {
  background: #1c1f21;
  border-top: 1px solid #e2e4e6;
  font-size: 12px;
  color: #787d82;
  padding: 27px 0;
  min-width: 620px;
  margin-top: 60px;
}
#footer .waper {
  width: auto;
  max-width: 1200px;
  margin: 0 auto;
}
#footer .footer_intro {
  padding-left: 40px;
}
#footer p {
  line-height: 1.7;
}
.footer_logo {
  display: none;
  float: left;
  background: url(/static/module/common/img/footer-sprite.png) 0 -230px no-repeat;
  height: 40px;
  width: 120px;
  margin: 0 20px;
}
#footer .des {
  width: 445px;
}
#footer .followus {
  margin-right: 34px;
  padding-left: 30px;
}
.followus a {
  float: left;
  position: relative;
  width: 32px;
  height: 32px;
  background-image: url(/static/module/common/img/footer-sprite.png);
  background-repeat: no-repeat;
  margin: 3px 6px 0;
  opacity: 0.5;
  filter: alpha(opacity=50);
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  transition: opacity 0.2s;
  z-index: 1;
}
#footer .followus a:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}
.flw-weixin-box {
  position: absolute;
  display: none;
  width: 170px;
  height: 220px;
  left: -69px;
  bottom: 35px;
  background: url(/static/module/common/img/footer-sprite.png?1) no-repeat 0 0;
}
.followus .followus-weixin {
  background-position: 0 -279px;
}
.followus-weixin:hover .flw-weixin-box {
  display: block;
}
.followus .followus-weibo {
  background-position: 0 -321px;
}
.followus .followus-qzone {
  background-position: 0 -363px;
}
.friend-links {
  /*padding-top: 20px ;border-top:1px solid #4F5153;*/
  line-height: 60px;
}
.friend-links a {
  display: inline-block;
  margin-right: 20px;
}
.friend-links a:hover {
  text-decoration: underline;
  color: #000;
}
.friend-links dl {
  padding: 0 10px;
}
.friend-links dd {
  float: left;
  width: 160px;
}
.footer_link ul {
  overflow: hidden;
  margin-top: -1px;
}
.footer_link a:link,
.footer_link a:visited,
.footer_link a:active {
  color: #c8cdd2;
}
.footer_link a:hover {
  color: #fff;
}
#footer .footer_link {
  margin-bottom: 4px;
  line-height: 1.8;
}
#footer .footer_link li {
  margin-right: 30px;
  text-align: center;
  float: left;
}
/*翻页*/
.page {
  margin: 25px 0 auto;
  overflow: hidden;
  clear: both;
  text-align: center;
}
.page-inner {
  padding: 0 20px;
}
.page a {
  display: inline-block;
  margin: 0 12px;
  width: 36px;
  height: 36px;
  line-height: 36px;
  font-size: 14px;
  color: #4d555d;
  text-align: center;
  border-radius: 50%;
  -webkit-transition: border-color 0.2s;
  -moz-transition: border-color 0.2s;
  transition: border-color 0.2s;
}
.page a:hover {
  text-decoration: none;
  background-color: #d9dde1;
}
.page a.active {
  background: #4d555d;
  color: #ffffff;
}
.page a:first-child,
.page a:nth-child(2),
.page a:nth-last-child(2),
.page a:last-child {
  width: auto;
}
.page a:first-child:hover,
.page a:nth-child(2):hover,
.page a:nth-last-child(2):hover,
.page a:last-child:hover {
  background-color: transparent;
}
.page span,
.page-disabled {
  display: inline-block;
  padding: 0 12px;
  min-width: 20px;
  height: 39px;
  line-height: 39px;
  font-size: 14px;
  color: #93999f;
  text-align: center;
}
.page-first,
.page-last {
  width: 50px;
}
.page-prev,
.page-next {
  width: 70px;
}
.page .notmargin {
  margin-right: 0;
}
/* 
HTML structure：
<div class="panel">
  <div class="panel-heading">
    <h3 class="panel-title">Panel title</h3>
  </div>
  <div class="panel-body">
    Panel content
  </div>
  <div class="panel-footer">Panel footer</div>
</div>
panel-heading,
panel-body,
panel-footer all could be select use not necessary
*/
.bordered {
  border-bottom: solid 1px #d0d6d9;
}
.panel {
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  padding: 0 20px;
  color: #1c1f21;
  background-color: #ffffff;
  margin-bottom: 20px;
}
.panel-heading {
  border-bottom: solid 1px #d0d6d9;
}
.panel-title {
  height: 50px;
  line-height: 50px;
  font-size: 16px;
}
select {
  margin: 0;
  font-size: 100%;
  cursor: pointer;
  font-weight: normal;
  background-color: #fff;
  border: 1px solid #ccc;
  color: #555;
  display: inline-block;
  font-size: 14px;
  height: 30px;
  line-height: 30px;
  padding: 4px 6px;
  vertical-align: middle;
}
select:focus {
  outline: thin dotted #333;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
/*收藏*/
a.btn-add-collection {
  display: block;
  background: url(/static/module/common/img/course/new_add_collection.png) no-repeat 46px top;
  height: 32px;
  color: #909b9e;
  text-align: center;
  line-height: 35px;
}
a.btn-add-collection:hover {
  background-position: 46px -44px;
  color: #fff;
}
a.btn-remove-collection {
  background-position: 46px -88px;
  color: #909b9e;
}
a.btn-remove-collection:hover {
  background-position: 46px -130px;
}
.course-title .btn-add-collection {
  margin-top: 6px;
}
.videohead .btn-add-collection {
  margin-top: 20px;
}
.js-btn-collection .concerned-icon {
  margin-top: 34px;
  display: inline-block;
}
/*进度条*/
progress {
  display: inline-block;
  background: #f0f0f0;
  border: 0;
  height: 6px;
  color: #aad94a;
  /*IE10 #c9394a*/
  width: 400px;
}
progress::-webkit-progress-bar {
  background: #f0f0f0;
}
progress::-moz-progress-bar {
  background: #aad94a;
}
progress::-webkit-progress-value {
  background: #aad94a;
}
.progress {
  background: #f0f0f0;
  height: 6px;
  width: 400px;
  display: inline-block;
}
.progressBar {
  background: #aad94a;
  height: 6px;
}
.teacher-icon {
  width: 7px;
  margin-left: 5px;
  position: relative;
  top: 1px;
}
/*回到顶部*/
.elevator {
  position: fixed;
  padding: 0 16px;
  top: 50%;
  margin-top: -140px;
  right: 0;
  z-index: 9;
  background-color: #fff;
  box-shadow: -2px 2px 5px 3px rgba(7, 17, 27, 0.1);
}
.elevator a {
  display: block;
  width: 26px;
  padding: 16px 0;
  font-size: 22px;
  line-height: 20px;
  color: #b5b9bc;
  box-sizing: border-box;
  text-align: center;
  border-bottom: 1px solid #edf1f2;
}
.elevator a:hover {
  color: #14191e;
}
.elevator a i {
  font-size: 24px;
  color: #b5b9bc;
}
.elevator a i:hover {
  color: #14191e;
}
.elevator a span {
  display: none;
  font-size: 12px;
  color: #f01414;
  line-height: 12px;
}
.elevator a .elevator-num {
  background-color: #f01414;
  color: #fff;
  border-radius: 50%;
  text-align: center;
  font-size: 12px;
  position: absolute;
  top: 3px;
  width: 18px;
  height: 18px;
  line-height: 16px;
  right: -9px;
}
.elevator .elevator-msg:hover i,
.elevator .elevator-faq:hover i,
.elevator .elevator-app:hover i,
.elevator .elevator-weixin:hover i,
.elevator .elevator-top:hover i {
  display: none;
}
.elevator .elevator-msg:hover span,
.elevator .elevator-faq:hover span,
.elevator .elevator-app:hover span,
.elevator .elevator-weixin:hover span,
.elevator .elevator-top:hover span {
  display: inline-block;
}
.elevator .elevator-app-box {
  position: absolute;
  width: 172px;
  height: 194px;
  bottom: -10px;
  right: 52px;
  -webkit-transition: opacity 0.25s, transform .3s;
  -moz-transition: opacity 0.25s, transform .3s;
  transition: opacity 0.25s, transform .3s;
  opacity: 0;
  filter: alpha(opacity=0);
  max-width: 0;
  -webkit-transform: scale(0.01);
  -ms-transform: scale(0.01);
  transform: scale(0.01);
  -webkit-transform-origin: 100% 95%;
  -ms-transform-origin: 100% 95%;
  transform-origin: 100% 95%;
  background: url(/static/module/common/img/elevator.png) no-repeat 0 -220px;
}
.elevator .elevator-app:hover .elevator-app-box {
  display: block;
  visibility: visible;
  opacity: 1;
  filter: alpha(opacity=100);
  max-width: none;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.elevator .elevator-weixin-box {
  position: absolute;
  width: 172px;
  height: 212px;
  bottom: -10px;
  right: 52px;
  -webkit-transition: opacity 0.25s, transform .3s;
  -moz-transition: opacity 0.25s, transform .3s;
  transition: opacity 0.25s, transform .3s;
  opacity: 0;
  filter: alpha(opacity=0);
  max-width: 0;
  -webkit-transform: scale(0.01);
  -ms-transform: scale(0.01);
  transform: scale(0.01);
  -webkit-transform-origin: 100% 95%;
  -ms-transform-origin: 100% 95%;
  transform-origin: 100% 95%;
  background: url(/static/module/common/img/elevator.png) no-repeat 0 0;
}
.elevator .elevator-weixin:hover .elevator-weixin-box {
  display: block;
  visibility: visible;
  opacity: 1;
  filter: alpha(opacity=100);
  max-width: none;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
a {
  outline: none;
}
a:active {
  star: expression(this.onFocus=this.blur());
}
a,
input,
button {
  outline: none;
}
button::-moz-focus-inner {
  border: 0px;
}
input::-moz-focus-inner {
  border: 0px;
}
.autowrap {
  word-wrap: break-word;
  word-break: break-all;
}
/*用户卡片样式*/
.layer-usercard {
  position: absolute;
  z-index: 999;
  width: 370px;
  height: 165px;
  background: #fff;
  box-shadow: 0 2px 2px #999;
}
.layer-usercard .arrow {
  position: absolute;
  left: 65px;
  top: -11px;
  width: 19px;
  height: 11px;
  background: url(/static/module/common/img/dot_usercard.png);
}
.layer-usercard-header {
  height: 110px;
  background: #2a2c2e;
}
.layer-usercard-header .avatar img {
  border-radius: 50px;
  left: 21px;
  position: absolute;
  top: 21px;
  border: 3px solid #7f8082;
}
.layer-usercard-header dt,
.layer-usercard-header dd {
  float: right;
  width: 245px;
  padding-right: 20px;
  color: #fff;
}
.layer-usercard-header dt {
  padding-top: 20px;
  font-size: 18px;
}
.layer-usercard-header dd {
  font-size: 12px;
}
.layer-usercard-info ul {
  overflow: hidden;
  padding-top: 16px;
  height: 32px;
  font-size: 16px;
  color: #364247;
  position: relative;
}
.layer-usercard-info li {
  float: left;
  padding: 0 22px;
  border-right: 1px solid #d9d9d9;
}
.layer-usercard-info span {
  color: #969b9e;
  font-size: 12px;
}
.layer-usercard-info li.noborder {
  border: 0;
}
li.layer-usercard-medal {
  padding: 0;
  top: 12px;
  right: 10px;
  width: 117px;
  position: absolute;
  border: 0;
}
.layer-usercard-medal a {
  width: 32px;
  height: 32px;
  float: left;
  margin-right: 5px;
  border-radius: 1px;
  overflow: hidden;
}
/*发问题匹配问答关键词*/
.send-area-result {
  background: #fff;
  box-shadow: 0 4px 8px rgba(7, 17, 27, 0.2);
  -moz-box-shadow: 0 4px 8px rgba(7, 17, 27, 0.2);
  -webkit-box-shadow: 0 4px 8px rgba(7, 17, 27, 0.2);
  position: absolute;
  top: 48px;
  left: 0;
  width: inherit;
  border-radius: 0px 0px 4px 4px;
}
.send-area-result dt {
  font-size: 12px;
  color: #b7bbbf;
  line-height: 40px;
  height: 40px;
  padding: 0 10px;
}
.send-area-result dd {
  height: 40px;
  line-height: 40px;
}
.send-area-result dd a.questiontitle {
  border: none;
  font-size: 14px;
  color: #93999f;
  width: inherit;
  text-align: left;
  height: 40px;
  line-height: 40px;
  padding: 0 10px;
  display: block;
}
.oncurr {
  color: #07111b;
  background: #f3f5f7;
}
.oncurr a.questiontitle {
  color: #07111b !important;
}
.send-area-result dd a.questiontitle i,
.send-area-result dd a.questiontitle em {
  font-style: normal;
  font-size: 12px;
  margin-left: 8px;
}
.send-area-result dd a.questiontitle em {
  color: #b7bbbf;
}
.send-area-result dd a.questiontitle i {
  color: #00b33b;
}
.g-menu-mini .menu-ctrl {
  display: none;
  visibility: hidden;
  opacity: 0;
  width: 0;
  height: 0;
  line-height: 0;
  font-size: 0;
  color: #787d82;
  text-align: center;
  -webkit-transform: translateX(-10px);
  -ms-transform: translateX(-10px);
  transform: translateX(-10px);
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: opacity .3s,transform .3s;
  overflow: hidden;
}
.g-menu-mini:hover .menu-ctrl {
  background-color: #222428;
  color: #fff;
}
/* 顶部导航用户卡片 */
.g-user-card {
  position: absolute;
  right: 0;
  top: 100%;
  width: 306px;
  visibility: hidden;
  box-shadow: 0 8px 16px 0 rgba(7, 17, 27, 0.2);
  z-index: 1000;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  /* opacity: 0;
    filter: alpha(opacity=0); */
  /* transform: rotateY(30deg) rotateX(-10deg);
    transition: all .3s, transform 0.6s cubic-bezier(0.285, 1.65, 0.745, 1.65); */
}
.g-user-card .card-inner {
  background-color: #fff;
  /* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .2); */
  padding: 24px;
  box-sizing: border-box;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
}
.g-user-card .card-top {
  color: #93999f;
  position: relative;
}
.g-user-card .card-top img {
  float: left;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  border: 2px solid #fff;
  margin-right: 12px;
}
.g-user-card .card-top .name {
  display: inline-block;
  font-size: 16px;
  color: #07111b;
  width: 170px;
}
.g-user-card .card-top a {
  color: #93999f;
  display: inline-block;
}
.g-user-card .card-top .setup {
  position: absolute;
  right: 20px;
  top: 33px;
  opacity: 0.6;
  filter: alpha(opacity=60);
  font-size: 16px;
}
.g-user-card .card-top .setup:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}
.g-user-card .card-top .card-top-right-box {
  margin-top: 14px;
}
.g-user-card .card-top .meta {
  font-size: 12px !important;
}
.g-user-card .card-top .meta a {
  margin-right: 12px;
}
.g-user-card .card-top .meta b {
  margin-left: 2px;
}
.g-user-card .user-center-box {
  margin-top: 16px;
  margin-bottom: 14px;
}
.g-user-card .user-center-box ul li {
  position: relative;
  width: 128px;
  width: 127px\9;
  /*IE6,7,8 hack*/
  height: 36px;
  background: #F8FAFC;
  border-radius: 2px;
  line-height: 36px;
  color: #4d555d;
  font-size: 12px;
  margin-right: 2px;
  margin-bottom: 2px;
  box-sizing: border-box;
}
.g-user-card .user-center-box ul li .user-center-icon {
  position: relative;
  top: 3px;
  font-size: 16px;
  margin-right: 8px;
}
.g-user-card .user-center-box ul li a {
  width: 100%;
  height: 36px;
  line-height: 36px;
  padding-left: 12px;
  text-align: left;
  box-sizing: border-box;
  color: #4D555D;
}
.g-user-card .user-center-box ul li:hover {
  color: #4d555d;
  background: #F3F5F7;
}
.g-user-card .user-center-box ul li:hover a {
  color: #4d555d;
  background: #d9dde1;
}
.g-user-card .user-center-box ul li i {
  width: 18px;
  height: 18px;
  position: absolute;
  top: 0px;
  right: 8px;
  background: url('/static/module/common/img/coupon-icon.png') no-repeat;
}
.g-user-card .user-center-box ul li:nth-child(2n) {
  margin-right: 0px;
}
.g-user-card .card-links {
  position: relative;
  height: 60px;
  line-height: 60px;
}
.g-user-card .card-links a,
.g-user-card .card-links .split {
  position: absolute;
}
.g-user-card .card-links .split {
  left: 150px;
  top: 0;
  margin-top: 15px;
  width: 1px;
  height: 30px;
  background-color: #edf1f2;
}
.g-user-card .card-links a {
  left: 20px;
  top: 0;
  font-weight: bold;
}
.g-user-card .card-links .my-sns {
  left: 172px;
}
.g-user-card .card-history,
.g-user-card .card-links {
  margin-bottom: -1px;
  border-bottom: 1px solid #edf1f2;
}
.g-user-card .card-history {
  padding-bottom: 16px;
}
.g-user-card .card-history .history-item {
  display: block;
  position: relative;
  padding-left: 24px;
  font-size: 12px;
  color: #787d82;
  transition: background-color 0.2s;
}
.g-user-card .card-history .history-item .tit {
  display: block;
  margin-bottom: 8px;
  font-weight: bold;
}
.g-user-card .card-history .history-item .media-name {
  display: block;
  width: 200px;
}
.g-user-card .card-history .history-item .sz-schedule {
  position: absolute;
  left: 0px;
  top: 2px;
  font-size: 16px;
  font-weight: 700;
}
.g-user-card .card-history .history-item .continue {
  position: absolute;
  right: 0px;
  top: 26px;
  color: #00b43c;
}
.g-user-card .card-history .history-item .continue:hover {
  color: #00c850;
}
.g-user-card .card-sets {
  margin-top: 16px;
  font-size: 12px;
  line-height: 12px;
}
.g-user-card .card-sets a {
  color: #93999F;
}
.g-user-card .card-sets a:hover {
  color: #4d555d;
  background: none;
}
.g-user-card .card-sets .mr30 {
  margin-right: 30px;
}
.g-user-card .card-arr {
  position: absolute;
  right: 23px;
  top: 2px;
  border-width: 0 7px 8px 7px;
  border-color: transparent transparent #f01400 transparent;
  border-style: solid;
}
.linkToMall {
  font-size: 12px !important;
  color: #fff !important;
  opacity: 1 !important;
}
.user-card-box {
  position: relative;
}
.user-card-box.hover .g-user-card {
  visibility: visible;
}
.user-card-box:hover .g-user-card {
  /* opacity: 1;
  filter: alpha(opacity=100);
  transform: rotateY(0) rotateX(0); */
}
.user-card-box:hover .user-card-item img {
  border: 2px solid rgba(255, 255, 255, 0.6);
}
.user-card-box .user-card-item img {
  width: 36px;
  height: 36px;
  border-color: #4d5559;
  /* margin-top:-5px; */
}
.visible-xs-block {
  display: none;
}
body {
  padding-top: 0;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
}
html.holding {
  height: 100%;
  overflow: hidden;
}
body:after {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  z-index: 1000;
  content: " ";
  display: block;
  background: #000;
  opacity: 0;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  visibility: hidden;
}
body.slide-left {
  -webkit-transform: translate(-130px, 0);
  -ms-transform: translate(-130px, 0);
  transform: translate(-130px, 0);
  margin-right: -130px;
  padding-right: 130px;
  height: 100%;
  overflow: hidden;
}
body.slide-left:after {
  left: -130px;
  visibility: visible;
  opacity: 0.3;
  z-index: 1002;
}
@media screen and (max-width: 1440px) {
  .nav-item li {
    transition: .3s;
    margin: 0;
  }
  .nav-item li a {
    padding: 0 16px;
  }
  .search-warp {
    margin-left: 10px!important;
  }
  .search-area {
    width: 150px!important;
  }
}
@media screen and (max-width: 1330px) {
  .nav-item li {
    transition: .3s;
    margin: 0;
  }
  .nav-item li a {
    padding: 0 15px;
  }
  .search-warp {
    margin-left: 10px!important;
  }
  .search-area {
    width: 140px!important;
  }
}
@media screen and (max-width: 1200px) {
  .nav-item li {
    transition: .3s;
    margin: 0;
  }
  .nav-item li a {
    padding: 0 15px;
  }
  .search-area {
    width: 140px!important;
  }
  #footer .followus {
    padding-left: 0;
  }
  #footer .footer_link li {
    margin-right: 10px;
  }
}
@media screen and (max-width: 979px) {
  #nav {
    padding: 0 15px;
  }
  #logo {
    margin-left: 0;
  }
  #logo a {
    width: 120px;
  }
  .nav-item li a {
    padding: 0 15px;
  }
  .logined li > a,
  .remind_warp {
    width: 50px;
  }
  .msg_icon {
    left: 30px;
  }
  .remind_warp .msg_remind {
    right: 5px;
  }
  .header-app {
    display: none;
  }
  .search-warp {
    margin-left: 10px;
  }
  .search-area {
    width: 140px;
  }
  .header-signin a {
    width: 50px;
  }
  #footer {
    text-align: center;
  }
  #footer .followus {
    float: none;
    padding: 0;
    margin-bottom: 8px;
  }
  #footer .followus a {
    float: none;
    display: inline-block;
  }
  #footer .footer_intro {
    float: none;
    padding-left: 0;
  }
  #footer .footer_link li {
    float: none;
    display: inline-block;
    margin-right: 16px;
  }
  .nav-item li a {
    padding: 0 15px;
  }
}
@media screen and (max-width: 820px) {
  #logo {
    margin-right: 0;
  }
  .nav-item li {
    float: none;
    margin: 0;
    width: 100%;
  }
  .nav-item li a {
    padding-left: 30px;
    text-align: left;
  }
  .search-warp,
  #login-area {
    display: none;
  }
  #footer {
    text-align: center;
  }
  #footer .followus {
    float: none;
    padding: 0;
    margin-bottom: 8px;
  }
  #footer .followus a {
    float: none;
    display: inline-block;
  }
  #footer .footer_intro {
    float: none;
    padding-left: 0;
  }
  #footer .footer_link li {
    float: none;
    display: inline-block;
    margin-right: 16px;
  }
  .elevator {
    display: none!important;
  }
  .navbar-toggle {
    position: relative;
    float: right;
    border: 0;
    color: #fff;
    margin-top: 10px;
    margin-right: -5px;
    outline: none;
    padding: 5px 10px;
  }
  .navbar-toggle,
  .navbar-toggle:focus,
  .navbar-toggle:hover {
    background: none;
  }
  .visible-xs-block {
    display: block;
  }
  .navbar-toggle .sz-list {
    color: #fff;
    font-size: 32px;
  }
  .nav-item {
    display: none;
    width: 130px;
    height: 2000px;
    background: #242A2F;
    position: absolute;
    left: 100%;
    top: 0;
    margin: 0;
  }
  .nav-item li {
    float: none;
  }
  .nav-item li a {
    padding: 10px 0 10px 30px;
    text-align: left;
    line-height: 30px;
    height: 30px;
  }
  .nav-item li.set-btn {
    color: #fff;
    height: 60px;
    line-height: 60px;
    text-align: center;
  }
  .nav-item li.set-btn a {
    display: inline;
    padding: 0;
  }
  .nav-item li.set-btn img {
    width: 36px;
    height: 36px;
    border: 2px solid #fff;
    border-radius: 22px;
    vertical-align: middle;
    display: inline-block;
    background: url("/static/module/common/img/menu_icon.png") no-repeat;
  }
  body.slide-left .nav-item {
    display: block;
  }
}
#sz-banner {
  position: relative;
  height: 188px;
  background-image: linear-gradient(-90deg, #07111b 0%, rgba(7, 17, 27, 0) 100%);
}
#sz-banner .info-bg {
  overflow: hidden;
  z-index: 0;
}
#sz-banner .info-bg,
#sz-banner .info-bg .cover-canvas,
#sz-banner .info-bg .cover-img-wrap,
#sz-banner .info-bg .cover-mask {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 188px;
}
#sz-banner .info-bg .cover-img-wrap {
  z-index: 0;
  overflow: hidden;
  /* filter: progid:DXImageTransform.Microsoft.Blur(PixleRdius=10, MakeShadow=false); */
}
#sz-banner .info-bg .cover-img-wrap img {
  position: absolute;
  left: 0;
  top: 0;
}
#sz-banner .info-bg .cover-mask {
  filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr="#cc000000", endcolorstr="#33000000", gradientType=1);
}
#sz-banner .wrap {
  width: 1152px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
#sz-banner .sz-banner-left,
#sz-banner .sz-banner-right {
  height: 188px;
  position: relative;
}
#sz-banner .sz-banner-left {
  float: left;
  width: 100%;
}
#sz-banner .sz-banner-right {
  position: absolute;
  right: 0;
  top: 0;
  width: 304px;
}
#sz-banner .course-notice {
  position: absolute;
  top: 24px;
  right: 0;
  width: 68px;
  height: 32px;
  background: rgba(255, 153, 0, 0.8);
  box-shadow: 0 2px 4px 0 rgba(7, 17, 27, 0.2);
  border-radius: 16px;
  padding: 6px 12px;
  box-sizing: border-box;
  cursor: pointer;
  overflow: hidden;
  transition: .3s all linear;
}
#sz-banner .course-notice:hover {
  background: #ff9900;
}
#sz-banner .course-notice i,
#sz-banner .course-notice span {
  float: left;
  color: #FFFFFF;
  line-height: 20px;
}
#sz-banner .course-notice i {
  font-size: 16px;
  margin-right: 4px;
}
#sz-banner .course-notice span {
  font-size: 12px;
}
#sz-banner .course-notice .course-new-notice {
  display: none;
}
#sz-banner .course-notice.open {
  width: 304px;
  height: 140px;
  padding: 16px 24px;
  background: #FF9900;
  box-shadow: 0 8px 16px 0 rgba(7, 17, 27, 0.2);
  border-radius: 8px;
  z-index: 1;
  cursor: default;
}
#sz-banner .course-notice.open i {
  font-size: 20px;
}
#sz-banner .course-notice.open span {
  font-size: 14px;
}
#sz-banner .course-notice.open .course-new-notice {
  display: block;
}
#sz-banner .course-notice.open p {
  font-size: 12px;
  color: #FFFFFF;
  line-height: 24px;
  margin: 8px 0;
}
#sz-banner .course-notice.open .al {
  float: left;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 24px;
}
#sz-banner .course-notice.open .al:hover {
  color: #fff;
}
#sz-banner .course-notice.open .ar {
  float: right;
  color: #FFFFFF;
  line-height: 24px;
}
#sz-banner .course-notice.open .ar span {
  float: left;
  font-size: 12px;
  margin-right: 4px;
}
#sz-banner .course-notice.open .ar i {
  float: left;
  font-size: 16px;
}
#sz-banner .crumbs {
  padding-top: 16px;
}
#sz-banner .crumbs span,
#sz-banner .crumbs a,
#sz-banner .crumbs i {
  float: left;
  font-size: 12px;
  line-height: 24px;
  color: rgba(255, 255, 255, 0.6);
}
#sz-banner .crumbs a:hover {
  color: #ffffff;
}
#sz-banner .crumbs i {
  margin: 0 4px;
  font-style: normal;
  width: 6px;
  text-align: center;
}
#sz-banner .course-title {
  padding-top: 5px;
  font-size: 32px;
  color: #FFFFFF;
  height: 45px;
  line-height: 36px;
  text-align: left;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-word;
}
#sz-banner .course-title a {
  font-size: 32px;
  color: #FFFFFF;
}
#sz-banner .shizhan-nav {
  position: absolute;
  width: 800px;
  left: 0;
  bottom: 0;
}
#sz-banner .shizhan-nav a {
  float: left;
  width: 124px;
  height: 60px;
  margin-right: 72px;
  padding: 12px 24px 16px;
  box-sizing: border-box;
}
#sz-banner .shizhan-nav a:hover i,
#sz-banner .shizhan-nav a:hover span {
  color: #fff;
}
#sz-banner .shizhan-nav a.on {
  background: #F8FAFC;
  border-radius: 4px 4px 0 0;
}
#sz-banner .shizhan-nav a.on i {
  color: #F01414;
}
#sz-banner .shizhan-nav a.on span {
  color: #2B333B;
}
#sz-banner .shizhan-nav i,
#sz-banner .shizhan-nav span {
  color: rgba(255, 255, 255, 0.6);
  line-height: 32px;
}
#sz-banner .shizhan-nav i {
  float: left;
  font-size: 32px;
}
#sz-banner .shizhan-nav span {
  float: right;
  font-size: 16px;
}
#sz-banner .wrap-other {
  position: relative;
  height: 150px;
}
#sz-banner .wrap-other img {
  display: block;
  width: 100%;
  height: 150px;
}
#sz-banner .wrap-other .user-info {
  position: absolute;
  left: 50%;
  top: 0;
  margin-left: -600px;
  width: 1000px;
  padding-left: 168px;
  height: 100%;
}
#sz-banner .wrap-other .user-info a {
  position: absolute;
  left: 0;
  bottom: -20px;
  width: 132px;
  height: 132px;
  border: 4px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  overflow: hidden;
}
#sz-banner .wrap-other .user-info img {
  width: 132px;
  height: 132px;
}
#sz-banner .wrap-other .user-info h3 {
  font-size: 32px;
  font-weight: 600;
  color: #ffffff;
  line-height: 40px;
  margin-top: 48px;
  margin-bottom: 18px;
}
#sz-banner .wrap-other .user-info span {
  color: #ffffff;
  font-size: 14px;
  line-height: 20px;
  text-align: left;
  opacity: 0.5;
  filter: alpha(opacity=50);
}
#sz-banner .wrap-other .user-info i {
  font-style: normal;
  margin: 0 20px;
  color: #ffffff;
  opacity: 0.2;
  filter: alpha(opacity=20);
}
#sz-banner .wrap-other .user-info em {
  margin-left: 8px;
}
.rl-modal {
  position: fixed;
  background: #fff;
  z-index: 100000;
  width: 360px;
  padding-bottom: 30px;
  left: 50%;
  top: 50%;
  margin: -218px 0 0 -180px;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
  transition: all 0.2s;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
}
.rl-modal.in {
  opacity: 1;
  filter: alpha(opacity=100);
}
.rl-modal-header {
  position: relative;
  padding: 0 20px;
}
.rl-modal-header h1 {
  font-size: 16px;
  line-height: 49px;
  height: 49px;
  color: #787d82;
  border-bottom: 1px solid #d0d6d9;
}
.rl-modal-header h1 span {
  float: left;
  width: 80px;
  text-align: center;
  height: 49px;
  line-height: 49px;
  cursor: pointer;
}
.rl-modal-header .active-title,
.rl-modal-header span:hover {
  border-bottom: 1px solid #f01400;
  color: #f01400;
}
.rl-close {
  position: absolute;
  top: 17px;
  right: 20px;
  width: 17px;
  height: 17px;
  cursor: pointer;
  background: url(/static/module/common/img/nlogin.png) no-repeat 0 0;
  transition: transform 0.2s;
  -webkit-transition: transform 0.2s;
  -moz-transition: transform 0.2s;
  -o-transition: transform 0.2s;
}
.rl-close:hover {
  background-position: 0 -21px;
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
}
.rl-modal-body {
  padding: 0 30px;
}
.error-erea {
  font-size: 14px;
  color: #f01400;
  padding-bottom: 5px;
  height: 20px;
}
.modal-backdrop {
  background-color: #ffffff;
}
.modal-backdrop.fade {
  opacity: 0;
}
.modal-backdrop,
.modal-backdrop.fade.in {
  opacity: 0.75;
  filter: alpha(opacity=75);
}
.modal-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000;
}
.fade {
  opacity: 0;
  -webkit-transition: opacity .15s linear;
  -moz-transition: opacity .15s linear;
  -o-transition: opacity .15s linear;
  transition: opacity .15s linear;
}
.rl-model-footer {
  padding: 20px 30px 4px;
}
.rlf-appendix {
  line-height: 1em;
  margin-bottom: 20px;
}
.rlf-appendix .rlf-autoin,
.rlf-appendix .rlf-forget {
  color: #787d82;
}
.rlf-appendix .rlf-forget:hover {
  color: #f01400;
}
.rlf-appendix .auto-cbx {
  margin-right: 10px;
  vertical-align: -1px;
}
.rl-modal .ipt {
  width: 270px;
  padding: 12px 14px;
  background-color: #fff;
  border: 1px solid #d0d6d9;
  box-shadow: 2px 0px 5px 0px #fff;
}
.rl-modal .ipt:focus {
  border-color: #98a1a6;
}
.ipt-email {
  background-position: 0 0;
}
.ipt-pwd {
  background-position: 0 -48px;
}
.ipt-nick {
  background-position: 0 -96px;
}
.rlf-verify-group .rlf-input {
  background: #fff;
  padding-left: 7px;
  width: 120px;
  vertical-align: top;
}
.rlf-verify-group img {
  height: 38px;
  width: 70px;
  margin: 0 10px;
  vertical-align: top;
  display: inline-block;
}
.rlf-verify-group span {
  display: inline-block;
  color: #39b94e;
  cursor: pointer;
  height: 40px;
  vertical-align: top;
  line-height: 150%;
  margin-top: -4px;
}
.rlf-tip-wrap {
  font-size: 12px;
  height: 20px;
}
.rlf-g-tip {
  height: 20px;
}
.rlf-tip-globle {
  font-size: 14px;
  height: 30px;
  line-height: 30px;
}
.rlf-tip-error {
  color: #f01400;
}
.btn-full {
  width: 300px;
}
.btn-block {
  display: block;
  width: auto;
}
.forgetpwd-resultwrap {
  text-align: center;
  display: none;
  width: 260px;
}
.pop-login-sns {
  text-align: center;
  font-size: 14px;
}
.pop-login-sns span {
  color: #b5b9bc;
  display: inline-block;
  margin-top: 4px;
}
.pop-login-sns a {
  font-size: 14px;
  margin-left: 21px;
  height: 20px;
  line-height: 20px;
  color: #c8cdd2;
  transition: color .2s;
}
.pop-login-sns i {
  font-size: 29px;
  vertical-align: -3px;
  transition: color .2s;
  color: #b5b9bc;
}
.pop-login-sns .pop-sns-weixin:hover i {
  color: #00b33b;
}
.pop-login-sns .pop-sns-qq:hover i {
  color: #0088cc;
}
.pop-login-sns .pop-sns-weibo:hover i {
  color: #f01400;
}
.rl-modal .ipt-verify {
  background-image: none;
}
.rl-modal .sz-refresh {
  position: absolute;
  right: 90px;
  top: 12px;
  color: #b5b9bc;
  font-size: 24px;
  display: inline-block;
  /* margin: 8px 0 0 10px; */
  -webkit-transition: 0.4s linear;
  transition: 0.4s ease-in;
}
.rl-modal .sz-refresh:hover {
  color: #787d82;
  transform: rotate(360deg);
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
}
.rl-modal {
  /*.ipt{
      .placeholder(@color-gray);
  }*/
  /* don't show the x for text inputs */
  /* don't show the eye for password inputs */
}
.rl-modal .form-control {
  position: relative;
}
.rl-modal .proclaim-loc {
  position: relative;
}
.rl-modal .proclaim-btn {
  font-size: 23px;
  color: #b5b9bc;
  position: absolute;
  top: 8px;
  right: 8px;
}
.rl-modal .proclaim-btn:hover {
  color: #787d82;
}
.rl-modal .verify-img-wrap {
  position: absolute;
  right: 2px;
  top: 3px;
  width: 84px;
  height: 40px;
}
.rl-modal .verify-img {
  width: 84px;
  height: 40px;
  vertical-align: top;
}
.rl-modal .verify-extra {
  line-height: 20px;
}
.rl-modal .verify-extra a {
  color: #17823b;
}
.rl-modal .btn-red {
  color: #ffffff;
  background-color: #f01400;
}
.rl-modal .btn-red:hover {
  background-color: #ff6464;
}
.rl-modal .ipt-error,
.rl-modal .rlf-tip-error {
  color: #f01400;
}
.rl-modal .rlf-tip-error {
  height: 30px;
  line-height: 30px;
}
.rl-modal .js-proclaim-on .js-txt-pwd {
  display: none;
}
.rl-modal .js-proclaim-off .js-pass-pwd {
  display: none !important;
}
.rl-modal input[type=text]::-ms-clear {
  width: 0;
  height: 0;
}
.rl-modal input[type=password]::-ms-reveal {
  width: 0;
  height: 0;
}
.verify-img-wrap {
  float: left;
  height: 40px;
  width: 70px;
}
.rlf-tip-wrap {
  clear: both;
}
/*down inputs*/
.autoul {
  width: 298px;
  padding: 0px;
  border: 1px solid #98a1a6;
  border-top: 0 none;
  position: absolute;
  top: 40px;
  height: 156px;
  overflow: hidden;
  background-color: #fff;
  z-index: 10000;
}
.autoul .autoli {
  color: #787d82;
  height: 39px;
  line-height: 39px;
  text-align: left;
  cursor: pointer;
  font-size: 14px;
  padding: 0 10px;
  overflow: hidden;
  display: none;
  text-overflow: ellipsis;
}
.autoul .lihover {
  background-color: #edf1f2;
}
.autoul .showli {
  display: block;
}
.form-control .autoul {
  width: 318px;
}
/* old ie tip */
.compatible-contianer {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  min-width: 800px;
  height: 30px;
  line-height: 30px;
  background: url(/static/module/common/img/iebg.gif) repeat-x;
  z-index: 999999;
}
.cpt-ct {
  color: #363636;
  font-size: 12px;
  text-align: center;
}
.cpt-ct i {
  display: inline-block;
  width: 12px;
  height: 14px;
  vertical-align: -2px;
  margin-right: 5px;
  background: url(/static/module/common/img/iefixed-sprite.png) no-repeat 0 0;
}
.cpt-ct a {
  color: #39b94e;
}
.cpt-ct a:hover {
  text-decoration: underline;
}
.cpt-handle {
  position: absolute;
  right: 20px;
  top: 0;
  font-size: 12px;
  line-height: 27px;
}
.cpt-handle a {
  display: inline-block;
  vertical-align: middle;
}
.cpt-handle .cpt-agin {
  color: #656e73;
  margin-right: 5px;
}
.cpt-handle .cpt-agin:hover {
  color: #363d40;
}
.cpt-close {
  width: 16px;
  height: 16px;
  text-align: center;
  line-height: 16px;
  border-radius: 50%;
  transition: 0.3s;
}
.cpt-close:hover {
  background-color: #fc8800;
}
.cpt-close i {
  display: inline-block;
  height: 8px;
  width: 8px;
  vertical-align: 1px;
  background: url(/static/module/common/img/iefixed-sprite.png) no-repeat 0 -24px;
}
.cpt-close:hover i {
  background-position: 0 -42px;
}
/* old ie tip end */
/*课程、评论相关的角色标识*/
.identity {
  font-size: 16px;
  margin-left: 5px;
  color: red;
  position: relative;
  top: 3px;
  display: inline-block;
}
.sz-jxsjs {
  background: url(/static/module/common/img/role_icon.png) no-repeat 0 0;
  width: 16px;
  height: 16px;
}
.sz-zhuj {
  background: url(/static/module/common/img/role_icon.png) no-repeat 0 -25px;
  width: 16px;
  height: 16px;
}
.project-qrcode {
  position: relative;
  float: right;
  width: 30px;
  height: 15px;
  color: #787d82;
}
.project-qrcode .sz-qrcode {
  vertical-align: -3px;
  color: #b5b9bc;
  cursor: pointer;
}
.project-qrcode .sz-qrcode:before {
  content: "\e903";
  font-size: 18px;
}
.project-qrcode .sz-qrcode:hover {
  color: #787d82;
}
div.qrcode-box {
  display: none;
  padding: 30px;
  background: #fff;
  width: 200px;
  height: 250px;
  position: absolute;
  z-index: 99;
  top: 42px;
  right: -110px;
  text-align: center;
  box-shadow: 0 5px 16px 0 rgba(0, 0, 0, 0.3);
}
div.qrcode-box .qrcode-dot {
  width: 15px;
  height: 15px;
  position: absolute;
  top: -8px;
  left: 120px;
  background: #fff;
  transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  box-shadow: 7px 5px 16px 0 rgba(0, 0, 0, 0.3);
}
div.qrcode-box .qrcode-dot-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 260px;
  height: 30px;
  background: #fff;
}
div.qrcode-box .qrcode-img {
  width: 164px;
  height: 164px;
  margin: 0 auto;
}
div.qrcode-box p {
  float: none !important;
  padding: 30px 0 10px;
  font-size: 18px;
  color: #1c1f21;
  line-height: 16px;
  margin: 0;
}
div.qrcode-box span {
  display: block;
  font-size: 12px;
  font-weight: normal;
  color: #b5b9bc;
  line-height: 150%;
}
.cool-pop-btn {
  position: relative;
  height: 0;
  text-align: right;
}
.cool-pop-btn .pop-action {
  position: absolute;
  right: 0;
  bottom: 0;
  top: -40px;
  text-align: center;
  width: 80px;
  height: 80px;
  line-height: 80px;
  color: #ffffff;
  border-radius: 50%;
  overflow: hidden;
  box-shadow: 6px 6px 12px 0 rgba(0, 0, 0, 0.12);
  transition: box-shadow 0.3s ease;
}
.cool-pop-btn .pop-action .action-text {
  display: block;
  vertical-align: middle;
  width: 0;
  height: 100%;
  overflow: hidden;
  font-size: 24px;
  margin-left: 0;
  white-space: nowrap;
  transition: width .3s ease;
}
.cool-pop-btn .pop-action i {
  font-size: 38px;
  vertical-align: middle;
}
.cool-pop-btn .pop-action.red {
  background-color: #f20d0d;
}
.cool-pop-btn .pop-action:hover {
  width: auto;
  padding: 0 30px;
  border-radius: 50px;
}
.cool-pop-btn .pop-action:hover .action-text {
  display: inline-block;
  width: 4em;
  margin-left: 16px;
}
.col-aside .divider {
  margin: 28px 0;
  height: 0;
  overflow: hidden;
  border-bottom: 1px solid #d9dde1;
}
.program-nav {
  padding-right: 10px !important;
}
.app-download {
  line-height: 72px;
  position: relative;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
}
.app-download:hover > a {
  color: #fff;
}
.app-download > a {
  color: rgba(255, 255, 255, 0.6);
  padding: 0 15px;
}
.app-download .app-load-box {
  display: none;
  position: absolute;
  right: 0;
  top: 100%;
  width: 304px;
  padding: 22px 24px;
  box-sizing: border-box;
  background-color: #fff;
  font-size: 12px;
  color: #4D555D;
  line-height: 16px;
  box-shadow: 0 8px 16px 0 rgba(7, 17, 27, 0.2);
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  z-index: 99999;
}
.app-download .app-load-box p {
  margin-bottom: 12px;
}
.app-download .app-load-box img {
  width: 108px;
  height: 108px;
}
.app-download .app-load-box i {
  font-size: 16px;
  margin: 0 8px 0 12px;
  vertical-align: -2px;
}
.app-download .app-load-box a {
  display: block;
  font-size: 12px;
  color: #fff;
  width: 132px;
  height: 36px;
  margin-top: 8px;
  line-height: 36px;
  background: #4D555D;
  border-radius: 18px;
}
.app-download .app-load-box a:hover {
  background-color: #07111b;
}
.shop-cart.hover .my-cart {
  display: block;
}
.shop-cart.hover .shop-cart-icon {
  color: #fff;
}
.shop-cart {
  position: relative;
  height: 36px;
  line-height: 36px;
  margin-top: 18px;
  margin-bottom: 18px;
}
.shop-cart:hover .shop-cart-icon {
  border-color: rgba(255, 255, 255, 0.4);
  background-color: rgba(255, 255, 255, 0.1);
  /* background-color: rgba(77,85,93,.4); */
}
.shop-cart:hover .shop-cart-icon span {
  color: #fff;
}
.shop-cart .shop-cart-icon {
  display: inline-block;
  padding: 0px 18px;
  width: auto;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 18px;
  height: 36px;
  line-height: 34px;
}
.shop-cart .shop-cart-icon span {
  color: rgba(255, 255, 255, 0.6);
  font-size: 14px;
}
.shop-cart .shop-cart-icon .sz-shopping-cart {
  position: relative;
  top: 2px;
  font-size: 16px;
  margin-right: 8px;
}
.shop-cart .shop-cart-icon .shopping_icon {
  padding: 0px 5px;
  height: 16px;
  line-height: 16px;
  background: #f01414;
  border-radius: 50%;
  color: #fff;
  font-style: normal;
  font-size: 10px;
  margin-left: 8px;
}
.shop-cart .my-cart {
  padding: 0px 12px;
  position: absolute;
  right: 0;
  top: 54px;
  width: 350px;
  background: #fff;
  box-sizing: border-box;
  display: none;
  z-index: 99999;
  box-shadow: 0 8px 16px 0 rgba(7, 17, 27, 0.2);
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
}
.shop-cart .my-cart .cart-title-box {
  padding: 20px 12px;
  border-bottom: 1px solid #d9dde1;
}
.shop-cart .my-cart .cart-title-box h2 {
  height: 16px;
  font-size: 16px;
  color: #07111b;
  line-height: 16px;
}
.shop-cart .my-cart .cart-title-box h5 {
  height: 16px;
  line-height: 16px;
  font-size: 12px;
  color: #93999f;
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box {
  height: 284px;
  overflow-y: scroll;
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box ul {
  width: 100%;
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box ul li {
  padding: 12px 12px 8px 12px;
  box-sizing: border-box;
  /* border-bottom: 1px solid #d9dde1; */
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box ul li:hover {
  background: #f3f5f7;
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box ul li:hover .del {
  display: block;
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box ul li a {
  width: auto;
  height: auto;
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box ul li img {
  width: 100px;
  height: 56px;
  margin-right: 12px;
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box ul li .content-box {
  width: 170px;
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box ul li .content-box h3 {
  word-break: break-word;
  font-size: 12px;
  color: #07111b;
  line-height: 16px;
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box ul li .content-box p {
  margin-top: 16px;
  height: 12px;
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box ul li .content-box p span {
  color: rgba(240, 20, 20, 0.6);
  font-size: 12px;
  line-height: 12px;
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box ul li .content-box p span:hover {
  color: #f01414;
}
.shop-cart .my-cart .cart-wrap .cart-wrap-box ul li .del {
  display: none;
  cursor: pointer;
}
.shop-cart .my-cart .cart-wrap .clear-cart {
  height: 284px;
  text-align: center;
  margin-top: 0 auto;
}
.shop-cart .my-cart .cart-wrap .clear-cart .cartIcon {
  margin-top: 36px;
  margin-bottom: 12px;
  display: inline-block;
  width: 60px;
  height: 60px;
  line-height: 60px;
  background: #93999f;
  font-size: 36px;
  color: #fff;
  border-radius: 50%;
}
.shop-cart .my-cart .cart-wrap .clear-cart h3 {
  margin: 0 auto;
  width: 180px;
  padding-bottom: 24px;
  border-bottom: 1px solid #d9dde1;
  color: #4d555d;
  font-size: 14px;
  line-height: 14px;
}
.shop-cart .my-cart .cart-wrap .clear-cart .text {
  text-align: center;
  margin-top: 24px;
  margin-bottom: 16px;
  font-size: 12px;
  line-height: 12px;
  color: #93999f;
}
.shop-cart .my-cart .cart-wrap .clear-cart .go-link {
  display: block;
  color: rgba(240, 20, 20, 0.6);
  font-size: 12px;
  line-height: 12px;
  margin-bottom: 16px;
}
.shop-cart .my-cart .cart-wrap .clear-cart .go-link:hover {
  color: #f01414;
}
.shop-cart .my-cart .more-box {
  padding: 16px 12px;
  border-top: 1px solid #d9dde1;
}
.shop-cart .my-cart .more-box .show-box {
  height: 38px;
  line-height: 38px;
}
.shop-cart .my-cart .more-box .show-box .num-icon {
  width: 16px;
  height: 16px;
  font-size: 10px;
  color: #fff;
  line-height: 10px;
  padding: 3px 6px;
  border-radius: 50%;
  background: #f01414;
  box-sizing: border-box;
}
.shop-cart .my-cart .more-box .show-box .text {
  font-size: 12px;
  color: #93999f;
}
.shop-cart .my-cart .more-box .show-box .text a {
  color: #93999f;
}
.shop-cart .my-cart .more-box .show-box .text a:hover {
  color: #4d555d;
}
.shop-cart .my-cart .more-box .show-box .go-pay a {
  color: #f01414;
  padding: 0px;
  font-size: 12px;
}
.shop-cart .my-cart .more-box .go-cart {
  color: #fff;
  font-size: 12px;
  line-height: 12px;
  font-weight: 700;
  padding: 12px 16px;
  background: rgba(240, 20, 20, 0.8);
  border-radius: 16px;
}
.shop-cart .my-cart .more-box .go-cart:hover {
  background-color: #f04646;
}
/*  precon.less*/
/* base color */
.word-break {
  word-break: break-all;
  word-wrap: break-word;
}
.keep-word {
  white-space: nowrap;
  word-break: keep-all;
}
.course-list li {
  border-radius: 0 0 1px 1px;
  float: left;
  margin: 0 80 8px 0;
  height: 250px;
  width: 260px;
  position: relative;
}
.course-list li a:hover h5 {
  color: #f01400;
}
.course-list .course-list-img {
  width: 260px;
  height: 146px;
  overflow: hidden;
  position: relative;
  *display: inline;
  *zoom: 1;
}
.course-list .course-list-img img {
  display: block;
  width: 260px;
  transition: 1s;
  -moz-transition: 1s;
  -webkit-transition: 1s;
  -o-transition: 1s;
}
.course-list h5 {
  margin: 18px 0 0;
  height: 18px;
  line-height: 18px;
  color: #4d555d;
  text-align: left;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  -webkit-transition: color 0.3s;
  -moz-transition: color 0.3s;
  transition: color 0.3s;
}
.course-list .tips {
  font-size: 12px;
  color: #b4bbbf;
}
.course-list .tips p {
  margin: 8px 0;
}
.course-list .tips span {
  color: #787d82;
}
.course-list .tips .update-latest {
  color: #00dc50;
}
.course-list .tips .price {
  font-size: 16px;
  color: #f20d0d;
  line-height: 1;
  font-weight: bold;
}
.course-list .tips .price i {
  font-size: 10px;
  font-style: normal;
  vertical-align: top;
}
.course-list .new {
  color: #86d693 !important;
}
.course-list .learned {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  height: 18px;
  padding: 0 5px;
  text-align: center;
  line-height: 18px;
  background-color: #7e878c;
  background-color: #00b33b;
  font-size: 12px;
  color: #fff;
  font-style: normal;
  font-weight: normal;
  margin-right: 5px;
  vertical-align: middle;
}
.course-list .follow-label {
  display: none;
  position: absolute;
  left: 15px;
  top: 25px;
  width: 46px;
  height: 23px;
  line-height: 23px;
  padding-bottom: 5px;
  font-size: 12px;
  color: #fff;
  text-align: center;
  background: url(/static/img/course/v2/follow_label.png) no-repeat 0 0;
}
.course-list .time-label {
  position: absolute;
  right: 6px;
  top: 6px;
  height: 20px;
  line-height: 20px;
  font-size: 12px;
  color: #fff;
  padding: 0 3px;
  visibility: hidden;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
  -webkit-transform: translateX(10px);
  -ms-transform: translateX(10px);
  transform: translateX(10px);
  -webkit-transition: .3s;
  transition: .3s;
}
.course-list .tags {
  margin: 12px 0 14px;
  height: 20px;
  overflow: hidden;
}
.course-list .tags span {
  display: inline-block;
  margin-right: 4px;
  padding: 0 8px;
  height: 20px;
  line-height: 20px;
  font-size: 12px;
  color: #787d82;
  background-color: #edf1f2;
  vertical-align: middle;
}
.course-list li:hover h5 {
  color: #f20d0d;
}
.course-list li:hover .time-label {
  visibility: visible;
  opacity: 1;
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}
.course-list .del {
  display: none;
  cursor: pointer;
  position: absolute;
  left: 5px;
  top: 5px;
  width: 24px;
  height: 24px;
  background: url(/static/img/course/dot_del.png) no-repeat left top;
}
.course-list.editable .del {
  display: block;
}
.ml20 {
  margin-left: 20px;
}
.course-one .media-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.course-one .media-progress .progress-val,
.course-one .media-progress .mask {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 4px;
  height: 30px;
}
.course-one .media-progress .progress-val {
  padding: 0 10px;
  line-height: 30px;
  font-size: 20px;
  color: white;
  font-weight: normal;
  z-index: 2;
}
.course-one .media-progress .mask {
  background-color: #000;
  opacity: .4;
  filter: alpha(opacity=40);
  z-index: 1;
}
.course-one .media-progress .progress-bar {
  position: relative;
  background-color: #656e73;
}
.course-one .media-progress .bar {
  height: 4px;
  background-color: #00b33b;
}
.course-one .complete {
  font-size: 12px;
  color: #787d82;
}
.course-one .complete strong {
  margin-left: 4px;
  font-size: 14px;
  color: #00b230;
}
.tab-header {
  background: #f3f5f7;
}
.tab-header .w {
  position: relative;
  padding: 40px 0 77px 0;
}
.tab-header .w .teacher-intro {
  float: none;
  margin-top: 0;
}
.tab-header .w p {
  padding: 0 200px 0 0;
  line-height: 28px;
  color: #787d82;
  word-wrap: break-word;
}
.tab-header .w .tab-btn {
  position: absolute;
  width: 80px;
  height: 80px;
  border-radius: 40px;
  background: #00b43c;
  right: 0;
  top: -40px;
  box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.1);
  color: #fff;
  font-size: 48px;
  line-height: 80px;
  text-align: center;
  transition: width .5s;
  overflow: hidden;
}
.tab-header .w .tab-btn span {
  width: 200px;
  font-size: 24px;
  overflow: hidden;
  display: none;
}
.tab-header .w .tab-btn:hover {
  width: 200px;
}
.tab-header .w .tab-btn:hover i {
  display: none;
}
.tab-header .w .tab-btn:hover span {
  display: block;
}
.tab-header .w .tab-btn:hover span i {
  display: inline-block;
}
.tab-header .tab-nav {
  position: absolute;
  left: 0;
  bottom: 0;
}
.tab-header .tab-nav a {
  border-bottom: 2px solid  #f3f5f7;
  font-size: 16px;
  color: #4d555d;
  font-weight: bold;
  display: inline-block;
  margin-right: 50px;
  line-height: 36px;
}
.tab-header .tab-nav a:hover {
  color: #07111b;
}
.tab-header .tab-nav a.curr {
  border-bottom: 2px solid  #00b43c;
  color: #00b43c;
}
.theme-purple .w {
  padding: 30px 0;
}
.theme-purple .w .no-teacher {
  line-height: 28px;
  color: #787d82;
}
.theme-purple .w .no-teacher img {
  vertical-align: middle;
  margin: 0 24px;
}
.tab-header.theme-red .tab-btn {
  background-color: #f01414;
}
.tab-header.theme-red .tab-nav a.curr {
  color: #f01414;
  border-bottom-color: #f01414;
}
.cart-color {
  background: linear-gradient(270deg, rgba(255, 115, 155, 0.7), #ff739b);
}
/*红色*/
.cart-color.red {
  background: linear-gradient(270deg, rgba(255, 115, 155, 0.7), #ff739b);
}
/*橙色*/
.cart-color.orange {
  background: linear-gradient(270deg, rgba(255, 150, 0, 0.7), #ff9600);
}
/*绿色*/
.cart-color.green {
  background: linear-gradient(270deg, rgba(0, 185, 90, 0.7), #00b95a);
}
/*青色*/
.cart-color.cyan {
  background: linear-gradient(270deg, rgba(0, 200, 200, 0.7), #00c8c8);
}
/*蓝色*/
.cart-color.blue {
  background: linear-gradient(270deg, rgba(75, 150, 220, 0.7), #4b96dc);
}
/*紫色*/
.cart-color.purple {
  background: linear-gradient(270deg, rgba(210, 115, 230, 0.7), #d273e6);
}
.shizhan-recommendcourse {
  width: 1200px;
  margin: 0 auto;
  padding: 32px 0px 0px;
}
.shizhan-recommendcourse .box-tit {
  font-size: 16px;
  color: #07111b;
  line-height: 36px;
  font-weight: bold;
  margin-bottom: 20px;
}
.shizhan-list-wrap {
  width: 100%;
  margin: 0 auto;
}
.shizhan-list-wrap .shizhan-course-list {
  width: 1232px;
  margin: -16px;
  overflow: hidden;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap {
  position: relative;
  margin: 16px;
  width: 276px;
  height: 316px;
  box-shadow: 0px 4px 8px 0px rgba(7, 17, 27, 0.1);
  transition: .3s all linear;
  border-radius: 6px;
  background: #fff;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap a {
  display: block;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap:hover {
  box-shadow: 0px 8px 16px 0px rgba(7, 17, 27, 0.2);
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box {
  position: relative;
  width: 100%;
  height: 100%;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .box {
  width: 276px;
  overflow: hidden;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .img-box {
  width: 276px;
  height: 96px;
  overflow: hidden;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .img-box img {
  width: 276px;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-course-rate {
  position: absolute;
  width: 40px;
  height: 24px;
  font-size: 12px;
  line-height: 24px;
  color: #fff;
  background-color: #07111b;
  font-weight: 200;
  text-align: center;
  right: -4px;
  top: 12px;
  z-index: 1;
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-course-rate:after {
  position: absolute;
  content: '';
  width: 0;
  height: 0;
  overflow: hidden;
  border-top: 4px solid #07111b;
  border-right: 4px solid transparent;
  right: 0;
  bottom: -4px;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-course-img {
  border-top-right-radius: 6px;
  border-top-left-radius: 6px;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box {
  position: relative;
  width: 277px;
  height: 220px;
  background: #fff;
  padding: 22px 24px 24px;
  box-sizing: border-box;
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizan-name {
  font-size: 16px;
  line-height: 28px;
  color: #07111b;
  font-weight: 200;
  letter-spacing: -0.1px;
  max-height: 56px;
  word-break: break-all;
  word-wrap: break-word;
  overflow: hidden;
  text-overflow: -o-ellipsis-lastline;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizan-desc {
  margin-top: 8px;
  font-size: 12px;
  line-height: 24px;
  color: #93999f;
  font-weight: 200;
  max-height: 48px;
  word-break: break-all;
  word-wrap: break-word;
  overflow: hidden;
  text-overflow: -o-ellipsis-lastline;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom {
  position: absolute;
  bottom: 22px;
  width: 228px;
  box-sizing: border-box;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .shizhan-info {
  font-size: 12px;
  line-height: 20px;
  color: #93999f;
  font-weight: 200;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .shizhan-info i {
  display: inline-block;
  width: 10px;
  text-align: center;
  font-weight: 400;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box {
  position: relative;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box:hover .evaluation-desc-box {
  display: block;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box .stars {
  font-size: 16px;
  line-height: 24px;
  color: rgba(255, 153, 0, 0.2);
  margin-right: 0px;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box .stars .on {
  color: #ff9900;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box .stars i {
  top: 0px;
  margin-right: 0px;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box .evaluation-desc-box {
  display: none;
  position: absolute;
  bottom: 24px;
  width: 228px;
  padding: 16px 0px;
  background: #ff9900;
  border-radius: 4px;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box .evaluation-desc-box .trangle {
  position: absolute;
  bottom: -5px;
  left: 34px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #ff9900;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box .evaluation-desc-box p {
  font-size: 12px;
  line-height: 12px;
  color: #fff;
  font-weight: 200;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box .evaluation-desc-box .left-box {
  width: 118px;
  text-align: center;
  border-right: 1px solid rgba(255, 255, 255, 0.4);
  box-sizing: border-box;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box .evaluation-desc-box .left-box .big-text {
  font-size: 20px;
  line-height: 20px;
  margin: 4px 0px;
  font-weight: 200;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box .evaluation-desc-box .right-box {
  width: 110px;
  text-align: center;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box .evaluation-desc-box .right-box span {
  margin-left: 4px;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .evaluation-box .evaluation-desc-box .right-box p:nth-child(2) {
  margin: 8px 0px;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .student-price {
  font-size: 12px;
  color: #93999F;
  line-height: 20px;
  font-weight: 200;
  text-align: right;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .student-price span {
  display: inline-block;
  font-size: 12px;
  color: rgba(240, 20, 20, 0.6);
  line-height: 20px;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .shizhan-price {
  height: 20px;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .shizhan-course-price {
  text-align: right;
  font-size: 16px;
  color: #f01414;
  line-height: 20px;
  font-weight: 200;
}
.shizhan-list-wrap .shizhan-course-list .shizhan-course-wrap .shizhan-course-box .shizhan-intro-box .shizhan-info-bottom .bottom-box .shizhan-discount-price {
  text-align: right;
  margin-right: 8px;
  font-size: 12px;
  font-weight: 200;
  color: #93999f;
  line-height: 20px;
  text-decoration: line-through;
}
.shizhan-list-wrap .no-course-box {
  padding: 120px 0px 200px;
  text-align: center;
}
.shizhan-list-wrap .no-course-box .no-course {
  margin-bottom: 24px;
  font-size: 24px;
  line-height: 24px;
  color: #93999f;
  font-weight: 200;
}
.shizhan-list-wrap .no-course-box a {
  font-size: 16px;
  line-height: 16px;
  color: #f01414;
}
.shizhan-list-wrap .no-course-box a:hover {
  color: #f04646;
}
.bread-crumbs {
  padding: 24px;
}
.bread-crumbs li {
  float: left;
  font-size: 12px;
  margin-right: 7px;
  color: #93999f;
}
.bread-crumbs li a {
  font-size: 12px;
  color: #93999f;
  margin-right: 7px;
}
.bread-crumbs li a:hover {
  color: #4d555d;
}
.edui-imooc .edui-editor {
  z-index: 900 !important;
}
.ipt-tip-error {
  font-size: 12px;
  color: #f20d0d;
  clear: both;
  height: 30px;
  line-height: 30px;
}
.setBest-mask-div {
  width: 400px;
  height: 250px;
  background: #fff;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: 9999;
}
.setBest-mask-div .setBest-mask-div-closeBox {
  height: 38px;
  position: relative;
}
.setBest-mask-div .setBest-mask-div-closeBox .setBest-mask-div-closeBtn {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 28px;
  color: #c9d0d2;
  cursor: pointer;
  width: 28px;
  height: 28px;
  line-height: 28px;
  text-align: center;
}
.setBest-mask-div .setBest-mask-div-success {
  height: 80px;
  line-height: 80px;
  text-align: center;
  font-size: 18px;
  color: #000;
}
.setBest-mask-div .setBest-mask-div-thanks {
  height: 38px;
  font-size: 14px;
  color: #9a9ba0;
  text-align: center;
}
.setBest-mask-div .setBest-mask-div-input {
  width: 310px;
  height: 40px;
  margin: 0 auto;
}
.setBest-mask-div .setBest-mask-div-input .setBest-mask-div-text {
  width: 222px;
  border: 1px solid #c9d0d2;
  padding: 11px 10px;
  font-size: 10px;
  color: #9a9ba0;
}
.setBest-mask-div .setBest-mask-div-input .setBest-mask-div-btn {
  width: 60px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background: #38b94f;
  color: #fff;
}
.setBest-mask {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: #000;
  opacity: 0.3;
  z-index: 9998;
}
.poster-submit {
  height: 40px;
  line-height: 40px;
  width: 100px;
  text-align: center;
  color: #ffffff;
  background-color: #17823b;
}
.poster-submit:link,
.poster-submit:visited {
  color: #ffffff;
}
.poster-submit:hover {
  color: #ffffff;
}
.poster-cancel {
  margin-right: 20px;
  line-height: 40px;
  color: #787d82;
}
.poster-cancel:link,
.poster-cancel:visited {
  color: #787d82;
}
.poster-cancel:hover {
  color: #787d82;
}
.sz-ic {
  font-size: 16px;
  vertical-align: -2px;
}
#wenda_top_edit .editQuestion-title {
  width: 100%;
  height: 40px;
  border: 1px solid #d0d6d9;
  padding: 10px;
  box-sizing: border-box;
}
#wenda_top_edit .editQuestion-title-error {
  height: 30px;
  line-height: 30px;
  color: #f20d0d;
  font-size: 12px;
  visibility: visible;
}
#editQuestion_editor_error {
  height: 30px;
  line-height: 30px;
  color: #f20d0d;
  font-size: 12px;
  visibility: visible;
}
#wenda_content {
  word-break: break-all;
}
#wenda_content caption,
#wenda_content code,
#wenda_content optgroup,
#wenda_content strong,
#wenda_content th {
  font-style: inherit;
  font-weight: bold;
}
#wenda_content i,
#wenda_content cite,
#wenda_content em,
#wenda_content var,
#wenda_content address,
#wenda_content dfn {
  font-style: italic;
  font-weight: inherit;
}
#wenda_content blockquote {
  padding: 1px 20px;
  margin: 1em 0;
  border-left: 4px solid #ccc;
  color: #787d82;
  background-color: #f5f5f5;
}
#wenda_content blockquote p {
  line-height: 1.5em;
  font-size: 13px;
  color: #444;
}
#wenda_content ul {
  list-style-type: disc;
}
#wenda_content ol {
  list-style-type: decimal;
}
#wenda_content .list-paddingleft-2 {
  padding-left: 30px;
}
#wenda_content a {
  color: #0088cc;
  text-decoration: none;
}
#wenda_content a:hover {
  color: #0088cc;
  text-decoration: underline;
}
#wenda_content pre {
  margin: .5em 0;
  padding: .4em .6em;
  line-height: 1.5;
  border-radius: 3px;
  background: #eee;
}
.layout {
  position: relative;
  padding-right: 376px;
  zoom: 1;
}
.layout .col-main {
  float: left;
  width: 100%;
}
.layout .col-aside.wenda-col-aside {
  margin-top: -48px;
}
.layout .col-aside {
  float: right;
  width: 328px;
  margin-right: -376px;
}
.layout::after {
  content: '';
  display: block;
  line-height: 0;
  overflow: hidden;
  clear: both;
}
.layout.imooc-layout-single {
  padding-right: 0;
}
@keyframes warn {
  0% {
    transform: scale(0);
    opacity: 0.0;
  }
  25% {
    transform: scale(0);
    opacity: 0.1;
  }
  50% {
    transform: scale(0.1);
    opacity: 0.3;
  }
  75% {
    transform: scale(0.5);
    opacity: 0.5;
  }
  100% {
    transform: scale(1);
    opacity: 0.0;
  }
}
@-webkit-keyframes "warn" {
  0% {
    -webkit-transform: scale(0);
    opacity: 0.0;
  }
  25% {
    -webkit-transform: scale(0);
    opacity: 0.1;
  }
  50% {
    -webkit-transform: scale(0.1);
    opacity: 0.3;
  }
  75% {
    -webkit-transform: scale(0.5);
    opacity: 0.5;
  }
  100% {
    -webkit-transform: scale(1);
    opacity: 0.0;
  }
}
.course-infos {
  position: relative;
  background-color: #172a34;
  margin-bottom: 30px;
}
.course-infos .info-video {
  width: 600px;
  height: 380px;
  position: absolute;
  top: 70px;
  right: 0;
  z-index: 999;
  overflow: hidden;
}
.course-infos .info-video .jwplayer {
  margin: 0 auto;
}
.course-infos .info-video .jwplayer .jwvideo video {
  height: 380px !important;
  bottom: 40px !important;
}
.course-infos .js-video-btn {
  width: inherit;
  height: inherit;
  display: block;
}
.course-infos .comp-tabs-pannel .js-close-video {
  position: absolute;
  width: 20px;
  height: 20px;
  display: block;
  right: 10px;
  top: 3px;
  color: #fff;
  z-index: 1001;
  font-size: 22px;
}
.course-infos .video-btn-bg {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  margin: 90px 0 0 200px;
  position: relative;
  display: block;
}
.course-infos .video-small-bg {
  width: 84px;
  height: 84px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  position: absolute;
  top: 148px;
  left: 258px;
  text-align: center;
}
.course-infos .video-small-bg [class*="sz-"] {
  font-size: 40px;
  line-height: 84px;
  color: rgba(0, 0, 0, 0.5);
}
.course-infos .video-small-bg:hover {
  background: #ffffff;
  cursor: pointer;
}
.course-infos .video-small-bg:hover [class*="sz-"] {
  color: #000000;
}
.course-infos .pulse {
  position: absolute;
  width: 140px;
  height: 140px;
  left: 200px;
  top: 90px;
  border: 30px solid #f8fafc;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  z-index: 1;
  opacity: 0;
  -webkit-animation: warn 1.5s ease-out;
  -moz-animation: warn 1.5s ease-out;
  animation: warn 1.5s ease-out;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.course-infos .w {
  height: 484px;
  z-index: 1;
}
.course-infos .path {
  padding: 40px 0 15px 0;
  color: #ffffff;
}
.course-infos .path span,
.course-infos .path a {
  opacity: 0.6;
  filter: alpha(opacity=60);
}
.course-infos .path a {
  color: #ffffff;
}
.course-infos .path a:hover {
  color: white;
  opacity: 1;
  filter: alpha(opacity=100);
}
.course-infos .path .path-split {
  opacity: 0.2;
  filter: alpha(opacity=20);
}
.course-infos .hd {
  clear: both;
}
.course-infos h2 {
  font-weight: bold;
  font-size: 32px;
  color: white;
}
.course-infos .video-desc-trigger {
  margin: 12px 0 0 28px;
  color: white;
  font-size: 14px;
  opacity: 0.6;
  filter: alpha(opacity=60);
  transition: opacity .3s;
}
.course-infos .video-desc-trigger:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}
.course-infos .video-desc-trigger .ic-video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  margin-right: 4px;
  width: 16px;
  height: 16px;
  vertical-align: -3px;
  background: url('/static/module/course/img/info_s.png') no-repeat 0 0;
}
.course-infos .statics {
  margin-top: 24px;
  color: #fff;
  font-size: 0;
  white-space: nowrap;
}
.course-infos .statics .static-item {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  position: relative;
  padding: 0 20px;
  font-size: 14px;
}
.course-infos .statics .static-item.first {
  padding-left: 0;
}
.course-infos .statics .static-item em {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 1px;
  background-color: #fff;
  opacity: 0.1;
  filter: alpha(opacity=10);
  -ms-filter: alpha(opacity=10);
  zoom: 1;
}
.course-infos .statics .static-item strong {
  font-weight: bold;
}
.course-infos .statics .static-item .meta-value {
  margin: 5px 0 8px 0;
  opacity: .6;
  filter: alpha(opacity=60);
}
.course-infos .statics .static-item .meta {
  opacity: .6;
  filter: alpha(opacity=60);
  font-size: 14px;
}
.course-infos .statics .static-item .meta.meta-stars {
  font-size: 16px;
  color: #ffffff;
}
.course-infos .statics .static-item .meta.meta-stars i {
  opacity: 0.2;
  filter: alpha(opacity=20);
}
.course-infos .statics .static-item .meta.meta-stars i.on {
  opacity: 1;
  filter: alpha(opacity=100);
  color: #ff9900;
}
.course-infos .statics .static-item .meta .star-h {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  position: relative;
}
.course-infos .statics .static-item .meta .star-h .on {
  position: absolute;
  left: 0;
  top: 4px;
  width: 50%;
  overflow: hidden;
}
.course-infos .statics .static-item .meta-star {
  display: inline-block;
  *display: inline;
  width: 14px;
  height: 14px;
  margin-right: 4px;
  background: url('/static/module/course/img/info_s.png') no-repeat 0 -20px;
  vertical-align: middle;
}
.course-infos .extra {
  position: absolute;
  right: 10px;
  top: 37px;
  color: white;
}
.course-infos .extra .split-line {
  margin: 2px 16px 0;
  width: 1px;
  height: 16px;
  background-color: white;
  opacity: .4;
  filter: alpha(opacity=40);
}
.course-infos .extra .follow-action {
  padding-left: 24px;
  color: white;
  background-position: 0 -37px;
}
.course-infos .extra .follow-action:hover {
  background-position: 0 -137px;
}
.course-infos .extra .follow-action.followed {
  background-position: 0 -157px;
}
.course-infos .extra .follow-action,
.course-infos .extra .share {
  background-image: url('/static/module/course/img/info_s.png');
  background-repeat: no-repeat;
}
.course-infos .extra .share-action .hd {
  color: #ffffff;
  opacity: 0.6;
  filter: alpha(opacity=60);
}
.course-infos .extra .share {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  float: none;
  padding: 0;
  line-height: normal;
  margin: 0 7px;
  width: 20px;
  height: 16px;
  opacity: .6;
  filter: alpha(opacity=60);
  vertical-align: middle;
  transition: opacity .3s;
}
.course-infos .extra .share:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}
.course-infos .extra .share.wx {
  background-position: 0 -60px;
}
.course-infos .extra .share.sina {
  background-position: 0 -100px;
}
.course-infos .extra .share.qq {
  background-position: 0 -80px;
}
.course-infos .info-bg {
  overflow: hidden;
  z-index: 0;
}
.course-infos .info-bg,
.course-infos .info-bg .cover-canvas,
.course-infos .info-bg .cover-img-wrap,
.course-infos .info-bg .cover-mask {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.course-infos .info-bg .cover-img-wrap {
  z-index: 0;
  overflow: hidden;
  /* filter: progid:DXImageTransform.Microsoft.Blur(PixleRdius=10, MakeShadow=false); */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.course-infos .info-bg .cover-img-wrap img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}
.course-infos .info-bg .cover-mask {
  filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr="#cc000000", endcolorstr="#33000000", gradientType=1);
}
.course-infos .price-box {
  margin-top: 60px;
}
.course-infos .price-box .tit {
  display: block;
  margin-bottom: 4px;
  color: #ffffff;
  opacity: 0.6;
  filter: alpha(opacity=60);
}
.course-infos .price-box .num .original-price,
.course-infos .price-box .num .discount-price {
  display: block;
  line-height: 45px;
  position: relative;
}
.course-infos .price-box .num .original-price .price-class,
.course-infos .price-box .num .discount-price .price-class {
  font-size: 14px;
  color: #ffffff;
  opacity: .6;
}
.course-infos .price-box .num .original-price i {
  font-style: normal;
  display: inline-block;
}
.course-infos .price-box .num .original-price i.old-y {
  color: #fff;
  opacity: .5;
  font-size: 14px;
}
.course-infos .price-box .num .original-price .org-price {
  color: #fff;
  opacity: .5;
  font-size: 14px;
  text-decoration: line-through;
}
.course-infos .price-box .num .discount-price i {
  font-style: normal;
  display: inline-block;
}
.course-infos .price-box .num .discount-price i.new-y {
  color: #f01414;
  font-size: 24px;
  vertical-align: baseline;
}
.course-infos .price-box .num .discount-price .cur-price {
  color: #f01414;
  font-size: 36px;
}
.course-infos .price-box .num .discount-price .cur-price i.sub {
  font-size: 24px;
  vertical-align: baseline;
  font-weight: bold;
}
.course-infos .price-box .num .discount-price .baseline-y {
  display: inline-block;
  position: absolute;
  top: -8px;
}
.chapter-box {
  text-align: left;
}
.path {
  opacity: .6;
  color: #fff;
  font-size: 12px;
}
.path a {
  color: #fff;
}
.path .path-split {
  margin: 0 6px;
  font-style: normal;
}
.path span {
  color: #fff;
}
.tea-inst {
  padding-bottom: 30px;
  margin-bottom: 30px;
  border-bottom: 1px solid #d9dde1;
}
.tea-inst .medias {
  margin-bottom: 12px;
  overflow: hidden;
  padding: 0px 24px;
}
.tea-inst .medias a {
  color: #1c1f21;
}
.tea-inst .medias .media {
  float: left;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin: 2px 12px 0 0;
}
.tea-inst .medias .name {
  font-weight: bold;
  color: #4d555d;
  font-size: 18px;
  line-height: 24px;
}
.tea-inst .medias .job {
  display: block;
  font-size: 12px;
  color: #4d555d;
}
.tea-inst .medias [class*=sz-] {
  font-size: 16px;
  color: #f20d0d;
}
.tea-inst .desc {
  padding: 0px 24px;
  line-height: 24px;
  font-size: 12px;
  word-break: break-all;
  word-wrap: break-word;
}
.mod-box .box-tit {
  padding: 0px 24px 20px;
  line-height: 30px;
  font-size: 18px;
  font-weight: bold;
  box-sizing: border-box;
}
.mod-box .box-tit .detailbtn {
  float: right;
  font-size: 22px;
  color: #787d82;
  font-weight: normal;
}
.mod-box .box-tit .detailbtn:hover {
  color: #14191e;
}
.recommendcourse {
  float: right;
  width: 328px;
  padding-top: 36px;
}
.recommendcourse .box-tit,
.recommendcourse .box-class-tit {
  font-size: 16px;
  color: #07111b;
  font-weight: bold;
  padding-bottom: 20px;
  margin-left: 24px;
}
.recommendcourse .moco-course-wrap {
  width: 260px;
}
.recommendcourse .moco-course-wrap .moco-course-box {
  width: 100%;
}
.info-recommendcourse {
  padding: 32px 0;
  overflow: hidden;
  margin-bottom: 60px;
}
.info-recommendcourse .box-tit {
  font-size: 16px;
  color: #07111b;
  line-height: 36px;
  font-weight: bold;
  margin-bottom: 20px;
}
.info-recommendcourse .free-course-list {
  box-sizing: border-box;
  width: 100%;
  border-bottom: none;
  padding: 0px;
  padding-left: 2px;
}
.info-recommendcourse .free-course-list .index-card-container {
  float: left;
  margin-right: 18px;
  margin-bottom: 18px;
  border-radius: 4px;
}
.info-recommendcourse .free-course-list .index-card-container:nth-child(5n) {
  margin-right: 0px;
}
.info-recommendcourse li {
  border-radius: 0 0 1px 1px;
  float: left;
  margin-right: 53px;
  height: 250px;
  width: 260px;
  position: relative;
}
.info-recommendcourse li:last-child {
  margin-right: 0;
}
.info-recommendcourse li a:hover h5 {
  color: #f01400;
}
.info-recommendcourse li h5 {
  line-height: 50px;
  color: #4d555d;
  text-align: left;
  font-weight: bold;
  text-overflow: ellipsis;
  white-space: nowrap;
  -webkit-transition: color 0.3s;
  -moz-transition: color 0.3s;
  transition: color 0.3s;
}
.info-recommendcourse li .tips {
  font-size: 12px;
  color: #b4bbbf;
}
.info-recommendcourse li .tips p {
  margin: 8px 0;
}
.info-recommendcourse li .tips span {
  color: #787d82;
}
.info-recommendcourse li .tips .update-latest {
  color: #00dc50;
}
.info-recommendcourse li .tips .price {
  font-size: 16px;
  color: #f20d0d;
  line-height: 1;
  font-weight: bold;
}
.info-recommendcourse li .tips .price i {
  font-size: 10px;
  font-style: normal;
  vertical-align: top;
}
.info-recommendcourse .course-list-img {
  width: 260px;
  height: 146px;
  overflow: hidden;
  position: relative;
  *display: inline;
  *zoom: 1;
}
.info-recommendcourse .course-list-img img {
  display: block;
  width: 260px;
  transition: 1s;
  -moz-transition: 1s;
  -webkit-transition: 1s;
  -o-transition: 1s;
}
.course-list li {
  width: 30.23255814%;
}
.course-list li .course-list-img {
  width: auto;
  height: auto;
  max-height: 146px;
}
.course-list li .course-list-img img {
  width: 260px;
}
.course-list.col-single li {
  width: 100%;
  margin-right: 0;
}
@-webkit-keyframes buy-btn-anim {
  0% {
    box-shadow: none;
    background-color: #ffffff;
  }
  100% {
    box-shadow: 0 0 3px rgba(240, 20, 0, 0.6);
    background-color: #f20d0d;
  }
}
.course-btn-bar {
  margin-top: 20px;
}
.course-btn-bar .buy-btn,
.course-btn-bar .preview-btn {
  height: 60px;
  line-height: 60px;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  border-radius: 3px;
}
.course-btn-bar .buy-btn {
  position: relative;
  padding: 0 54px;
  background-color: #f20d0d;
  color: #ffffff;
  -webkit-transition: background-color 0.3s ease;
  -moz-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}
.course-btn-bar .buy-btn span {
  position: relative;
  z-index: 2;
}
.course-btn-bar .buy-btn:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  background-color: #f53d3d;
  visibility: hidden;
  transform: scale(0, 1);
  -webkit-transition: transform 0.3s ease;
  -moz-transition: transform 0.3s ease;
  transition: transform 0.3s ease;
}
.course-btn-bar .buy-btn:hover {
  background-color: #f53d3d;
}
.course-btn-bar .buy-btn:hover:before {
  visibility: visible;
  transform: scale(1, 1);
}
.course-btn-bar .buy-btn.disabled {
  background-color: #98a1a6;
  cursor: default;
}
.course-btn-bar .buy-btn.disabled:before {
  display: none;
}
.course-btn-bar .preview-btn {
  margin-left: 40px;
  height: 58px;
  line-height: 58px;
  padding: 0 30px;
  color: #787d82;
  border: 1px solid #d0d6d9;
}
.course-btn-bar .preview-tip {
  line-height: 60px;
  font-size: 16px;
  margin-left: 215px;
  color: #ffffff;
  opacity: .6;
  font-weight: bold;
}
.course-btn-bar .preview-tip b {
  font-size: 18px;
}
.desc-box {
  text-align: center;
}
.desc-box img {
  vertical-align: top;
  border: 0;
  height: auto;
}
.evaluation-right {
  width: 328px;
  float: right;
  box-sizing: border-box;
}
.evaluation-right-item {
  width: 328px;
  box-sizing: border-box;
  background-color: rgba(255, 153, 0, 0.1);
  padding: 36px;
  border-radius: 4px;
}
.evaluation-right-item .scoreitem {
  border-bottom: 1px solid rgba(255, 153, 0, 0.4);
  padding-bottom: 15px;
}
.evaluation-right-item .scoreitem h3 {
  font-size: 14px;
  color: #4d555d;
  line-height: 14px;
  font-weight: 200;
}
.evaluation-right-item .scoreitem h3 i {
  font-style: normal;
  margin-right: 2px;
}
.evaluation-right-item .scoreitem .num {
  float: right;
}
.evaluation-right-item .scoreitem p {
  font-size: 48px;
  line-height: 48px;
  color: #ff9000;
  font-weight: 200;
  margin-top: 12px;
}
.evaluation-right-item .star {
  margin-top: 4px;
  font-weight: 200;
  line-height: 16px;
}
.evaluation-right-item .star i {
  color: rgba(255, 153, 0, 0.2);
}
.evaluation-right-item .star i.sz-star-h {
  color: #ff9900 !important;
  position: absolute;
  top: 2px;
  left: 0;
}
.evaluation-right-item .star .on {
  color: #ff9900;
}
.evaluation-right-item .star em {
  position: relative;
}
.evaluation-right-item .itemlist {
  padding-top: 12px;
  overflow: hidden;
}
.evaluation-right-item .slist:last-child {
  margin-right: 0px;
}
.evaluation-right-item .slist {
  float: left;
  width: 48px;
  text-align: left;
  font-size: 12px;
  color: #4d555d;
  line-height: 20px;
  margin-right: 52px;
  font-weight: 700;
  font-weight: 200;
}
.evaluation-right-item .slist.mr0 {
  margin-right: 0;
}
.evaluation-right-item .slist em {
  color: #ff9900;
  font-size: 16px;
  line-height: 16px;
  font-weight: 200;
}
.course-desc {
  word-break: break-all;
  word-wrap: break-word;
}
.course-desc .desc-short {
  line-height: 28px;
  overflow: hidden;
}
.course-desc .desc-short #video-container_wrapper {
  margin: 0 auto;
}
.course-desc .jwplayer {
  margin: 0 auto;
}
.course-desc .jwplayer .jwvideo video {
  height: 394px !important;
  bottom: 40px !important;
}
.course-desc .desc-txt {
  margin: 20px 0 30px 0;
  line-height: 28px;
}
.course-desc .desc-sec {
  margin-bottom: 28px;
}
.course-desc .desc-sec h2 {
  margin-bottom: 6px;
  font-size: 18px;
  line-height: 30px;
  font-weight: bold;
}
.course-desc .desc-sec h2.small {
  margin-bottom: 25px;
  font-size: 14px;
}
.course-desc .desc-sec p {
  line-height: 28px;
}
.comp-tab {
  position: absolute;
  bottom: 0;
}
.comp-tab .comp-tab-item {
  float: left;
  padding-right: 65px;
  line-height: 58px;
  font-weight: bold;
}
.comp-tab .comp-tab-item a {
  position: relative;
  display: block;
  height: 100%;
  width: 100%;
  color: #ffffff;
  opacity: 0.5;
  font-size: 16px;
  text-align: center;
  zoom: 1;
  -webkit-transition: color 0.3s ease;
  -moz-transition: color 0.3s ease;
  transition: color 0.3s ease;
}
.comp-tab .comp-tab-item a:hover {
  opacity: 1;
}
.comp-tab .comp-tab-item a:before {
  content: '';
  display: block;
  visibility: hidden;
  position: absolute;
  left: 0;
  bottom: -1px;
  height: 2px;
  width: 100%;
  background-color: #f20d0d;
  z-index: 1;
  -webkit-transition: 0s ease;
  -moz-transition: 0s ease;
  transition: 0s ease;
}
.comp-tab .comp-tab-item a .small {
  font-size: 10px;
  margin-left: 5px;
  color: #787d82;
}
.comp-tab .comp-tab-item.active a {
  color: #ffffff;
  opacity: 1;
}
.comp-tab .comp-tab-item.active a:before {
  visibility: visible;
  transform: scale(1, 1);
}
.cmt-bar {
  height: 40px;
  line-height: 40px;
  background-color: #f6f6f6;
}
.cmt-bar .filters li {
  float: left;
}
.cmt-bar .filters a {
  display: block;
  padding: 0 20px;
  height: 100%;
  font-size: 12px;
  color: #787d82;
  -webkit-transition: color 0.3s;
  -moz-transition: color 0.3s;
  transition: color 0.3s;
}
.cmt-bar .filters a:hover {
  color: #1c1f21;
}
.cmt-bar .filters a.active {
  color: #1c1f21;
}
.cmt-bar .filters a.active .num {
  color: #787d82;
}
.cmt-bar .score {
  margin-left: 20px;
  font-size: 12px;
}
.cmt-bar .score .hd {
  color: #787d82;
}
.cmt-bar .score .num {
  font-size: 14px;
  font-weight: bold;
  color: #f20d0d;
  margin-right: 8px;
}
.cmt-bar .score .scoreitem {
  margin-left: 25px;
}
.cmt-bar .studentnum {
  margin-right: 20px;
  color: #b5b9bc;
  font-size: 12px;
}
.evaluation-recommend {
  position: relative;
  width: 824px;
  padding: 36px 0px;
  border-radius: 4px;
  background-color: rgba(169, 169, 169, 0.1);
}
.evaluation-recommend .hot-evaluation {
  position: absolute;
  top: -12px;
  left: -12px;
  width: 72px;
  height: 72px;
  font-size: 16px;
  line-height: 18px;
  color: #fff;
  padding: 18px;
  font-weight: 200;
  text-align: center;
  box-sizing: border-box;
  background: url('/static/module/common/img/hot-evaluation.png');
}
.evaluation-recommend ul {
  width: 100%;
}
.evaluation-recommend ul li:last-child {
  border-right: 1px solid transparent;
}
.evaluation-recommend ul li {
  width: 33.3%;
  position: relative;
  padding: 0px 32px;
  box-sizing: border-box;
  text-align: center;
  border-right: 1px solid #d9dde1;
}
.evaluation-recommend ul li img {
  border-radius: 50%;
  display: block;
  margin: 0 auto;
}
.evaluation-recommend ul li .user-name {
  width: 210px;
  margin: 8px 0px 8px;
  font-size: 14px;
  line-height: 14px;
  color: #4d555d;
  font-weight: 700;
  text-overflow: ellipsis;
  word-break: break-all;
  word-wrap: break-word;
  white-space: pre;
  overflow: hidden;
}
.evaluation-recommend ul li .user-text-box .star {
  line-height: 12px;
}
.evaluation-recommend ul li .user-text-box .star i {
  position: relative;
  color: #d0d6d9;
  font-size: 12px;
}
.evaluation-recommend ul li .user-text-box .star .on {
  color: #ff9900;
}
.evaluation-recommend ul li .content {
  margin: 8px 0px;
  width: 210px;
  height: 196px;
  font-size: 14px;
  line-height: 28px;
  color: #4d555d;
  text-overflow: ellipsis;
  word-break: break-all;
  word-wrap: break-word;
  overflow: hidden;
  text-overflow: -o-ellipsis-lastline;
  display: -webkit-box;
  -webkit-line-clamp: 7;
  -webkit-box-orient: vertical;
}
.evaluation-recommend ul li .time {
  position: absolute;
  bottom: 24px;
  font-size: 12px;
  line-height: 24px;
  color: #93999f;
}
.all-evaluation {
  margin-top: 36px;
  font-size: 16px;
  line-height: 16px;
  color: #07111b;
  padding: 0px 0px 24px 24px;
  border-bottom: 1px solid #d9dde1;
}
.cmt-post {
  position: relative;
  padding: 24px 25px;
  border-bottom: 1px solid #d9dde1;
}
.cmt-post a {
  cursor: pointer;
}
.cmt-post .js-treply {
  color: #b5b9bc;
  font-size: 12px;
  margin-left: 30px;
  display: inline-block;
}
.cmt-post .js-treply:hover {
  color: #14191e;
}
.cmt-post .treply-edit {
  color: #666;
  font-size: 12px;
  margin-left: 30px;
  display: inline-block;
}
.cmt-post .treply-edit:hover {
  color: #14191e;
}
.cmt-post .treplybox {
  margin-top: 20px;
  overflow: hidden;
  background: #f6f6f6;
  padding: 30px;
}
.cmt-post .treplybox .textarea-wrap {
  position: relative;
  padding: 10px;
  border: 1px solid #d0d6d9;
  background-color: #ffffff;
}
.cmt-post .treplybox .textarea-wrap textarea {
  resize: none;
  width: 100%;
  height: 78px;
}
.cmt-post .treplybox .textarea-wrap textarea::-webkit-input-placeholder {
  font-size: 12px;
  color: #b5b9bc;
}
.cmt-post .treplybox .textarea-wrap textarea:-moz-placeholder {
  font-size: 12px;
  color: #b5b9bc;
}
.cmt-post .treplybox .textarea-wrap textarea::-moz-placeholder {
  font-size: 12px;
  color: #b5b9bc;
}
.cmt-post .treplybox .textarea-wrap textarea::-ms-input-placeholder {
  font-size: 12px;
  color: #b5b9bc;
}
.cmt-post .treplybox .textarea-wrap .num-limit {
  position: absolute;
  right: 10px;
  bottom: 10px;
  font-size: 12px;
  color: #b5b9bc;
  line-height: 14px;
}
.cmt-post .treplybox .textarea-wrap .num-limit em.error {
  color: #f01414;
}
.cmt-post .treplybox .submitarea {
  display: block;
  overflow: hidden;
  float: right;
  height: 30px;
  line-height: 30px;
  margin-top: 20px;
  text-align: center;
}
.cmt-post .treplybox .submitarea a {
  display: block;
  float: left;
  padding: 0 30px;
}
.cmt-post .treplybox .submitarea a.js-replysure {
  background: #f01414;
  color: #ffffff;
}
.cmt-post .treplybox .submitarea a.js-replysure:hover {
  background: #ff6464;
}
.cmt-post .treplybox .submitarea a.js-cancel {
  color: #787d82;
}
.cmt-post .treplybox .submitarea a.js-cancel:hover {
  color: #14191e;
}
.cmt-post .pdl-0 {
  padding-left: 0;
}
.cmt-post .click-more {
  padding: 24px 0px;
  font-size: 14px;
  line-height: 14px;
  text-align: center;
  cursor: pointer;
}
.cmt-post .click-more .more {
  color: #93999F;
}
.cmt-post .click-more .more:hover {
  color: #07111b;
}
.cmt-post .inner {
  position: relative;
  padding-left: 72px;
}
.cmt-post .inner blockquote {
  padding: 1px 20px;
  margin: 1em 0;
  border-left: 4px solid #ccc;
  color: #787d82;
  background-color: #f5f5f5;
}
.cmt-post .inner blockquote p {
  line-height: 1.5em;
  font-size: 13px;
  color: #444;
}
.cmt-post .inner ul {
  list-style-type: disc;
}
.cmt-post .inner ol {
  list-style-type: decimal;
}
.cmt-post .inner p a {
  color: #0088cc;
  text-decoration: none;
}
.cmt-post .inner p a:hover {
  color: #0088cc;
  text-decoration: underline;
}
.cmt-post .inner .list-paddingleft-2 {
  padding-left: 30px;
}
.cmt-post .inner .normal-reply {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #f1f2f3;
}
.cmt-post .inner .normal-reply .normal-reply-head {
  margin-right: 20px;
}
.cmt-post .inner .normal-reply .normal-reply-head a {
  display: block;
}
.cmt-post .inner .normal-reply .normal-reply-head a img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  vertical-align: top;
}
.cmt-post .inner .normal-reply .normal-reply-content textarea {
  width: 998px;
  height: 22px;
  border: 1px solid #d0d6d9;
  padding: 10px;
  color: #000;
  display: block;
}
.cmt-post .inner .normal-reply .normal-reply-content .normal-reply-verify {
  width: 258px;
  padding-top: 5px;
}
.cmt-post .inner .normal-reply .normal-reply-content .normal-reply-verify input {
  height: 14px;
  line-height: 14px;
  width: 110px;
  padding: 14px 0 10px 08px;
  border: 1px solid #d0d6d9;
  color: #b5b9bc;
}
.cmt-post .inner .normal-reply .normal-reply-content .normal-reply-verify img {
  width: 70px;
  height: 40px;
  margin-left: 10px;
  cursor: pointer;
}
.cmt-post .inner .normal-reply .normal-reply-content .normal-reply-verify p {
  clear: both;
  font-size: 12px;
  color: #f01400;
}
.cmt-post .inner .normal-reply .normal-reply-content .normal-reply-verify .normal-reply-change {
  margin-left: 10px;
}
.cmt-post .inner .normal-reply .normal-reply-content .normal-reply-verify .normal-reply-change p {
  font-size: 12px;
  color: #787d82;
}
.cmt-post .inner .normal-reply .normal-reply-content .normal-reply-verify .normal-reply-change a {
  display: block;
  color: #00b33b;
}
.cmt-post .inner .normal-reply .normal-reply-content .normal-reply-cancelSubmit {
  padding-top: 10px;
}
.cmt-post .inner .normal-reply .normal-reply-content .normal-reply-cancelSubmit .normal-reply-cancel {
  font-size: 14px;
  color: #787d82;
}
.cmt-post .inner .normal-reply .normal-reply-content .normal-reply-cancelSubmit .normal-reply-submit {
  width: 80px;
  height: 40px;
  line-height: 40px;
  display: inline-block;
  text-align: center;
  font-size: 14px;
  color: #fff;
  background: #00b33b;
  margin-left: 20px;
}
.cmt-post .inner .common-reply-t-div .common-reply-t-div-header {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  vertical-align: top;
}
.cmt-post .inner .common-reply-t-div .common-reply-t-div-textarea {
  border: 1px solid #d0d6d9;
  width: 1015px;
  height: 80px;
}
.cmt-post .inner .common-reply-t-div .common-reply-list-btnDiv {
  clear: both;
}
.cmt-post .inner .comment-reply-div .comment-reply-div-header {
  width: 40px;
  height: 40px;
}
.cmt-post .inner .comment-reply-div .comment-reply-div-header img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  vertical-align: top;
}
.cmt-post .inner .comment-reply-div .comment-reply-div-r {
  width: 1020px;
  margin-left: 20px;
}
.cmt-post .inner .comment-reply-div .comment-reply-div-textarea {
  width: 998px;
  height: 22px;
  border: 1px solid #d0d6d9;
  padding: 10px;
  color: #000;
  display: block;
}
.cmt-post .inner .comment-reply-div .comment-reply-div-verify {
  padding-top: 5px;
}
.cmt-post .inner .comment-reply-div .comment-reply-div-div {
  padding-top: 10px;
}
.cmt-post .inner .comment-reply-div .comment-reply-div-div .comment-reply-btn-cancel {
  font-size: 14px;
  color: #787d82;
}
.cmt-post .inner .comment-reply-div .comment-reply-div-div .comment-reply-btn-true {
  width: 80px;
  height: 40px;
  line-height: 40px;
  display: inline-block;
  text-align: center;
  font-size: 14px;
  color: #fff;
  background: #00b33b;
  margin-left: 20px;
}
.cmt-post .pic {
  position: absolute;
  left: 0;
  top: 0px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
}
.cmt-post .hd {
  margin-bottom: 4px;
  line-height: 18px;
}
.cmt-post .hd .split {
  margin: 0 8px;
  font-style: normal;
  font-size: 12px;
}
.cmt-post .hd .put-que-icon {
  display: inline-block;
  margin-right: 8px;
  padding: 0px 4px;
  box-sizing: border-box;
  background: rgba(0, 140, 200, 0.2);
  border-radius: 4px;
  font-size: 12px;
  color: #008CC8;
  line-height: 24px;
}
.cmt-post .name {
  color: #93999f;
  font-size: 14px;
  line-height: 24px;
  margin-right: 10px;
}
.cmt-post .name:hover {
  color: #4d555d;
}
.cmt-post .name.disabled {
  color: #787d82 !important;
  cursor: default;
}
.cmt-post .cmt-txt {
  color: #4d555d;
  font-size: 14px;
  line-height: 24px;
  word-break: break-all;
  word-wrap: break-word;
}
.cmt-post .cmt-txt p {
  font-size: 16px;
  line-height: 36px;
  color: #07111b;
}
.cmt-post .floor {
  font-size: 12px;
  color: #93999f;
}
.cmt-post .ft {
  margin-top: 16px;
  font-size: 12px;
  color: #93999F;
  line-height: 24px;
}
.cmt-post .ft .time-stamp {
  color: #adb0b3;
}
.cmt-post .ft .time-stamp .mr15 {
  margin-right: 15px;
}
.cmt-post .ft .stars {
  margin-left: 18px;
  margin-top: 1px;
}
.cmt-post .ft .actions {
  font-size: 12px;
}
.cmt-post .ft .actions a:hover {
  color: #07111b;
}
.cmt-post .ft .actions a:hover span {
  color: #07111b;
}
.cmt-post .ft .actions a:hover .sz-ic {
  color: #07111b;
}
.cmt-post .ft .actions .praise {
  padding: 7px 10px;
  border: 1px solid #D9DDE1;
  border-radius: 2px;
  font-size: 12px;
  color: #787D82;
  line-height: 16px;
}
.cmt-post .ft .actions .praise .sz-ic {
  font-size: 16px;
}
.cmt-post .ft .actions .praise.on {
  color: #07111b;
}
.cmt-post .ft .actions .praise.on .sz-ic {
  color: #07111b;
}
.cmt-post .ft .actions .reply {
  margin-left: 24px;
  font-size: 12px;
  color: #93999F;
  line-height: 32px;
}
.cmt-post .ft .actions .reply:hover {
  color: #07111b;
}
.cmt-post .ft .actions .split {
  line-height: 1;
  margin: 2px 15px 0;
  font-style: normal;
  color: #4d5559;
}
.cmt-post .ft .reply-a {
  color: #b5b9bc;
  font-size: 12px;
}
.cmt-post .ft .reply-a:hover {
  color: #f20d0d;
}
.cmt-post .ft .two_reply_a {
  color: #b5b9bc;
}
.cmt-post .ft .two_reply_a:hover {
  color: #f20d0d;
}
.cmt-post .treply {
  margin-top: 20px;
  overflow: hidden;
  background: #f6f6f6;
  padding: 20px;
  font-size: 12px;
  line-height: 24px;
  color: #787d82;
  word-wrap: break-word;
  word-break: break-all;
}
.cmt-post .treply span {
  color: #f01414;
}
.cmt-post .set-best-answer {
  padding: 0px 16px;
  margin-left: 24px;
  font-size: 12px;
  color: #00B43C;
  height: 32px;
  line-height: 32px;
  text-align: center;
  border: 1px solid #00B43C;
  border-radius: 2px;
}
.cmt-post .set-best-answer:hover {
  color: #fff !important;
  background-color: #00B43C;
}
.cmt-post .cmt-reply {
  margin-top: 16px;
  margin-left: 36px;
  border-top: 1px solid #f1f2f3;
}
.cmt-post .cmt-reply .cmt-post:last-child {
  border-bottom: none;
}
.cmt-page-more {
  line-height: 48px;
  text-align: center;
  margin: 10px auto;
  color: #93999f;
}
.wenda-lists h2 {
  font-size: 16px;
  font-weight: normal;
  color: #07111b;
  padding: 36px 0 24px 24px;
  line-height: 1;
  border-bottom: 1px solid #d9dde1;
}
.wenda-lists h2 span {
  margin-right: 8px;
}
.wenda-lists .cmt-post {
  padding: 24px 25px;
}
.wenda-lists .cmt-post .cmt-reply {
  border-top: none;
  margin-left: 72px;
  margin-top: 0px;
}
.wenda-lists .cmt-post .cmt-reply a:hover {
  color: #07111b;
}
.wenda-lists .list-reply-item {
  margin-top: 24px !important;
}
.wenda-lists .replies_editor {
  margin-left: 72px;
  margin-top: 24px;
}
.wenda-lists .cmt-list .cmt-post .cmt-txt {
  word-break: break-all;
  word-wrap: break-word;
}
.wenda-lists .cmt-list .cmt-post .cmt-txt caption,
.wenda-lists .cmt-list .cmt-post .cmt-txt code,
.wenda-lists .cmt-list .cmt-post .cmt-txt optgroup,
.wenda-lists .cmt-list .cmt-post .cmt-txt strong,
.wenda-lists .cmt-list .cmt-post .cmt-txt th {
  font-style: inherit;
  font-weight: bold;
}
.wenda-lists .cmt-list .cmt-post .cmt-txt i,
.wenda-lists .cmt-list .cmt-post .cmt-txt cite,
.wenda-lists .cmt-list .cmt-post .cmt-txt em,
.wenda-lists .cmt-list .cmt-post .cmt-txt var,
.wenda-lists .cmt-list .cmt-post .cmt-txt address,
.wenda-lists .cmt-list .cmt-post .cmt-txt dfn {
  font-style: italic;
  font-weight: inherit;
}
.wenda-lists .cmt-list .cmt-post .cmt-txt blockquote {
  padding: 1px 20px;
  margin: 1em 0;
  border-left: 4px solid #ccc;
  color: #787d82;
  background-color: #f5f5f5;
}
.wenda-lists .cmt-list .cmt-post .cmt-txt blockquote p {
  line-height: 1.5em;
  font-size: 13px;
  color: #444;
}
.wenda-lists .cmt-list .cmt-post .cmt-txt ul {
  list-style-type: disc;
}
.wenda-lists .cmt-list .cmt-post .cmt-txt ol {
  list-style-type: decimal;
}
.wenda-lists .cmt-list .cmt-post .cmt-txt .list-paddingleft-2 {
  padding-left: 30px;
}
.wenda-lists .cmt-list .cmt-post .cmt-txt a {
  color: #0088cc;
  text-decoration: none;
}
.wenda-lists .cmt-list .cmt-post .cmt-txt a:hover {
  color: #0088cc;
  text-decoration: underline;
}
.stars {
  position: relative;
  top: 2px;
  color: #b5b9bc;
  font-size: 16px;
  display: inline-block;
}
.stars em {
  position: relative;
}
.stars span.onestar {
  position: relative;
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 3px;
}
.stars span.onestar i.sz-star-h {
  position: absolute;
  left: 0;
  top: 1px;
}
@-moz-document url-prefix() {
  top: 4px;
}
.stars span.onestar i.sz-star {
  position: absolute;
  left: 0px;
  top: 1px;
}
.stars i {
  margin-right: 3px;
  font-size: 16px;
  color: #d0d6d9;
  position: relative;
  top: 0px;
}
@-moz-document url-prefix() {
  top: 2px;
}
.stars i.on {
  color: #ff9900;
}
.stars i.sz-star-h {
  color: #ff9900;
  position: absolute;
  top: -2px;
  left: 0;
}
@-moz-document url-prefix() {
  top: 2px;
}
.empty-cmt {
  padding: 140px 0 60px 0;
  text-align: center;
  font-size: 18px;
  color: #c8cdd2;
}
.empty-recommend {
  font-size: 16px;
  color: #787d82;
  text-align: center;
  padding: 20px 0;
}
/*购买弹出层*/
.modal-buy {
  display: none;
  position: fixed;
  left: 50%;
  margin-left: -200px;
  top: 20%;
  width: 400px;
  background-color: #ffffff;
  z-index: 1000;
}
.modal-buy .content {
  padding: 0 20px;
}
.modal-buy .header {
  margin: 0 20px;
  height: 48px;
  line-height: 48px;
  border-bottom: 1px solid #d0d6d9;
  overflow: hidden;
}
.modal-buy .header .tit {
  font-size: 16px;
  font-weight: bold;
}
.modal-buy .header .help {
  display: none;
  float: right;
  font-size: 12px;
  color: #b5b9bc;
}
.modal-buy .infos {
  padding: 25px 20px 40px;
}
.modal-buy .infos .name {
  font-size: 18px;
  font-weight: bold;
}
.modal-buy .infos .deadline {
  display: block;
  color: #787d82;
  font-size: 12px;
}
.modal-buy .infos .deadline b {
  margin: 0 2px;
  font-weight: bold;
  color: #1c1f21;
}
.modal-buy .infos .deadline span {
  font-size: 12px;
  color: #b5b9bc;
}
.modal-buy .infos .price {
  font-size: 24px;
  color: #f20d0d;
  font-weight: bold;
  display: block;
  margin: 20px 0;
}
.modal-buy .infos .price i {
  font-style: normal;
}
.modal-buy .footer {
  padding: 20px 30px;
  background: #edf1f2 url(/static/module/course/img/buy-modal-arr.gif) repeat-x 0 0;
  overflow: hidden;
}
.modal-buy .footer a {
  display: block;
  float: left;
  width: 160px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background-color: transparent;
}
.modal-buy .footer a.cancel-btn {
  width: 158px;
  height: 38px;
  line-height: 38px;
  border: 1px solid #b4bbbf;
}
.modal-buy .footer a.cancel-btn:hover {
  border-color: #7e888c;
  color: #1c1f21;
}
.modal-buy .footer a.go-pay-btn {
  margin-left: 20px;
  border-color: #f20d0d;
  background-color: #f20d0d;
  color: #ffffff;
}
.modal-buy .footer a.go-pay-btn:hover {
  background-color: #f53d3d;
}
#reply_editor_error {
  height: 30px;
  line-height: 30px;
  font-size: 12px;
  color: #f20d0d;
  visibility: visible;
}
.comp-modal-overlay {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  background-color: #000;
  opacity: 0.6;
  filter: alpha(opacity=60);
}
.video-modal {
  display: none;
  width: 600px;
  height: 340px;
  background-color: #000;
  z-index: 400;
}
.video-modal .close {
  position: absolute;
  right: -50px;
  top: 0;
  width: 50px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  background-color: #14191e;
  color: white;
  font-size: 24px;
}
.class-tab-pannel {
  min-height: 280px;
  width: 824px;
  float: left;
}
.desc-sec h2.small {
  font-weight: bold;
  line-height: 32px;
}
#issuequestitle {
  padding-top: 30px;
}
#qa_list {
  padding-bottom: 40px;
}
.pageHtml {
  margin-bottom: 0;
}
.page {
  padding-bottom: 0;
}
.modal-block {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
}
.confirm-modal {
  position: fixed;
  left: 50%;
  top: 30%;
  margin-left: -140px;
  width: 280px;
  height: 240px;
  background-color: #ffffff;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.3);
  z-index: 1001;
}
.confirm-modal .modal-icon {
  font-size: 60px;
  color: #787d82;
  padding: 10px 0 0;
}
.confirm-modal .body {
  text-align: center;
}
.confirm-modal .modal-text {
  line-height: 24px;
}
.confirm-modal .modal-text .smaller {
  font-size: 12px;
  color: #787d82;
}
.confirm-modal .footer {
  margin-top: 22px;
  text-align: center;
}
.confirm-modal .modal-btn {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  margin: 0 10px;
  height: 40px;
  line-height: 40px;
  padding: 0 36px;
  color: #ffffff;
  background-color: #ffffff;
}
.confirm-modal .modal-btn.modal-btn-ok {
  background-color: #17823b;
}
.confirm-modal .modal-btn.modal-btn-ok:hover {
  background-color: #1b9844;
}
.confirm-modal .modal-btn.modal-btn-no {
  height: 38px;
  line-height: 38px;
  border: 1px solid #d0d6d9;
  color: #787d82;
}
.confirm-modal .modal-btn.modal-btn-no:hover {
  color: #1c1f21;
}
.rich-text {
  line-height: 1.76em;
  font-size: 14px;
}
.rich-text h1,
.rich-text h2,
.rich-text h3 {
  line-height: 1em;
  margin: 0.67em 0;
  font-weight: bold;
}
.rich-text h1 {
  font-size: 24px;
}
.rich-text h2 {
  font-size: 20px;
}
.rich-text h3 {
  font-size: 16px;
}
.rich-text ol,
.rich-text ul,
.rich-text p {
  margin: 1em 0 ;
}
.rich-text strong,
.rich-text b {
  font-weight: bold;
}
.rich-text i,
.rich-text cite,
.rich-text em,
.rich-text var,
.rich-text address,
.rich-text dfn {
  font-style: italic;
  font-weight: inherit;
}
.rich-text ol p,
.rich-text ul p {
  margin: 0.6em 0;
}
.rich-text ol {
  list-style: decimal;
  padding-left: 30px;
}
.rich-text ul {
  list-style: disc;
  padding-left: 30px;
}
.rich-text a:link,
.rich-text a:visited {
  color: #0088cc;
  text-decoration: none;
}
.rich-text a:hover,
.rich-text a:active {
  text-decoration: underline;
}
.rich-text blockquote {
  padding: 1px 20px;
  margin: 1em 0;
  border-left: 4px solid #ccc;
  color: #787d82;
  background-color: #f5f5f5;
}
.rich-text sub,
.rich-text sup {
  font-size: smaller;
}
.rich-text sub {
  vertical-align: sub;
}
.rich-text sup {
  vertical-align: super;
}
.rich-text img {
  max-width: 100%;
}
.rich-text * {
  word-break: break-all;
  word-wrap: break-word;
}
.exp-progress span {
  font-size: 12px;
  color: #787d82;
}
.exp-progress .exp-per {
  margin-right: 8px;
  font-size: 18px;
  font-weight: bold;
  color: red;
}
.exp-progress .exp-per strong {
  font-size: 32px;
}
.exp-progress span b {
  margin: 0 2px;
}
.exp-progress .exp-bar {
  position: relative;
  height: 10px;
  background-color: #d9dde1;
  border-radius: 8px;
  background-clip: content-box;
  overflow: hidden;
}
.exp-progress .exp-bar ins {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 10%;
  height: 10px;
}
.exp-progress .exp-bar ins:before {
  content: '';
  display: block;
  height: 100%;
  width: 100%;
  border-radius: 8px;
  background-color: red;
  transform: translateZ(0);
  -webkit-animation: progressBar ease-in-out 0.7s 0.4s;
  -webkit-animation-fill-mode: both;
}
.statics-section {
  padding: 40px 0 0 0;
  background-color: #f3f5f7;
}
.wrap {
  width: 1152px;
  margin: 0 auto;
}
a.start-study-btn {
  display: block;
  width: auto;
  height: 60px;
  line-height: 60px;
  text-align: center;
  color: white;
  font-size: 18px;
  background-color: #f20d0d;
  border: 0 none;
  font-weight: 600;
}
a.start-study-btn:hover {
  background-color: #ff4d4d;
}
a.start-study-btn.disabled {
  background-color: #edf1f2 !important;
  color: #c8cdd2 !important;
}
.mb40 {
  margin-bottom: 40px;
}
.mod-menus li {
  float: left;
  margin-right: 50px;
  height: 100%;
  text-align: center;
}
.mod-menus li:last-child {
  margin-right: 0;
}
.mod-menus a {
  display: block;
  padding: 10px 0;
  font-size: 16px;
  color: #303538;
}
.mod-menus a span {
  display: block;
  height: 14px;
  line-height: 14px;
}
.mod-menus a:hover {
  color: #f20d0d;
  text-decoration: none;
}
.mod-menus a.active {
  border-bottom: 2px solid #f20d0d;
  color: #f20d0d;
  text-decoration: none;
}
@-webkit-keyframes progressBar {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
.exp-get-tip {
  position: absolute;
  top: 0;
  right: 14px;
  line-height: 58px;
  color: #787d82;
  font-size: 12px;
}
.exp-get-tip b {
  margin-left: 2px;
  color: #1c1f21;
  font-weight: bold;
}
/* Õ½ÚÁбí */
.mod-chapters {
  margin: 0 0 20px 0;
}
.mod-chapters .chapter {
  border-bottom: 1px solid #edf1f2;
}
.mod-chapters .chapter.disabled h3 {
  cursor: default;
}
.mod-chapters .chapter .video li {
  position: relative;
  height: 40px;
  line-height: 40px;
  padding-left: 46px;
  margin-bottom: 10px;
}
.mod-chapters .chapter .video li:hover {
  background: #edf1f2;
}
.mod-chapters .chapter .video li:last-child {
  border: none;
}
.mod-chapters .chapter .video li .study-state {
  position: absolute;
  right: 10px;
  top: 0;
  line-height: 40px;
  font-size: 12px;
}
.mod-chapters .chapter .video li .study-state.ing,
.mod-chapters .chapter .video li .study-state.done,
.mod-chapters .chapter .video li .study-state.latest {
  color: #f11d1d;
}
.mod-chapters .chapter .video li .study-state.doStudy,
.mod-chapters .chapter .video li .study-state.ing {
  background-position: 0 -288px;
}
.mod-chapters .chapter .video li .study-state.hasStudy,
.mod-chapters .chapter .video li .study-state.done {
  background-position: 0 -248px;
}
.mod-chapters .chapter .video li .sz-icn {
  float: left;
  margin-left: -20px;
  line-height: 40px;
}
.mod-chapters .chapter .video li a {
  color: #787d82;
  display: block;
  overflow: hidden;
  padding: 0 0 0 20px;
  word-break: break-all;
}
.mod-chapters .chapter .video li a:hover {
  color: #1c1f21;
}
.mod-chapters .chapter .video li a.studyvideo,
.mod-chapters .chapter .video li a.practise,
.mod-chapters .chapter .video li a.programme {
  background: url('') no-repeat 0 -121px;
}
.mod-chapters .chapter .video li a.practise {
  background-position: 0 -157px;
}
.mod-chapters .chapter .video li a.programme {
  background-position: 0 -194px;
}
.mod-chapters .chapter h3 {
  height: 58px;
  line-height: 58px;
  padding: 0 13px 0 0;
  margin: 0 0 10px 0;
  font-size: 14px;
  cursor: pointer;
  overflow: hidden;
}
.mod-chapters .chapter h3:hover {
  background-color: #edf1f2;
}
.mod-chapters .chapter h3 span {
  display: inline-block;
  width: 10px;
  font-weight: bold;
  color: #b4bbbf;
  text-align: center;
}
.mod-chapters .chapter h3 .chapter-icon,
.mod-chapters .chapter h3 .expand-state {
  width: 46px;
  text-align: center;
  font-size: 25px;
}
.mod-chapters .chapter h3 .chapter-icon i,
.mod-chapters .chapter h3 .expand-state i {
  vertical-align: -2px;
}
.mod-chapters .chapter h3 .open-tip {
  font-size: 12px;
  width: auto;
  font-weight: normal;
}
.mod-chapters .chapter h3 strong {
  font-weight: bold;
  width: auto;
}
.mod-chapters .chapter h3 i {
  margin-right: 10px;
}
.mod-chapters .chapter h3 em {
  color: #b5b9bc;
}
.mod-chapters .chapter ul {
  display: none;
}
.mod-chapters .chapter strong {
  display: block;
  float: left;
  white-space: nowrap;
  overflow: hidden;
  width: 345px;
  text-overflow: ellipsis;
}
.mod-chapters .chapter em {
  float: right;
  font-size: 12px;
  cursor: default;
  font-style: normal;
}
.mod-chapters .chapter .new,
.mod-chapters .chapter .laststudy {
  color: #93999f;
  font-size: 12px;
  position: absolute;
  right: 35px;
  top: 0;
}
.mod-chapters .chapter .state-open,
.mod-chapters .chapter .state-unopen,
.mod-chapters .chapter .state-expand {
  background-image: url('');
  background-repeat: no-repeat;
  width: 20px;
  height: 40px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
}
.mod-chapters .chapter .state-expand {
  background-position: 0 -37px;
}
.mod-chapters .chapter .state-open {
  background-position: 0 -37px;
}
.mod-chapters .chapter .state-unopen {
  background-position: 0 -82px;
}
.mod-chapters .chapter .sz-chapter {
  font-size: 24px;
  color: #787d82;
  position: relative;
  top: 5px;
}
.mod-chapters .chapter.chapter-active ul {
  display: block;
  margin: 0 0 10px 0;
}
.mod-chapters .chapter.unlearn h3 {
  color: #b5b9bc;
  cursor: default;
}
.mod-chapters .chapter-update-state {
  padding-left: 46px;
  line-height: 58px;
  border-bottom: 1px solid #eceef0;
  color: #93999f;
}
.imooc-form {
  width: 835px;
  height: 564px;
  padding: 0 35px;
  position: fixed;
  left: 50%;
  top: 50%;
  margin-left: -452px;
  margin-top: -275px;
  background: #fff;
  z-index: 999;
  display: none;
}
.imooc-form .btn-close {
  position: absolute;
  top: 23px;
  right: 35px;
  font-size: 24px;
  color: #93999f;
  line-height: 1;
}
.imooc-form .form-row .hd {
  float: left;
  margin-left: -50px;
  line-height: 40px;
}
.imooc-form .form-row .ipt {
  width: 100%;
  height: 48px;
  line-height: 48px;
  padding: 6px 10px;
  border: 1px solid #b7bbbf;
  font-size: 16px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.imooc-form .form-row .ipt::-webkit-input-placeholder {
  color: #93999f;
}
.imooc-form .form-row .ipt:-moz-placeholder {
  color: #93999f;
}
.imooc-form .form-row .ipt::-moz-placeholder {
  color: #93999f;
}
.imooc-form .form-row .ipt:-ms-input-placeholder {
  color: #93999f;
}
.imooc-form .form-row .ipt:focus {
  border-color: #00b43c;
  outline: 0;
}
.imooc-form .form-row textarea.ipt {
  height: 140px;
  overflow-x: hidden;
  overflow-y: auto;
}
.imooc-form .form-row .ipt-tip {
  height: 20px;
  line-height: 20px;
  font-size: 12px;
}
.imooc-form .form-row .ipt-tip-error {
  font-size: 12px;
  color: #f20d0d;
  clear: both;
  height: 25px;
  line-height: 25px;
  visibility: visible;
}
.imooc-form .form-footer .submit {
  height: 40px;
  line-height: 40px;
  padding: 0 36px;
  color: #ffffff;
  background-color: #00b43c;
}
.imooc-form .form-footer .submit:hover {
  background-color: #30c44b;
}
.imooc-form .form-footer .cancel {
  margin-right: 20px;
  line-height: 40px;
  color: #787d82;
}
.imooc-form-single .form-row {
  padding-left: 0;
}
/* ±íµ¥ÑéÖ¤Âë */
.verify-box .ipt {
  height: 14px;
  line-height: 14px;
  width: 110px;
  padding: 14px 0 10px 08px;
  border: 1px solid #d0d6d9;
  color: #b5b9bc;
  box-shadow: none;
}
.verify-box .ipt:focus {
  color: #1c1f21;
}
.verify-box.vf-error .ipt {
  border-color: #f20d0d;
}
.verify-box .verify-media {
  width: 70px;
  height: 40px;
  margin-left: 8px;
  background-color: #787d82;
}
.verify-box .verify-help {
  margin-left: 10px;
  font-size: 12px;
  color: #787d82;
}
.verify-box .verify-help .verify-refresh {
  display: block;
  margin-top: 4px;
  color: #00b43c;
}
.verify-box .verify-help .ipt-tip-error {
  color: #f20d0d;
  font-size: 12px;
}
/* ÎÊ´ðÁбí */
.comp-filter-bar {
  height: 40px;
  background-color: #f6f6f6;
}
.comp-filter-bar .bar-item {
  float: left;
  font-size: 12px;
  display: inline-block;
  line-height: 40px;
  text-align: center;
  padding: 0 20px;
  color: #787d82;
}
.comp-filter-bar .bar-item:hover,
.comp-filter-bar .bar-item.active {
  color: #1c1f21;
  font-weight: 600;
}
.comp-filter-bar .static-num {
  margin-right: 20px;
  line-height: 40px;
  color: #787d82;
  font-size: 12px;
}
.comp-filter-bar .static-num b {
  color: #f20d0d;
  margin: 0 2px;
  font-weight: normal;
}
.mod-qa-list {
  padding: 24px 0 32px;
  border-bottom: 1px solid #d9dde1;
  overflow: hidden;
}
.mod-qa-list .qa-medias {
  position: relative;
  width: 40px;
  text-align: center;
}
.mod-qa-list .qa-medias .meida:hover {
  color: #be3948;
  text-decoration: underline;
}
.mod-qa-list .qa-medias img {
  display: block;
  width: 40px;
  height: 40px;
  margin: 0 auto;
  border-radius: 50%;
  vertical-align: top;
}
.mod-qa-list .qa-medias .qa-state {
  font-size: 20px;
  width: 20px;
  height: 20px;
  line-height: 20px;
  border-radius: 10px;
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  bottom: -2px;
  right: -2px;
  background: #fff;
}
.mod-qa-list .qa-medias .qa-state .sz-help {
  color: #0088cc;
}
.mod-qa-list .qa-medias .qa-state .sz-done {
  color: #00b43c;
}
.mod-qa-list .qa-content {
  min-height: 85px;
  position: relative;
  overflow: hidden;
}
.mod-qa-list .qa-content .name {
  display: block;
  line-height: 16px;
  color: #93999f;
  font-size: 14px;
  line-height: 24px;
  padding-left: 20px;
}
.mod-qa-list .qa-content .name:hover {
  color: #4d555d;
}
.mod-qa-list .qa-content .static-count {
  font-size: 12px;
  position: absolute;
  top: 0;
  right: 14px;
}
.mod-qa-list .qa-content .static-count .static-item {
  display: inline-block;
  vertical-align: top;
  color: #787d82;
  margin-left: 26px;
}
.mod-qa-list .qa-content .static-count .val {
  display: block;
  font-size: 14px;
  font-weight: normal;
  text-align: center;
}
.mod-qa-list .qa-content .static-count.hasanswer .answer {
  color: #00b43c;
}
.mod-qa-list.without-mh .qa-content {
  min-height: 0;
}
.mod-qa-list .qa-header {
  font-size: 14px;
  line-height: 20px;
  color: #363d40;
  position: relative;
}
.mod-qa-list .qa-header .qa-header-cnt {
  padding: 8px 0 8px 18px;
}
.mod-qa-list .qa-header .qa-header-cnt .istop {
  color: #ff7e00;
  margin-right: 5px;
}
.mod-qa-list .qa-header .qa-header-cnt .top {
  margin: 1px 4px 0 0;
  font-size: 20px;
  color: #f20d0d;
}
.mod-qa-list .qa-header .qa-tit {
  font-weight: bold;
  word-break: break-all;
  word-wrap: break-word;
  display: block;
  line-height: 24px;
  color: #07111b;
  font-size: 16px;
}
.mod-qa-list .qa-header .qa-tit:hover {
  color: #07111b;
  text-decoration: none;
}
.mod-qa-list .qa-header .jchoose {
  display: inline-block;
  color: #ff6600;
  font-size: 12px;
  font-style: normal;
  line-height: 20px;
  height: 20px;
  margin: 3px 5px 0 0;
  background: #ffefe5;
  padding: 0 5px;
}
.mod-qa-list .qa-header .isfinish,
.mod-qa-list .qa-header .nofinish,
.mod-qa-list .qa-header .issport,
.mod-qa-list .qa-header .isflag,
.mod-qa-list .qa-header .qa-state {
  font-style: normal;
  width: 20px;
  height: 20px;
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: 1px;
  left: 0;
}
.mod-qa-list .qa-header .nofinish {
  background-position: 0 -24px;
}
.mod-qa-list .qa-header .issport,
.mod-qa-list .qa-header .isflag {
  background: url(/static/module/img/add-qa.png) no-repeat 0 0;
}
.mod-qa-list .qa-header .isflag {
  background-position: 0 -30px;
}
.mod-qa-list .qa-footer {
  padding-left: 20px;
  color: #93999f;
  padding-right: 24px;
  font-size: 12px;
}
.mod-qa-list .qa-footer em {
  font-style: normal;
  display: inline-block;
}
.mod-qa-list .qa-footer .from {
  color: #93999f;
  font-size: 12px;
  margin-left: 20px;
}
.mod-qa-list .qa-footer .from a {
  color: #93999f;
  font-size: 12px;
}
.mod-qa-list .qa-footer .from a:hover {
  color: #4d555d;
}
.replycont {
  position: relative;
}
.replycont .reply-icon {
  margin: 5px 0 0 1px;
  font-size: 16px;
  color: #b5b9bc;
  line-height: 1;
}
.replydes {
  padding-left: 20px;
  padding-bottom: 16px;
  line-height: 22px;
  word-wrap: break-word;
  word-break: break-all;
  overflow: hidden;
}
.replydes .replysign {
  font-size: 14px;
  line-height: 22px;
  color: #4d555d;
}
.replydes .replysign .adopt {
  color: #00b43c;
}
.replydes .replysign .adopt .nickname {
  color: #00b43c;
}
.replydes .replysign .adopt .nickname:hover {
  color: #00a028;
}
.replydes .replysign.adopt {
  color: #00b43c;
}
.replydes .replysign p {
  color: #93999f;
}
.replydes .replysign p .go-answer {
  display: inline-block;
  margin-right: 12px;
  width: 74px;
  height: 30px;
  color: #787d82;
  line-height: 30px;
  font-size: 14px;
  border: 1px solid #d0d6d9;
  text-align: center;
  font-weight: 200;
}
.replydes .replysign p .integral-intro {
  color: #b5b9bc;
  font-size: 14px;
  line-height: 22px;
}
.replydes .replysign p .integral-intro span {
  color: #ff7802;
}
.replydes .replysign p .integral-intro:hover {
  color: #14191e;
}
.replydes .nickname {
  color: #4d555d;
  font-weight: bold;
}
.replydes .nickname:hover {
  color: #07111b;
}
.replydes .replyuserhead {
  border-radius: 10px;
  overflow: hidden;
  width: 20px;
  height: 20px;
  display: inline-block;
  position: relative;
  top: 5px;
}
.aside-view-address {
  line-height: 24px;
}
.aside-view-address strong {
  font-weight: bold;
}
.aside-view-address a {
  display: block;
  font-size: 12px;
}
.empty-holder {
  padding: 180px 0 180px;
  text-align: center;
  color: #93999f;
  font-size: 16px;
}
/* ±Ê¼ÇÁбí */
.mod-post .post-row {
  border-bottom: 1px solid #eee;
  overflow: hidden;
  *zoom: 1;
  padding: 20px 0 20px 0;
}
.mod-post .post-row .media {
  float: left;
  width: 40px;
  margin-right: 10px;
}
.mod-post .post-row .media img {
  display: block;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  -o-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
}
.mod-post .post-row .bd {
  margin-left: 60px;
}
.mod-post .post-row .tit {
  line-height: 1.2;
  color: #93999f;
}
.mod-post .post-row .tit a {
  color: #4d555d;
}
.mod-post .post-row .tit a:hover {
  color: #303538;
}
.mod-post .post-row .cnt {
  margin-top: 8px;
  font-size: 14px;
  line-height: 28px;
  color: #07111b;
  position: relative;
  max-height: 196px;
  /*max-height = (lineNumber + 1) * lineHeight*/
  overflow: hidden;
}
.mod-post .post-row .cnt.cnt-expanded {
  max-height: none;
}
.mod-post .post-row .cnt.cnt-expanded .more {
  position: static;
}
.mod-post .post-row .cnt .cnt-area-action {
  display: none;
  padding: 20px 0;
  overflow: hidden;
}
.mod-post .post-row .cnt .cnt-area-action a {
  padding: 0 26px;
  height: 40px;
  line-height: 40px;
  color: #ffffff;
  font-size: 14px;
  background-color: #f20d0d;
  border-radius: 2px;
}
.mod-post .post-row .cnt .cnt-area-action a:hover {
  background-color: #f04646;
}
.mod-post .post-row .cnt .post-update-tip {
  display: none;
  color: #f20d0d;
}
.mod-post .post-row.editable .cnt {
  max-height: none;
}
.mod-post .post-row.editable .cnt-area {
  padding: 0 8px;
  min-height: 80px;
  border: 1px solid #d0d6d9;
  border-radius: 2px;
}
.mod-post .post-row.editable .cnt-area-action {
  display: block;
}
.mod-post .post-row.editable .actions {
  visibility: hidden;
}
.mod-post .post-row.editable .more {
  display: none;
}
.mod-post .post-row .footer {
  color: #93999f;
  font-size: 12px;
  margin-top: 15px;
}
.mod-post .post-row .from {
  color: #93999f;
  font-size: 12px;
  margin-left: 20px;
}
.mod-post .post-row .from:hover {
  color: #4d555d;
}
.mod-post .post-row .post-action {
  float: left;
  display: block;
  padding-left: 16px;
  color: #b5b9bc;
  font-size: 12px;
  overflow: hidden;
  *zoom: 1;
  cursor: pointer;
}
.mod-post .post-row .post-action:hover,
.mod-post .post-row .post-action.on {
  text-decoration: none;
  color: #4d555d;
}
.mod-post .post-row .post-action.on {
  color: #f20d0d;
}
.mod-post .post-row .post-action .ac-icon {
  margin-top: 1px;
  line-height: 1;
  font-size: 16px;
  vertical-align: -2px;
}
.mod-post .post-row .post-action em {
  padding: 0px 3px 0;
  line-height: 16px;
}
.mod-post .post-row i.split {
  margin: -1px -1px 0 14px;
  font-style: normal;
}
.mod-post .post-row .answercon {
  overflow: hidden;
  margin: 6px 0 8px;
}
.mod-post .post-row .answer-img {
  position: relative;
  width: 160px;
  overflow: hidden;
  border: 4px solid #f3f5f7;
  border-radius: 4px;
}
.mod-post .post-row .answer-img.expand {
  width: auto;
  height: auto;
  max-height: 288px;
}
.mod-post .post-row .answer-img.expand img {
  width: auto;
  height: auto;
  max-width: 100%;
}
.mod-post .post-row .answer-img .answerVideo {
  position: relative;
  width: 100%;
  height: 24px;
  display: block;
  padding-bottom: 4px;
  background: #f3f5f7;
  color: #93999f;
  font-size: 12px;
  line-height: 24px;
}
.mod-post .post-row .answer-img .answerVideo i {
  position: relative;
  top: 2px;
  font-size: 16px;
  margin-right: 4px;
}
.mod-post .post-row .answer-img .answerVideo:hover {
  color: #f01414;
}
.mod-post .post-row .answer-img .ctrl {
  position: absolute;
  width: 50%;
  height: 100%;
  top: 0;
  color: #fff;
  line-height: 90px;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 2;
  transition: margin .3s;
}
.mod-post .post-row .answer-img .ctrl-img {
  left: 0;
  margin-left: -50%;
}
.mod-post .post-row .answer-img .ctrl-video {
  right: 0;
  margin-right: -50%;
  background-color: rgba(0, 0, 0, 0.5);
}
.mod-post .post-row .answer-img:hover .ctrl {
  margin: 0;
}
.mod-post .post-row .answer-img .view-ctrl {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}
.mod-post .post-row .answer-img .time {
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 2px 4px;
  font-size: 12px;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.6);
}
.mod-post .post-row .answer-img img {
  vertical-align: top;
}
.mod-post .post-row .answer-img-big {
  width: 60%;
  height: auto;
}
.mod-post .post-row .answer-img-big img {
  max-width: 100%;
}
.mod-post .post-row .more {
  position: absolute;
  top: 168px;
  /*top = lineNumber * lineHeight*/
  left: 0;
  right: 0;
  height: 28px;
  line-height: 28px;
  background-color: #fff;
}
.mod-post .post-row .more a {
  position: relative;
  top: 4px;
  font-size: 22px;
  color: #93999f;
}
.mod-post .post-row .more a:hover {
  color: #4d555d;
}
.note-lists .mod-post {
  padding-bottom: 40px;
}
/* 课程公告 */
.notice-bar {
  position: relative;
  margin: 0 0 10px 0;
}
.notice-bar .inner {
  height: 40px;
  line-height: 40px;
  font-size: 14px;
  color: #787d82;
  background-color: #fff3e5;
  cursor: pointer;
}
.notice-bar .inner .hd {
  float: left;
  width: 54px;
  text-align: right;
  color: #ff8c00;
}
.notice-bar .inner .bd {
  overflow: hidden;
}
.notice-bar .inner .bd span {
  float: right;
  color: #ff8c00;
  margin-right: 16px;
}
.notice-bar .inner .notice-latest {
  color: #4d555d;
}
.notice-bar .inner .notice-latest:hover {
  color: #07111b;
}
.notice-bar .close {
  display: none;
  position: absolute;
  right: 0;
  top: 2px;
  padding: 0 15px;
  font-size: 16px;
  color: #b4bbbf;
}
.notice-bar .close:hover {
  color: #f20d0d;
}
.notice-modal {
  display: none;
  width: 740px;
  background-color: #ffffff;
  z-index: 1000;
}
.notice-modal .hd {
  margin: 0 36px;
  padding: 24px 0;
  font-size: 16px;
  border-bottom: 1px solid #d0d6d9;
}
.notice-modal .hd span {
  font-weight: bold;
}
.notice-modal .hd .close {
  position: absolute;
  right: 36px;
  top: 24px;
  line-height: 100%;
  font-size: 20px;
}
.notice-modal .bd {
  height: 570px;
  overflow-y: auto;
}
.notice-modal .notice-container {
  padding: 0 36px;
}
.notice-modal .notice-list li {
  margin-top: 10px;
  padding: 20px 0;
  border-bottom: 1px solid #d0d6d9;
}
.notice-modal .notice-list li .metas {
  padding: 10px 0;
  color: #b5b9bc;
}
.notice-modal .notice-list li h3 {
  line-height: 1;
  font-size: 16px;
  color: #1c1f21;
  font-weight: bold;
  word-break: break-all;
  word-wrap: break-word;
}
.notice-modal .notice-list li p {
  line-height: 30px;
  color: #4d555d;
  word-break: break-all;
  word-wrap: break-word;
}
/* aside -> 优惠券互推 */
.coupon-recom-wrap {
  width: 100%;
  padding: 24px 24px 0px;
  box-sizing: border-box;
}
.coupon-recom-wrap a {
  display: block;
}
.coupon-recom-wrap .coupon-recom-box {
  padding: 24px;
  width: 100%;
  height: 132px;
  background: #f3f5f7;
  border-radius: 8px;
  box-sizing: border-box;
  background: #f3f5f7 url('/static/module/course/img/show-get-coupon-bg.png') bottom right no-repeat;
  background-position: 160px 83px;
}
.coupon-recom-wrap .coupon-recom-box .intro-box {
  width: 100%;
  margin-bottom: 12px;
}
.coupon-recom-wrap .coupon-recom-box .intro-box .coupon-course-title {
  width: 160px;
  font-size: 14px;
  line-height: 24px;
  max-height: 48px;
  color: #07111b;
  text-overflow: ellipsis;
  word-break: break-all;
  word-wrap: break-word;
  overflow: hidden;
  text-overflow: -o-ellipsis-lastline;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.coupon-recom-wrap .coupon-recom-box .intro-box .coupon-info {
  text-align: center;
}
.coupon-recom-wrap .coupon-recom-box .intro-box .coupon-info .coupon-price {
  font-size: 24px;
}
.coupon-recom-wrap .coupon-recom-box .intro-box .coupon-info p {
  font-size: 12px;
  color: #F01414;
  line-height: 24px;
}
.coupon-recom-wrap .coupon-recom-box .get-recom-coupon-btn {
  width: 72px;
  padding: 5px 12px;
  background: #f01414;
  border-radius: 12px;
  font-size: 12px;
  color: #FFFFFF;
  line-height: 14px;
  font-weight: 200;
  text-align: center;
  box-sizing: border-box;
}
/* aside -> 课程介绍 */
.aside-course-info .desc {
  width: 100%;
  padding: 0px 24px;
  box-sizing: border-box;
  line-height: 24px;
  font-size: 12px;
  color: #787d82;
}
.aside-course-info ul {
  width: 100%;
  padding: 0px 24px;
  box-sizing: border-box;
}
.aside-course-info li {
  padding: 3px 0;
  line-height: 24px;
  color: #4d555d;
}
.aside-course-info .key {
  font-weight: bold;
}
.aside-course-info .value {
  margin-left: 12px;
}
.aside-course-info .stars {
  margin-left: 8px;
  font-size: 16px;
  vertical-align: middle;
  top: 0;
}
.aside-course-info .stars i.sz-star-h {
  color: #ff9900;
  position: absolute;
  top: 2px;
  left: 0;
}
@-moz-document url-prefix() {
  top: 6px;
}
.aside-course-info .for-evaluate {
  font-size: 12px;
  color: #ff9900;
}
/* 问答详情 */
.wenda-top-intro-box {
  width: 100%;
  background: #F3F5F7;
}
.wenda-top-intro-box .wenda-top-intro-wrap {
  width: 1152px;
  margin: 0 auto;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro {
  width: 776px;
  padding: 24px;
  box-sizing: border-box;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .bread-crumbs {
  padding: 0px 0px 12px;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .bread-crumbs li {
  float: left;
  font-size: 12px;
  margin-right: 7px;
  color: #93999f;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .bread-crumbs li a {
  font-size: 12px;
  color: #93999f;
  margin-right: 7px;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .bread-crumbs li a:hover {
  color: #4d555d;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top #wenda_top_ask {
  padding: 0px 24px;
  box-sizing: border-box;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .wenda-tit {
  margin-bottom: 16px;
  font-size: 24px;
  font-weight: bold;
  line-height: 36px;
  color: #07111b;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .bd {
  margin-top: 20px;
  line-height: 32px;
  font-size: 16px;
  color: #07111b;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top p {
  margin-bottom: 32px;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .wenda-edit-box {
  line-height: 24px;
  font-size: 12px;
  color: #93999f;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .wenda-edit-box .count-item {
  margin-right: 24px;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .wenda-edit-box .count-item i {
  font-style: normal;
  margin-left: 4px;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .wenda-edit-box .edit {
  color: #93999f;
  margin-right: 24px;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .wenda-edit-box .edit:hover {
  color: #07111b;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .bt {
  line-height: 20px;
  border-top: 0;
  border-bottom: 1px solid #edf1f2;
  font-size: 12px;
  color: #93999f;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .bt .author {
  font-size: 14px;
  line-height: 24px;
  padding-left: 29px;
  color: #93999f;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .bt .author img {
  float: left;
  margin-left: -29px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .bt .author:hover {
  color: #07111b;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .bt .author .identity {
  top: 1px;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .bt .add-integral {
  font-size: 12px;
  color: #F6A623;
  line-height: 24px;
  margin-left: 12px;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .bt .add-integral i {
  font-style: normal;
  margin-left: 4px;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .bt .add-integral:hover {
  text-decoration: underline;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .attach-medias {
  position: relative;
  min-height: 20px;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .attach-medias img {
  width: 100%;
  vertical-align: top;
}
.wenda-top-intro-box .wenda-top-intro-wrap .wenda-top-intro .wenda-top .attach-medias .time {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 20px;
  line-height: 20px;
  width: 40px;
  color: #ffffff;
  font-size: 12px;
  text-align: center;
  background-color: #000000;
  background-color: rgba(0, 0, 0, 0.4);
}
.wenda-wrap .wenda-details {
  width: 100%;
  box-sizing: border-box;
  padding: 24px;
  font-size: 16px;
  color: #07111B;
  line-height: 36px;
}
.wenda-wrap .from-share-wrap {
  margin-top: 36px;
  margin-bottom: 36px;
}
.wenda-wrap .from-share-wrap .from {
  padding: 0px 24px;
  box-sizing: border-box;
  font-size: 12px;
  color: #93999F;
  line-height: 24px;
}
.wenda-wrap .from-share-wrap .from a {
  color: #93999F;
}
.wenda-wrap .from-share-wrap .from a:hover {
  color: #07111b;
}
.wenda-wrap .from-share-wrap .share-box .share-add-text {
  font-size: 12px;
  color: #FF9900;
  line-height: 24px;
}
.wenda-wrap .from-share-wrap .share-box .share-action .share {
  display: inline-block;
  float: none;
  padding: 0;
  line-height: normal;
  margin: 0px 0px 0px 16px;
  width: auto;
  height: auto;
  vertical-align: middle;
  background-image: none;
  font-size: 16px;
  color: #B7BBBF;
  background-repeat: no-repeat;
}
.wenda-wrap .from-share-wrap .share-box .share-action .share:hover {
  color: #4d555d;
}
.wenda-wrap .wenda-top-edit {
  padding: 24px 24px 0px;
  box-sizing: border-box;
}
.wenda-wrap .answer-box {
  margin-bottom: 12px;
  width: 100%;
  padding: 24px 24px 36px;
  box-sizing: border-box;
  background: #F3F5F7;
  border-radius: 8px;
}
.wenda-wrap .answer-box .answer-title {
  margin-bottom: 16px;
  font-size: 16px;
  color: #07111B;
  line-height: 16px;
}
.wenda-wrap .answer-box .answer-input-before {
  width: 100%;
  height: 40px;
  background: #fff;
  border: 1px solid #D9DDE1;
}
.wenda-wrap .answer-box .reply-poster {
  padding: 0px;
}
.wenda-wrap .answer-box .add-answer-box {
  position: relative;
  z-index: 1;
}
.wenda-wrap .answer-box .add-answer-box .poster-ft {
  position: relative;
}
.wenda-wrap .answer-box .add-answer-box .poster-ft .captcha-verify-box {
  position: absolute;
  right: -137px;
  bottom: 55px;
  padding: 6px;
  width: 320px;
  background: #fff;
  border-radius: 4px;
  border: 1px solid #d0d6d9;
  z-index: 900;
}
.wenda-wrap .answer-box .add-answer-box .poster-ft .captcha-verify-box:after {
  position: absolute;
  bottom: -11px;
  left: 156px;
  content: " ";
  display: block;
  width: 0;
  height: 0;
  border-top: 10px solid #d0d6d9;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  z-index: 9;
}
.wenda-wrap .answer-box .add-answer-box .poster-ft .captcha-verify-box:before {
  position: absolute;
  bottom: -9px;
  left: 157px;
  content: " ";
  display: block;
  width: 0;
  height: 0;
  border-top: 9px solid #fff;
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  z-index: 10;
}
.wenda-wrap .answer-box .add-answer-box .poster-ft .captcha-verify-box .js-mocaptcha-close {
  position: absolute;
  right: -40px;
  top: -7px;
  display: block;
  color: #fff;
  width: 30px;
  height: 30px;
  font-size: 18px;
  line-height: 30px;
  text-align: center;
  background: rgba(0, 0, 0, 0.6);
  cursor: pointer;
}
.wenda-wrap .answer-box .reply-ask-btn {
  padding: 8px 16px;
  font-size: 14px;
  color: #FFFFFF;
  background: #F01414;
  border-radius: 2px;
  border: none;
}
.wenda-wrap .answer-box .cancel-ask-btn {
  margin-left: 9px;
  padding: 8px 16px;
  border: 1px solid #D9DDE1;
  border-radius: 2px;
  font-size: 14px;
  color: #93999F;
  cursor: pointer;
}
.wenda-best-answer {
  padding-bottom: 24px;
  border: 1px solid rgba(0, 180, 60, 0.1);
  border-radius: 8px;
}
.wenda-best-answer .content {
  position: relative;
  padding: 24px;
  line-height: 24px;
  box-sizing: border-box;
  background-image: linear-gradient(0deg, rgba(0, 180, 60, 0) 0%, rgba(0, 180, 60, 0.1) 100%);
}
.wenda-best-answer .content .best-answer-text {
  position: absolute;
  top: 13px;
  right: 48px;
  font-size: 12px;
  color: #00B43C;
  line-height: 24px;
}
.wenda-best-answer .content .best-answer-icon {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 48px;
  height: 48px;
  background: url(/static/module/course/img/best-answer.png);
}
.wenda-best-answer .content .author-head img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
}
.wenda-best-answer .content .best-answer-right-box {
  margin-left: 72px;
}
.wenda-best-answer .content .best-answer-right-box .author {
  font-size: 14px;
  color: #93999F;
  line-height: 24px;
}
.wenda-best-answer .content .best-answer-right-box .author-name-box {
  margin-bottom: 4px;
}
.wenda-best-answer .content .best-answer-right-box .author-name-box a {
  display: inline-block;
}
.wenda-best-answer .content .best-answer-right-box .author-name-box .toName {
  font-size: 14px;
  color: #93999F;
  line-height: 24px;
}
.wenda-best-answer .content .best-answer-right-box .author-name-box .toName:hover {
  color: #07111b;
}
.wenda-best-answer .content .best-answer-right-box .author-name-box .add-integral-box {
  margin-left: 12px;
  font-size: 12px;
  color: #FF9900;
  line-height: 24px;
  font-weight: 200;
}
.wenda-best-answer .content .best-answer-right-box .best-answer-bottom {
  margin-top: 16px;
}
.wenda-best-answer .content .best-answer-right-box .best-answer-bottom .actions a:hover {
  color: #07111b;
}
.wenda-best-answer .content .best-answer-right-box .best-answer-bottom .actions a:hover span {
  color: #07111b;
}
.wenda-best-answer .content .best-answer-right-box .best-answer-bottom .actions a:hover .sz-ic {
  color: #07111b;
}
.wenda-best-answer .content .best-answer-right-box .best-answer-bottom .actions .praise {
  padding: 7px 10px;
  border: 1px solid #D9DDE1;
  border-radius: 2px;
  font-size: 12px;
  color: #787D82;
  line-height: 16px;
}
.wenda-best-answer .content .best-answer-right-box .best-answer-bottom .actions .praise .sz-ic {
  font-size: 16px;
}
.wenda-best-answer .content .best-answer-right-box .best-answer-bottom .actions .praise.on {
  color: #07111b;
}
.wenda-best-answer .content .best-answer-right-box .best-answer-bottom .actions .reply {
  margin-left: 24px;
  font-size: 12px;
  color: #93999F;
  line-height: 32px;
}
.wenda-best-answer .content .best-answer-right-box .best-answer-bottom .actions .reply:hover {
  color: #07111b;
}
.wenda-best-answer .content .best-answer-right-box .best-answer-bottom .time {
  font-size: 12px;
  color: #93999F;
  line-height: 32px;
}
.wenda-best-answer .content .hd .label {
  margin-left: 49px;
  font-size: 16px;
  color: #00b33b;
  font-weight: bold;
}
.wenda-best-answer .content .hd .time {
  font-size: 12px;
  line-height: 16px;
  color: #93999f;
}
.wenda-best-answer .content .txt {
  word-break: break-all;
  word-wrap: break-word;
}
.wenda-best-answer .content .txt p {
  font-size: 16px;
  color: #07111B;
  line-height: 32px;
}
.wenda-best-answer .content .txt caption,
.wenda-best-answer .content .txt code,
.wenda-best-answer .content .txt optgroup,
.wenda-best-answer .content .txt strong,
.wenda-best-answer .content .txt th {
  font-style: inherit;
  font-weight: bold;
}
.wenda-best-answer .content .txt i,
.wenda-best-answer .content .txt cite,
.wenda-best-answer .content .txt em,
.wenda-best-answer .content .txt var,
.wenda-best-answer .content .txt address,
.wenda-best-answer .content .txt dfn {
  font-style: italic;
  font-weight: inherit;
}
.wenda-best-answer .content .txt blockquote {
  padding: 1px 20px;
  margin: 1em 0;
  border-left: 4px solid #ccc;
  color: #787d82;
  background-color: #f5f5f5;
}
.wenda-best-answer .content .txt blockquote p {
  line-height: 1.5em;
  font-size: 13px;
  color: #444;
}
.wenda-best-answer .content .txt ul {
  list-style-type: disc;
}
.wenda-best-answer .content .txt ol {
  list-style-type: decimal;
}
.wenda-best-answer .content .txt .list-paddingleft-2 {
  padding-left: 30px;
}
.wenda-best-answer .content .txt a {
  color: #0088cc;
  text-decoration: none;
}
.wenda-best-answer .content .txt a:hover {
  color: #0088cc;
  text-decoration: underline;
}
.wenda-best-answer .best-reply-box {
  margin-left: 96px;
  margin-right: 24px;
}
.wenda-best-answer .best-reply-box .cmt-reply {
  border-top: 0;
}
.wenda-best-answer .pdl-0 {
  padding-left: 0;
}
.wenda-best-answer .reply-edit-box {
  margin-bottom: 24px;
}
.cmt-reply .cmt-post {
  background: #F8FAFC;
  border-radius: 4px;
  border-bottom: none;
  margin-bottom: 2px;
}
.cmt-reply .cmt-post .pic {
  width: 48px;
  height: 48px;
}
.cmt-reply .cmt-post .name {
  margin-right: 0px;
  font-size: 14px;
  color: #93999F;
  line-height: 24px;
  font-weight: normal;
}
.cmt-reply .cmt-post .name:hover {
  color: #07111b;
}
.cmt-reply .cmt-post .inner {
  padding-left: 72px;
}
.cmt-reply .cmt-post .inner .put-que-icon {
  display: inline-block;
  margin-right: 8px;
  padding: 0px 4px;
  box-sizing: border-box;
  background: rgba(0, 140, 200, 0.2);
  border-radius: 4px;
  font-size: 12px;
  color: #008CC8;
  line-height: 24px;
}
.cmt-reply .cmt-post .hd {
  font-size: 14px;
  color: #93999F;
  line-height: 24px;
  margin-bottom: 4px;
}
.cmt-reply .cmt-post .cmt-txt {
  font-size: 14px;
  color: #07111B;
  line-height: 28px;
}
.cmt-reply .cmt-post .floor {
  color: #B7BBBF;
}
.cmt-reply .cmt-post .ft {
  margin-top: 8px;
  height: 24px;
  font-size: 12px;
  color: #93999F;
  line-height: 24px;
}
.cmt-reply .cmt-post .ft .reply-a {
  color: #93999F;
}
.cmt-reply .cmt-post .ft .reply-a:hover {
  color: #07111b;
}
.reply-poster {
  display: none;
  padding: 24px;
  box-sizing: border-box;
  background: #F3F5F7;
  border-radius: 4px;
}
.reply-poster .author {
  margin-left: -72px;
  float: left;
}
.reply-poster .author img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
}
.reply-poster .inner {
  padding-left: 72px;
}
.reply-poster .inner .common-reply-list-btnDiv {
  width: 100%;
  position: relative;
}
.reply-poster .inner .common-reply-list-btnDiv .poster__submit {
  padding: 8px 16px;
  font-size: 14px;
  color: #FFFFFF;
  background: #F01414;
  border-radius: 2px;
  border: none;
  cursor: pointer;
}
.reply-poster .inner .common-reply-list-btnDiv .cancel_reply_btn {
  margin-left: 9px;
  padding: 8px 16px;
  border: 1px solid #D9DDE1;
  border-radius: 2px;
  font-size: 14px;
  color: #93999F;
  cursor: pointer;
}
.reply-poster .inner .common-reply-list-btnDiv .captcha-verify-box {
  position: absolute;
  right: -137px;
  bottom: 55px;
  padding: 6px;
  width: 320px;
  background: #fff;
  border-radius: 4px;
  border: 1px solid #d0d6d9;
  z-index: 9;
}
.reply-poster .inner .common-reply-list-btnDiv .captcha-verify-box:after {
  position: absolute;
  bottom: -11px;
  left: 156px;
  content: " ";
  display: block;
  width: 0;
  height: 0;
  border-top: 10px solid #d0d6d9;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  z-index: 9;
}
.reply-poster .inner .common-reply-list-btnDiv .captcha-verify-box:before {
  position: absolute;
  bottom: -9px;
  left: 157px;
  content: " ";
  display: block;
  width: 0;
  height: 0;
  border-top: 9px solid #fff;
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  z-index: 10;
}
.reply-poster .inner .common-reply-list-btnDiv .captcha-verify-box .js-mocaptcha-close {
  position: absolute;
  right: -40px;
  top: -7px;
  display: block;
  color: #fff;
  width: 30px;
  height: 30px;
  font-size: 18px;
  line-height: 30px;
  text-align: center;
  background: rgba(0, 0, 0, 0.6);
  cursor: pointer;
}
.reply-poster .inner .comment_reply_textarea {
  width: 100%;
  height: 88px;
  padding: 10px;
  line-height: 20px;
  resize: none;
  border: 1px solid #D9DDE1;
  border-radius: 2px;
  box-sizing: border-box;
}
.reply-poster .inner .comment_reply_textarea:focus {
  border-color: #98A1A6;
}
.reply-poster .comment-reply-div {
  position: relative;
}
.reply-poster .comment-reply-div .captcha-verify-box {
  position: absolute;
  right: -136px;
  bottom: 55px;
  padding: 6px;
  width: 320px;
  background: #fff;
  border-radius: 4px;
  border: 1px solid #d0d6d9;
  z-index: 9;
}
.reply-poster .comment-reply-div .captcha-verify-box:after {
  position: absolute;
  bottom: -11px;
  left: 156px;
  content: " ";
  display: block;
  width: 0;
  height: 0;
  border-top: 10px solid #d0d6d9;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  z-index: 9;
}
.reply-poster .comment-reply-div .captcha-verify-box:before {
  position: absolute;
  bottom: -9px;
  left: 157px;
  content: " ";
  display: block;
  width: 0;
  height: 0;
  border-top: 9px solid #fff;
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  z-index: 10;
}
.reply-poster .comment-reply-div .captcha-verify-box .js-mocaptcha-close {
  position: absolute;
  right: -40px;
  top: -7px;
  display: block;
  color: #fff;
  width: 30px;
  height: 30px;
  font-size: 18px;
  line-height: 30px;
  text-align: center;
  background: rgba(0, 0, 0, 0.6);
  cursor: pointer;
}
.reply-poster .best-reply-error {
  height: 25px;
  line-height: 25px;
  visibility: visible;
  font-size: 12px;
  color: #f20d0d;
}
.reply-poster .post-ipt {
  width: 100%;
  height: 88px;
  padding: 10px;
  line-height: 20px;
  resize: none;
  border: 1px solid #D9DDE1;
  border-radius: 2px;
  box-sizing: border-box;
}
.reply-poster .cancel_reply_btn {
  margin-left: 9px;
  padding: 8px 16px;
  border: 1px solid #D9DDE1;
  border-radius: 2px;
  font-size: 14px;
  color: #93999F;
}
.reply-poster .best_poster__submit {
  padding: 8px 16px;
  font-size: 14px;
  color: #FFFFFF;
  background: #F01414;
  border-radius: 2px;
  border: none;
}
.best_click-more {
  padding: 24px 0px;
  font-size: 14px;
  line-height: 14px;
  text-align: center;
  cursor: pointer;
}
.best_click-more .best_more {
  color: #93999F;
}
.best_click-more .best_more:hover {
  color: #07111b;
}
.replies_editor .normal-reply-error {
  height: 25px;
  line-height: 22px;
  font-size: 12px;
  color: #f20d0d;
  visibility: visible;
}
.reply-edit-box {
  padding-top: 10px;
  display: none;
}
.reply-edit-box .reply-edit-box-bottom {
  padding-top: 10px;
  text-align: right;
  overflow: hidden;
}
.reply-edit-box .normal-reply-error {
  height: 25px;
  line-height: 22px;
  font-size: 12px;
  color: #f01414;
  visibility: visible;
}
.reply-edit-box .moco-btn-normal {
  margin-right: 12px;
}
.reply-editing {
  margin-top: 24px;
  padding: 0px 0px 24px!important;
}
.reply-editing .content {
  display: none;
}
.reply-editing .reply-edit-wrap {
  width: 100%;
  padding: 24px 25px;
  box-sizing: border-box;
  background: #F3F5F7;
  border-radius: 4px;
}
.reply-editing .reply-edit-wrap .edit-reply-text-title {
  margin-bottom: 16px;
  font-size: 16px;
  color: #07111B;
  line-height: 16px;
}
.reply-editing .reply-edit-wrap .reply-edit-box-wrap {
  position: relative;
  z-index: 1;
}
.reply-editing .reply-edit-wrap .reply-edit-box-wrap .author {
  position: relative;
  display: block;
}
.reply-editing .reply-edit-wrap .reply-edit-box-wrap .author img {
  position: absolute;
  left: 0;
  top: 0px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
}
.reply-editing .reply-edit-wrap .reply-edit-box-wrap .wenda-reply-edit {
  margin-left: 72px;
}
.reply-editing .reply-edit-wrap .reply-edit-box-bottom {
  padding-top: 0px;
  margin-top: 24px;
}
.reply-editing .reply-edit-wrap .reply-edit-box-bottom .reply-edit-cancel {
  margin-left: 9px;
  padding: 8px 16px;
  border: 1px solid #D9DDE1;
  border-radius: 2px;
  font-size: 14px;
  color: #93999F;
}
.reply-editing .reply-edit-wrap .reply-edit-box-bottom .reply-edit-submit {
  padding: 8px 16px;
  font-size: 14px;
  color: #FFFFFF;
  background: #F01414;
  border-radius: 2px;
  border: none;
}
.loading {
  display: none;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -93px;
  margin-top: -40px;
  width: 186px;
  height: 80px;
  background-color: #ffffff;
  font-size: 14px;
  line-height: 80px;
  text-align: center;
  color: #787d82;
  z-index: 9;
}
.loading span {
  position: relative;
  display: inline-block;
  top: 10px;
  left: -5px;
  width: 36px;
  height: 36px;
  /*background: url(../../../common/img/loading_36px.gif) no-repeat left top;*/
  background: url(/static/module/course/img/loading_36px.gif) no-repeat -3px 3px;
  z-index: 10;
}
.info-dialog {
  position: fixed;
  left: 50%;
  top: 50%;
  margin-left: -65px;
  margin-top: -60px;
  width: 130px;
  height: 120px;
  background-color: white;
  z-index: 999;
  box-shadow: 0px 2px 8px 1px rgba(0, 0, 0, 0.2);
}
.info-dialog .tip-img {
  height: 80px;
  font-size: 40px;
  line-height: 80px;
  text-align: center;
}
.info-dialog .tip-img.sz-done {
  color: #00b33b;
}
.info-dialog .tip-img.sz-error {
  color: #f01400;
}
.info-dialog .tip-text {
  font-size: 14px;
  color: #14191e;
  text-align: center;
}
.info-dialog .tip-text .add-exp {
  color: #008cc8;
  margin-right: 4px;
}
.info-dialog .tip-text .add-credit {
  color: #ffa01e;
}
.praise-anim {
  -webkit-animation: praiseAnim .5s .1s;
  -moz-animation: praiseAnim .5s .1s;
  -o-animation: praiseAnim .5s .1s;
  animation: praiseAnim .5s .1s;
}
/* 点赞后动画 */
@-webkit-keyframes praiseAnim {
  0%,
  100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: .3;
    transform: scale(1.4);
  }
}
@-moz-keyframes praiseAnim {
  0%,
  100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: .3;
    transform: scale(1.4);
  }
}
@keyframes praiseAnim {
  0%,
  100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: .3;
    transform: scale(1.4);
  }
}
#sz-banner ul b {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 0px;
  height: 0px;
  line-height: 0;
  font-size: 0;
  overflow: hidden;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-bottom: 12px solid #ffffff;
}
.notices-statics {
  margin-top: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #d9dde1;
  font-size: 12px;
  color: #93999f;
}
.notices-statics .statics-item b {
  margin: 0 2px;
  font-weight: bold;
}
.notices-statics .chose-self a {
  float: left;
  padding-left: 20px;
  color: #93999f;
}
.notices-statics .chose-self a i {
  float: left;
  margin-left: -20px;
  margin-top: 1px;
  font-size: 16px;
}
.notices-statics .chose-self a:hover {
  color: #4d555d;
}
.evaluate-box {
  background-color: #ffad33;
  color: #fff;
  font-size: 12px;
  padding: 10px 20px;
  margin: 10px 0;
  position: relative;
}
.evaluate-box .triangle {
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #ffad33;
  position: absolute;
  right: 70px;
  top: -10px;
}
.project-preview-url {
  line-height: 1em;
  padding: 16px 20px;
  border: 1px solid #d0d6d9;
}
.project-preview-url .project-qrcode {
  float: none;
  display: inline-block;
}
.project-preview-url .qrcode-box {
  top: 30px;
}
.project-preview-url span {
  font-weight: bold;
}
.project-preview-url p {
  margin-top: 14px;
  font-size: 12px;
  word-break: break-all;
  word-wrap: break-word;
}
.inner .moco-btn-normal {
  margin-right: 12px;
}
.padbottom0 {
  padding-bottom: 0px !important;
}
.free-course-list {
  width: 328px;
  padding: 0px 24px;
  box-sizing: border-box;
  border-bottom: 1px solid #d9dde1;
}
.free-course-list ul {
  width: 100%;
}
.free-course-list ul li:last-child {
  border-bottom: none;
}
.free-course-list ul li {
  width: 100%;
  padding: 24px 0px;
  border-bottom: 1px solid #d9dde1;
}
.free-course-list ul li .course-img {
  margin-right: 16px;
  width: 72px;
  height: 60px;
  background-size: cover;
  border-radius: 2px;
  background-color: #f3f5f7;
}
.free-course-list ul li .cart-color {
  width: 72px;
  height: 60px;
  border-radius: 2px;
  padding: 5px 6px;
  box-sizing: border-box;
}
.free-course-list ul li .cart-color span {
  display: inline-block;
  color: #fff;
  font-size: 12px;
  line-height: 18px;
}
.free-course-list ul li .content-box {
  width: 190px;
}
.free-course-list ul li .content-box .smalle-title {
  margin-bottom: 8px;
  font-size: 14px;
  line-height: 20px;
  color: #07111b;
  text-overflow: ellipsis;
  word-break: break-all;
  word-wrap: break-word;
  overflow: hidden;
  max-height: 40px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.free-course-list ul li .content-box .content-text {
  margin-bottom: 8px;
  font-size: 12px;
  line-height: 20px;
  color: #93999f;
  text-overflow: ellipsis;
  word-break: break-all;
  word-wrap: break-word;
  overflow: hidden;
  max-height: 40px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.free-course-list ul li .content-box .learn-detail {
  font-size: 12px;
  line-height: 24px;
  color: #93999f;
}
.free-course-list ul li .content-box .learn-detail span {
  padding: 0px 3px;
}
/*  precon.less*/
/* base color */
.word-break {
  word-break: break-all;
  word-wrap: break-word;
}
.keep-word {
  white-space: nowrap;
  word-break: keep-all;
}
.fl {
  float: left;
}
.fr {
  float: right;
}
.preconsultation {
  background-color: #f3f5f7;
  padding: 90px 0px 32px 0px;
}
.question-input {
  text-align: center;
  margin-bottom: 32px;
}
.question-input .input-block {
  width: 656px;
}
.input-block {
  font-size: 16px;
  height: 62px;
  line-height: 62px;
  color: #07111b;
  padding-left: 24px;
  border: 1px solid #d9dde1;
  outline: none;
}
.input-block:focus {
  border: 1px solid #f01414;
}
.question-btn {
  width: 120px;
  height: 64px;
  line-height: 64px;
  background-color: #f01404;
  color: #fff;
  font-size: 16px;
  text-align: center;
  display: inline-block;
  margin-left: -5px;
  cursor: pointer;
}
.question-contain {
  background-color: #fff;
  margin: 0 auto;
  display: block;
  padding: 24px 0;
}
.question-contain .question-content {
  overflow: hidden;
}
.question-contain .question-content li {
  float: left;
  width: 528px;
  padding: 0 24px 0 48px;
  margin-top: 24px;
}
.question-contain .question-content li .mid-detail {
  width: 372px;
}
.question-contain .question-content li .answer-content {
  height: 84px;
  margin-bottom: 24px;
}
.question-contain .question-content li .right-date {
  margin-left: 16px;
}
.prebox li .left-hand {
  margin-right: 16px;
}
.prebox li .left-hand .hand-block {
  background: #f3f5f7;
  color: #93999f;
  width: 34px;
  height: 34px;
  line-height: 34px;
  text-align: center;
  border-radius: 18px;
  position: relative;
  cursor: pointer;
  border: 1px solid #f3f5f7;
  -webkit-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
}
.prebox li .left-hand .hand-block:hover {
  color: #fff;
  background: #f01414;
}
.prebox li .left-hand .hand-block .hand-number {
  margin-top: 8px;
  color: #93999f;
  font-size: 12px;
  line-height: 12px;
  display: block;
}
.prebox li .left-hand .hand-block.current {
  color: #f01414;
  background: rgba(240, 20, 20, 0.1);
}
.prebox li .mid-detail .question-title {
  font-size: 16px;
  line-height: 32px;
  color: #07111b;
  overflow: hidden;
  _zoom: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  word-break: break-word;
  -webkit-transition: color 0.2s ease-out;
  transition: color 0.2s ease-out;
}
.prebox li .mid-detail .question-title a:hover {
  color: #f01414;
}
.prebox li .mid-detail .questiondetail-title {
  font-size: 16px;
  line-height: 32px;
  color: #07111b;
  overflow: hidden;
  _zoom: 1;
  -webkit-transition: color 0.2s ease-out;
  transition: color 0.2s ease-out;
  word-break: break-all;
  word-wrap: break-word;
}
.prebox li .mid-detail .questiondetail-title a:hover {
  color: #f01414;
}
.prebox li .mid-detail .answer-content {
  color: #4d555d;
  font-size: 14px;
  line-height: 28px;
  text-overflow: ellipsis;
  word-break: break-all;
  word-wrap: break-word;
  overflow: hidden;
  text-overflow: -o-ellipsis-lastline;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.prebox li .mid-detail .consult-detail {
  color: #4d555d;
  font-size: 14px;
  line-height: 28px;
}
.prebox li .right-date {
  font-size: 12px;
  color: #93999f;
  line-height: 32px;
}
.highlight {
  font-style: normal;
  color: #f01414;
}
.more-question {
  text-align: center;
  background: #fff;
  padding-bottom: 24px;
}
.more-question a {
  font-size: 14px;
  line-height: 14px;
  color: #93999f;
}
.more-question a:hover {
  color: #f01414;
}
.question-null {
  background: #fff;
  margin: 0 auto;
  padding: 96px 0;
  text-align: center;
  font-size: 16px;
  font-weight: 200;
  color: #93999f;
  line-height: 16px;
}
/*列表*/
.pre-banner {
  background: #f3f5f7;
}
.pre-banner .prebread-crumbs {
  overflow: hidden;
  display: block;
}
.pre-banner .prebread-crumbs ul {
  overflow: hidden;
  padding: 16px 0 36px 0;
}
.pre-banner .prebread-crumbs li {
  float: left;
  font-size: 12px;
  margin-right: 7px;
  color: #93999f;
}
.pre-banner .prebread-crumbs li a {
  font-size: 12px;
  color: #93999f;
  margin-right: 7px;
}
.pre-banner .prebread-crumbs li a:hover {
  color: #4d555d;
}
.pre-banner .prebread-crumbs h2 {
  padding: 12px 0 36px 0 ;
  font-size: 24px;
  line-height: 24px;
  color: #07111b;
  position: relative;
}
.pre-banner .prebread-crumbs .continue-detail {
  position: absolute;
  right: 382px;
  top: 12px;
  color: #f01414;
  font-size: 14px;
  line-height: 24px;
}
.pre-banner .prelist-input {
  margin-bottom: 36px;
  width: 872px;
  float: left;
  overlfow: hidden;
}
.pre-banner .prelist-input .input-block {
  width: 678px;
}
.pre-container {
  background: #fff;
  overflow: hidden;
  min-height: 500px;
}
.pre-container .preconlist-content {
  float: left;
  width: 824px;
  padding: 24px 0 0 0;
  margin-right: 48px;
}
.pre-container .preconlist-content li {
  padding: 24px 0 24px 24px;
  border-bottom: 1px solid #d9dde1;
  width: 824px;
  overflow: hidden;
}
.pre-container .preconlist-content li .mid-detail {
  width: 640px;
  margin-right: 16px;
}
.pre-container .preconlist-content li .right-date {
  margin-right: 24px;
}
.preconlist-content-null {
  width: 872px;
  padding: 120px 0;
  text-align: center;
  font-size: 16px;
  font-weight: 200px;
  line-height: 16px;
  color: #93999f;
}
.js-load-page {
  width: 872px;
  float: left;
  text-align: center;
  padding: 36px 0 0 0;
}
.pt36 {
  padding: 36px 0 48px 0;
}
.pt48 {
  padding-bottonm: 48px;
}
.pt16 {
  padding-top: 16px;
}
/*右侧信息*/
.pre-content {
  position: relative;
}
.right-course-aside {
  width: 208px;
  box-shadow: 0 4px 8px rgba(7, 17, 27, 0.1);
  background: #fff;
  position: fixed;
  top: 130px;
  right: 50%;
  margin-right: -565px;
  z-index: 100;
  padding: 36px;
}
.right-course-aside h2 {
  font-size: 16px;
  font-weight: 700;
  color: #07111b;
  line-height: 24px;
  margin-bottom: 32px;
}
.right-course-aside .course-aside-info {
  overflow: hidden;
}
.right-course-aside .course-aside-info li {
  font-size: 14px;
  padding-bottom: 16px;
  line-height: 14px;
  color: #07111b;
}
.right-course-aside .course-aside-info li .key {
  font-weight: 700;
}
.right-course-aside .course-aside-info li .value {
  margin-left: 12px;
}
.right-course-aside .course-aside-info li .stars {
  margin-left: 12px;
  font-size: 16px;
  vertical-align: middle;
  top: 0;
}
.right-course-aside .course-aside-info li .stars i {
  color: #d9dde1;
  position: relative;
  top: 0px;
}
.right-course-aside .course-aside-info li .stars i.on {
  color: #ff9900;
}
.right-course-aside .desc {
  font-size: 12px;
  color: #93999f;
  line-height: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid #d9dde1;
}
.right-course-aside .price-box {
  font-size: 24px;
  line-height: 24px;
  font-weight: 200;
  color: #f01414;
  text-align: center;
}
.right-course-aside .price-box span {
  padding: 24px 0;
  display: block;
}
.right-course-aside .pre-buy {
  font-size: 16px;
  color: #fff;
  line-height: 48px;
  height: 48px;
  text-align: center;
  width: 208px;
  margin: 0 auto;
}
.right-course-aside .pre-buy .buy-btn1 {
  background-color: #f01404;
  float: left;
  display: block;
  width: 159px;
  text-align: center;
  font-size: 16px;
  color: #fff;
}
.right-course-aside .pre-buy .addcart {
  float: left;
  color: #ffffff;
  width: 48px;
  position: relative;
  font-size: 16px;
  background-color: #f01404;
}
.right-course-aside .pre-buy .buy-class-btn {
  background-color: #f01404;
  float: left;
  display: block;
  width: 207px;
  text-align: center;
  font-size: 16px;
  color: #fff;
}
.right-course-aside .pre-buy .line {
  position: absolute;
  left: 0;
  top: 14px;
  height: 20px;
  width: 1px;
  background-color: rgba(255, 255, 255, 0.6);
}
.w872 {
  width: 872px;
}
.comp-loading {
  padding: 96px 0;
  font-size: 16px;
  color: #787d82;
  text-align: center;
}
.comp-loading i {
  display: inline-block;
  font-size: 28px;
  -webkit-animation: loadingIcon 1s linear infinite;
  -moz-animation: loadingIcon 1s linear infinite;
  animation: loadingIcon 1s linear infinite;
}
.comp-loading .text {
  display: block;
  margin-top: 4px;
}
@-webkit-keyframes loadingIcon {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-moz-keyframes loadingIcon {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes loadingIcon {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
.moco-prompt-layer span {
  color: #f01414;
}
.course-class-infos.pale-color {
  background: #fff;
}
.course-class-infos.pale-color .path {
  color: rgba(7, 17, 27, 0.5);
}
.course-class-infos.pale-color .path a,
.course-class-infos.pale-color .path span {
  color: rgba(7, 17, 27, 0.5);
}
.course-class-infos.pale-color .path a:hover,
.course-class-infos.pale-color .path span:hover {
  color: #07111b;
}
.course-class-infos.pale-color .statics .meta {
  color: rgba(7, 17, 27, 0.7);
}
.course-class-infos.pale-color .statics .meta-value {
  color: rgba(7, 17, 27, 0.7);
}
.course-class-infos.pale-color .price-box .original-price {
  color: rgba(7, 17, 27, 0.5);
}
.course-class-infos.pale-color .extra .share {
  color: rgba(7, 17, 27, 0.5);
}
.course-class-infos.pale-color .extra .share:hover {
  color: #07111b;
}
.cart-color {
  background: linear-gradient(270deg, rgba(255, 115, 155, 0.7), #ff739b);
}
/*红色*/
.cart-color.red {
  background: linear-gradient(270deg, rgba(255, 115, 155, 0.7), #ff739b);
}
/*橙色*/
.cart-color.orange {
  background: linear-gradient(270deg, rgba(255, 150, 0, 0.7), #ff9600);
}
/*绿色*/
.cart-color.green {
  background: linear-gradient(270deg, rgba(0, 185, 90, 0.7), #00b95a);
}
/*青色*/
.cart-color.cyan {
  background: linear-gradient(270deg, rgba(0, 200, 200, 0.7), #00c8c8);
}
/*蓝色*/
.cart-color.blue {
  background: linear-gradient(270deg, rgba(75, 150, 220, 0.7), #4b96dc);
}
/*紫色*/
.cart-color.purple {
  background: linear-gradient(270deg, rgba(210, 115, 230, 0.7), #d273e6);
}
.course-card-container {
  width: 224px;
  height: 228px;
  border-radius: 4px;
  background-color: #fff;
  position: relative;
  box-shadow: 0px 4px 8px 0px rgba(7, 17, 27, 0.1);
  transition: .3s all linear;
}
.course-card-container .course-card-top i {
  float: left;
  font-size: 16px;
  color: #fff;
  line-height: 48px;
  margin-right: 8px;
  display: none;
}
.course-card-container.coding .course-card-top i {
  display: block;
}
.course-card-container:hover {
  box-shadow: 0px 8px 16px 0px rgba(7, 17, 27, 0.2);
}
.course-card-container .course-cart-new {
  display: none;
  position: absolute;
  width: 44px;
  height: 24px;
  z-index: 2;
  right: -5px;
  top: -4px;
}
.course-card-container.new .course-cart-new {
  display: block;
}
.course-card-container .course-card-bk {
  position: absolute;
  width: 224px;
  height: 228px;
  z-index: 0;
  left: 0;
  top: 0;
  border-radius: 4px;
  overflow: hidden;
  background-size: contain;
  background-repeat: no-repeat;
}
.course-card-container .course-card-bk img {
  border-radius: 4px;
}
.course-card-container .course-card {
  display: block;
  position: relative;
  z-index: 1;
  border-radius: 4px;
  overflow: hidden;
}
.course-card-container .course-card-top {
  height: 48px;
  padding: 0 20px;
  overflow: hidden;
}
.course-card-container .course-card-top span {
  float: left;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  line-height: 48px;
  margin-right: 10px;
}
.course-card-container .course-card-content {
  height: 180px;
  background-color: #fff;
  padding: 16px 24px;
  box-sizing: border-box;
}
.course-card-container .course-card-name {
  font-size: 14px;
  color: #07111b;
  line-height: 24px;
  max-height: 48px;
  text-overflow: ellipsis;
  word-break: break-all;
  word-wrap: break-word;
  overflow: hidden;
  text-overflow: -o-ellipsis-lastline;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  letter-spacing: -0.1px;
}
.course-card-container p {
  height: 48px;
  text-overflow: ellipsis;
  word-break: normal;
  word-wrap: break-word;
  overflow: hidden;
  text-overflow: -o-ellipsis-lastline;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.course-card-container p,
.course-card-container .course-card-info {
  font-size: 12px;
  color: #93999f;
  line-height: 24px;
  margin: 8px 0;
}
.course-card-container .course-card-info {
  float: left;
  margin: 0;
}
.course-card-container .course-card-info span {
  margin: 0 3px 0 4px;
  font-weight: 800;
}
.course-card-container .course-card-info i {
  font-style: normal;
}
.course-card-container .course-card-bottom {
  position: absolute;
  bottom: 24px;
  right: 24px;
  left: 24px;
  height: 24px;
  line-height: 24px;
  font-size: 12px;
  text-align: right;
}
.course-card-container .course-card-learning {
  position: absolute;
  width: 40px;
  height: 24px;
  font-size: 12px;
  line-height: 24px;
  color: #fff;
  background-color: #2b333b;
  font-weight: 200;
  text-align: center;
  right: -4px;
  top: 12px;
  z-index: 1;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
.course-card-container .course-card-learning i {
  font-size: 16px;
  line-height: 24px;
}
.course-card-container .course-card-learning:after {
  position: absolute;
  content: '';
  width: 0;
  height: 0;
  overflow: hidden;
  border-top: 4px solid #2b333b;
  border-right: 4px solid transparent;
  right: 0;
  bottom: -4px;
}
.course-card-container .course-card-price {
  float: right;
  color: #f01414;
  font-weight: 200;
}
.path-card-container {
  width: 224px;
  height: 228px;
  position: relative;
}
.path-card-container > a {
  display: block;
  width: 224px;
  height: 228px;
  padding: 24px;
  box-sizing: border-box;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  border-radius: 4px;
}
.path-card-container .path-cart-tit1 {
  height: 22px;
  line-height: 20px;
  margin-bottom: 12px;
}
.path-card-container .path-cart-tit1 span {
  float: left;
  color: rgba(255, 255, 255, 0.6);
}
.path-card-container .path-cart-tit1 i {
  float: left;
  margin-right: 10px;
  color: #fff;
  font-size: 20px;
}
.path-card-container .path-cart-tit2 {
  color: rgba(255, 255, 255, 0.6);
  height: 14px;
  line-height: 14px;
  text-align: left;
  margin-bottom: 10px;
}
.path-card-container .path-cart-tit3 {
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  color: #fff;
}
.path-card-container .path-cart-more {
  margin-top: 36px;
  color: #fff;
}
.path-card-container .path-cart-more span,
.path-card-container .path-cart-more i {
  float: left;
  margin-right: 8px;
  line-height: 14px;
  font-size: 12px;
}
.infolayout {
  overflow: hidden;
}
.course-class-infos {
  position: relative;
  background: #000;
}
.course-class-infos .info-warp {
  padding-top: 292px;
}
.course-class-infos .course-collect {
  margin-right: 24px;
  cursor: pointer;
}
.course-class-infos .course-collect span,
.course-class-infos .course-collect i {
  float: left;
  color: rgba(255, 255, 255, 0.4);
  line-height: 24px;
}
.course-class-infos .course-collect span {
  font-size: 12px;
  margin-left: 4px;
}
.course-class-infos .course-collect i {
  font-size: 20px;
}
.course-class-infos .course-collect:hover span,
.course-class-infos .course-collect:hover i {
  color: #fff;
}
.course-class-infos .w {
  padding-bottom: 60px;
  z-index: 1;
}
.course-class-infos .extra {
  position: absolute;
  right: 0;
  top: 24px;
  color: white;
  z-index: 1;
}
.course-class-infos .extra .share {
  display: inline-block;
  float: none;
  padding: 0;
  line-height: normal;
  margin: 0 12px;
  width: auto;
  height: auto;
  vertical-align: middle;
  background-image: none;
  font-size: 24px;
  background-repeat: no-repeat;
  color: rgba(255, 255, 255, 0.5);
}
.course-class-infos .extra .share:hover {
  color: #ffffff;
}
.course-class-infos .cover-img-wrap {
  z-index: 0;
  overflow: hidden;
  background-size: auto 100%;
  background-position: center;
  background-repeat: no-repeat;
}
.course-class-infos .info-bg,
.course-class-infos .cover-img-wrap {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.course-class-infos .path {
  position: absolute;
  top: 24px;
  font-size: 14px;
  line-height: 24px;
  z-index: 1;
  color: rgba(255, 255, 255, 0.5);
  opacity: 1;
}
.course-class-infos .path .path-split {
  margin: 0 6px;
  font-style: normal;
}
.course-class-infos .path a {
  color: rgba(255, 255, 255, 0.5);
}
.course-class-infos .path a:hover,
.course-class-infos .path span:hover {
  color: #ffffff;
}
.course-class-infos .path span {
  color: rgba(255, 255, 255, 0.5);
}
.course-class-infos .tc {
  text-align: center;
}
.course-class-infos .info-bar {
  height: 16px;
}
.course-class-infos .statics {
  display: inline-block;
  font-size: 0;
  white-space: nowrap;
}
.course-class-infos .statics .static-item {
  display: inline-block;
  position: relative;
  padding: 0 20px;
  font-size: 14px;
}
.course-class-infos .statics .static-item.first {
  padding-left: 0;
}
.course-class-infos .statics .meta {
  font-size: 14px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.6);
  line-height: 16px;
}
.course-class-infos .statics .meta-value {
  font-size: 14px;
  margin-left: 8px;
  line-height: 16px;
  font-weight: 200;
  color: rgba(255, 255, 255, 0.6);
}
.course-class-infos .statics span {
  float: left;
}
.course-class-infos .statics em {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 1px;
  background-color: #fff;
  opacity: 0.4;
  filter: alpha(opacity=10);
  -ms-filter: alpha(opacity=10);
  zoom: 1;
}
.course-class-infos .statics .meta.meta-stars {
  margin-left: 8px;
  color: #ff9900;
  line-height: 16px;
}
.course-class-infos .statics .meta.meta-stars .sz-star {
  color: #d0d6d9;
}
.course-class-infos .statics .meta.meta-stars .sz-star.on {
  color: #ff9900;
}
.course-class-infos .statics .meta.meta-stars span {
  float: none;
}
.course-class-infos .price-box {
  padding: 24px 0px 0px;
  text-align: center;
}
.course-class-infos .price-box .sales-box,
.course-class-infos .price-box .student-sales-box {
  width: 100%;
  margin: 8px auto 0px;
  text-align: center;
}
.course-class-infos .price-box .sales,
.course-class-infos .price-box .student-sales {
  display: inline-block;
  height: 24px;
  padding: 0px 12px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 24px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 12px;
}
.course-class-infos .price-box .sales > a,
.course-class-infos .price-box .student-sales > a {
  color: rgba(255, 255, 255, 0.6);
}
.course-class-infos .price-box .sales i,
.course-class-infos .price-box .student-sales i {
  margin-right: 5px;
}
.course-class-infos .price-box .sales .sales-timer,
.course-class-infos .price-box .student-sales .sales-timer {
  font-size: 16px;
  color: #fff;
  padding-left: 12px;
  display: inline-block;
}
.course-class-infos .price-box .student-sales-box .student-sales span {
  display: inline-block;
  margin: 0px 12px;
}
.course-class-infos .price-box .student-sales-box .student-sales a {
  color: rgba(255, 255, 255, 0.4);
}
.course-class-infos .price-box .student-sales-box .student-sales a:hover {
  color: #fff;
}
.course-class-infos .price-box .num {
  height: 24px;
  display: inline-block;
}
.course-class-infos .price-box .discount-price {
  float: left;
}
.course-class-infos .price-box .discount-price .baseline {
  font-size: 24px;
  height: 24px;
  line-height: 22px;
  font-weight: bold;
  color: #f01400;
  padding-right: 12px;
}
.course-class-infos .price-box .baseliner0 {
  padding-right: 0;
}
.course-class-infos .price-box .original-price {
  margin-left: 12px;
  float: left;
  text-decoration: line-through;
  line-height: 24px;
  font-size: 14px;
  font-weight: bold;
  color: rgba(255, 255, 255, 0.6);
}
.course-class-infos .adjustment-intro-box {
  width: 100%;
  text-align: center;
}
.course-class-infos .adjustment-intro-box .hb-tips {
  margin-top: 7px;
  width: 172px;
  height: 32px;
  display: inline-block;
  line-height: 32px;
  background-image: linear-gradient(-90deg, rgba(5, 152, 182, 0.6) 0%, rgba(54, 0, 159, 0.6) 100%);
  border-radius: 16px;
}
.course-class-infos .adjustment-intro-box .hb-tips .hb-tips-icon {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAALGPC/xhBQAAAs5JREFUOBGNUltIVFEU3efcc+/cGe94HV9Z+Sh8gUIPCntIH2IPKOwvSIMkoqQg/PGjj4gIQvroAX2lfRRZfeRHEBGFYUGBz0DCSizER6I4jqPeedw759G5EyOlfrRhs8/eZ+119t5nA/yH3Pw45xdCoPWgeL3gqhiyPJ43178k+q/2W/Wr7mBd1hToykC4WPf56pxIfBmraj3R9Vo7YrUpunHpWiVyXNxKBcbD0Urj6XhlKtm1jKNTerZ6JyHESXihH7Ytq9NrGudZbPFGCpesIP3Z5B5L0bqQYJaZ8JQfK9YOEqIUEUF7A5q2T3ESA61V/g/NvVYD8XqfcCdOpRy4t9fsIS5TTCUXeHrAIFboW6g4MxaKLx3XAkajE7IWJm3nOecsWPdpcfsU4xeVaBxUzUNk7JxM7UFbusf0CcsY4npamZGInbCOZnVWy6k7TGtOALpMfEYapg5gJIulMiJVIRoonI4gFtqBcrtmNwSp+h1xQTdmkPKp/WYo1V/+u8UqG1AHR7gUMwcUOXN3aIqCAQs+b+qkAqvgpaaCeABEtKBnKZZKdu1UrdnnULt+gTJrjiGYpQJmpE4nFVjQWea4VBlc3ETQeK5Hyxvzxbf+TeCew0dyPuO4PQRCAUE5cKmMY2AJNlUGI2H8vqaGBrB4VZjt19Q8f8tqAtm5ACo4OAxWVBJolL92c5N7MD0ba4/NhoJleRlnyrrDrWeHRaZLJGS7217O1HKb74RoFMBOyOWQy7O0HNQZbXcxyT1wD94HPxsKTONxfo4fb8bxCT9CQz+WHL0vaFeHGfhAyExCACHMfYI2RhqLOv4hcB3l7tfTgmi3PL60bIwERB0q+5avYgRIfh3mNKgDbYk0lTxy8a6sVPDHBUi/PVwSF7iJIjgkm8h343IHfmGivDU5bZtrrhhNYV27hiB1uev+gDpBvVmuX0hi84NNu2Upa+U3f40/qC6dIX8AAAAASUVORK5CYII=");
  height: 16px;
  width: 16px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  margin-right: 4px;
  display: inline-block;
  vertical-align: middle;
}
.course-class-infos .adjustment-intro-box .hb-tips .hb-tips-txt {
  font-size: 12px;
  color: #fff;
}
.course-class-infos .adjustment-intro-box .adjustment-intro {
  margin-top: 7px;
  margin-left: 16px;
  display: inline-block;
  padding: 0px 16px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 32px;
  background: rgba(7, 17, 27, 0.6);
  border-radius: 16px;
  word-wrap: break-word;
}
.course-class-infos .adjustment-intro-box .adjustment-intro a {
  color: #fff;
  display: inline-block;
  margin: 0 5px;
}
.course-class-infos .adjustment-intro-box .adjustment-intro.light-color {
  color: #07111b;
}
.course-class-infos .btnwarp {
  margin-top: 24px;
  display: inline-block;
}
.course-class-infos .buy-class-btn {
  width: 180px;
  height: 60px;
  font-size: 18px;
  line-height: 58px;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  display: block;
  font-weight: 600;
  float: left;
}
.course-class-infos .buynow-btn {
  border-radius: 4px 0px 0px 4px !important;
}
.course-class-infos .addcart {
  float: left;
  height: 60px;
  padding: 0 16px;
  line-height: 60px;
  background-color: #f01404;
  color: #ffffff;
  position: relative;
  font-size: 24px;
  border-radius: 0px 4px 4px 0px;
}
.course-class-infos .addcart .line {
  position: absolute;
  left: 0;
  top: 20px;
  height: 20px;
  width: 1px;
  background-color: rgba(255, 255, 255, 0.6);
}
.course-class-infos .addcart:hover {
  color: #ffffff;
  background-color: #f04646;
}
.course-class-infos .class-btn1 {
  width: 140px;
  font-size: 16px;
  letter-spacing: 4px;
  font-weight: 200;
  color: #fff;
  background-color: #f01404;
  border-radius: 4px;
}
.course-class-infos .class-btn1:hover {
  background-color: #f04646;
}
.course-class-infos .class-btn2 {
  color: rgba(255, 255, 255, 0.7);
  border: 2px solid rgba(255, 255, 255, 0.3);
}
.course-class-infos .preview-tip {
  font-size: 12px;
  color: #f01404;
  text-align: center;
  margin-top: 16px;
}
.course-fixed-nav {
  width: 100%;
  height: 60px;
  box-shadow: 0 4px 8px rgba(7, 17, 27, 0.2);
  position: fixed;
  top: 0;
  z-index: 100;
  background: #ffffff;
  text-align: center;
}
.course-fixed-nav .fixed-course-name {
  height: 60px;
  line-height: 60px;
  color: #07111b;
  font-size: 16px;
  font-weight: 700;
  position: absolute;
  left: 24px;
  top: 0;
}
.course-fixed-nav .fixed-nav {
  display: inline-block;
  background-color: #fff;
  position: relative;
  padding: 0 32px;
  z-index: 1;
}
.course-fixed-nav .goumai {
  position: absolute;
  right: 24px;
  top: 0;
  line-height: 60px;
  height: 60px;
  margin-left: 48px;
}
.course-fixed-nav .goumai .fixed-nav-btn {
  display: block;
  width: 120px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-size: 14px;
  color: #fff;
  margin-top: 10px;
  font-weight: 200;
  letter-spacing: 2px;
}
.course-fixed-nav .goumai .fixed-nav-btn:hover {
  color: #fff;
}
.course-fixed-nav .goumai .fixed-btn1 {
  width: 112px;
  background-color: #f01404;
  float: left;
}
.course-fixed-nav .goumai .fixed-nav-prices {
  position: relative;
  font-size: 24px;
  line-height: 60px;
  color: #f01414;
  font-weight: 200;
  margin-right: 24px;
  z-index: 2;
}
.course-fixed-nav .goumai .addcart {
  float: left;
  height: 40px;
  padding: 0 12px;
  line-height: 40px;
  color: #ffffff;
  position: relative;
  font-size: 16px;
  margin-top: 10px;
  background-color: #f01404;
}
.course-fixed-nav .goumai .addcart .line {
  position: absolute;
  left: 0;
  top: 10px;
  height: 20px;
  width: 1px;
  background-color: rgba(255, 255, 255, 0.6);
}
.course-fixed-nav .goumai .addcart:hover {
  color: #ffffff;
}
.course-fixed-nav .goumai .fixed-btn1:hover {
  background-color: #f04646;
}
.course-fixed-nav .goumai .fixed-btn2 {
  background: #fff;
  width: 120px;
  color: #07111b;
  border-radius: 2px;
  box-sizing: border-box;
  border: 1px solid rgba(7, 17, 27, 0.4);
  font-weight: 200;
}
.course-fixed-nav .goumai .fixed-btn2:hover {
  color: #07111b;
}
.course-fixed-nav .fixed-nav-item {
  float: left;
  position: relative;
  height: 60px;
  margin-left: 36px;
}
.course-fixed-nav .fixed-nav-item a {
  color: #4b555b;
  font-size: 16px;
  font-weight: 200;
  line-height: 60px;
}
.course-fixed-nav .fixed-nav-item a:hover {
  color: #07111b;
}
.course-fixed-nav .fixed-nav-item span {
  position: relative;
  top: -6px;
  font-size: 12px;
  font-weight: 400!important;
  color: #93999f !important;
  line-height: 52px;
}
.course-fixed-nav .ml0 {
  margin-left: 0;
}
.course-infos-t {
  background: #F8FAFC;
  overflow: hidden;
}
.course-infos-t .comp-tab-t {
  padding: 16px 0 20px 0;
  text-align: center;
  background: #FFFFFF;
  box-shadow: 0 8px 16px 0 rgba(28, 31, 33, 0.1);
}
.course-infos-t .comp-tab-t ul {
  display: inline-block;
}
.course-infos-t .comp-tab-item {
  height: 40px;
  position: relative;
  font-size: 16px;
  line-height: 27px;
  float: left;
  margin-left: 60px;
}
.course-infos-t .comp-tab-item a {
  font-weight: bold;
  font-size: 16px;
  line-height: 40px;
  color: #4d555d;
  vertical-align: text-bottom;
}
.course-infos-t .comp-tab-item span {
  position: absolute;
  top: 0px;
  left: 67px;
  font-size: 12px;
  color: #93999f;
}
.course-infos-t .comp-tab-item .borderLine {
  position: absolute;
  width: 16px;
  height: 2px;
  top: 40px;
  left: 50%;
  margin-left: -8px;
  background: #F01414;
}
.course-infos-t .comp-tab-item-first {
  margin-left: 0;
}
.course-infos-t .b {
  border: 1px red solid;
  box-sizing: border-box;
}
.course-infos-t .info-video {
  width: 1152px;
  height: 448px;
  box-sizing: border-box;
  margin: 36px auto 48px auto;
  text-align: left;
  padding: 64px 0 72px 0;
  box-shadow: 0 4px 8px 0 rgba(7, 17, 27, 0.1);
  border-radius: 16px;
  display: block;
  background: #4D4D4D;
  background-size: cover;
  background-position: center;
}
.course-infos-t .video-dark-box {
  width: 862px;
  height: 312px;
  box-sizing: border-box;
}
.course-infos-t .video-dark-box .videoBtn {
  width: 96px;
  margin: 96px 100px 86px 100px;
}
.course-infos-t .video-dark-box .videoBtn p {
  font-size: 16px;
  color: #FFFFFF;
  line-height: 24px;
  text-align: center;
  margin-top: 8px;
}
@keyframes mymove {
  from {
    opacity: 0.3;
  }
  to {
    opacity: 0.8;
  }
}
.course-infos-t .video-dark-box .videoBtn .sz-play {
  font-size: 96px;
  color: #fff;
  opacity: 0.3;
  animation: mymove 2s infinite;
  -moz-animation: mymove 2s infinite;
  /* Firefox */
  -webkit-animation: mymove 2s infinite;
  /* Safari and Chrome */
  -o-animation: mymove 2s infinite;
  /* Opera */
}
.course-infos-t .video-dark-box .videoBtn .sz-play:hover {
  color: #fff;
  opacity: 1;
  cursor: pointer;
}
.course-infos-t .video-dark-box #videoInfo {
  width: 564px;
  height: 100%;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}
.course-infos-t .video-dark-box #videoInfo #content {
  position: relative;
  padding-right: 95px;
  display: table;
}
.course-infos-t .video-dark-box #videoInfo #content .con {
  display: table-cell;
  vertical-align: middle;
}
.course-infos-t .video-dark-box #videoInfo #content .info-name {
  font-weight: bold;
  font-size: 24px;
  color: #FFFFFF;
  line-height: 36px;
  margin-bottom: 16px;
}
.course-infos-t .video-dark-box #videoInfo #content .info-desc {
  font-size: 14px;
  color: #FFFFFF;
  line-height: 28px;
}
.course-infos-t .video-dark-box #videoInfo #content .line {
  position: absolute;
  top: 0;
  right: 3px;
  width: 2px;
  height: 100%;
  background: rgba(255, 255, 255, 0.4);
}
.course-infos-t .video-dark-box #videoInfo .scrollDiv {
  width: 8px;
  position: absolute;
  background: #fff;
  top: 0;
  border-radius: 8px;
  cursor: pointer;
}
.course-infos-t .teacher-right-box {
  width: 272px;
  height: 312px;
  padding-top: 49px;
  position: relative;
}
.course-infos-t .teacher-right-box .teacher {
  width: 160px;
  margin: 0 auto;
  position: relative;
  text-align: center;
}
.course-infos-t .teacher-right-box .teacher .whiteBorder {
  width: 140px;
  height: 140px;
  border-radius: 50%;
  margin: 0 auto 12px auto;
  background: #fff;
}
.course-infos-t .teacher-right-box .teacher .headPortrait {
  width: 132px;
  height: 132px;
  left: 14px;
  top: 5px;
  border-radius: 50%;
  overflow: hidden;
  position: absolute;
}
.course-infos-t .teacher-right-box .teacher .headPortrait img {
  width: 100%;
  height: 100%;
}
.course-infos-t .teacher-right-box .teacher .nickname {
  font-weight: bold;
  font-size: 20px;
  color: #FFFFFF;
  line-height: 30px;
  margin-bottom: 4px;
}
.course-infos-t .teacher-right-box .teacher p {
  font-size: 14px;
  color: #FFFFFF;
  line-height: 22px;
}
.course-infos-t .teacher-right-box .jiao {
  position: absolute;
  top: 100px;
  height: 0px;
  width: 0px;
  border-top: 20px solid transparent;
  border-left: 25px solid #fff;
  border-bottom: 20px solid transparent;
}
.course-infos-t .detail-white-box {
  position: relative;
  margin-top: -64px;
  left: 0;
  width: 880px;
  box-sizing: border-box;
  height: 448px;
  background: #FFFFFF;
  box-shadow: 0 8px 16px 0 rgba(7, 17, 27, 0.1);
  border-radius: 16px 0 0 16px;
  padding: 48px 60px 60px 64px;
  overflow: hidden;
}
.course-infos-t .detail-white-box .scrollConTeacher {
  padding-right: 20px;
  box-sizing: border-box;
}
.course-infos-t .detail-white-box .detailContent .nickname {
  font-weight: bold;
  font-size: 32px;
  color: #F20D0D;
  line-height: 48px;
}
.course-infos-t .detail-white-box .detailContent .jobType {
  font-weight: bold;
  font-size: 20px;
  color: #07111B;
  line-height: 30px;
  margin-bottom: 24px;
}
.course-infos-t .detail-white-box .detailContent .introduce p {
  font-size: 16px;
  color: #07111B;
  line-height: 32px;
}
.course-infos-t .detail-white-box .division {
  margin: 24px 0;
  box-sizing: border-box;
}
.course-infos-t .detail-white-box .division h3 {
  font-weight: bold;
  font-size: 14px;
  color: #07111B;
  line-height: 22px;
  margin-right: 12px;
  background: #fff;
  position: relative;
}
.course-infos-t .detail-white-box .division p {
  width: 638px;
  height: 2px;
  background: #D9DDE1;
  margin: -12px 0 0 12px;
}
.course-infos-t .detail-white-box .recommend .item {
  margin: 0 0 0 0;
}
.course-infos-t .detail-white-box .recommend .item img {
  width: 126.4px;
  height: 84px;
  border-radius: 8px;
}
.course-infos-t .detail-white-box .recommend .item .textCon {
  width: 207.6px;
  height: 84px;
  margin-left: 143px;
  position: relative;
}
.course-infos-t .detail-white-box .recommend .item .textCon .className {
  font-weight: bold;
  word-break: break-all;
  font-size: 14px;
  color: #2B333B;
  line-height: 20px;
  margin-bottom: 2px;
}
.course-infos-t .detail-white-box .recommend .item .textCon .typeNumCon {
  margin-bottom: 4px;
}
.course-infos-t .detail-white-box .recommend .item .textCon .typeNumCon .type {
  font-size: 12px;
  color: #93999F;
  line-height: 18px;
  padding-right: 12px;
}
.course-infos-t .detail-white-box .recommend .item .textCon .typeNumCon .difficulty {
  font-size: 12px;
  color: #93999F;
  line-height: 18px;
  padding-right: 12px;
}
.course-infos-t .detail-white-box .recommend .item .textCon .typeNumCon .peopleNum {
  font-size: 12px;
  color: #4D555D;
  line-height: 18px;
  vertical-align: middle;
}
.course-infos-t .detail-white-box .recommend .item .textCon .priceDiscount {
  position: absolute;
  bottom: 0;
}
.course-infos-t .detail-white-box .recommend .item .textCon .priceDiscount .price {
  font-weight: bold;
  font-size: 12px;
  color: #4D555D;
  line-height: 20px;
  margin-right: 8px;
}
.course-infos-t .detail-white-box .recommend .item .textCon .priceDiscount .discount {
  font-size: 12px;
  color: #FFFFFF;
  line-height: 20px;
  background: #F67272;
  margin-right: 4px;
  padding: 0 2px;
}
.course-infos-t .detail-white-box .recommend .item .textCon .priceDiscount .time {
  font-size: 12px;
  color: #FFFFFF;
  line-height: 20px;
  background: #F67272;
  padding: 0 3px;
}
.course-infos-t .detail-white-box .recommend .item .textCon .priceDiscount .discount_price {
  padding: 0 4px;
  background: rgba(240, 20, 20, 0.6);
  border-radius: 2px;
  font-size: 12px;
  color: #FFFFFF;
  line-height: 20px;
  height: 20px;
}
.course-infos-t .detail-white-box .recommend #item0,
.course-infos-t .detail-white-box .recommend #item1 {
  margin: 0 0 32px 0;
}
.course-infos-t .jw-tab-focus:focus {
  outline: none !important;
}
.course-infos-t .video-container {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  display: none;
}
.course-infos-t .video-container .video-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -245px;
  margin-left: -400px;
  width: 800px;
  height: 490px;
  z-index: 10001;
}
.course-infos-t .video-container .video-wrap video {
  margin: 0;
  height: 450px;
}
.course-infos-t .video-container .video-mask {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: #000;
  opacity: 0.8;
  filter: alpha(opacity=80);
  z-index: 10000;
}
.course-infos-t .video-container .video-close {
  position: absolute;
  font-size: 50px;
  color: rgba(255, 255, 255, 0.7);
  right: 40px;
  top: 40px;
  z-index: 10001;
  cursor: pointer;
}
.course-infos-t .desc-short {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}
.course-infos-t .close-video {
  position: absolute;
  right: 12px;
  top: 12px;
  z-index: 1;
  font-size: 36px;
  color: rgba(255, 255, 255, 0.6);
}
.course-infos-t .close-video:hover {
  color: #ffffff;
}
.outline-list .chapter-ul {
  width: 100%;
  border-bottom: 1px solid #d9dde1;
}
.outline-list .chapter {
  position: relative;
  overflow: hidden;
  padding: 32px 12px 28px 0;
  z-index: 2;
  vertical-align: middle;
  border-top: 1px solid #d9dde1;
}
.outline-list .chapter a {
  cursor: default;
}
.outline-list .chapter .chapter-icon {
  float: left;
  font-size: 36px;
  color: #93999f;
  margin: 5px 24px 0 12px;
}
.outline-list .chapter .chapter-bd {
  position: relative;
  float: none;
  overflow: hidden;
}
.outline-list .chapter .chapter-bd .name {
  font-weight: bold;
  font-size: 16px;
  color: #07111b;
}
.outline-list .chapter .chapter-bd .desc {
  margin-bottom: 16px;
  line-height: 24px;
  font-size: 14px;
  color: #07111b;
}
.outline-list .chapter .chapter-bd ul li {
  padding: 12px 0;
  border-top: 1px solid rgba(28, 31, 33, 0.1);
  line-height: 24px;
}
.outline-list .chapter .chapter-bd ul li i {
  margin-right: 12px;
  color: #9199A1;
}
.outline-list .update-tip {
  padding: 30px 0 30px 60px;
  color: #b5b9bc;
}
.envir-box {
  width: 100%;
  background: #2b333b;
  margin: 0 auto;
}
.envir-box h1 {
  width: 1200px;
  margin: 0 auto;
  padding-top: 72px;
  padding-left: 24px;
  padding-bottom: 24px;
  border-bottom: 2px solid #555c62;
  box-sizing: border-box;
  font-size: 24px;
  line-height: 24px;
  color: #fff;
}
.envir-box .detail-box {
  width: 1200px;
  padding: 36px 48px 80px;
  box-sizing: border-box;
  margin: 0 auto;
}
.envir-box .detail-box ul {
  width: 100%;
}
.envir-box .detail-box ul li {
  position: relative;
  width: 528px;
  height: 32px;
  margin-right: 48px;
  margin-bottom: 16px;
  font-size: 14px;
  line-height: 32px;
  list-style: none;
  overflow: hidden;
}
.envir-box .detail-box ul li .detail-tag {
  background: #93999f;
  padding: 7px 4px 7px 12px;
  box-sizing: border-box;
  color: #07111b;
  line-height: 14px;
}
.envir-box .detail-box ul li .triangle {
  position: relative;
  margin-right: 8px;
}
.envir-box .detail-box ul li .triangle:after {
  position: absolute;
  left: -5px;
  content: '';
  width: 0;
  height: 0;
  border-top: 16px solid #2b333b;
  border-left: 10px solid #93999f;
  border-bottom: 16px solid #2b333b;
}
.envir-box .detail-box ul li .detail {
  color: #fff;
  padding-left: 8px;
}
.envir-box .detail-box ul li:nth-child(2n) {
  margin-right: 0px;
}
.user-evaluation-box {
  width: 100%;
  background: #4d555d;
}
.user-evaluation-box .user-evalustion {
  width: 1314px;
  margin: 0 auto;
  text-align: center;
  background: #4d555d;
}
.user-evaluation-box .user-evalustion h2 {
  font-size: 24px;
  line-height: 24px;
  color: #ffffff;
  font-weight: 700;
  padding-top: 72px;
  padding-bottom: 36px;
}
.user-evaluation-box .user-evalustion ul {
  width: 100%;
}
.user-evaluation-box .user-evalustion ul li:last-child {
  border-right: 1px solid transparent;
}
.user-evaluation-box .user-evalustion ul li {
  width: 438px;
  position: relative;
  padding: 0px 64px;
  box-sizing: border-box;
  text-align: center;
  border-right: 1px solid #71777d;
}
.user-evaluation-box .user-evalustion ul li img {
  border-radius: 50%;
  display: block;
  margin: 24px auto 0px;
}
.user-evaluation-box .user-evalustion ul li .user-name {
  margin: 8px 0px 18px;
  font-size: 14px;
  line-height: 14px;
  color: #ffffff;
  font-weight: 700;
  max-width: 312px;
  text-overflow: ellipsis;
  word-break: break-all;
  word-wrap: break-word;
  overflow: hidden;
}
.user-evaluation-box .user-evalustion ul li .user-text-box .star {
  line-height: 16px;
}
.user-evaluation-box .user-evalustion ul li .user-text-box .star i {
  position: relative;
  top: 0px;
  color: #2b333b;
  font-size: 16px;
}
.user-evaluation-box .user-evalustion ul li .user-text-box .star .on {
  color: #ff9900;
}
.user-evaluation-box .user-evalustion ul li .content {
  margin: 22px 0px;
  max-width: 312px;
  height: 140px;
  font-size: 14px;
  line-height: 28px;
  color: #fff;
  text-overflow: ellipsis;
  word-break: break-all;
  word-wrap: break-word;
  overflow: hidden;
  text-overflow: -o-ellipsis-lastline;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
}
.user-evaluation-box .user-evalustion ul li .time {
  position: absolute;
  bottom: 24px;
  font-size: 12px;
  line-height: 24px;
  color: #93999f;
}
.user-evaluation-box .more {
  width: 50%;
  margin: 36px auto 0px;
  padding-bottom: 72px;
  display: block;
  color: rgba(255, 255, 255, 0.4);
  font-size: 14px;
  line-height: 14px;
}
.user-evaluation-box .more span {
  margin: 0 4px;
}
.user-evaluation-box .more:hover {
  color: #fff;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  /* style */
  body {
    width: 100%;
    min-width: 100%;
  }
  .course-class-infos .w {
    height: 350px;
  }
  .w,
  .wrap {
    width: 100%;
  }
  #header,
  .path,
  .extra,
  .infolayout .recommendcourse,
  #J_GotoTop,
  .info-recommendcourse,
  #footer,
  #Prchor,
  .js-recom-course,
  .js-comp-tab li:nth-child(3),
  .js-comp-tab li:nth-child(4) {
    display: none !important;
  }
  .appendtemplate .w1200 {
    width: 100%;
  }
  .appendtemplate .w1200 img {
    width: 100%;
  }
  .class-tab-pannel {
    width: 100%;
  }
  .class-tab-pannel .outline-list .chapter-ul {
    width: 100%;
  }
  .envir-box h1 {
    width: 100%;
  }
  .envir-box .detail-box {
    width: 100%;
  }
  .envir-box .detail-box ul {
    width: 100%;
  }
  .envir-box .detail-box ul li {
    width: 100%;
  }
  .user-evaluation-box .user-evalustion {
    width: 100%;
  }
  .user-evaluation-box .user-evalustion ul li {
    width: 330px;
    padding: 0 32px;
  }
  .user-evaluation-box .more {
    visibility: hidden;
  }
  .course-infos-t .info-video {
    width: 100%;
  }
  .course-infos-t .video-dark-box {
    width: 740px;
  }
  .course-infos-t .video-dark-box .videoBtn {
    margin: 96px 40px 86px 40px;
  }
  .course-infos-t .detail-white-box {
    width: 740px;
  }
  .course-infos-t .teacher-right-box .jiao {
    left: -12px;
  }
}
#bargain_enter {
  position: fixed;
  right: 21px;
  top: 50%;
  z-index: 9;
  margin-top: -225px;
}
#bargain_enter .close-enter {
  line-height: 27px;
  text-align: center;
  position: absolute;
  right: -15px;
  top: -18px;
  opacity: 0.8;
}
#bargain_enter .close-enter i {
  width: 27px;
  height: 27px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  font-size: 10px;
  color: #FFF;
  padding: 2px;
  background-color: #1C1F21;
}
.modal-btn {
  height: 42px;
  background: #F53D3D;
  border-radius: 20px;
  font-size: 14px;
  color: #FFFFFF !important;
  letter-spacing: 0;
  font-weight: bold;
  padding: 0 32px;
  line-height: 42px;
  box-sizing: border-box;
}
.share-link {
  display: flex;
  justify-content: space-between;
  width: 420px;
  margin: 30px auto;
}
.share-link .link-item {
  text-align: center;
}
.share-link .link-item .link-content {
  width: 180px;
  height: 180px;
  border: 1px solid #F3F5F6;
  border-radius: 8px;
  box-sizing: border-box;
  margin-bottom: 10px;
}
.share-link .link-item .link-content .qr-code {
  width: 164px;
  height: 164px;
  display: inline-block;
  margin-top: 8px;
}
.share-link .link-item .link-content .link-img {
  width: 80px;
  height: 58px;
  display: inline-block;
  margin: 31px auto 21px;
}
.share-link .link-item p {
  font-size: 14px;
  color: #4A4A4A;
  letter-spacing: 0;
}