@charset "UTF-8";
.mCustomScrollbar {
  overflow: hidden; }
  .mCustomScrollbar .mCSB_inside > .mCSB_container {
    margin-right: 0; }
  .mCustomScrollbar .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: rgba(102, 102, 102, 0.75); }
  .mCustomScrollbar .mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCustomScrollbar .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
    background-color: rgba(102, 102, 102, 0.85); }

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

/**
 *
 *
 * 问答首页
 *
 *
 **/
.topFixed {
  margin-top: 90px;
  display: flex;
  height: 66px;
  border-radius: 2px;
  background-color: #fff; }
  .topFixed-search {
    width: 340px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative; }
    .topFixed-search input {
      width: 300px;
      height: 32px;
      padding: 6px 13px;
      background-color: #f6f6f6;
      border-radius: 2px; }
    .topFixed-search i {
      height: 16px;
      width: 16px;
      display: block;
      position: absolute;
      top: 25px;
      right: 30px;
      background: url("../image/head-search-icon .png") no-repeat center/contain; }
  .topFixed-question {
    width: 840px;
    padding: 22px 40px 22px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center; }
    .topFixed-question span {
      width: 600px;
      height: 22px;
      font-size: 16px;
      color: #303133;
      width: 600px;
      line-height: 22px; }
    .topFixed-question button {
      width: 112px;
      height: 40px;
      font-size: 16px;
      color: #fff;
      width: 112px;
      background-color: #0088ff;
      border-radius: 4px;
      text-align: center;
      cursor: pointer; }

.leftFixed {
  position: absolute;
  top: 86px;
  left: 0;
  width: 340px;
  border-radius: 2px;
  background-color: #fff;
  margin-bottom: 20px; }
  .leftFixed.active {
    position: fixed;
    top: 78px;
    left: 50%;
    -webkit-transform: translate(-590px, 0);
            transform: translate(-590px, 0); }
  .leftFixed-all {
    height: 40px;
    font-size: 14px;
    color: #000;
    line-height: 40px;
    padding: 0 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06); }
    .leftFixed-all.active {
      color: #0088ff; }
  .leftFixed .mCustomScrollbar {
    height: 400px; }
  .leftFixed li {
    font-size: 14px;
    color: #303133;
    line-height: 20px;
    padding: 10px 20px; }
    .leftFixed li:hover {
      color: #0088ff; }
    .leftFixed li.active {
      background-color: #0088ff;
      color: #fff; }

.indexCoursex {
  margin: 20px 0 50px 360px;
  width: 820px;
  min-height: 500px; }
  .indexCoursex .mCustomScrollbar {
    max-height: 750px; }
  .indexCoursex-item {
    padding: 20px;
    background-color: #fff;
    margin-bottom: 10px;
    cursor: pointer; }
    .indexCoursex-item-people {
      display: flex;
      justify-content: space-between;
      align-items: center; }
      .indexCoursex-item-people > img {
        object-fit: cover;
        width: 32px;
        height: 14px; }
      .indexCoursex-item-people .flex2 {
        display: flex; }
        .indexCoursex-item-people .flex2 > img {
          object-fit: cover;
          width: 40px;
          height: 40px;
          border-radius: 50%;
          margin-right: 10px; }
      .indexCoursex-item-people .flex3 {
        display: flex;
        flex-direction: column; }
      .indexCoursex-item-people ._name {
        height: 20px;
        font-size: 14px;
        color: #303133;
        line-height: 20px; }
      .indexCoursex-item-people ._time {
        height: 17px;
        font-size: 12px;
        color: #909399;
        line-height: 17px; }
    .indexCoursex-item-content p {
      font-size: 16px;
      color: #303133;
      line-height: 22px;
      margin-top: 10px; }
    .indexCoursex-item-content ul {
      margin-top: 10px;
      display: flex; }
      .indexCoursex-item-content ul img {
        object-fit: cover;
        width: 100px;
        height: 100px;
        margin-right: 12px;
        border-radius: 2px; }
    .indexCoursex-item-type {
      margin-top: 10px;
      font-size: 12px;
      height: 17px;
      display: flex;
      justify-content: space-between;
      align-items: center; }
      .indexCoursex-item-type span:nth-child(1) {
        color: #909399; }
      .indexCoursex-item-type span:nth-child(2) {
        color: #0088ff;
        cursor: pointer; }
  .indexCoursex-nodata {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 600px;
    padding-top: 142px;
    background-color: #fff; }
    .indexCoursex-nodata img {
      object-fit: cover;
      width: 218px;
      height: 137px; }
    .indexCoursex-nodata p {
      margin-top: 10px;
      color: #303133;
      font-size: 14px;
      text-align: center;
      width: 218px; }

.indexPutx {
  height: 349px;
  width: 780px;
  position: fixed;
  top: 174px;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  left: 50%;
  background-color: #fff;
  padding: 0 20px 20px;
  overflow: hidden; }
  .indexPutx-titlep {
    height: 55px;
    font-size: 18px;
    color: #303133;
    line-height: 55px;
    text-align: center;
    position: relative; }
    .indexPutx-titlep i {
      width: 20px;
      height: 20px;
      position: absolute;
      top: 18px;
      right: 20px;
      background: url("../image/close.png") no-repeat center/contain; }
  .indexPutx-type {
    width: 180px; }
    .indexPutx-type-titlet {
      width: 100%;
      height: 30px;
      font-size: 14px;
      color: #303133;
      width: 100%;
      line-height: 30px;
      padding: 0 25px 0 10px;
      position: relative;
      border: 1px solid #eee;
      cursor: pointer; }
      .indexPutx-type-titlet.active i {
        -webkit-transform: rotate(0);
                transform: rotate(0); }
      .indexPutx-type-titlet i {
        -webkit-transform: rotate(180deg);
                transform: rotate(180deg);
        width: 12px;
        height: 12px;
        position: absolute;
        top: 8px;
        right: 10px;
        background: url("../image/user-arrow.png") no-repeat center/contain; }
      .indexPutx-type-titlet .selectTip {
        position: absolute;
        right: -181px;
        top: 0;
        color: #909399;
        cursor: default; }
    .indexPutx-type-list {
      max-height: 227px;
      position: absolute;
      top: 87px;
      left: 20px;
      z-index: 100;
      background-color: #fff;
      border: 1px solid #eee;
      overflow: hidden; }
      .indexPutx-type-list ul {
        padding: 7px 0;
        width: 180px; }
        .indexPutx-type-list ul li {
          padding: 7px 10px;
          font-size: 12px;
          color: #303133;
          line-height: 17px; }
          .indexPutx-type-list ul li:hover {
            color: #0088ff; }
          .indexPutx-type-list ul li.active {
            background-color: #0088ff;
            color: #fff; }
  .indexPutx-content-text {
    position: relative; }
    .indexPutx-content-text textarea {
      width: 740px;
      height: 108px;
      background-color: #f6f6f6;
      border: 1px solid #eeeeee;
      border-radius: 4px;
      display: block;
      padding: 10px;
      resize: none;
      margin: 10px auto 16px; }
    .indexPutx-content-text span {
      position: absolute;
      bottom: 10px;
      right: 10px;
      color: #909399; }
  .indexPutx-content-img {
    display: flex;
    align-items: flex-end; }
    .indexPutx-content-img ul {
      display: flex; }
    .indexPutx-content-img li,
    .indexPutx-content-img .fileupload {
      width: 50px;
      height: 50px;
      margin-right: 10px;
      position: relative; }
      .indexPutx-content-img li img,
      .indexPutx-content-img .fileupload img {
        object-fit: cover;
        width: 100%;
        height: 100%; }
      .indexPutx-content-img li input,
      .indexPutx-content-img .fileupload input {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0; }
    .indexPutx-content-img li i {
      width: 14px;
      height: 14px;
      background: url("../image/ask-close.png") no-repeat center/contain;
      position: absolute;
      top: -7px;
      right: -7px; }
    .indexPutx-content-img ._tip {
      height: 17px;
      font-size: 12px;
      color: #909399;
      line-height: 17px;
      margin-left: 10px; }
  .indexPutx-submit {
    margin-top: 20px;
    height: 40px;
    float: right; }
    .indexPutx-submit button {
      width: 160px;
      height: 40px;
      font-size: 16px;
      color: #fff;
      width: 160px;
      background-color: #0088ff;
      border-radius: 4px;
      text-align: center;
      cursor: pointer; }

/**
 *
 *
 * 问答详情
 *
 *
 **/
.detailPutx {
  background-color: #fff;
  overflow: hidden; }
  .detailPutx-item {
    padding: 20px;
    border-bottom: 1px solid #eeeeee; }
    .detailPutx-item-people {
      display: flex;
      justify-content: space-between;
      align-items: center; }
      .detailPutx-item-people > img {
        object-fit: cover;
        width: 32px;
        height: 14px; }
      .detailPutx-item-people .flex2 {
        display: flex; }
        .detailPutx-item-people .flex2 > img {
          object-fit: cover;
          width: 40px;
          height: 40px;
          border-radius: 50%;
          margin-right: 10px; }
      .detailPutx-item-people .flex3 {
        display: flex;
        flex-direction: column; }
      .detailPutx-item-people ._name {
        height: 20px;
        font-size: 14px;
        color: #303133;
        line-height: 20px;
        font-weight: bold; }
      .detailPutx-item-people ._time {
        height: 17px;
        font-size: 12px;
        color: #909399;
        line-height: 17px; }
    .detailPutx-item-content p {
      font-size: 16px;
      color: #303133;
      line-height: 22px;
      margin-top: 10px; }
    .detailPutx-item-content ul {
      margin-top: 10px;
      display: flex; }
      .detailPutx-item-content ul img {
        object-fit: cover;
        width: 100px;
        height: 100px;
        margin-right: 12px;
        border-radius: 2px; }
    .detailPutx-item-type {
      margin-top: 10px;
      font-size: 12px;
      height: 17px;
      display: flex;
      justify-content: space-between;
      align-items: center; }
      .detailPutx-item-type span:nth-child(1) {
        color: #909399; }
      .detailPutx-item-type span:nth-child(2) {
        color: #0088ff; }
  .detailPutx-reply {
    display: flex;
    margin: 20px 0 30px;
    height: 40px; }
    .detailPutx-reply img {
      object-fit: cover;
      width: 40px;
      border-radius: 50%;
      margin: 0 20px; }
    .detailPutx-reply input {
      width: 604px;
      padding: 10px;
      border-radius: 2px;
      border: 1px solid #efefef; }
    .detailPutx-reply button {
      margin-left: 20px;
      width: 96px;
      height: 40px;
      font-size: 14px;
      color: #fff;
      width: 96px;
      line-height: 40px;
      background-color: #0088ff;
      border-radius: 2px;
      text-align: center;
      cursor: pointer; }
      .detailPutx-reply button.disable {
        background-color: rgba(0, 136, 255, 0.6); }

.problemx {
  margin-top: 20px;
  background-color: #fff;
  position: relative;
  min-height: 300px; }
  .problemx-title {
    height: 50px;
    font-size: 16px;
    color: #303133;
    line-height: 50px;
    padding-left: 20px;
    border-bottom: 1px solid #eeeeee; }
  .problemx-list {
    height: 250px;
    overflow: hidden;
    position: relative; }
    .problemx-list.active {
      height: auto; }
      .problemx-list.active .problemx-mc {
        display: none; }
  .problemx-mc {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, white 30%);
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 10;
    top: 0; }
    .problemx-mc p {
      height: 22px;
      font-size: 16px;
      color: #0088ff;
      line-height: 22px;
      margin-top: 154px;
      text-align: center; }
  .problemx-item {
    padding: 20px;
    display: flex;
    border-bottom: 1px solid #eee; }
    .problemx-item-avatar {
      height: 40px;
      width: 40px;
      border-radius: 50%;
      margin-right: 10px;
      flex: none; }
    .problemx-item > div {
      width: 730px; }
    .problemx-item-nickname {
      height: 20px;
      font-size: 14px;
      color: #303133;
      line-height: 20px;
      font-weight: bold;
      display: flex;
      justify-content: space-between; }
      .problemx-item-nickname .zan-icon {
        cursor: pointer;
        font-weight: normal;
        color: #909399;
        font-size: 12px;
        position: relative; }
        .problemx-item-nickname .zan-icon:after {
          content: '';
          position: absolute;
          left: -18px;
          top: 1px;
          width: 16px;
          height: 16px;
          display: block;
          background: url("../image/course-detail-zan.png") no-repeat center/contain; }
        .problemx-item-nickname .zan-icon.active {
          color: #f56c6c; }
          .problemx-item-nickname .zan-icon.active::after {
            background-image: url("../image/course-detail-zaned.png"); }
    .problemx-item-text {
      font-size: 14px;
      color: #303133;
      line-height: 24px;
      margin-top: 10px; }
    .problemx-item-info {
      height: 17px;
      font-size: 12px;
      color: #909399;
      line-height: 17px;
      display: flex;
      justify-content: space-between;
      margin-top: 10px; }
      .problemx-item-info span:nth-child(1) {
        color: #909399; }
      .problemx-item-info span:nth-child(2) {
        color: #0088ff;
        cursor: pointer;
        position: relative; }
        .problemx-item-info span:nth-child(2):after {
          content: '';
          position: absolute;
          left: -20px;
          top: 0;
          width: 16px;
          height: 16px;
          display: block;
          background: url("../image/ask-detail-message.png") no-repeat center/contain; }
    .problemx-item-image {
      display: flex; }
      .problemx-item-image img {
        object-fit: cover;
        height: 100px;
        width: 100px;
        margin-right: 12px;
        margin-top: 10px; }
    .problemx-item-reply {
      display: flex;
      margin: 10px 0;
      height: 40px; }
      .problemx-item-reply img {
        object-fit: cover;
        width: 40px;
        border-radius: 50%;
        margin-right: 20px; }
      .problemx-item-reply input {
        width: 618px;
        padding: 10px;
        border-radius: 2px;
        border: 1px solid #efefef;
        margin-right: 20px; }
      .problemx-item-reply button {
        height: 40px;
        width: 40px;
        background: url("../image/ask-detail-reply.png") no-repeat center/contain; }
        .problemx-item-reply button.disable {
          background-image: url("../image/ask-detail-reply2.png"); }
  .problemx-page {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 20px; }
    .problemx-page i,
    .problemx-page input,
    .problemx-page span {
      margin-left: 16px;
      color: #303133; }
    .problemx-page i {
      background: url("../image/cate-arrow-2.png") no-repeat center/contain;
      height: 14px;
      width: 14px;
      display: block; }
      .problemx-page i:first-child {
        -webkit-transform: rotate(180deg);
                transform: rotate(180deg); }
    .problemx-page input {
      width: 48px;
      height: 22px;
      text-align: center;
      line-height: 22px;
      padding: 0 2px;
      border: 1px solid #d9d9d9;
      border-radius: 4px; }
  .problemx-nodata {
    position: absolute;
    top: 19px;
    width: 300px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0); }
    .problemx-nodata img {
      object-fit: cover;
      width: 300px;
      height: 160px; }
    .problemx-nodata p {
      color: #606266;
      font-size: 14px;
      margin-top: 10px;
      text-align: center; }

.replyx {
  background-color: #f6f6f6;
  margin-top: 10px;
  overflow: hidden;
  padding: 0 20px 0 12px; }
  .replyx-item {
    display: flex;
    border-bottom: 1px solid #e5e5e5;
    padding: 10px 0; }
    .replyx-item:last-child {
      border-bottom: none; }
    .replyx-item-avatar {
      height: 30px;
      width: 30px;
      border-radius: 50%;
      margin-right: 10px;
      flex: none; }
    .replyx-item > div {
      width: 658px;
      flex: none; }
    .replyx-item-text {
      font-size: 14px;
      color: #303133;
      line-height: 24px; }
    .replyx-item-image {
      display: flex; }
      .replyx-item-image img {
        object-fit: cover;
        height: 100px;
        width: 100px;
        margin-right: 12px;
        margin-top: 10px; }
    .replyx-item-info {
      height: 17px;
      font-size: 12px;
      color: #303133;
      line-height: 17px;
      display: flex;
      justify-content: space-between;
      margin-top: 10px; }
      .replyx-item-info span:nth-child(1) {
        color: #909399; }
      .replyx-item-info span:nth-child(2) {
        color: #0088ff;
        cursor: pointer; }
    .replyx-item-reply {
      display: flex;
      margin-top: 10px;
      height: 40px; }
      .replyx-item-reply img {
        object-fit: cover;
        width: 40px;
        border-radius: 50%;
        margin-right: 20px; }
      .replyx-item-reply input {
        width: 550px;
        padding: 10px;
        border-radius: 2px;
        border: 1px solid #efefef;
        margin-right: 20px; }
      .replyx-item-reply button {
        height: 40px;
        width: 40px;
        background: url("../image/ask-detail-reply2.png") no-repeat center/contain; }
        .replyx-item-reply button:active {
          background-image: url("../image/ask-detail-reply.png"); }
  .replyx-more {
    height: 17px;
    font-size: 12px;
    color: #303133;
    line-height: 17px;
    position: relative;
    margin: 10px 20px;
    cursor: pointer; }
    .replyx-more:after {
      content: '';
      position: absolute;
      left: 160px;
      top: 0;
      width: 16px;
      height: 16px;
      display: block;
      background: url("../image/ask-detail-more.png") no-repeat center/contain; }

.detailCoursex {
  background-color: #fff;
  padding: 20px;
  float: left;
  width: 340px; }
  .detailCoursex-item {
    display: flex; }
    .detailCoursex-item img {
      object-fit: cover;
      width: 120px;
      height: 68px;
      margin-right: 10px; }
    .detailCoursex-item > div {
      width: 170px;
      height: 68px; }
    .detailCoursex-item-title {
      font-size: 14px;
      color: #303133;
      line-height: 20px;
      font-weight: bold; }
    .detailCoursex-item-info {
      height: 20px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 11px; }
      .detailCoursex-item-info span:nth-child(1) {
        font-size: 12px;
        color: #909399; }
      .detailCoursex-item-info span:nth-child(2) {
        font-size: 14px;
        color: #0088ff; }
  .detailCoursex-content {
    margin-top: 10px;
    font-size: 14px;
    color: #606266;
    line-height: 20px; }
  .detailCoursex-todetail {
    margin-top: 10px;
    font-size: 14px;
    color: #0088ff;
    line-height: 20px; }

.detailTipx {
  width: 437px;
  height: 192px;
  background-color: #fff;
  border-radius: 4px; }